@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,500;0,600;0,700;0,800;0,900;1,800;1,900&family=Barlow:wght@400;500;600;700;800&display=swap');
:root{--acid:#d3f26a;--paper:#f1f1e5;--muted:#c0c4b6}*{box-sizing:border-box}body{margin:0;background:#151c1b;color:var(--paper);font-family:Barlow,Arial,sans-serif;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--acid);outline-offset:5px}button{border:0}button:hover{filter:brightness(1.12)}[hidden]{display:none!important}#app{height:100dvh;min-height:570px;position:relative;overflow:hidden}#world,.vignette{position:absolute;width:100%;height:100%;inset:0}.vignette{pointer-events:none;background:linear-gradient(90deg,rgba(11,24,26,.92),rgba(11,24,26,.55) 37%,transparent 74%),linear-gradient(0deg,rgba(8,17,18,.7),transparent 25%)}header{position:absolute;top:0;left:0;right:0;z-index:5;height:104px;padding:28px 4%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff20}.brand{color:var(--paper);font-size:25px;font-weight:800;letter-spacing:-1px;text-decoration:none;display:flex;align-items:center;gap:4px}.brand>span:not(.brandmark){font-weight:400}.brandmark{font-size:42px;line-height:.8;transform:skew(-17deg);margin-right:7px;color:var(--acid)}.brand small{font-size:9px;font-weight:500;letter-spacing:2px;max-width:100px;line-height:1.6;margin-left:23px;padding-left:23px;border-left:1px solid #ffffff35}.top-actions{display:flex;gap:22px;align-items:center;font-size:10px;letter-spacing:1.5px}.top-actions button{background:transparent;font-size:10px;letter-spacing:1.5px;padding:9px 0}#fullscreen{font-size:25px}.status{display:flex;align-items:center;gap:8px}.status i{width:6px;height:6px;border-radius:50%;background:var(--acid);box-shadow:0 0 12px #d3f26a80}.menu{position:absolute;left:6.4%;top:19%;z-index:2;width:min(670px,57%)}.eyebrow{font-size:10px;letter-spacing:3px;font-weight:700;color:var(--acid);display:flex;align-items:center;gap:11px}.eyebrow>span{height:1px;width:24px;background:var(--acid)}h1{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:clamp(68px,7.9vw,122px);font-weight:800;letter-spacing:-2px;line-height:.87;margin:27px 0 23px}h1 em{font-style:italic;color:var(--acid)}.intro{font-size:14px;color:#d4d6cb;line-height:1.65;margin-bottom:30px}.route-selector{display:flex;gap:8px;width:100%;max-width:620px}.route{background:#12212690;border:1px solid #e2e7d633;padding:16px 14px;text-align:left;flex:1;min-width:0;backdrop-filter:blur(14px);transition:background .2s,border .2s}.route.selected{background:#d3f26a16;border-color:var(--acid)}.route small{font-size:9px;font-weight:600;letter-spacing:1.2px;color:#b0b6ab;display:block}.route.selected small{color:var(--acid)}.route strong{display:flex;justify-content:space-between;font-family:'Barlow Condensed',Impact,sans-serif;font-size:25px;font-weight:600;margin:9px 0 12px}.route strong span{font:20px Barlow;color:var(--acid)}.route>span{font-size:7px;letter-spacing:.8px;white-space:nowrap;color:#b4beb6}.launch-row{display:flex;align-items:center;gap:24px;margin-top:23px}.primary{background:var(--acid);color:#18251b;padding:19px 25px;min-width:211px;font-weight:800;font-size:13px;letter-spacing:1px;display:flex;align-items:center;justify-content:space-between;gap:35px}.primary span{font-size:21px;line-height:16px}.record{font-size:8px;letter-spacing:1.7px;color:#b0b7aa}.record strong{display:block;margin-top:6px;font:23px 'Barlow Condensed',Impact,sans-serif;color:var(--paper);letter-spacing:2px}.menu-controls{display:flex;gap:22px;margin-top:23px;font-size:8px;letter-spacing:1px;color:#b7bfb5}.menu-controls>span{display:flex;align-items:center;gap:4px}kbd{font:9px Barlow,Arial,sans-serif;min-width:19px;height:19px;line-height:17px;text-align:center;padding:0 4px;display:inline-block;border:1px solid #ffffff3a;border-radius:3px;color:var(--paper);margin-right:2px}.scene-caption{position:absolute;right:5%;bottom:17%;display:flex;flex-direction:column;text-align:right;gap:10px}.scene-caption span{font-size:9px;letter-spacing:2px}.scene-caption strong{font:600 26px 'Barlow Condensed',Impact,sans-serif;letter-spacing:1px}footer{position:absolute;bottom:0;left:4%;right:4%;height:66px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff25;font-size:8px;letter-spacing:1.5px;color:#bdc4b9}footer b,.race-hint b{padding:0 12px;color:var(--acid)}body.racing .vignette{background:linear-gradient(0deg,#07181b90,transparent 30%,transparent 65%,#07181b55)}body.racing header{height:74px;padding-top:16px;padding-bottom:16px}body.racing .brand small,body.racing .status{display:none}.race-top{position:absolute;left:4%;right:4%;top:100px;display:flex;justify-content:space-between;align-items:start}.race-top small,.track-info small{font-size:9px;letter-spacing:2px;color:#e2e4d7}.position strong{display:block;font:800 65px 'Barlow Condensed',Impact,sans-serif;line-height:1.05}.position strong span{font-size:28px;font-weight:500;color:#e0e4d2}.timing{text-align:center;display:flex;flex-direction:column;gap:7px}.timing strong{font:600 33px 'Barlow Condensed',Impact,sans-serif;font-variant-numeric:tabular-nums}.timing>span{font-size:10px;letter-spacing:2px}#pause{background:#10242c60;border:1px solid #ffffff40;padding:12px;font-size:17px}#pause span{font-size:9px;letter-spacing:1px;margin-left:8px}.progress{position:absolute;top:74px;width:100%;height:3px;background:#ffffff20}#progress-fill{width:0;background:var(--acid);height:100%}.race-bottom{position:absolute;left:4%;right:4%;bottom:65px;display:flex;justify-content:space-between;align-items:end}.track-info strong{display:block;font:600 29px 'Barlow Condensed',Impact,sans-serif;margin-top:8px}#minimap{display:block;margin-top:15px;opacity:.85}.speedometer{width:210px}.speedline{display:flex;gap:13px;align-items:center}.speedline>strong{font:800 italic 103px 'Barlow Condensed',Impact,sans-serif;line-height:1;font-variant-numeric:tabular-nums}.speedline>span{font-size:11px;letter-spacing:1px}.speedline b{display:block;font:600 32px 'Barlow Condensed',Impact,sans-serif;margin-top:8px;color:var(--acid)}.rpm{height:5px;background:#ffffff30;margin:12px 0 20px}.rpm>div{background:var(--paper);height:100%}.nitro-label{font-size:9px;letter-spacing:1.3px;display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.nitro{height:7px;background:#ffffff20}.nitro>div{height:100%;background:var(--acid)}.race-hint{position:absolute;bottom:24px;left:0;right:0;text-align:center;font-size:9px;letter-spacing:1.5px;color:#d6ded4}#announcement{position:absolute;top:30%;width:100%;text-align:center;font:700 italic 34px 'Barlow Condensed',Impact,sans-serif;color:var(--acid);text-shadow:0 3px 15px #000}#overlay{position:absolute;inset:0;background:#0b1a20c9;backdrop-filter:blur(16px);z-index:20;display:grid;place-items:center}.dialog{width:440px;max-width:90vw;text-align:center;padding:35px}.dialog .eyebrow{justify-content:center}.dialog h2{font:800 italic 65px/1 'Barlow Condensed',Impact,sans-serif;margin:22px 0}.dialog p{color:#bdc8bf;font-size:14px}.dialog .primary{width:100%;margin:26px 0 12px}.secondary{background:#ffffff12;border:1px solid #ffffff40;width:100%;padding:16px;font-size:11px;font-weight:700;letter-spacing:1.5px}.text-button{background:none;padding:21px 12px 0;font-size:10px;letter-spacing:1.5px;color:#cbd5ca}#results{display:flex;justify-content:space-around;margin:28px 0}#results div{font-size:9px;letter-spacing:1px;color:#b8c8bb}#results strong{display:block;font:600 30px 'Barlow Condensed',Impact,sans-serif;color:var(--paper);margin-top:8px}#countdown{position:absolute;inset:0;z-index:10;display:grid;place-items:center;font:800 italic 160px 'Barlow Condensed',Impact,sans-serif;color:var(--acid);text-shadow:0 5px 35px #0008;pointer-events:none}#touch-controls{display:none}.boosting .vignette{box-shadow:inset 0 0 110px #cfff6e35}button:active{transform:translateY(1px)}
@media(min-height:900px){.menu{top:23%}}@media(max-height:750px) and (min-width:800px){header{height:80px}.menu{top:17%}h1{font-size:85px;margin:20px 0}.intro{margin-bottom:20px}.route{padding:12px}.launch-row{margin-top:16px}.menu-controls{margin-top:15px}footer{height:45px}}
@media(max-width:800px){#app{min-height:520px}header{height:75px;padding:20px 5%}.brand{font-size:21px}.brand small,.status{display:none}.top-actions{gap:17px}.menu{left:6%;top:16%;width:88%}h1{font-size:clamp(64px,12vw,96px);margin:24px 0 19px}.intro{font-size:13px;margin-bottom:24px}.route{padding:13px 10px;flex:1}.route strong{font-size:23px}.route>span{font-size:6px;letter-spacing:.1px}.route small{font-size:8px}.scene-caption{display:none}.vignette{background:linear-gradient(90deg,#0b181bd9,#0b181b50),linear-gradient(0deg,#07171988,transparent)}footer{height:48px;font-size:7px}footer span:last-child{display:none}.menu-controls{gap:14px;font-size:7px}.record{font-size:7px}.primary{min-width:180px}.race-bottom{bottom:128px}.track-info{display:none}.speedometer{margin-left:auto;width:155px}.speedline>strong{font-size:72px}.race-top{top:96px}.race-hint{display:none}#touch-controls{display:flex;position:absolute;left:4%;right:4%;bottom:26px;justify-content:space-between;gap:12px;touch-action:none}#touch-controls>div{display:flex;gap:7px}#touch-controls button{background:#0b1e2699;border:1px solid #ffffff50;border-radius:8px;width:55px;height:62px;font-size:12px;font-weight:700;touch-action:none;user-select:none}#touch-controls .gas{background:var(--acid);color:#17281a}#touch-controls .boost{color:var(--acid);border-color:var(--acid)}}
@media(pointer:coarse) and (min-width:801px){#touch-controls{display:flex;position:absolute;left:4%;right:4%;bottom:18px;justify-content:space-between;touch-action:none}#touch-controls button{padding:18px;margin:4px;background:#112a30bb;border:1px solid #ffffff60;border-radius:6px;touch-action:none}.race-hint{display:none}.race-bottom{bottom:110px}}
@media(max-height:650px) and (max-width:800px){.menu{top:16%}h1{font-size:60px;margin:14px 0}.intro{margin:0 0 15px;font-size:11px}.route{padding:8px}.route strong{margin:5px 0;font-size:21px}.route>span{display:none}.launch-row{margin-top:15px}.menu-controls{margin-top:15px}.primary{padding:15px 20px}footer{height:32px}.race-bottom{bottom:100px}.position strong{font-size:46px}.speedline>strong{font-size:60px}}
.menu{max-height:calc(100dvh - 175px);overflow:auto;scrollbar-width:thin;scrollbar-color:#d3f26a50 transparent;padding-bottom:8px}.ride-options-row{display:flex;align-items:center;gap:14px;margin-top:13px;max-width:620px}.ride-options-row button{border:1px solid #c9d5ba77;background:#122126b0;color:var(--acid);font-size:9px;font-weight:700;letter-spacing:1px;padding:11px 12px;white-space:nowrap}.ride-options-row button span{margin-left:15px}#ride-summary{font-size:8px;line-height:1.7;letter-spacing:1px;color:#d5ddcf;text-transform:uppercase}.launch-row{margin-top:15px}
#garage{position:absolute;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;background:#09191be8;backdrop-filter:blur(20px);padding:24px}.garage-panel{width:960px;max-width:100%;max-height:calc(100dvh - 48px);overflow:auto;border:1px solid #d4e2ce40;background:#142727;padding:32px;box-shadow:0 20px 100px #0005}.garage-heading{display:flex;align-items:start;justify-content:space-between;gap:20px}.garage-heading h2{font:800 italic 48px/1 'Barlow Condensed',Impact,sans-serif;margin:14px 0 10px}.garage-heading .eyebrow{font-size:9px}.garage-heading>button{background:#ffffff0a;border:1px solid #ffffff35;font-size:21px;width:36px;height:36px;flex-shrink:0}.garage-grid{display:grid;grid-template-columns:1fr 250px;gap:28px}.garage-grid h3{font-size:9px;font-weight:600;letter-spacing:2px;color:#b7c6ba;margin:25px 0 13px}.option-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.option-cards button{background:#0b1d2077;border:1px solid #cadbb333;padding:15px 12px;min-width:0;text-align:left;position:relative;transition:background .2s}.option-cards button.active{border-color:var(--acid);background:#d3f26a0e}.option-cards button.active:after{content:'✓';position:absolute;top:9px;right:10px;color:var(--acid);font-size:13px}.option-cards b{font:32px 'Barlow Condensed',Arial;display:block;color:var(--acid);height:43px}.option-cards strong{font:600 22px 'Barlow Condensed',Impact,sans-serif;display:block;margin:5px 0 8px}.option-cards span{font-size:10px;color:#bdcdc0;line-height:1.6;display:block}.bikes i{display:block;width:23px;height:44px;background:var(--bike);border-radius:50% 50% 25% 25%;margin:5px 0 20px;transform:rotate(-28deg);box-shadow:inset 0 -13px #193331,inset 0 8px #e5ead680,5px 7px 0 #081b1e,-5px 7px 0 #081b1e}.garage-settings label{font-size:9px;letter-spacing:1.3px;display:block;margin-bottom:18px;color:#c8d7c9}.garage-settings select{display:block;width:100%;margin-top:8px;background:#0f2224;border:1px solid #bdd0bc55;color:#e0e9d7;padding:12px 8px;font:11px Barlow,Arial;letter-spacing:.2px;border-radius:0}.check-option{display:flex!important;align-items:start;gap:10px;line-height:1.5}.check-option input{accent-color:var(--acid);width:16px;height:16px;margin:0}.check-option small{display:block;font-size:10px;letter-spacing:0;color:#a5b8ac;margin-top:5px}.hazard-guide{border-top:1px solid #ffffff20;padding-top:15px}.hazard-guide>strong{font-size:9px;letter-spacing:1.7px;color:var(--acid)}.hazard-guide p{font-size:11px;line-height:2;color:#c3d1c4;margin-bottom:0}.garage-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:25px;padding-top:22px;border-top:1px solid #c8dcc033;gap:15px}.garage-bottom>span{font-size:10px;color:#a9bcae}.garage-bottom .primary{padding:16px 20px;font-size:11px;min-width:230px}
#arcade-hud{pointer-events:none;position:absolute;inset:0}.score-block{position:absolute;left:18%;top:109px;display:flex;flex-direction:column;gap:4px}.score-block small{font-size:9px;letter-spacing:2px}.score-block strong{font:700 40px 'Barlow Condensed',Impact,sans-serif;font-variant-numeric:tabular-nums;color:#f4ce69}.score-block>span{font-size:8px;letter-spacing:1.3px;color:#d0dbca}.condition{position:absolute;right:4%;bottom:305px;width:210px}.condition>div:first-child{display:flex;justify-content:space-between;gap:15px;font-size:8px;letter-spacing:1.2px}.condition b{font-weight:500}.health-track{height:5px;background:#ffffff20;margin:9px 0}.health-track>i{display:block;height:100%;width:100%;background:#8fdde0;transition:width .15s}.condition>span{font-size:8px;letter-spacing:.8px;color:#a8e3e1}.mission{position:absolute;bottom:75px;left:23%;display:flex;flex-direction:column;gap:8px;border-left:2px solid #d3f26a88;padding:5px 15px}.mission>span{font-size:8px;letter-spacing:1.7px;color:#bdcbbd}.mission strong{font:600 21px 'Barlow Condensed',Impact,sans-serif;font-weight:500}.mission>span:last-child{color:var(--acid);font-size:10px}#hazard-warning{position:absolute;left:50%;transform:translateX(-50%);top:205px;display:flex;align-items:center;gap:9px;background:#0b2026a3;border:1px solid #eab95655;padding:10px 16px;color:#f4ce69;backdrop-filter:blur(5px)}#hazard-warning>span{font-size:22px}#hazard-warning strong{font-size:10px;letter-spacing:1.5px;white-space:nowrap}#hazard-warning small{display:none}#checkpoint-clock{position:absolute;right:17%;top:110px;display:flex;flex-direction:column;gap:4px;text-align:right}#checkpoint-clock small,#checkpoint-clock span{font-size:8px;letter-spacing:1.4px}#checkpoint-clock strong{font:700 40px 'Barlow Condensed',Impact,sans-serif;color:var(--acid);font-variant-numeric:tabular-nums}#checkpoint-clock.urgent strong{color:#ff816c;animation:pulse .6s infinite alternate}.mode-abbr{font:600 32px 'Barlow Condensed',Impact,sans-serif!important;color:var(--acid)!important}.rainy .vignette{box-shadow:inset 0 0 120px #7ebbe52a}@keyframes pulse{to{opacity:.5}}#announcement{z-index:2;top:37%;font-size:29px;pointer-events:none}#overlay{z-index:22}.dialog{max-height:95dvh;overflow:auto}.race-hint{letter-spacing:1px}
@media(max-width:800px){.menu{max-height:calc(100dvh - 150px)}#garage{padding:10px}.garage-panel{padding:22px;max-height:calc(100dvh - 20px)}.garage-grid{grid-template-columns:1fr;gap:0}.garage-heading h2{font-size:35px}.option-cards button{padding:13px 10px}.option-cards strong{font-size:21px}.option-cards span{font-size:10px}.garage-grid h3{margin-top:22px}.garage-bottom{flex-direction:column;align-items:stretch;margin-top:12px}.garage-bottom .primary{min-width:0}.garage-bottom>span{display:none}.garage-settings{display:grid;grid-template-columns:1fr 1fr;gap:12px}.garage-settings h3,.check-option,.hazard-guide{grid-column:1/-1}.garage-settings h3{margin-bottom:0}.garage-settings label{margin:0}.hazard-guide p{columns:2;column-gap:10px;font-size:9px}.ride-options-row{gap:10px;align-items:start}#ride-summary{font-size:7px}.ride-options-row button{font-size:8px;padding:10px}.ride-options-row button span{margin-left:8px}.score-block{left:4%;top:190px}.score-block strong{font-size:31px}.score-block small{font-size:8px}.score-block>span{font-size:7px;max-width:100px;line-height:1.5}.condition{bottom:335px;width:150px;right:4%}.mission{display:none}#checkpoint-clock{top:190px;right:4%}#checkpoint-clock strong{font-size:31px}#hazard-warning{top:282px;padding:7px 12px}#hazard-warning strong{font-size:8px}#hazard-warning>span{font-size:16px}#announcement{top:45%;padding:0 15px;font-size:23px}#touch-controls{gap:5px;left:3%;right:3%}#touch-controls>div{gap:5px}#touch-controls button{width:48px;font-size:10px;height:60px}#touch-controls>div:last-child{gap:4px}.condition>span{font-size:7px}.race-top{left:4%;right:4%}.position strong{font-size:56px}.timing strong{font-size:29px}.timing>span{font-size:8px}#pause span{display:none}.timing{position:absolute;left:50%;transform:translateX(-50%)}#pause{margin-left:auto}}
@media(max-width:370px){#touch-controls button{width:43px}.option-cards{gap:5px}.option-cards button{padding:12px 7px}.option-cards strong{font-size:19px}}
@media(max-height:650px){.garage-panel{padding:20px}.garage-grid h3{margin-top:16px}.garage-heading h2{font-size:36px}.option-cards b{height:30px;font-size:25px}.option-cards button{padding:10px}.option-cards span{font-size:9px}.garage-bottom{margin-top:18px;padding-top:14px}.garage-settings label{margin-bottom:12px}.hazard-guide p{line-height:1.7}}
@media(max-height:650px) and (max-width:800px){.menu{top:90px;max-height:calc(100dvh - 130px)}.condition{bottom:245px}.race-top{top:87px}.score-block,#checkpoint-clock{top:164px}#hazard-warning{top:215px}#announcement{top:49%;font-size:18px}.speedometer{width:130px}.rpm{margin:4px 0 8px}.nitro-label{font-size:7px}.speedline>strong{font-size:53px}.speedline b{font-size:22px}.speedline>span{font-size:9px}}
