*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#a9d3e0;color:#233843;font-family:ui-rounded,'Arial Rounded MT Bold',system-ui,sans-serif}canvas{display:block;width:100%;height:100%}.lobby-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#fff3dcef 0%,#fff3dcd9 30%,#fff3dc00 62%);transition:opacity .25s}.playing .lobby-shade{opacity:0}header{position:absolute;top:0;left:0;right:0;padding:28px 40px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;z-index:1}header a{font-weight:950;letter-spacing:.06em;text-decoration:none;color:inherit;pointer-events:auto}header a span{font-weight:550;opacity:.7}#build{font-size:10px;font-weight:800;letter-spacing:.1em;display:flex;align-items:center;gap:8px}#build i{width:6px;height:6px;border-radius:50%;background:#ef713e}#lobby{position:absolute;top:15%;bottom:100px;left:7%;width:370px;overflow-y:auto;scrollbar-width:thin;padding-right:12px;animation:enter .5s ease-out}.card:not(#lobby){position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:36px;background:#fff3dc;border-radius:20px;box-shadow:0 24px 80px #18313c55;width:420px}h1{font-size:clamp(62px,6.3vw,94px);line-height:.84;letter-spacing:.01em;margin:25px 0;font-weight:1000;font-style:italic;transform:rotate(-3deg);transform-origin:left center}h1 span{font-style:normal;color:#ed743e;font-size:60px;vertical-align:top;margin-left:5px}.intro{font-size:17px;line-height:1.5;margin:26px 0;color:#405562}.eyebrow{font-size:10px;font-weight:900;letter-spacing:.19em}p{line-height:1.5}.section-line{display:flex;justify-content:space-between;align-items:center}.section-line label,#course-number{font-size:10px;font-weight:850;letter-spacing:.12em}.course-picker{border-top:1px solid #23384333;padding-top:18px;margin-bottom:20px}label{font-size:12px;font-weight:700}select{display:block;width:100%;margin-top:6px;padding:9px 10px;border:1px solid #23384340;background:#fff8eacc;border-radius:6px;font:inherit;color:#233843}#course-choice{font-size:20px;font-weight:850;border:0;border-bottom:2px solid #233843;border-radius:0;padding:10px 0;background:transparent}#course-description{font-size:12px;min-height:36px;color:#465967;margin:9px 0 0}.options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}button{display:block;width:100%;padding:15px 18px;border:0;border-radius:6px;background:#f47740;color:#182f3c;font-size:15px;font-weight:900;cursor:pointer;transition:transform .15s,background .15s,box-shadow .15s}button:hover{background:#ff8f59;transform:translateY(-2px);box-shadow:0 5px 0 #233843}button:active{transform:translateY(1px);box-shadow:none}button:disabled{opacity:.6;cursor:wait;transform:none;box-shadow:none}button.secondary{background:#e1e5df;margin-top:9px;font-size:13px}button.text-button{background:transparent;font-size:12px;margin-top:8px}.text-button:hover{box-shadow:none}button:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #ce4a15;outline-offset:3px}#start{font-size:15px;letter-spacing:.06em;padding:18px 15px;box-shadow:0 4px 0 #233843}#start:hover{box-shadow:0 7px 0 #233843}small,#loading{font-size:10px;color:#4d626b}#loading{min-height:15px;line-height:1.4;margin:12px 0}.keys{display:flex;flex-wrap:wrap;gap:9px 15px;font-size:10px;margin-top:18px}.keys b{font-size:9px;background:#233843;color:#fff3dc;padding:4px 5px;border-radius:3px;margin-right:3px}details{border-top:1px solid #23384330;padding:11px 0;font-size:12px}summary{cursor:pointer;list-style:none;font-size:10px;font-weight:850;letter-spacing:.08em;display:flex;justify-content:space-between;gap:12px}summary span{color:#556975;font-weight:500}details[open]>summary{margin-bottom:10px}details p{font-size:11px}details .secondary{padding:9px;font-size:11px}details input[type=range]{width:100%}#lobby>details:last-of-type{margin-bottom:10px}footer{position:absolute;bottom:22px;left:40px;font-size:9px;font-weight:750;letter-spacing:.12em;color:#233843}#performance{position:absolute;bottom:22px;right:40px;font-size:9px;color:#23384388}#hud{position:absolute;top:82px;left:32px;right:32px;display:flex;justify-content:space-between;pointer-events:none}.badge{background:#233843ed;color:#fff3dc;border-radius:8px;padding:15px 20px;min-width:220px;box-shadow:0 6px 22px #12344822}.badge small{color:#fff3dc99;font-size:9px;letter-spacing:.14em;font-weight:800}.badge strong{font-size:24px;display:block;line-height:1.35}.counter{min-width:150px;text-align:right;background:#fff3dceb;color:#233843}.counter small{color:#23384388}.counter strong{font-size:40px}.counter em{font-size:15px;font-style:normal;opacity:.4}.survival-note{font-size:9px;letter-spacing:.12em;font-weight:850}.race-progress{margin-top:13px}progress{display:block;width:100%;height:4px;border:0;appearance:none;background:#ffffff22;margin-bottom:8px;border-radius:2px;overflow:hidden}progress::-webkit-progress-bar{background:#ffffff22}progress::-webkit-progress-value{background:#f47740}progress::-moz-progress-bar{background:#f47740}#course-tip{position:absolute;top:100%;left:0;font-size:12px;max-width:260px;font-weight:650;background:#fff3dcef;padding:12px 16px;border-radius:6px}#callout{position:absolute;top:28%;width:100%;text-align:center;font-size:clamp(55px,10vw,140px);font-style:italic;font-weight:1000;letter-spacing:.02em;color:#fff3dc;-webkit-text-stroke:2px #233843;text-shadow:0 7px 0 #233843;pointer-events:none}.pop{animation:count .25s ease-out}.small-card{position:absolute;bottom:95px;right:32px;width:320px;padding:26px;background:#fff3dc;border-radius:12px;box-shadow:0 16px 45px #23384333}.small-card p{font-size:13px;color:#4d626b}h2{margin:12px 0;font-size:28px;line-height:1.1}#result{text-align:center;z-index:5}#result h1{font-size:44px;line-height:1;transform:none;margin:20px 0}#result p{font-size:14px}#pause{top:50%;bottom:auto;right:50%;transform:translate(50%,-50%);z-index:5}#sound-controls{position:absolute;bottom:48px;left:40px;display:flex;align-items:center;gap:8px;z-index:4}#sound-controls button{width:auto;padding:6px 9px;font-size:10px;background:#233843;color:#fff3dc;box-shadow:none}#sound-controls button[aria-pressed=false]{opacity:.5}#sound-status{font-size:9px;color:#233843;display:none}.popup-close{position:absolute;transform:translate(-50%,-50%);width:32px;height:32px;padding:0;border:2px solid #111;border-radius:3px;background:#ffef20;box-shadow:2px 2px #111;font:900 24px/24px monospace;z-index:3}.popup-close:hover{background:white;transform:translate(-50%,-50%) scale(1.1)}[hidden]{display:none!important}@keyframes enter{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}@keyframes count{from{scale:1.3;opacity:.2}to{scale:1;opacity:1}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-height:820px){#lobby{top:12%;bottom:96px}h1{font-size:64px;margin:18px 0}.intro{font-size:14px;margin:18px 0}.course-picker{padding-top:12px;margin-bottom:10px}#course-description{min-height:28px}details{padding:8px 0}#start{padding:14px}#loading{margin:8px 0}.keys{margin-top:12px}}@media(max-width:800px){header{padding:20px}header a span,#build{display:none}#lobby{left:24px;width:320px}.lobby-shade{background:linear-gradient(90deg,#fff3dcf5,#fff3dcaa 45%,transparent)}#hud{left:14px;right:14px;top:64px}.badge{min-width:170px;padding:12px}.badge strong{font-size:20px}.counter{min-width:100px}.counter strong{font-size:30px}.counter small{font-size:8px}footer{left:20px;font-size:8px}#sound-controls{left:20px}#performance{display:none}.small-card{right:20px;width:290px}}@media(max-width:500px){#lobby{width:280px;left:20px}h1{font-size:58px}.intro{font-size:13px}#hud .badge{min-width:150px}.counter{min-width:90px!important}#course-tip{max-width:190px}footer{max-width:90%;font-size:7px}.card:not(#lobby){width:calc(100% - 36px)}#callout{top:35%}}
/* Keep the poster title inside the scrollable control column. */
#loading-screen{display:none;position:absolute;inset:0;background:#fff3dcee;z-index:10;place-content:center;text-align:center}.playing[data-loading=true] #loading-screen{display:grid}#loading-screen p{font-size:13px}
#lobby{overflow-x:hidden;padding-left:6px}#lobby h1{font-size:clamp(58px,5.2vw,76px)}#lobby h1 span{font-size:40px}#lobby>details:last-of-type{font-size:10px}