#test.container{--bg1:#f5f7fa;--bg2:#fdeded;--card:#ffffff;--text:#1f2937;--muted:#6b7280;--line:rgba(31,41,55,0.08);--brand:#e24a4a;--brandHover:#bd3535;--radius:16px;--shadow:0 10px 30px rgba(0,0,0,0.08);min-height:100vh;display:grid;place-items:center;padding:24px 16px;width:100%;margin:0 auto}#test .card{width:min(560px,100%);background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line);padding:24px;text-align:left}#test .head{display:grid;gap:12px;margin-bottom:18px}#test .badgeRow{display:flex;align-items:center;justify-content:space-between;gap:10px}#test .badge{display:inline-flex;align-items:center;height:28px;padding:0 10px;border-radius:999px;background:rgba(226,74,74,.12);color:#8a1f1f;font-weight:700;font-size:12px;letter-spacing:-.2px}#test .counter{color:var(--muted);font-size:12px;font-weight:600}#test .stageTitle{font-size:15px;font-weight:800;color:var(--text)}#test .stageDesc{font-size:13px;color:var(--muted);margin-top:4px}#test .progressWrap{width:100%;height:10px;background:rgba(31,41,55,.08);border-radius:999px;overflow:hidden}#test .progressBar{height:100%;background:linear-gradient(90deg,var(--brand),#ff7b5c);border-radius:999px;transition:width .18s ease}#test .title{font-size:20px;font-weight:900;color:var(--text);letter-spacing:-.4px;margin:0}#test .question{margin:18px 0 16px;font-size:18px;line-height:1.45;font-weight:800;color:var(--text);letter-spacing:-.2px}#test .options{display:grid;gap:10px}#test .btn{width:100%;border:1px solid var(--line);background:var(--brand);color:#fff;font-size:15px;font-weight:800;padding:12px 14px;border-radius:12px;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,background .12s ease}#test .btn:hover{background:var(--brandHover);transform:translateY(-1px);box-shadow:0 8px 18px rgba(226,74,74,.18)}#test .btn:active{transform:translateY(0);box-shadow:none}#test .btn.btnSub{background:#111827}#test .btn.btnSub:hover{background:#0b1220;box-shadow:0 10px 18px rgba(17,24,39,.18)}#test .hint{margin-top:14px;font-size:13px;color:var(--muted);border-top:1px solid var(--line);padding-top:12px}#test .hint span{color:var(--text);font-weight:800;margin-right:6px}#test .character{width:220px;max-width:100%;display:block;margin:14px auto 10px}#test .result-description{margin:12px 0 14px;font-size:14px;line-height:1.55;color:#374151;text-align:center}#test .resultBox{border:1px solid var(--line);border-radius:14px;padding:14px;background:rgba(31,41,55,.02);display:grid;gap:10px;margin:12px 0 10px}#test .resultBox .row{display:grid;grid-template-columns:92px 1fr;gap:10px;align-items:start}#test .resultBox .k{font-size:12px;color:var(--muted);font-weight:800}#test .resultBox .v{font-size:13px;color:var(--text);font-weight:700;line-height:1.5}#test .share-buttons{margin-top:14px;display:grid;gap:10px}#test .share-buttons p{margin:6px 0 0;text-align:center;font-size:13px;color:var(--muted)}#test .shareRow{display:grid;grid-template-columns:1fr 1fr;gap:10px}#test .recommendation{width:100%;border:1px solid rgba(226,74,74,.25);border-radius:12px;padding:12px 14px;cursor:pointer;font-weight:900;color:#7a1111;background:rgba(226,74,74,.15);transition:transform .12s ease,box-shadow .12s ease}#test .recommendation:hover{transform:translateY(-1px);box-shadow:0 10px 18px rgba(226,74,74,.12)}#test .detail{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}#test .scoreGrid{margin-top:10px;display:grid;gap:6px;color:#374151}@media (max-width:860px){#test .card{max-width:calc(100vw - 32px);padding:18px}#test .question{font-size:16px}#test .character{width:200px}}