@font-face{font-family:Silkscreen;src:url('/assets/silkscreen.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{color-scheme:dark;--bg:#0b0c0e;--panel:#121316;--border:#292b30;--text:#f1f0eb;--muted:#8a8c95;--red:#ff3a39;--green:#c9ff70;--pixel:Silkscreen,monospace;--mono:'SFMono-Regular',Consolas,'Liberation Mono',monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--mono);font-size:16px;line-height:1.5}body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:linear-gradient(#ffffff02 1px,transparent 1px),linear-gradient(90deg,#ffffff02 1px,transparent 1px);background-size:32px 32px}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--green);outline-offset:5px}button:disabled{cursor:wait}::selection{background:var(--red);color:white}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.race-screen{min-height:100svh;display:flex;flex-direction:column;padding:0 max(24px,env(safe-area-inset-left));position:relative;border-bottom:1px solid var(--border)}.site-header{height:100px;max-width:1280px;width:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff09}.brand{display:flex;align-items:center;gap:14px;text-decoration:none}.brand-mark{display:flex;gap:4px;transform:skew(-16deg)}.brand-mark i{width:8px;height:24px;background:var(--red)}.brand-mark i:nth-child(2){height:18px;margin-top:6px}.brand-mark i:nth-child(3){height:12px;margin-top:12px}.wordmark{font:20px var(--pixel);letter-spacing:-1px}.wordmark>span{color:var(--red);margin-left:3px}.brand img{max-width:220px;max-height:54px;object-fit:contain;image-rendering:auto}.header-label{display:flex;gap:20px;align-items:center;color:var(--muted);font-size:12px;letter-spacing:2px}.checker{display:inline-block;width:24px;height:24px;background:conic-gradient(#d0d0cc 25%,transparent 0 50%,#d0d0cc 0 75%,transparent 0) 0 0/12px 12px}.checker.large{width:42px;height:42px;background-size:14px 14px;opacity:.4}
.race-main{width:100%;max-width:680px;margin:auto;display:flex;flex-direction:column;align-items:center;padding:38px 0 24px}.intro{text-align:center;margin-bottom:26px}.eyebrow{font-size:12px;letter-spacing:2px;color:var(--muted)}h1,h2,h3{font-family:var(--pixel);font-weight:400;margin:0}h1{font-size:44px;line-height:1.2;margin-top:9px;letter-spacing:-2px}.red-dot{color:var(--red)}.race-pad{border:0;background:none;width:100%;padding:0;color:inherit;display:flex;flex-direction:column;align-items:center;user-select:none;-webkit-user-select:none;position:relative}.gantry-top{width:100%;display:flex;justify-content:space-between;margin-bottom:9px;padding:0 3px;color:var(--muted);font-size:11px;letter-spacing:2px}.gantry{width:100%;display:flex;gap:12px;padding:22px 25px 14px;background:linear-gradient(180deg,#1c1e23,#121315);border:1px solid #3a3b41;box-shadow:0 6px 0 #060607,0 7px 0 #25272b;position:relative;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px)}.light-column{flex:1;min-width:0;background:#08090b;border:1px solid #24262a;padding:10px 8px 5px;display:flex;flex-direction:column;align-items:center;gap:10px}.light-column>span{font-size:10px;letter-spacing:1px;color:#62646e}.lamp{display:block;aspect-ratio:1;max-width:85px;width:100%;background-color:#241113;background-image:radial-gradient(#462022 1px,transparent 1px);background-size:4px 4px;box-shadow:inset 0 0 0 2px #0009;clip-path:polygon(25% 0,75% 0,75% 6%,88% 6%,88% 12%,94% 12%,94% 25%,100% 25%,100% 75%,94% 75%,94% 88%,88% 88%,88% 94%,75% 94%,75% 100%,25% 100%,25% 94%,12% 94%,12% 88%,6% 88%,6% 75%,0 75%,0 25%,6% 25%,6% 12%,12% 12%,12% 6%,25% 6%)}.light-column.on{border-color:#623031;background:#1c0b0e;filter:drop-shadow(0 0 12px #ff252528)}.light-column.on .lamp{background-color:#ff3337;background-image:radial-gradient(#ff999680 1px,transparent 1px);box-shadow:inset 0 -7px 0 #b51526,inset 0 6px 0 #ff6058}.readout{display:flex;flex-direction:column;align-items:center;margin-top:30px}.readout-label{font-size:11px;letter-spacing:3px;color:var(--muted)}.time-line{display:flex;align-items:baseline;gap:10px;line-height:1.2;min-height:94px;margin:6px 0 8px}.time-line #reaction-time{font:84px/1.1 var(--pixel);letter-spacing:-6px;color:var(--text);font-variant-numeric:tabular-nums}.time-unit{font-size:20px;color:var(--muted)}.result-note{font-size:14px;color:var(--muted);min-height:22px}.race-pad[data-state="waiting"] .time-line #reaction-time{color:#656670}.race-pad[data-state="go"] .time-line #reaction-time{color:var(--green)}.race-pad[data-state="false-start"] .time-line #reaction-time{font-size:54px;color:var(--red);letter-spacing:-3px}.race-pad[data-state="go"] .result-note{color:var(--green)}.start-cue{width:100%;max-width:340px;display:flex;align-items:center;justify-content:space-between;border:1px solid #ffffff25;background:#15171a;box-shadow:4px 4px 0 #030304;margin-top:24px;padding:15px 18px;font:14px var(--pixel);color:var(--text);transition:background .15s,border-color .15s}.race-pad:hover .start-cue{border-color:var(--red);background:#221416}.cue-symbol{color:var(--red);font:18px var(--mono)}.race-pad[data-state="waiting"] .start-cue{background:#251012;border-color:#6c2429;color:#ff7c76}.race-pad[data-state="go"] .start-cue{background:var(--green);border-color:var(--green);color:#0b0c0e}.race-pad[data-state="go"] .cue-symbol{color:#0b0c0e}.instructions{font-size:12px;text-align:center;color:var(--muted);max-width:400px;line-height:1.7;margin:16px 0 0}.personal-best{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:340px;padding:16px 0 0;margin-top:25px;border-top:1px solid var(--border)}.best-label{display:flex;align-items:center;gap:9px;font-size:11px;letter-spacing:1px;color:var(--muted)}.best-label svg{width:18px;height:18px;color:#d4bd72}.best-time strong{font-family:var(--pixel);font-weight:400;font-size:21px}.best-time>span{font-size:12px;color:var(--muted)}.scroll-cue{display:flex;flex-direction:column;align-items:center;gap:12px;text-decoration:none;align-self:center;font-size:11px;letter-spacing:3px;color:var(--muted);padding:24px 20px 28px}.pixel-chevron{display:block;width:5px;height:5px;background:var(--red);box-shadow:-5px -5px var(--red),5px -5px var(--red),-10px -10px var(--red),10px -10px var(--red)}
.section-wrap{max-width:960px;margin:auto;padding:72px 24px 24px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}h2{font-size:32px;letter-spacing:-1px;margin-top:8px}.driver-panel{border:1px solid var(--border);border-top:2px solid var(--red);background:var(--panel);padding:26px;display:grid;grid-template-columns:1fr 1fr;gap:24px 30px}.driver-copy p{font-size:14px;margin:10px 0 14px}.qualification-progress{display:flex;gap:5px}.qualification-progress i{width:26px;height:6px;background:#323339}.qualification-progress i.filled{background:var(--red)}.name-form label{display:block;font-size:13px;color:var(--muted);margin-bottom:8px}.input-row{display:flex}.input-row input{width:100%;min-width:0;background:#0b0c0e;border:1px solid #3d3e46;padding:12px;color:var(--text);font-size:14px;border-radius:0}.input-row input::placeholder{color:#70727d}.input-row button{background:var(--red);color:#100b0b;border:0;font:12px var(--pixel);padding:12px 14px}.input-row button:disabled{opacity:.6}.form-note{font-size:12px;color:var(--muted);margin:8px 0 0;min-height:18px}.form-note.error{color:#ff7c76}.form-note.success{color:var(--green)}.driver-stats{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--border);padding-top:20px;gap:16px}.driver-stats>div{display:flex;flex-direction:column;gap:7px}.driver-stats span{font-size:11px;color:var(--muted);letter-spacing:1px}.driver-stats strong{font:25px var(--pixel);font-weight:400}.driver-stats small{font:12px var(--mono);color:var(--muted)}.ranking-tabs{display:flex;gap:26px;margin-top:38px;border-bottom:1px solid var(--border)}.ranking-tabs button{background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);padding:15px 0;font:13px var(--pixel);white-space:nowrap}.ranking-tabs button[aria-selected="true"]{color:var(--text);border-color:var(--red)}.ranking-explanation{font-size:12px;color:var(--muted);margin:19px 0}.table-wrap{min-height:245px}.empty-state{padding:38px 20px;text-align:center;border:1px dashed #303137}.empty-lights{display:flex;justify-content:center;gap:5px;margin-bottom:18px}.empty-lights i{width:12px;height:12px;background:#582026}.empty-state h3{font-size:17px}.empty-state p{font-size:13px;color:var(--muted);margin-bottom:0}.results-table{width:100%;border-collapse:collapse;font-size:14px;text-align:left}.results-table th{font-weight:400;font-size:11px;letter-spacing:1px;color:var(--muted);padding:14px 12px;border-bottom:1px solid var(--border)}.results-table td{padding:18px 12px;border-bottom:1px solid #24252b}.results-table th:first-child,.results-table td:first-child{width:46px;padding-left:8px;color:var(--muted)}.results-table th:last-child,.results-table td:last-child{text-align:right;padding-right:8px}.results-table tr.you{background:#ff3a3909}.results-table .rank-one{color:var(--red)!important;font-family:var(--pixel)}.driver-cell{font-weight:500;overflow-wrap:anywhere}.you-label{display:inline-block;color:var(--red);font-size:10px;padding:1px 5px;margin-left:8px;border:1px solid #ff3a3944}.score-cell{font:22px var(--pixel);white-space:nowrap}.score-cell small{font:11px var(--mono);color:var(--muted);margin-left:4px}.date-cell{color:var(--muted);font-size:12px;white-space:nowrap}.date-cell span{display:block;font-size:11px}.count-cell{color:var(--muted)}.status-cell{color:#ff7c76;font-size:12px}.retry-button{background:none;border:1px solid var(--border);padding:12px 18px;font:12px var(--pixel);color:var(--text);margin-top:12px}.site-footer{border-top:1px solid var(--border);padding:24px 0;margin-top:54px;display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:11px;color:var(--muted)}.footer-brand{font:12px var(--pixel);color:var(--text)}.site-footer a{text-decoration:none;font-size:10px;letter-spacing:1px}.rules{font-size:13px;line-height:1.8;color:var(--muted);border:1px solid var(--border);padding:12px 20px;margin-bottom:24px}.save-error{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);width:min(520px,calc(100% - 32px));background:#271315;border:1px solid #ff3a3966;padding:16px;z-index:5;font-size:13px;box-shadow:0 8px 50px #0009}.save-error button{display:block;font:12px var(--pixel);color:var(--text);background:none;border:1px solid #ff3a3966;padding:10px;margin-top:12px}
@media(min-width:1000px) and (min-height:850px){.race-main{max-width:730px}.intro{margin-bottom:35px}.gantry{padding:26px 30px 16px;gap:16px}.readout{margin-top:36px}.time-line #reaction-time{font-size:100px}.time-line{min-height:110px}.start-cue{margin-top:30px}.personal-best{margin-top:35px}}
@media(max-width:600px){.race-screen{padding:0 20px}.site-header{height:76px}.wordmark{font-size:16px}.brand{gap:10px}.brand-mark{gap:3px}.brand-mark i{width:6px;height:20px}.brand-mark i:nth-child(2){height:14px}.brand-mark i:nth-child(3){height:8px}.header-label{font-size:10px;letter-spacing:1px;gap:9px}.header-label .checker{width:18px;height:18px;background-size:9px 9px}.race-main{padding:24px 0 14px}.intro{margin-bottom:22px}.eyebrow{font-size:10px;letter-spacing:1.5px}h1{font-size:31px;letter-spacing:-1px}.gantry-top{font-size:9px;letter-spacing:1px}.gantry{gap:6px;padding:14px 10px 10px;clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px)}.light-column{padding:7px 4px 4px;gap:7px}.light-column>span{font-size:9px}.lamp{background-size:3px 3px}.readout{margin-top:30px}.readout-label{font-size:10px;letter-spacing:2px}.time-line{min-height:78px}.time-line #reaction-time{font-size:70px;letter-spacing:-5px}.time-unit{font-size:16px}.result-note{font-size:12px}.start-cue{max-width:290px;font-size:12px;padding:15px;margin-top:24px}.instructions{font-size:11px;max-width:275px;margin-top:15px}.personal-best{max-width:290px;margin-top:24px;padding-top:15px}.best-label{font-size:10px}.best-time strong{font-size:19px}.scroll-cue{padding:22px 20px 25px;font-size:10px}.race-pad[data-state="false-start"] .time-line #reaction-time{font-size:36px;letter-spacing:-2px}.section-wrap{padding:46px 20px 20px}h2{font-size:27px}.section-heading{margin-bottom:24px}.driver-panel{padding:20px;grid-template-columns:1fr;gap:20px}.driver-copy p{font-size:13px}.name-form label{font-size:12px}.driver-stats{gap:10px}.driver-stats span{font-size:9px;letter-spacing:0}.driver-stats strong{font-size:20px}.driver-stats small{font-size:10px}.ranking-tabs{gap:20px;margin-top:23px;justify-content:space-between}.ranking-tabs button{font-size:10px;padding:15px 0}.ranking-explanation{font-size:11px;line-height:1.7}.results-table{font-size:12px}.results-table th{font-size:9px;letter-spacing:0;padding:11px 5px}.results-table td{padding:16px 5px}.results-table th:first-child,.results-table td:first-child{width:28px;padding-left:3px}.score-cell{font-size:17px}.score-cell small{font-size:9px}.date-cell{font-size:10px}.date-cell span{font-size:9px}.you-label{font-size:9px;margin-left:4px;padding:0 3px}.site-footer{flex-wrap:wrap;font-size:10px;margin-top:35px;row-gap:16px}.site-footer a{font-size:9px}.empty-state h3{font-size:14px}.empty-state p{font-size:12px}.brand img{max-width:180px;max-height:44px}}
@media(max-width:360px){.race-screen{padding:0 15px}.header-label{font-size:9px}.time-line #reaction-time{font-size:62px}.start-cue{max-width:260px}.section-wrap{padding-left:15px;padding-right:15px}.ranking-tabs{gap:10px}.score-cell{font-size:15px}.driver-stats strong{font-size:17px}}
@media(max-height:740px) and (max-width:600px){.site-header{height:64px}.race-main{padding:18px 0 10px}.intro{margin-bottom:16px}h1{font-size:28px}.readout{margin-top:21px}.time-line{min-height:68px}.time-line #reaction-time{font-size:60px}.start-cue{margin-top:16px;padding:12px 15px}.personal-best{margin-top:17px}.instructions{margin-top:12px}.scroll-cue{padding:20px 20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Keep the complete play area on the first screen of compact phones. */
@media(max-width:600px){.start-cue{font-size:14px}.result-note{font-size:14px}.instructions{font-size:12px}.driver-copy p{font-size:14px}.name-form label{font-size:14px}.results-table{font-size:14px}.ranking-tabs button{font-size:12px}}
@media(max-height:680px) and (max-width:600px){.intro{display:none}.race-main{padding:10px 0 6px}.gantry-top{margin-bottom:5px}.gantry{padding:10px 8px 8px;gap:5px}.light-column{padding:5px 3px 3px;gap:5px}.lamp{max-width:48px}.readout{margin-top:16px}.readout .result-note{display:none}.time-line{min-height:60px}.time-line #reaction-time{font-size:56px}.start-cue{margin-top:12px}.instructions{margin-top:8px;line-height:1.5}.personal-best{margin-top:14px;padding-top:10px}.scroll-cue{padding:14px 20px 10px;gap:8px}.ranking-tabs{gap:10px}.ranking-tabs button{font-size:11px}}
.error-actions{display:flex;gap:10px;flex-wrap:wrap}.error-actions button{font-size:10px}
.brand .brand-logo{display:block;width:300px;max-width:300px;height:auto;max-height:54px;object-fit:contain}.brand .logo-inverted{filter:invert(1);mix-blend-mode:screen}
@media(max-width:600px){.brand .brand-logo{width:min(280px,calc(100vw - 90px));max-width:100%;max-height:44px}.site-header.branded .club-label{display:none}.site-header.branded .header-label{gap:0}.site-header.branded .brand{min-width:0}}
.site-header{justify-content:center}.intro h1{display:flex;align-items:center;justify-content:center;gap:18px}.title-flag{width:28px;height:28px;background-size:14px 14px;flex-shrink:0}.guide-open{overflow:hidden}.guide-dialog{color:var(--text);background:var(--panel);border:1px solid var(--border);border-top:2px solid var(--red);padding:0;width:min(480px,calc(100% - 32px));max-height:calc(100svh - 32px);margin:auto;box-shadow:0 20px 100px #0009}.guide-dialog::backdrop{background:#08090be8;backdrop-filter:blur(5px)}.guide-content{padding:28px}.guide-dialog h2{font-size:25px;margin:8px 0 0;outline:none}.guide-summary{color:var(--muted);font-size:14px;margin:13px 0 22px}.guide-steps{padding:0;margin:0;list-style:none}.guide-steps li{display:flex;align-items:flex-start;gap:15px;padding:15px 0;border-top:1px solid var(--border)}.guide-number{color:var(--red);font:18px var(--pixel);padding-top:1px}.guide-steps strong{font-size:16px;font-weight:500}.guide-steps p{font-size:14px;color:var(--muted);line-height:1.6;margin:5px 0 0}.guide-warning{font-size:13px;color:#ff7c76;background:#ff3a3909;border-left:2px solid var(--red);padding:12px 14px;margin:14px 0}.guide-ranking{font-size:12px;color:var(--muted);line-height:1.7;margin:16px 0 20px}.guide-confirm{font:12px var(--pixel);width:100%;padding:17px 12px;background:var(--red);color:#110b0c;border:0;box-shadow:4px 4px 0 #030304}
@media(max-width:600px){.intro h1{gap:12px}.title-flag{width:24px;height:24px;background-size:12px 12px}.brand .brand-logo{width:min(300px,calc(100vw - 64px))}.guide-content{padding:22px}.guide-dialog h2{font-size:22px}}
@media(max-height:680px) and (max-width:600px){.intro{display:block;margin-bottom:14px}.intro h1{font-size:24px;margin-top:5px;gap:10px}.intro .title-flag{width:20px;height:20px;background-size:10px 10px}.guide-content{padding:18px}.guide-steps li{padding:11px 0}.guide-summary{margin-bottom:14px}.guide-steps p{font-size:13px}.guide-warning{padding:9px 12px}.guide-ranking{margin:12px 0 16px}}
