:root{--bg:#f5f3ff;--card:#ffffff;--text:#1e1b2e;--muted:#6b6685;--line:#e7e3f7;--primary:#6d28d9;--primary-ink:#ffffff;--active-bg:#f2ecff;--active-line:#7c3aed;--shadow:0 6px 24px rgba(76,29,149,0.1)}@media (prefers-color-scheme:dark){:root{--bg:#14121f;--card:#1e1b2b;--text:#efeafc;--muted:#a49fbe;--line:#322c48;--primary:#a78bfa;--primary-ink:#14121f;--active-bg:#2a2440;--active-line:#a78bfa;--shadow:0 6px 24px rgba(0,0,0,0.45)}}*{box-sizing:border-box}body,html{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,PingFang TC,Microsoft JhengHei,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.6}:root{--ad-h:0px}:root[data-ads=on]{--ad-h:108px}.screen{min-height:calc(100dvh - var(--ad-h));max-width:560px;margin:0 auto;padding:clamp(12px,2.6vh,20px) 18px calc(clamp(12px, 2.6vh, 20px) + 22px);display:flex;flex-direction:column;justify-content:center;gap:clamp(10px,2vh,18px)}.quizScreen,.resultScreen{height:calc(100dvh - var(--ad-h));overflow:hidden;justify-content:flex-start}.quizScreen .card{flex:1 1;display:flex;flex-direction:column;min-height:0}.autofitBox{flex:1 1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.autofitInner{width:100%;transform-origin:center center}.card{background:var(--card);border-radius:20px;padding:clamp(18px,3vh,26px) clamp(16px,5vw,24px);box-shadow:var(--shadow)}.appFooter{bottom:calc(var(--ad-h) + 6px);text-align:center;font-size:12px;letter-spacing:.05em;color:var(--muted);opacity:.6;pointer-events:none}.adBanner,.appFooter{position:fixed;left:0;right:0}.adBanner{bottom:0;height:var(--ad-h);display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--bg);border-top:1px solid var(--line);z-index:20}.adBanner .adsbygoogle{display:inline-block;width:320px;height:100px;max-width:100%}.quizHeader{align-self:center;display:inline-flex;align-items:center;gap:8px;padding:8px 18px;font-size:15px;font-weight:700;color:var(--primary);background:var(--active-bg);border:1px solid var(--line);border-radius:999px;letter-spacing:.02em}.quizHeader svg{width:16px;height:16px}.topbar{display:flex;flex-direction:column;gap:8px}.progressTrack{height:8px;border-radius:999px;background:var(--line);overflow:hidden}.progressFill{height:100%;background:linear-gradient(90deg,#a78bfa,var(--primary));border-radius:999px;transition:width .3s ease}.counter{font-size:14px;color:var(--muted);text-align:right}.qNumber{margin:0 0 8px;font-size:14px;font-weight:700;color:var(--primary);letter-spacing:.04em}.qText{margin:0 0 clamp(16px,3vh,24px);font-size:clamp(18px,4.6vw,22px);font-weight:600;line-height:1.5}.options{display:flex;flex-direction:column;gap:clamp(10px,1.6vh,14px)}.abOption{display:flex;align-items:center;gap:14px;width:100%;padding:clamp(12px,1.9vh,16px) 16px;text-align:left;color:var(--text);background:var(--card);border:2px solid var(--line);border-radius:14px;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .05s ease}.abBadge{flex:0 0 auto;width:clamp(28px,4.6vh,34px);height:clamp(28px,4.6vh,34px);display:inline-flex;align-items:center;justify-content:center;border-radius:50%;font-weight:800;color:var(--primary);background:var(--active-bg)}.abText{font-size:clamp(15px,4vw,17px);line-height:1.45}.abOption:hover{border-color:var(--active-line)}.abOption:active{transform:scale(.99)}.optionActive{border-color:var(--active-line);background:var(--active-bg)}.optionActive .abBadge{background:var(--primary);color:#fff}.navbar{display:flex;justify-content:space-between;gap:12px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 22px;font-size:16px;font-weight:600;border-radius:999px;border:none;cursor:pointer;text-decoration:none;transition:opacity .15s ease,transform .05s ease}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.35;cursor:default}.btnPrimary{background:var(--primary);color:var(--primary-ink)}.btnGhost{background:transparent;color:var(--muted)}.introCard{text-align:center}.introTitle{margin:0 0 16px;font-size:28px}.introText{margin:0 0 20px;color:var(--muted);font-size:16px;text-align:left}.introMeta{margin:0 0 24px;color:var(--muted);font-size:14px}.introCard .btn{width:100%}.resultCard{padding:0;overflow:hidden;animation:pop .35s ease}@keyframes pop{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}.bandHero{padding:clamp(24px,4.5vh,40px) 24px clamp(20px,3.5vh,32px);text-align:center;color:#fff}.bandLabel{margin:0 0 6px;font-size:15px;opacity:.9}.bandTitle{margin:0;font-size:clamp(32px,8vw,42px);font-weight:800;letter-spacing:.03em}.resultBody{padding:clamp(18px,3vh,26px) clamp(20px,5vw,24px) clamp(20px,3.5vh,30px)}.bandDesc{margin:0 0 clamp(18px,3vh,24px);font-size:clamp(14px,3.8vw,16px);text-align:left}.spectrum{margin-bottom:clamp(18px,3vh,26px)}.spectrumTrack{position:relative;height:14px;border-radius:999px;background:linear-gradient(90deg,#f43f5e,#f59e0b,#22c55e,#059669)}.spectrumMarker{position:absolute;top:50%;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--primary);box-shadow:0 2px 8px rgba(0,0,0,.25);transform:translate(-50%,-50%);transition:left .6s ease}.spectrumEnds{display:flex;justify-content:space-between;margin-top:8px;font-size:12px;color:var(--muted)}.stats{display:flex;gap:10px;margin-bottom:clamp(18px,3vh,24px)}.stat{flex:1 1;display:flex;flex-direction:column;align-items:center;padding:clamp(10px,1.8vh,14px) 6px;background:var(--active-bg);border-radius:14px}.statNum{font-size:clamp(22px,6vw,28px);font-weight:800;line-height:1}.statMax{font-size:12px;color:var(--muted);margin-top:2px}.statName{font-size:clamp(11px,3vw,13px);color:var(--muted);margin-top:4px}.resultBody .btn{width:100%}