:root{--asphalt:#20272d;--ink:#101418;--paper:#f4f0e7;--orange:#ff6b2c;--blue:#55c9dc;--lime:#b6db68;--yellow:#ffd05a;--red:#dc4e42;--line:rgba(16,20,24,.25);--shadow:5px 6px 0 rgba(16,20,24,.9)}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#697f76;color:var(--ink);font-family:"IBM Plex Mono",monospace;touch-action:none;-webkit-user-select:none;user-select:none}button,a{font:inherit}button:focus-visible,a:focus-visible{outline:3px solid white;outline-offset:3px}button{cursor:pointer}#game{position:fixed;inset:0;isolation:isolate;overflow:hidden}#game>canvas:not(#miniMap){position:absolute;z-index:-2;inset:0;display:block;width:100%;height:100%}.screen-grain{position:absolute;z-index:-1;inset:0;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E")}.hidden{display:none!important}.hud{pointer-events:none}.hud>*{pointer-events:auto}.topbar{position:absolute;z-index:8;top:max(12px,env(safe-area-inset-top));left:14px;right:14px;display:flex;justify-content:space-between;align-items:flex-start}.back-link{display:flex;align-items:center;gap:8px;color:white;text-decoration:none;text-shadow:0 2px 0 #111}.back-link span{display:grid;place-items:center;width:37px;height:37px;border:2px solid white;background:var(--orange);color:var(--ink);box-shadow:3px 3px 0 var(--ink);font-weight:900}.back-link b{font:800 14px "Barlow Condensed",sans-serif;letter-spacing:.08em}.zone-readout{position:absolute;left:50%;transform:translateX(-50%);display:grid;text-align:center;color:white;text-shadow:0 2px 0 #111}.zone-readout small{font-size:7px;letter-spacing:.17em}.zone-readout strong{font:900 21px "Barlow Condensed",sans-serif;text-transform:uppercase}.top-actions{display:flex;gap:6px}.top-actions button{height:37px;border:2px solid white;background:rgba(16,20,24,.78);color:white;padding:0 10px;font-size:8px;font-weight:800;box-shadow:2px 3px 0 rgba(16,20,24,.55)}.mission{position:absolute;z-index:7;top:max(68px,calc(env(safe-area-inset-top) + 60px));left:50%;transform:translateX(-50%);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;min-width:min(590px,calc(100vw - 28px));padding:8px;border:2px solid var(--ink);background:rgba(244,240,231,.92);box-shadow:var(--shadow);font-size:9px}.mission-tag{padding:5px 7px;background:var(--orange);font-weight:800}.mission strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mission>span:last-child{font-weight:800;color:#3d735e}.telemetry{position:absolute;z-index:6;right:16px;bottom:18px;width:184px;border:2px solid white;background:rgba(16,20,24,.8);color:white;box-shadow:5px 6px 0 rgba(16,20,24,.6);padding:10px}.speed{display:flex;align-items:flex-end;gap:7px}.speed strong{font:900 64px/ .75 "Barlow Condensed",sans-serif;letter-spacing:-.05em}.speed span{font-size:8px;margin-bottom:3px}.meter{height:6px;margin:12px 0;background:rgba(255,255,255,.2);overflow:hidden}.meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--orange));transition:width .08s}.telemetry-row{display:flex;justify-content:space-between;padding-top:6px;border-top:1px solid rgba(255,255,255,.18);font-size:7px}.telemetry-row+ .telemetry-row{margin-top:5px}.map-panel{position:absolute;z-index:5;left:14px;top:82px;width:186px;padding:3px;border:2px solid white;background:rgba(16,20,24,.78);box-shadow:4px 5px 0 rgba(16,20,24,.55)}#miniMap{display:block;width:176px;height:176px;background:#9eb18a}.map-panel>div{display:flex;gap:7px;padding:4px 3px;color:white;font-size:6px;align-items:center}.map-panel span{display:inline-block;width:6px;height:6px}.map-car{background:var(--orange)}.map-battery{background:var(--yellow)}.map-gate{background:var(--blue)}.mode-dock{position:absolute;z-index:7;left:14px;bottom:18px;display:flex;gap:6px}.mode-dock button{min-width:116px;height:42px;border:2px solid white;background:rgba(16,20,24,.78);color:white;padding:0 10px;font:800 10px "Barlow Condensed",sans-serif;letter-spacing:.04em;box-shadow:3px 4px 0 rgba(16,20,24,.58)}.mode-dock button span{margin-right:7px;color:var(--blue)}.mode-dock button.active{background:var(--orange);color:var(--ink);border-color:var(--ink);box-shadow:3px 4px 0 var(--ink)}.mode-dock button.active span{color:var(--ink)}.reset-hint{position:absolute;z-index:4;left:50%;bottom:18px;transform:translateX(-50%);padding:5px 8px;background:rgba(16,20,24,.68);color:white;font-size:7px;letter-spacing:.08em}.builder-tray{position:absolute;z-index:12;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);display:grid;grid-template-columns:auto auto auto;gap:10px;align-items:center;width:min(900px,calc(100vw - 24px));padding:8px;border:2px solid var(--ink);background:rgba(244,240,231,.96);box-shadow:7px 8px 0 var(--ink)}.builder-title{display:grid;gap:2px;min-width:110px}.builder-title small{font-size:7px;color:#5a675f}.builder-title strong{font:800 13px "Barlow Condensed",sans-serif}.piece-list{display:flex;gap:5px}.piece-list button{display:grid;grid-template-columns:35px auto;align-items:center;gap:4px;min-width:92px;height:48px;border:2px solid transparent;background:rgba(16,20,24,.06);padding:4px;color:var(--ink)}.piece-list button.selected{border-color:var(--ink);background:white;box-shadow:3px 3px 0 var(--orange)}.piece-list b{font:800 10px "Barlow Condensed",sans-serif}.piece-icon{position:relative;display:block;width:30px;height:23px}.piece-icon.ramp:after,.piece-icon.mega:after{content:"";position:absolute;inset:7px 2px 2px;background:var(--orange);clip-path:polygon(0 100%,100% 0,100% 100%)}.piece-icon.mega:after{inset:2px;background:var(--blue)}.piece-icon.barrier:after{content:"";position:absolute;left:2px;right:2px;top:8px;height:10px;background:repeating-linear-gradient(135deg,var(--orange) 0 6px,white 6px 12px);border:1px solid var(--ink)}.piece-icon.cone:after{content:"";position:absolute;left:10px;top:2px;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:19px solid var(--orange)}.builder-actions{display:grid;grid-template-columns:repeat(2,72px);gap:4px}.builder-actions button{height:23px;border:1px solid var(--ink);background:transparent;font-size:7px;font-weight:800}.builder-actions .place{background:var(--orange)}.stunt-callout{position:absolute;z-index:14;left:50%;top:33%;transform:translate(-50%,-30px) scale(.85);display:grid;text-align:center;opacity:0;color:white;text-shadow:0 3px 0 var(--ink);transition:.18s ease;pointer-events:none}.stunt-callout.show{opacity:1;transform:translate(-50%,0) scale(1)}.stunt-callout small{font:800 15px "Barlow Condensed",sans-serif;letter-spacing:.12em}.stunt-callout strong{font:900 54px/.9 "Barlow Condensed",sans-serif;color:var(--yellow)}.toast{position:absolute;z-index:20;left:50%;bottom:86px;transform:translate(-50%,20px);opacity:0;max-width:min(520px,calc(100vw - 24px));padding:9px 12px;border:2px solid white;background:var(--ink);color:white;box-shadow:4px 5px 0 var(--orange);font-size:9px;text-align:center;transition:.18s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}.overlay{position:absolute;z-index:30;inset:0;display:grid;place-items:center;padding:20px;background:linear-gradient(rgba(20,30,28,.44),rgba(16,20,24,.74));backdrop-filter:blur(5px)}.start-card,.pause-card{width:min(820px,100%);max-height:95vh;overflow:auto;border:3px solid var(--ink);background:var(--paper);padding:clamp(20px,4vw,38px);box-shadow:11px 13px 0 rgba(16,20,24,.85)}.start-card{text-align:center;position:relative}.lab-stamp{position:absolute;right:18px;top:17px;display:flex;align-items:center;gap:7px;transform:rotate(3deg);padding:5px 8px;border:2px solid var(--orange);color:var(--orange)}.lab-stamp span{font:900 19px "Barlow Condensed",sans-serif}.lab-stamp b{font-size:6px}.kicker{margin:0 0 8px;color:#4c7568;font-size:8px;letter-spacing:.16em;font-weight:800}h1,h2{margin:0;font:900 clamp(50px,10vw,98px)/.82 "Barlow Condensed",sans-serif;letter-spacing:-.045em;text-transform:uppercase}h1 em{color:var(--orange);font-style:italic}h2{font-size:clamp(42px,7vw,68px)}.intro{max-width:660px;margin:18px auto;font-size:11px;line-height:1.55}.vehicle-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.vehicle-picker button{display:grid;justify-items:center;gap:3px;min-height:112px;border:2px solid var(--line);background:#e5e0d6;padding:9px;color:var(--ink)}.vehicle-picker button.selected{border-color:var(--ink);background:white;box-shadow:4px 5px 0 var(--orange);transform:translateY(-3px)}.vehicle-picker strong{font:800 13px "Barlow Condensed",sans-serif}.vehicle-picker small{font-size:7px;color:#607067}.mini-car{position:relative;display:block;width:70px;height:35px;margin:4px;background:var(--orange);clip-path:polygon(8% 42%,25% 38%,34% 8%,75% 8%,86% 39%,100% 48%,94% 77%,8% 77%,0 56%)}.mini-car:before,.mini-car:after{content:"";position:absolute;bottom:0;width:17px;height:17px;border-radius:50%;background:var(--ink);border:4px solid #555}.mini-car:before{left:8px}.mini-car:after{right:7px}.mini-car.monster{height:41px;background:var(--lime)}.mini-car.monster:before,.mini-car.monster:after{width:23px;height:23px;bottom:-2px}.mini-car.drift{height:31px;background:var(--blue);clip-path:polygon(2% 50%,23% 44%,35% 12%,74% 12%,87% 43%,100% 52%,95% 76%,4% 76%)}.control-notes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0;text-align:left}.control-notes div{padding:10px;border:1px solid var(--line);background:rgba(255,255,255,.4)}.control-notes b{display:block;margin-bottom:3px;color:#397689;font-size:8px}.control-notes span{font-size:8px;line-height:1.4}.start-actions{display:grid;grid-template-columns:1.3fr .7fr;gap:7px}.start-actions button,.start-actions a,.pause-card button,.pause-card>a{display:grid;place-items:center;min-height:47px;border:2px solid var(--ink);background:transparent;color:var(--ink);padding:8px;text-decoration:none;font-size:9px;font-weight:800}.start-actions .primary,.pause-card .primary{background:var(--orange);box-shadow:4px 5px 0 var(--ink)}.start-actions button:disabled{cursor:wait;opacity:.58;box-shadow:none}.save-note{margin:14px 0 0;color:#647168;font-size:8px}.pause-card{text-align:left}.pause-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:22px 0}.pause-stats div{padding:10px;border:1px solid var(--line)}.pause-stats span{display:block;color:#637069;font-size:7px}.pause-stats strong{font:800 21px "Barlow Condensed",sans-serif}.pause-card button,.pause-card>a{width:100%;margin-top:7px}.garage-picker{margin:24px 0}.fatal{position:absolute;z-index:50;inset:20px;display:grid;place-content:center;gap:8px;text-align:center;border:3px solid var(--ink);background:var(--paper)}.fatal strong{font:900 24px "Barlow Condensed",sans-serif}.fatal span{font-size:10px}.fatal a{color:#397689}#touchUI{display:none}
@media(max-width:1050px){.reset-hint{display:none}.map-panel{transform:scale(.82);transform-origin:top left}.builder-tray{grid-template-columns:auto 1fr}.builder-actions{grid-column:1/-1;grid-template-columns:repeat(4,1fr)}.piece-list{justify-content:flex-end}}
@media(pointer:coarse),(max-width:760px){.topbar{left:8px;right:8px}.back-link b,.top-actions #soundBtn{display:none}.zone-readout strong{font-size:17px}.top-actions button{height:35px;padding:0 7px}.mission{top:max(57px,calc(env(safe-area-inset-top) + 50px));min-width:calc(100vw - 16px);padding:6px;gap:6px}.mission-tag{padding:4px;font-size:7px}.mission strong{font-size:8px}.map-panel{display:none}.telemetry{right:8px;top:190px;bottom:auto;width:96px;padding:7px}.speed strong{font-size:46px}.telemetry-row{display:none}.mode-dock{left:8px;bottom:max(12px,env(safe-area-inset-bottom));gap:3px}.mode-dock button{min-width:0;width:90px;height:38px;padding:0 4px;font-size:8px}.mode-dock button span{display:none}.builder-tray{bottom:max(6px,env(safe-area-inset-bottom));grid-template-columns:1fr;width:calc(100vw - 12px);gap:5px;padding:5px}.builder-title{display:none}.piece-list{justify-content:center}.piece-list button{grid-template-columns:26px auto;min-width:69px;height:39px;padding:2px}.piece-icon{width:24px}.builder-actions{grid-column:auto;grid-template-columns:repeat(4,1fr)}.builder-actions button{height:26px}.stunt-callout{top:28%}.stunt-callout strong{font-size:43px}.toast{top:290px;bottom:auto}.reset-hint{display:none}.lab-stamp{display:none}.start-card,.pause-card{padding:18px}h1{font-size:58px}.intro{font-size:9px;margin:12px auto}.vehicle-picker{gap:5px}.vehicle-picker button{min-height:92px;padding:5px}.vehicle-picker strong{font-size:10px}.mini-car{transform:scale(.78);margin:-1px}.control-notes{margin:11px 0;grid-template-columns:1fr}.control-notes div{padding:7px}.control-notes div:first-child{display:none}.start-actions{grid-template-columns:1fr}.start-actions a{min-height:37px}.pause-stats{margin:14px 0}#touchUI{display:block;position:absolute;z-index:10;inset:0;pointer-events:none}#lookZone{position:absolute;left:25%;right:25%;top:105px;bottom:88px;pointer-events:auto;touch-action:none}.steer-control{position:absolute;left:13px;bottom:76px;width:145px;pointer-events:auto;touch-action:none;color:white;text-align:center;font-size:7px;text-shadow:0 1px 2px #000}.steer-track{position:relative;height:50px;margin-top:5px;border:2px solid rgba(255,255,255,.78);border-radius:28px;background:rgba(16,20,24,.34)}#steerKnob{position:absolute;left:50%;top:50%;width:47px;height:47px;margin:-23.5px;border:3px solid white;border-radius:50%;background:rgba(255,107,44,.86);box-shadow:2px 3px 0 rgba(16,20,24,.55)}#steerKnob:before{content:"";position:absolute;left:50%;top:4px;bottom:4px;width:3px;background:white;transform:translateX(-50%)}.pedals{position:absolute;right:11px;bottom:76px;display:grid;grid-template-columns:64px 64px;gap:7px;pointer-events:auto}.pedals button{min-height:75px;border:2px solid white;border-radius:10px;background:rgba(16,20,24,.72);color:white;font-size:8px;font-weight:800;box-shadow:2px 3px 0 rgba(16,20,24,.6);touch-action:none}.pedals button span{display:block;font-size:22px}.pedals #throttleTouch{background:rgba(80,145,77,.83)}.pedals #brakeTouch{background:rgba(192,67,53,.82)}.touch-extra{position:absolute;right:12px;bottom:158px;display:flex;gap:6px;pointer-events:auto}.touch-extra button{width:61px;min-height:34px;border:2px solid white;border-radius:18px;background:rgba(16,20,24,.68);color:white;font-size:7px;font-weight:800;touch-action:none}}
@media(pointer:coarse) and (orientation:landscape){.mission{top:max(52px,calc(env(safe-area-inset-top) + 46px))}.telemetry{top:105px;bottom:auto}.toast{top:170px}.mode-dock{bottom:8px}.steer-control{bottom:55px}.pedals{bottom:50px}.touch-extra{bottom:131px}.start-card{max-height:96vh;padding:12px 24px}h1{font-size:50px}.intro{margin:7px auto}.vehicle-picker button{min-height:73px}.mini-car{transform:scale(.65);margin:-7px}.control-notes{display:none}.start-actions{grid-template-columns:1.5fr .5fr;margin-top:8px}.save-note{margin-top:7px}}
@media(max-width:420px){h1{font-size:50px}.vehicle-picker small{display:none}.vehicle-picker button{min-height:78px}.mini-car{transform:scale(.68)}.mode-dock button{width:82px}.steer-control{width:128px}.pedals{grid-template-columns:57px 57px}.pedals button{min-height:67px}.touch-extra{bottom:150px}.mission strong{max-width:210px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* UI pass: preserve zoom in HTML and make major shell controls at least 44px. */
.top-actions button,.back-link,.mode-dock button,.start-actions button,.vehicle-picker button,.builder-actions button,.touch-extra button,.pedals button,.modal-card button,.modal-card a{min-width:44px;min-height:44px}.top-actions button{padding:0 12px}@media(pointer:coarse),(max-width:760px){.top-actions button{height:44px;min-height:44px}.mode-dock button{min-height:44px}.start-actions button{min-height:58px}}