:root{color-scheme:dark;font-family:Arial Black,Impact,system-ui,sans-serif;background:#000;color:#fff}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#000}button,input,select{font:inherit}.screen{min-height:100vh;width:100%;padding:28px;display:flex;flex-direction:column;justify-content:center;gap:22px}.start-screen,.results-screen{align-items:center;text-align:center}.start-screen{justify-content:start;padding-top:18px}.results-screen h1,.stats-screen h1{margin:0;font-size:clamp(48px,8vw,92px);line-height:.95;letter-spacing:0}.subtitle,.best-line,.run-line,.try-line{color:#b6c3d1;margin:0}.logo-image{display:block;width:min(860px,92vw);max-height:34vh;object-fit:contain;margin:0 auto}.subtitle{font-family:system-ui,sans-serif;font-size:clamp(16px,2vw,20px);margin-top:4px}.stats-controls{display:flex;flex-wrap:wrap;justify-content:center;align-items:end;gap:16px;font-family:system-ui,sans-serif}.start-form{width:min(840px,100%);display:flex;flex-wrap:wrap;justify-content:center;gap:16px;align-items:end;padding:18px;border-block:1px solid #243447;background:linear-gradient(90deg,transparent,rgba(12,23,34,.78),transparent);font-family:system-ui,sans-serif}.start-form .button-row{flex-basis:100%;justify-content:center;margin-top:2px}.start-form label{flex:1 1 250px;max-width:260px}.start-form .nickname-field{flex-basis:100%;max-width:260px}.checkbox-label{min-height:52px;grid-template-columns:auto 1fr;align-items:center;align-self:end}.checkbox-label input{width:22px;height:22px}label{display:grid;gap:8px;text-align:left;color:#d7e1ea;font-size:15px}.text-input,.answer-input{color:#fff;background:#05070a;border:2px solid #526172;border-radius:6px;padding:12px 14px;min-height:52px}.text-input{width:100%;min-width:0}.button-row{display:flex;flex-wrap:wrap;gap:12px}.button-row.center{justify-content:center}.primary-button,.ghost-button,.segmented button{border:2px solid #fff;border-radius:6px;color:#fff;background:#000;min-height:52px;padding:12px 20px;cursor:pointer}.primary-button{background:#fff;color:#000}.ghost-button:hover,.ghost-button:focus-visible,.primary-button:hover,.primary-button:focus-visible,.segmented button.active{background:#1b2733;color:#fff}.best-line{width:min(1120px,100%);padding:4px 12px 0;font-family:system-ui,sans-serif;font-size:clamp(16px,2vw,20px);font-weight:800}.game-screen{justify-content:space-between;text-align:center;position:relative}.quit-button{position:absolute;top:28px;right:28px;border:1px solid #526172;border-radius:6px;background:#05070a;color:#b6c3d1;padding:8px 12px;cursor:pointer}.quit-button:hover,.quit-button:focus-visible{color:#fff;border-color:#fff}.quit-overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:24px;background:#000000c7}.quit-dialog{width:min(520px,100%);border:2px solid #fff;border-radius:8px;background:#05070a;padding:28px;text-align:center;font-family:system-ui,sans-serif}.quit-dialog h2{margin:0 0 10px;font-family:Arial Black,Impact,system-ui,sans-serif;font-size:clamp(32px,5vw,56px)}.quit-dialog p{margin:0 0 22px;color:#b6c3d1}.hud{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;font-size:clamp(20px,3vw,36px)}.hud.lower{grid-template-columns:repeat(2,1fr)}.question-zone{display:grid;justify-items:center;gap:18px}.question-zone h2{margin:0;font-size:clamp(52px,10vw,128px);line-height:1;letter-spacing:0}.countdown{font-size:clamp(96px,22vw,240px);line-height:1;color:#fff;text-align:center}.answer-input{width:min(420px,90vw);text-align:center;font-size:clamp(40px,8vw,84px)}.choice-grid{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:16px;width:min(720px,92vw)}.choice-button{min-height:110px;border:3px solid #fff;border-radius:8px;background:#05070a;color:#fff;font-size:clamp(36px,7vw,72px);cursor:pointer}.choice-button:hover,.choice-button:focus-visible{background:#162331}.feedback{min-height:40px;margin:0;font-size:clamp(22px,4vw,40px)}.feedback.correct{color:#2ee66b}.feedback.wrong{color:#ff4f4f}.result-grid,.notes-grid,.detail-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;width:min(960px,100%)}.metric{border:1px solid #334254;border-radius:8px;padding:14px;background:#071018;display:grid;gap:6px;font-family:system-ui,sans-serif}.metric span{color:#aebccc}.metric strong{font-size:28px}.notes-grid section,.fact-detail{border:1px solid #334254;border-radius:8px;padding:18px;background:#071018;text-align:left;font-family:system-ui,sans-serif}.stats-screen,.scoreboard-screen{justify-content:start;font-family:system-ui,sans-serif}.stats-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.stats-header h1{font-family:Arial Black,Impact,system-ui,sans-serif}.segmented{display:inline-flex;border:2px solid #fff;border-radius:8px;overflow:hidden}.segmented button{border:0;border-radius:0}.heatmap{display:grid;grid-template-columns:36px repeat(12,minmax(36px,1fr));gap:4px;width:min(980px,100%);margin:0 auto}.axis,.corner{min-height:36px;display:grid;place-items:center;color:#aebccc}.heat-cell{aspect-ratio:1;min-width:0;border:1px solid #101820;border-radius:4px;color:#fff;cursor:pointer;font-size:clamp(10px,1.8vw,16px)}.heat-cell.empty{background:#26313d}.heat-cell.weak{background:#9d1d22}.heat-cell.mixed{background:#a87000}.heat-cell.strong,.heat-cell.speed-fast{background:#087c36}.heat-cell.speed-good{background:#1269c7}.heat-cell.speed-steady{background:#4338ca}.heat-cell.speed-slow{background:#7c3aed}.fact-detail{width:min(980px,100%);margin:0 auto}.scoreboard-table{width:min(1100px,100%);margin:0 auto;display:grid;gap:6px}.scoreboard-row{display:grid;grid-template-columns:1.4fr 1fr .9fr .8fr .8fr .8fr 1.2fr;gap:10px;align-items:center;padding:12px 14px;border:1px solid #334254;border-radius:8px;background:#071018}.scoreboard-row.header{color:#aebccc;background:#111c27;font-weight:700}.empty-state{text-align:center;color:#aebccc}@media(max-width:1040px){.start-form{width:min(640px,100%)}}@media(max-width:680px){.screen{padding:18px}.start-screen{padding-top:12px}.logo-image{max-height:26vh}.start-form{display:grid;grid-template-columns:1fr;padding-inline:0;border-block:0;background:transparent}.start-form label{max-width:none}.hud{grid-template-columns:1fr}.heatmap{grid-template-columns:26px repeat(12,minmax(22px,1fr));gap:2px}.choice-grid,.scoreboard-row{grid-template-columns:1fr}.axis,.corner{min-height:24px;font-size:12px}}
