:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;color:#f8f5de;background:#102a34;--lime:#e5ff70;--gold:#ffd45b}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a,input{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid white;outline-offset:5px}button:disabled{opacity:.45;cursor:default}[hidden]{display:none!important}#game{height:100dvh;min-height:360px;position:relative;overflow:hidden}canvas{width:100%;height:100%;display:block;touch-action:none}header{position:absolute;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:calc(22px + env(safe-area-inset-top)) 30px 20px;background:linear-gradient(#071e29bb,transparent)}.brand{font-size:14px;font-weight:900;letter-spacing:1px;color:#fff;text-decoration:none}.brand span{color:var(--lime)}.tools{display:flex;gap:8px}.tools button{background:#102a34bb;border:1px solid #ffffff45;border-radius:30px;padding:10px 15px;font-size:14px;min-height:42px}.hud{position:absolute;top:96px;left:30px;right:30px;display:flex;justify-content:space-between;pointer-events:none;text-shadow:0 2px 8px #102a34}.hud small{display:block;font-size:12px;letter-spacing:2px;margin-bottom:5px}.hud strong{font-size:30px;font-variant-numeric:tabular-nums}.hud .gold{color:var(--gold)}.hud em{font-size:14px;font-style:normal}.hud>div:last-child{text-align:right}.hud>div:last-child strong{font-size:22px;color:#ffcf8a}.distance{text-align:center}.overlay{position:absolute;inset:0;display:flex;align-items:center;padding:130px 8vw 115px;background:linear-gradient(90deg,#0b2735e8 0%,#0b2735aa 38%,transparent 76%);overflow:auto}.panel{width:370px;max-width:100%}.eyebrow{font-size:12px;letter-spacing:3px;font-weight:bold;color:var(--lime);margin-bottom:18px}h1{font-size:clamp(72px,8vw,116px);font-weight:950;font-style:italic;letter-spacing:-7px;line-height:.82;margin:0 0 26px}h1 span{display:block;color:var(--lime)}p{font-size:17px;line-height:1.5;color:#d3e1dc}.primary,.secondary{width:100%;border:0;text-align:left;padding:18px 22px;font-size:15px;font-weight:900;border-radius:6px;display:flex;align-items:center;justify-content:space-between}.primary{color:#15312c;background:var(--lime);box-shadow:0 8px 0 #132f2b55}.primary:hover{background:#f1ffa9}.primary span{font-size:24px}.secondary{margin-top:12px;background:#163441d9;border:1px solid #88adad80;color:#f2f5e7;font-size:13px}.how{display:flex;gap:24px;margin:25px 0 10px;font-size:13px;font-weight:bold}.how b{color:#a5c4c6;margin-left:5px;font-size:12px}.record{font-size:12px;letter-spacing:.6px;color:#bed1ce}.other{font-size:14px;color:#e5ff70;text-underline-offset:5px}.touch-help{display:none;font-size:13px}footer{position:absolute;inset:auto 0 0;display:flex;align-items:end;justify-content:space-between;padding:20px 30px calc(22px + env(safe-area-inset-bottom));pointer-events:none;background:linear-gradient(transparent,#102a34aa)}footer button{pointer-events:auto}.steering{display:flex;gap:10px}.steering button{border:1px solid #ffffff66;background:#13303cbb;border-radius:12px;width:56px;height:56px;font-size:28px;user-select:none}.speed{text-align:center;line-height:1}.speed strong{font-size:42px;font-style:italic}.speed small{font-size:12px;margin-left:8px}.speed>span{display:block;font-size:12px;letter-spacing:2px;margin-top:10px;color:var(--lime)}.nitro{width:135px}.nitro label{font-size:12px;font-weight:bold;letter-spacing:2px}progress{appearance:none;width:100%;height:5px;border:0;display:block;margin:8px 0 12px}progress::-webkit-progress-bar{background:#ffffff44}progress::-webkit-progress-value{background:var(--lime)}progress::-moz-progress-bar{background:var(--lime)}#boost{width:100%;height:54px;background:#e5ff70;border:0;border-radius:8px;color:#17392e;font-weight:900;font-size:15px;touch-action:none;user-select:none}#boost.active{background:#fff;box-shadow:0 0 35px #e5ff70}#notice{position:absolute;top:27%;left:0;right:0;text-align:center;color:var(--lime);font-weight:900;font-size:20px;pointer-events:none;text-shadow:0 3px 10px #102a34;opacity:0}.garage-panel{max-width:460px;width:100%;background:#102c38f5;padding:26px;border:1px solid #71928a;border-radius:14px;margin:auto}.garage-panel h2{font-size:32px;letter-spacing:-1px;margin:0}.garage-panel p{font-size:14px}.garage-panel label{display:flex;justify-content:space-between;align-items:center;margin:16px 0;font-size:16px}.garage-panel input{width:52px;height:32px;accent-color:var(--lime)}.garage-panel input[type=checkbox]{width:24px;height:24px}.cars{display:grid;gap:8px}.car-option{padding:14px;border:1px solid #7b9898;background:#183b47;color:#fff;border-radius:6px;display:flex;justify-content:space-between;align-items:center;text-align:left}.car-option.selected{border-color:var(--lime);background:#294638}.car-option span{font-size:13px;color:var(--gold)}#garageStatus{min-height:20px;color:var(--gold)}#results{font-size:24px;font-weight:bold;color:var(--gold);margin-bottom:20px}.garage-panel .record{font-size:12px}@media(pointer:coarse){.how{display:none}.touch-help{display:block}}@media(max-width:600px){header{padding:16px}.brand{font-size:12px}.brand span{display:block;margin-top:4px}.tools button{padding:9px 12px}.hud{left:18px;right:18px;top:82px}.hud strong{font-size:24px}.hud small{font-size:12px;letter-spacing:1px}.hud>div:last-child strong{font-size:18px}.overlay{padding:135px 24px 132px;background:linear-gradient(90deg,#0b2735df,#0b27358a 70%,#0b273530);align-items:center}.panel{width:285px}h1{font-size:78px;letter-spacing:-5px;margin-bottom:20px}.eyebrow{margin-bottom:14px}.panel p{font-size:15px}.primary,.secondary{padding:15px 18px}.panel .record{font-size:12px}.how{gap:16px;margin-top:20px}footer{padding:12px 16px 18px}.steering{gap:6px}.steering button{width:44px;height:50px}.nitro{width:105px}.speed strong{font-size:30px}.speed small{font-size:12px}.speed>span{font-size:12px;letter-spacing:0}.garage-panel{padding:20px}.overlay:has(.garage-panel){padding:75px 18px 95px}.garage-panel h2{font-size:28px}}@media(max-height:720px){h1{font-size:66px;letter-spacing:-4px}.eyebrow{margin-bottom:10px}.panel p{margin:14px 0}.primary,.secondary{padding:13px 18px}.how{margin-top:16px}.overlay{padding-top:128px;padding-bottom:115px}.garage-panel{padding:16px}.garage-panel label{margin:10px 0}.garage-panel p{margin:10px 0}.car-option{padding:10px}}@media(max-height:500px) and (orientation:landscape){.overlay{padding:75px 10% 65px}.panel{width:310px}h1{font-size:48px;letter-spacing:-2px;margin-bottom:10px}h1 span{display:inline}.eyebrow,.how,.touch-help,.panel .record,.panel .other{display:none}.panel p{font-size:14px;margin:10px 0}.secondary{margin-top:8px}.hud{top:75px}.distance{display:none}.hud>div:last-child{margin-left:auto}.overlay:has(.garage-panel){padding:20px 120px;align-items:start}.garage-panel{z-index:4}.speed strong{font-size:26px}}

/* Boston driver's cockpit */
:root{background:#233b45;--lime:#deef9f;--gold:#f9cf73}header{pointer-events:none}header a,header button{pointer-events:auto}header{background:linear-gradient(#172d3bc4,transparent)}.hud{top:80px}.hud strong{font-size:26px}.hud small{font-size:11px}.route{position:absolute;top:155px;left:30px;display:flex;flex-direction:column;gap:7px;padding:15px 18px;border-left:3px solid #e5efb4;background:#102735ce;pointer-events:none;border-radius:0 7px 7px 0}.route small{font-size:10px;letter-spacing:2px;color:#c3c9b9}.route strong{font-size:14px;letter-spacing:.5px}.route span{font-size:12px;color:#d1dedc}.route b{color:#f6d99c;margin-left:8px}#combo{color:#e4f3b3}.overlay{background:linear-gradient(90deg,#102531ed,#17374498 45%,transparent 85%);padding-top:280px;padding-bottom:135px}.panel{width:420px}h1{font-size:clamp(70px,7vw,105px);letter-spacing:-6px}.how{gap:14px;flex-wrap:wrap}.speed{position:absolute;left:50%;bottom:calc(25px + env(safe-area-inset-bottom));transform:translateX(-50%)}.speed strong{font-size:32px}.speed small{font-size:10px}.speed>span{font-size:10px;letter-spacing:.7px}.steering{margin-bottom:0}.nitro{width:120px}#brake{position:absolute;right:175px;bottom:calc(22px + env(safe-area-inset-bottom));height:54px;border-radius:8px;border:1px solid #f3e1cf88;background:#26363cdd;color:#e6d9c9;font-size:12px;padding:0 17px;touch-action:none;user-select:none}#game:has(#menu[hidden]):has(#garage[hidden]) #road{cursor:none}#game:has(#menu:not([hidden])) footer,#game:has(#garage:not([hidden])) footer{visibility:hidden}#notice{top:29%;font-size:16px;padding:0 20px}.overlay:has(.garage-panel){padding-top:90px}.primary{background:#e3efb0}.record{line-height:1.7}.touch-help{line-height:1.6}.garage-panel{background:#162c35f5}
@media(max-width:600px){.hud{top:78px}.route{left:17px;top:145px;padding:10px 12px;gap:5px}.route strong{font-size:12px}.route span{font-size:11px}.route small{font-size:9px}#notice{top:260px;font-size:13px}.overlay{padding:280px 24px 70px;align-items:flex-start}.panel{width:340px}h1{font-size:65px;letter-spacing:-4px}.panel p{font-size:15px}.speed{bottom:100px;left:50%}.speed strong{font-size:26px}.speed>span{display:none}.nitro{width:94px}#brake{right:120px;bottom:18px;width:64px;padding:0;font-size:11px}.steering button{width:42px}.hud small{font-size:10px}.hud strong{font-size:24px}.hud>div:last-child strong{font-size:16px}.overlay:has(.garage-panel){padding:85px 18px 25px}}
@media(max-height:500px) and (orientation:landscape){.route{top:115px;left:20px;padding:8px 12px;gap:4px}.route strong{font-size:11px}.route span{font-size:10px}.route small{display:none}.overlay{padding:90px 28% 35px;align-items:center}.panel{width:360px}h1{font-size:44px}.panel p{font-size:13px}#notice{top:210px;font-size:12px}.speed{bottom:18px;left:48%}.hud{top:68px}.speed>span{display:none}#brake{right:170px;bottom:18px}.route{max-width:175px}}
