:root{--ink: #0d2438;--ink-2: #153450;--gold: #e8912a;--gold-2: #f6a83f;--paper: #faf6ef;--card: #ffffff;--line: #e9e0d2;--text: #22303c;--muted: #5d6b76;--ink-soft: #cdd8e2;--shadow: 0 18px 50px -20px rgba(13, 36, 56, .35);--radius: 14px;--heavy: #c0392b;--medium: #d98324;--light: #2e7d5b}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Noto Sans TC,system-ui,sans-serif;background:radial-gradient(1000px 420px at 50% -10%,#1b3d5c 0%,transparent 55%),linear-gradient(160deg,var(--ink) 0%,var(--ink-2) 60%,var(--paper) 60%,var(--paper) 100%);color:var(--text);line-height:1.75;-webkit-font-smoothing:antialiased;min-height:100vh;padding:40px 18px 60px}#app{max-width:640px;margin:0 auto}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:34px 28px 28px;position:relative}.eyebrow{display:inline-block;background:#e8912a1f;color:var(--gold);font-weight:700;font-size:.8rem;padding:6px 13px;border-radius:999px;letter-spacing:.06em;margin-bottom:16px}.h1{font-size:1.7rem;font-weight:900;color:var(--ink);line-height:1.35;letter-spacing:-.01em}.sub{color:var(--muted);font-size:1rem;margin:12px 0 22px}.field{width:100%;padding:15px 16px;border:1.5px solid var(--line);border-radius:11px;font-family:inherit;font-size:1rem;color:var(--text);margin-bottom:12px;transition:border-color .15s}.field:focus{outline:0;border-color:var(--gold)}.field::placeholder{color:#9aa6b0}.err{color:var(--heavy);font-size:.85rem;margin:-6px 0 10px}.btn{display:block;width:100%;border:0;cursor:pointer;text-align:center;text-decoration:none;background:linear-gradient(180deg,var(--gold-2),var(--gold));color:#3a1e00;font-family:inherit;font-weight:900;font-size:1.05rem;padding:16px 20px;border-radius:12px;letter-spacing:.02em;box-shadow:0 10px 24px -8px #e8912ab3;transition:transform .15s ease,box-shadow .15s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 16px 30px -8px #e8912acc}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.promise{font-size:.82rem;color:var(--muted);margin-top:14px;text-align:center;line-height:1.7}.hint{font-size:.82rem;color:var(--muted);margin-top:14px;text-align:center}.quiz-lead{font-size:.92rem;color:var(--muted);margin-bottom:14px}.quiz-lead b{color:var(--ink)}.progress{height:8px;background:var(--line);border-radius:999px;overflow:hidden;margin-bottom:8px}.bar{height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--gold-2));transition:width .25s ease}.progress-label{font-size:.82rem;color:var(--muted);margin-bottom:16px;font-weight:700}.qlist{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.qrow{display:grid;grid-template-columns:22px auto 1fr;align-items:start;gap:10px;padding:13px 14px;border:1.5px solid var(--line);border-radius:11px;cursor:pointer;transition:border-color .15s,background .15s}.qrow:hover{border-color:var(--gold);background:#fffaf1}.qrow input{width:20px;height:20px;margin-top:2px;accent-color:var(--gold);cursor:pointer}.qrow .cat{font-size:.72rem;font-weight:700;color:var(--ink);background:var(--paper);border-radius:6px;padding:2px 8px;white-space:nowrap;align-self:start;margin-top:1px}.qrow .qtext{font-size:.95rem;color:var(--text)}.result .score-wrap{display:flex;align-items:center;gap:18px;margin:8px 0 18px}.score-num{font-size:3.2rem;font-weight:900;color:var(--ink);line-height:1}.score-den{font-size:1.1rem;font-weight:700;color:var(--muted);margin-left:6px}.tier-badge{font-weight:900;font-size:1.05rem;padding:8px 16px;border-radius:999px;color:#fff}.tone-light .tier-badge,.tier-badge.tone-light{background:var(--light)}.tone-medium .tier-badge,.tier-badge.tone-medium{background:var(--medium)}.tone-heavy .tier-badge,.tier-badge.tone-heavy{background:var(--heavy)}.score-label{font-size:.9rem;font-weight:700;color:var(--muted);margin:0 0 14px}.result-text{font-size:1.02rem;color:var(--text);margin-bottom:24px;line-height:1.85}.result.tone-heavy{border-top:5px solid var(--heavy)}.result.tone-medium{border-top:5px solid var(--medium)}.result.tone-light{border-top:5px solid var(--light)}@media (max-width: 480px){.card{padding:26px 18px 22px}.h1{font-size:1.4rem}.score-num{font-size:2.6rem}}