:root{--lime:#d9ff58;--white:#f1f9f6;--muted:#a0b7bd;--ink:#071d24;--cyan:#61e3ea}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#0b2630;color:var(--white);font-family:Arial,Helvetica,sans-serif}button,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--lime);outline-offset:4px}button{color:inherit}#game{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}#vignette{position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(2,17,24,.64),transparent 55%),linear-gradient(0deg,rgba(1,14,23,.6),transparent 35%)}.screen{position:absolute;inset:0;padding:30px 44px 24px;display:flex;flex-direction:column}header{display:flex;justify-content:space-between;align-items:center;gap:16px}.wordmark{position:relative;color:var(--white);font-size:25px;font-weight:900;font-style:italic;letter-spacing:-1px;text-decoration:none;padding-left:41px;line-height:1}.wordmark svg{position:absolute;left:0;top:-2px;width:34px;color:var(--lime)}.wordmark span{display:block;font-size:7px;letter-spacing:2.6px;font-style:normal;font-weight:500;margin-top:8px}.headerActions{display:flex;gap:10px}.iconButton{border:1px solid #c8e5e43b;background:#102e3699;border-radius:7px;padding:12px 15px;font-size:10px;font-weight:700;letter-spacing:1px;backdrop-filter:blur(8px)}.iconButton:hover{background:#214650}.menuBody{flex:1;display:flex;align-items:center;justify-content:space-between;gap:35px;min-height:0}.intro{align-self:center;padding-bottom:20px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;display:flex;align-items:center;gap:9px}.eyebrow i{width:6px;height:6px;background:var(--lime);border-radius:50%;box-shadow:0 0 15px #d9ff5888}h1{font-size:clamp(76px,9.5vw,155px);line-height:.84;font-style:italic;letter-spacing:-7px;margin:28px 0 22px;font-weight:950;text-shadow:0 6px 25px #00202b33}h1 span{color:var(--lime)}.intro p{font-size:15px;line-height:1.65;color:#d2e1df}.courseReadout{border-left:2px solid var(--lime);padding:0 0 0 16px;margin-top:42px;display:flex;flex-direction:column;gap:7px}.courseReadout>span{color:var(--lime);font-size:10px;font-weight:700;letter-spacing:2px}.courseReadout b{font-size:19px;font-style:italic;letter-spacing:.5px}.courseReadout small{font-size:10px;color:#c0d7db}.raceSetup{width:400px;flex-shrink:0;background:linear-gradient(135deg,#0c2833f5,#071b25ed);border:1px solid #c4e8e630;box-shadow:0 20px 60px #00101e55;backdrop-filter:blur(18px);padding:25px;border-radius:14px}.panelTop{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1.6px;color:#b0c9cb}.localTag{border:1px solid #6e9d9940;border-radius:3px;padding:5px 6px;color:var(--lime);font-size:7px;letter-spacing:1px}h2{font-size:25px;font-weight:600;letter-spacing:-.8px;margin:15px 0 18px}.courseChoices{display:flex;gap:7px}.course{position:relative;flex:1;min-width:0;border:1px solid #c8e9ec2b;border-radius:7px;overflow:hidden;background:#173943;padding:0;text-align:left}.courseArt{height:64px;position:relative;overflow:hidden;background:linear-gradient(165deg,#8bc7da,#1d96a2 65%,#57e6cb);opacity:.7;transition:opacity .2s}.courseArt:before,.courseArt:after{content:"";position:absolute;bottom:0;background:#6d8550;width:80px;height:40px;clip-path:polygon(0 80%,25% 16%,55% 32%,80% 0,100% 100%);left:-15px}.courseArt:after{left:auto;right:-20px;width:50px;background:#92ab62;transform:scaleX(-1)}.course[data-course="1"] .courseArt{background:linear-gradient(#e5b18e,#805b42 55%,#268f9b)}.course[data-course="1"] .courseArt:before,.course[data-course="1"] .courseArt:after{background:#b4643d;height:55px;clip-path:polygon(0 0,60% 0,70% 60%,100% 100%,0 100%)}.course[data-course="2"] .courseArt{background:linear-gradient(#0b1838,#664987 60%,#117581)}.course[data-course="2"] .courseArt:before,.course[data-course="2"] .courseArt:after{background:repeating-linear-gradient(0deg,#1b3445 0 8px,#51c2b5 8px 10px);height:60px;clip-path:polygon(0 25%,20% 25%,20% 5%,45% 5%,45% 45%,70% 45%,70% 0,100% 0,100% 100%,0 100%)}.course span{display:block;font-size:9px;font-weight:700;padding:10px 7px;white-space:nowrap}.course.active{border-color:var(--lime);background:#d9ff5810}.course.active .courseArt{opacity:1}.course.active:after{content:'✓';position:absolute;right:6px;top:5px;border-radius:50%;background:var(--lime);color:var(--ink);font-size:9px;width:16px;height:16px;text-align:center;line-height:16px}.labelRow{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.5px;margin:21px 0 9px;color:#aac3c6}.labelRow span:last-child{color:var(--lime)}.boatChoices{display:flex;gap:7px}.boatChoice{background:#19404b60;border:1px solid #a0c1c523;border-radius:6px;flex:1;padding:8px 4px;font-size:9px;font-weight:700}.boatChoice svg{display:block;width:80px;max-width:100%;height:40px;margin:auto}.boatChoice.active{border-color:var(--lime);color:var(--lime);background:#d9ff580b}.boatStats{display:flex;gap:12px;margin:11px 0 17px}.stat{flex:1;font-size:7px;color:#a0babe;letter-spacing:.8px}.stat>div{height:3px;background:#29464f;margin-top:5px}.stat i{display:block;height:100%;background:#6a9b9f}.setupRow{display:flex;gap:10px}.setupRow label{min-width:0;flex:1;display:flex;flex-direction:column;gap:7px;font-size:8px;letter-spacing:1px;color:#a5bfc3}.setupRow label:first-child{flex:1.5}select{appearance:auto;min-width:0;background:#13323b;border:1px solid #a0c1c52b;border-radius:5px;color:#e2eded;padding:11px 6px;font-size:11px}option{background:#102d38}.primary{display:flex;align-items:center;justify-content:space-between;gap:25px;background:var(--lime);color:#162a20;border:0;border-radius:6px;font-size:13px;font-weight:900;letter-spacing:1px;padding:17px 19px;width:100%;margin-top:19px;box-shadow:0 6px 25px #d9ff5812}.primary:hover{background:#e7ff9b;transform:translateY(-1px)}.primary span{font-size:22px;line-height:14px}.setupFoot{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:8px;color:#91b0b5;margin-top:14px}.setupFoot button{font-size:8px;color:#b8ced0;border:0;background:none;padding:0;white-space:nowrap}.screen footer{display:flex;justify-content:space-between;gap:20px;font-size:8px;letter-spacing:1px;color:#c0d9da99;align-items:end}.mobileHint{display:none}.hidden{display:none!important}#loading{position:absolute;inset:0;background:#091e28;z-index:20;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px}#loading b{font-size:42px;font-weight:900;font-style:italic;letter-spacing:-2px;color:var(--lime)}#loading span{letter-spacing:4px;font-size:9px}#hud{position:absolute;inset:0;pointer-events:none;padding:24px 30px}#hud button{pointer-events:auto}.hudTop{display:flex;gap:25px;align-items:start}.positionBox small,.raceInfo small{display:block;font-size:8px;letter-spacing:1.7px;color:#d4eeed;text-shadow:0 2px 4px #002a37}.positionBox strong{font-size:58px;font-weight:900;font-style:italic;line-height:1.05;text-shadow:0 2px 15px #072e39}.positionBox strong span{font-size:21px;color:#bbd2d5;font-style:normal;font-weight:500}.raceInfo{display:flex;gap:30px;padding-top:3px;flex:1}.raceInfo b{display:block;font-size:25px;margin-top:8px;font-style:italic;text-shadow:0 2px 7px #002732;font-variant-numeric:tabular-nums}.raceInfo #clock{color:var(--lime)}#clockBox.danger b{color:#ff7866;animation:pulse .4s infinite alternate}#pauseBtn{font-size:20px;padding:10px 15px}#raceProgress{height:3px;background:#daffff20;margin-top:15px}#raceProgress i{height:100%;display:block;background:var(--lime);width:0}.hudBottom{position:absolute;left:30px;right:30px;bottom:22px;display:flex;justify-content:space-between;align-items:end}.miniMap{display:flex;flex-direction:column;align-items:center;background:#08293355;border-radius:12px;padding:5px;backdrop-filter:blur(5px)}.miniMap canvas{width:150px;height:120px}.miniMap small{font-size:8px;letter-spacing:1.6px;padding-bottom:6px}.telemetry{width:200px;text-align:right}.speed b{font-size:74px;font-style:italic;line-height:.9;font-weight:900;text-shadow:0 2px 15px #00303e}.speed span{font-size:10px;margin-left:10px}.boostLabel{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;margin:15px 0 7px}.boostTrack{height:9px;background:#091d2c99;border:1px solid #bafaff60;transform:skewX(-15deg);padding:1px}.boostTrack i{display:block;height:100%;background:var(--lime);width:65%;box-shadow:0 0 15px #d9ff5855}.telemetry>small{display:block;height:18px;margin-top:8px;letter-spacing:1px;color:var(--lime);font-size:10px}#countdown{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);font-size:110px;font-style:italic;font-weight:900;color:var(--lime);text-shadow:0 8px 25px #0a283b88}#notice{position:absolute;top:24%;width:calc(100% - 60px);text-align:center;font-size:24px;font-style:italic;font-weight:900;text-shadow:0 3px 20px #022436;letter-spacing:1px;color:var(--lime);opacity:0;transition:opacity .12s}#racePrompt{position:absolute;top:61%;width:calc(100% - 60px);text-align:center;font-size:9px;letter-spacing:1.5px;text-shadow:0 2px 5px #002e3e}#speedLines{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 45%,transparent 30%,#adfcff25 110%);border:0 solid #8befff;box-shadow:inset 0 0 70px #a0f8ff66;transition:opacity .2s}#touchControls{display:none;position:absolute;bottom:24px;left:24px;right:24px;justify-content:space-between;align-items:end;pointer-events:none}#touchControls button{touch-action:none;user-select:none;-webkit-user-select:none;border:1px solid #d5f4f95e;background:#102e4099;backdrop-filter:blur(4px);box-shadow:0 4px 10px #00172633}.steering{display:flex;gap:10px}.steering button{width:67px;height:66px;border-radius:13px;font-size:29px}.pedals{display:flex;gap:10px;align-items:end}#brake{height:44px;width:58px;border-radius:10px;font-size:9px;letter-spacing:1px}#boost{width:77px;height:77px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;border-radius:50%;background:#d9ff58e0!important;color:#183525;font-weight:800;font-size:9px;letter-spacing:1px;border-color:#efffc2!important}#boost span{font-size:34px;line-height:34px}#touchControls button.pressed{background:#defdff77;transform:scale(.95)}#boost.pressed{background:#fff!important;box-shadow:0 0 30px #e0ff55}.modal{position:fixed;inset:0;background:#03121ec7;backdrop-filter:blur(12px);z-index:30;display:flex;justify-content:center;align-items:center;padding:20px}.modalContent{position:relative;width:min(480px,100%);max-height:90vh;overflow:auto;background:#0b2633;border:1px solid #9dbfc34d;border-radius:14px;padding:30px;box-shadow:0 20px 70px #0005}.modalContent h2{font-size:34px;font-style:italic;font-weight:900;margin:9px 0 17px}.modalContent p{font-size:13px;line-height:1.7;color:#b5cfd2}.modalContent .eyebrow{color:var(--lime);font-size:9px}.modalContent .secondary{border:1px solid #9bbcc340;background:#153641;border-radius:6px;padding:13px;width:100%;margin-top:9px;font-size:11px;font-weight:700}.modalContent .close{position:absolute;right:16px;top:13px;font-size:23px;border:0;background:none;color:#b7d4d8}.controlsList{display:grid;grid-template-columns:1fr 1fr;gap:10px}.controlsList div{background:#143640;border-radius:5px;padding:10px;font-size:11px}.controlsList b{display:block;margin-bottom:5px;color:var(--lime);font-size:14px}.resultsGrid{display:flex;gap:8px}.resultsGrid>div{flex:1;background:#143741;border-radius:6px;padding:14px 10px}.resultsGrid small{font-size:8px;color:#97b6bc;letter-spacing:1px}.resultsGrid strong{display:block;font-size:24px;margin-top:5px}.leaderboard{margin-top:16px}.leaderboard div{display:flex;justify-content:space-between;padding:8px 10px;border-bottom:1px solid #a5c5cc17;font-size:11px;color:#a9c7ce}.leaderboard .you{background:#d9ff5815;color:var(--lime);font-weight:700}.recordsList{display:grid;gap:10px}.recordRow{padding:12px;background:#14343e;border-radius:6px;font-size:11px;display:flex;justify-content:space-between;gap:10px}.recordRow span{color:var(--lime)}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#132f3a;border:1px solid #aac9c144;padding:13px 20px;border-radius:30px;font-size:12px;z-index:50;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90%;text-align:center}@keyframes pulse{to{opacity:.5}}
@media(pointer:coarse),(max-width:900px){#touchControls{display:flex}.hudBottom{bottom:120px}.miniMap canvas{width:100px;height:80px}.telemetry{width:160px}.speed b{font-size:53px}.desktopHint{display:none}.mobileHint{display:block}}
@media(max-width:900px){.screen{padding:23px 25px 18px}.raceSetup{width:350px;padding:20px}.intro h1{font-size:85px;letter-spacing:-5px}.intro p{font-size:13px}.eyebrow{font-size:8px;letter-spacing:1.4px}.courseReadout{margin-top:28px}.courseReadout small{max-width:200px;line-height:1.6}.wordmark{font-size:22px}.headerActions .iconButton{padding:10px;font-size:9px}.menuBody{gap:20px}.screen footer{font-size:7px}.course span{font-size:8px}}
@media(max-width:640px) and (orientation:portrait){.screen{padding:20px 18px 10px;overflow:auto;display:block;background:linear-gradient(0deg,#071c28 20%,transparent 85%)}header{margin-bottom:30px}.wordmark{font-size:21px}.headerActions{gap:6px}.headerActions .iconButton{font-size:0;width:34px;height:34px;padding:0}.headerActions .soundButton:before{content:'♪';font-size:18px}#helpBtn:before{content:'?';font-size:15px}.menuBody{display:block}.intro{padding-bottom:0}.intro .eyebrow{font-size:8px}.intro h1{font-size:74px;line-height:.84;letter-spacing:-4px;margin:19px 0 16px}.intro h1 br{display:none}.intro p{font-size:12px;margin:0 0 18px}.courseReadout{display:none}.raceSetup{width:100%;padding:19px;background:#0a2635eb}.raceSetup h2{font-size:23px;margin:12px 0 14px}.courseArt{height:48px}.boatChoice svg{height:31px}.labelRow{margin-top:16px}.primary{margin-top:16px}.screen footer{margin-top:15px;font-size:6px;justify-content:center}.screen footer span:first-child,.screen footer .desktopHint{display:none}.screen footer span:last-child{display:none}#hud{padding:18px 15px}.hudTop{gap:16px}.raceInfo{gap:14px}.raceInfo b{font-size:19px}.raceInfo small,.positionBox small{font-size:6px;letter-spacing:1px}.positionBox strong{font-size:43px}.positionBox strong span{font-size:16px}#pauseBtn{font-size:16px;padding:8px 12px}.hudBottom{left:18px;right:18px;bottom:140px}.telemetry{width:135px}.speed b{font-size:48px}.speed span{font-size:8px;margin-left:5px}.miniMap canvas{width:95px;height:76px}.miniMap small{font-size:6px}#touchControls{bottom:max(24px,env(safe-area-inset-bottom));left:17px;right:17px}.steering button{width:60px;height:65px}#notice{width:calc(100% - 30px);font-size:19px}#racePrompt{width:calc(100% - 30px);font-size:7px}#countdown{font-size:90px}.modalContent{padding:25px}.hudTop #clockBox small{max-width:60px}.raceInfo{align-items:start}}
@media(max-height:590px) and (orientation:landscape){.screen{padding:15px 25px 10px}.wordmark{font-size:18px}.wordmark span{font-size:6px}.headerActions .iconButton{padding:8px;font-size:8px}.intro h1{font-size:75px;margin:18px 0 13px}.intro p{font-size:11px}.courseReadout{margin-top:20px}.courseReadout small{display:none}.raceSetup{width:350px;padding:15px;margin-top:8px}.panelTop{font-size:7px}.raceSetup h2{font-size:19px;margin:9px 0}.courseArt{height:30px}.course span{padding:6px}.labelRow{margin:10px 0 6px}.boatChoice{padding:4px}.boatChoice svg{height:25px}.boatStats{margin:8px 0}.setupRow label{font-size:7px;gap:4px}select{padding:7px 4px;font-size:10px}.primary{margin-top:10px;padding:12px 15px;font-size:11px}.setupFoot{margin-top:9px;font-size:7px}.screen footer{font-size:6px}.screen footer span:first-child{visibility:hidden}#hud{padding:15px 25px}.positionBox strong{font-size:40px}.raceInfo b{font-size:20px}.hudBottom{bottom:100px;left:25px;right:25px}.miniMap canvas{width:90px;height:72px}.miniMap small{font-size:6px}.telemetry{width:145px}.speed b{font-size:45px}.steering button{height:56px;width:62px}#boost{height:66px;width:66px}#touchControls{bottom:15px}#racePrompt{top:66%}.modalContent{max-height:94vh;padding:22px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}#clockBox.danger b{animation:none}}
@media(max-width:640px) and (orientation:portrait){.intro h1 br{display:block}.intro h1{font-size:70px;line-height:.85;margin:17px 0}.intro{overflow:hidden}}
@media(max-height:450px) and (orientation:landscape){.raceSetup{padding:12px;margin-top:0}.raceSetup .panelTop{display:none}.raceSetup h2{margin:5px 0 8px}.courseArt{height:24px}.labelRow{margin-top:8px}.boatChoice svg{height:22px}.primary{margin-top:8px}.setupFoot{margin-top:7px}.screen footer{display:none}}

@media(max-width:640px) and (orientation:portrait){#graphicsBtn:before{content:"◈";font-size:19px}.headerActions{gap:5px}.wordmark{font-size:19px}.wordmark span{letter-spacing:1.8px}}

.studioLink{color:inherit;text-decoration:none}.studioLink:hover{color:var(--lime)}

.compatibilityNote{font-size:11px;line-height:1.5;color:#ffe4a6;padding:10px;background:#69532935;border:1px solid #bfa25655;border-radius:6px}.localTag{font-size:8px;letter-spacing:.8px}

/* Install and private race room controls. */
.extraModes{display:grid;gap:7px;margin-top:10px}.extraModes .secondary,.inviteButtons button,.inviteButtons a{border:1px solid #9bbcc34d;background:#153641;border-radius:6px;padding:12px;color:var(--white);font-size:10px;font-weight:800;letter-spacing:.7px;text-decoration:none;text-align:center}.extraModes button:first-child{border-color:#61e3ea77;color:var(--cyan)}button:disabled{opacity:.45;cursor:default;transform:none}.roomField{display:flex;flex-direction:column;gap:7px;font-size:11px;color:#bfd9dc;margin:13px 0}.roomField input,.roomField select{width:100%;padding:13px;border-radius:6px;background:#12313e;border:1px solid #99bcc65c;color:white;font:inherit;font-size:16px}.roomDivider{margin:22px 0 8px;font-size:9px;letter-spacing:1.5px;color:#a4c8cc}.roomError{color:#ffb7a5!important;min-height:18px}.roomFine{font-size:11px!important}.inviteCode{display:flex;flex-direction:column;gap:6px;border:1px dashed #61e3ea77;background:#16404b;padding:12px;text-align:center;border-radius:8px}.inviteCode small{letter-spacing:2px;font-size:9px}.inviteCode b{font-size:26px;letter-spacing:3px;color:var(--lime)}.inviteButtons{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.roomRoster{list-style:none;margin:15px 0;padding:0}.roomRoster li{display:flex;gap:10px;align-items:center;min-height:44px;border-bottom:1px solid #9ac3ca22;padding:6px 0}.roomRoster li>i{width:9px;height:24px;border-radius:4px}.roomRoster li>span{flex:1;min-width:0}.roomRoster b{font-size:13px;overflow-wrap:anywhere}.roomRoster small{display:block;font-size:9px;color:#b5cdd3;margin-top:4px}.roomRoster em{font-style:normal;font-size:8px;color:var(--lime)}.roomRoster .emptyRacer{min-height:25px;color:#7c9fa9;font-size:10px;padding-left:19px}.removeRacer{background:none;border:1px solid #abc6c655;border-radius:5px;padding:5px 9px;color:white}.downloadFile{display:block;text-align:center;text-decoration:none;color:var(--cyan)}.offlineStatus{padding:10px;background:#61e3ea12;border-radius:6px}.installHintActive{border:1px solid var(--lime);padding:10px;border-radius:6px}.modalContent{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}#onlineStatus{position:absolute;top:110px;left:30px;font-size:9px;color:var(--cyan);max-width:55%;line-height:1.5;text-shadow:0 1px 3px #000}#onlineStandings{position:absolute;top:135px;left:30px;font-size:10px;width:145px;display:grid;gap:5px}#onlineStandings div{display:flex;align-items:center;gap:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 4px #000}#onlineStandings i{width:5px;height:12px;flex-shrink:0}#onlineStandings .self{color:var(--lime);font-weight:bold}
/* Safari's dynamic viewport and notch must agree with the drawing surface. */
html,body{height:100%;height:100dvh}#game,#menu,#hud,#vignette,#speedLines{height:100%;height:100dvh}.screen{padding-top:max(20px,env(safe-area-inset-top));padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));overflow-y:auto}#hud{padding-top:max(18px,env(safe-area-inset-top));padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}#touchControls{bottom:calc(14px + env(safe-area-inset-bottom));left:calc(14px + env(safe-area-inset-left));right:calc(14px + env(safe-area-inset-right))}.modal{padding-top:max(14px,env(safe-area-inset-top));padding-bottom:max(14px,env(safe-area-inset-bottom))}.modalContent{max-height:calc(100dvh - 36px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}.screen .menuBody{min-height:fit-content;padding:20px 0}.raceSetup{margin-block:10px}
@media(max-width:699px) and (orientation:portrait){
 #hud{padding-inline:14px}.hudTop{gap:12px}.raceInfo{gap:12px}.hudBottom{top:calc(110px + env(safe-area-inset-top));bottom:auto;left:14px;right:14px;align-items:start}.miniMap{padding:2px}.miniMap canvas{width:68px;height:55px}.miniMap small{display:none}.telemetry{width:95px}.speed b{font-size:34px}.boostLabel{margin-top:8px;font-size:7px}.telemetry>small{font-size:8px}.boostTrack{height:7px}#racePrompt{top:31%;left:20%;width:60%;font-size:8px;line-height:1.6}#notice{top:26%;font-size:17px}#onlineStatus{top:calc(85px + env(safe-area-inset-top));left:14px;max-width:90%;font-size:8px}#onlineStandings{top:calc(175px + env(safe-area-inset-top));left:14px;width:95px;font-size:8px;gap:3px}.steering{gap:6px}.steering button{width:54px;height:58px}.pedals{gap:7px}#boost{width:65px;height:65px}#brake{width:48px;height:42px}.screen footer{display:flex;font-size:7px}.screen footer span:first-child{display:inline}.intro h1{font-size:62px}.extraModes .secondary{padding:13px}.inviteCode b{font-size:22px;letter-spacing:2px}
}
@media(max-height:540px) and (orientation:landscape){
 .screen .menuBody{align-items:flex-start;padding:12px 0}.raceSetup{margin-top:0}.intro{position:sticky;top:15px}.extraModes{grid-template-columns:1fr 1fr}.extraModes .secondary{font-size:8px;padding:10px}.hudBottom{top:80px;bottom:auto;left:calc(18px + env(safe-area-inset-left));right:calc(18px + env(safe-area-inset-right));align-items:start}.miniMap canvas{width:65px;height:52px}.miniMap small{display:none}.telemetry{width:100px}.speed b{font-size:31px}.boostLabel{margin-top:7px;font-size:7px}.telemetry>small{font-size:8px}#racePrompt{top:25%;left:25%;width:50%;font-size:8px}#onlineStatus{top:80px;left:calc(95px + env(safe-area-inset-left));max-width:50%;font-size:8px}#onlineStandings{top:102px;left:calc(95px + env(safe-area-inset-left));font-size:8px;width:95px;gap:2px}#notice{top:28%;font-size:18px}.modalContent{max-height:calc(100dvh - 28px);padding:20px}.steering button{width:57px;height:50px}#boost{width:58px;height:58px}#brake{height:38px}
}
.touchDevice #touchControls{display:flex}#touchControls button{pointer-events:auto;-webkit-touch-callout:none;touch-action:none}.touchDevice .desktopHint{display:none}.touchDevice .mobileHint{display:block}#boost{min-width:58px;min-height:58px}#boost:focus-visible{outline-offset:2px}

/* Keep browser gestures off the complete thumb areas, including the arrow gap. */
#touchControls,.steering,.pedals{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#touchControls{z-index:5;bottom:calc(24px + env(safe-area-inset-bottom))}
#touchControls button{min-width:60px;min-height:60px}
#touchControls button.pressed{transform:none}
.steering{gap:4px;pointer-events:auto;border-radius:15px}
#boost{min-width:72px;min-height:72px}
@media(max-width:699px) and (orientation:portrait){.steering button{width:62px;height:68px}.pedals{gap:10px}#brake{width:60px;height:60px}#boost{width:72px;height:72px}}
@media(max-height:540px) and (orientation:landscape){#touchControls{bottom:calc(20px + env(safe-area-inset-bottom))}.steering button{width:68px;height:62px}}