/* Site chrome remains Gertrude; the road is a low-resolution arcade canvas. */
.tesla-page{background:#f8f8f8;color:#111}.tesla-page header{position:absolute!important}.tesla-main{padding:calc(112rem + 35rem) 0 0!important}.tesla-shell{margin:0 50px;background:#252c46;position:relative;border-radius:6px;overflow:hidden;isolation:isolate;container-type:inline-size}.tesla-hud{position:absolute;inset:0 0 auto;height:64px;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:linear-gradient(#1d253cef,transparent);color:#f1eee5;font:12px/1 monospace;pointer-events:none}.hud-left,.hud-right{display:flex;gap:22px;align-items:center}.hud-distance{font-size:24px;font-variant-numeric:tabular-nums}.hud-distance small{font-size:12px;color:#adbac5}.hud-speed{color:#b0bcc9}.fuel{display:flex;align-items:center;gap:9px}.fuel-track{width:90px;height:7px;background:#ffffff28}.fuel-track span{display:block;height:100%;background:#9ce6ed;width:100%}.fuel.low .fuel-track span{background:#f0aa85}.hud-fuel{width:30px;text-align:right}.tesla-shell #road{width:100%;height:auto;aspect-ratio:960/450;display:block;image-rendering:pixelated;outline-offset:-4px}.tesla-shell:fullscreen{border-radius:0;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#151c2a}.tesla-shell:fullscreen #road{width:min(100vw,213.33vh)}.game-overlay{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;background:#171f3652;text-align:center;color:#fff3df}.game-overlay[hidden]{display:none}.overlay-card{padding:28px;max-width:600px;transform:translateY(-4px)}.overlay-kicker{font:12px/1.4 monospace;letter-spacing:.18em;margin:0 0 14px;color:#b9dee2}.overlay-card h2{font:400 clamp(38px,4.6vw,80px)/.9 Gertrude,sans-serif;letter-spacing:-.05em;margin:0 0 16px;text-shadow:0 3px 0 #303448}.overlay-card p{font:14px/1.5 monospace;margin:0 0 20px}.tesla-button{font:16px/1.1 Gertrude,sans-serif;border:0;border-radius:100px;background:#bce8e9;color:#162b35;padding:15px 28px;cursor:pointer;min-height:45px;transition:background .15s,transform .15s}.tesla-button:hover{background:#ddf9f7;transform:translateY(-2px)}.tesla-button:disabled{opacity:.6;cursor:wait;transform:none}.tesla-button.secondary{background:#fff1;color:#fff3df;border:1px solid #fff5;margin-left:8px}.overlay-controls{display:flex;gap:8px;justify-content:center}.overlay-card .start-hint{font-size:11px;color:#d0d3d5;margin-top:16px}.game-toolbar{margin:14px 50px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#777;font-size:14px;line-height:1.4}.control-hints{display:flex;gap:18px;flex-wrap:wrap}.control-hints kbd{font:12px monospace;border:1px solid #d1d1d1;border-radius:4px;background:white;padding:3px 6px;color:#444}.toolbar-buttons{display:flex;align-items:center;gap:16px}.toolbar-buttons button{font:14px Gertrude,sans-serif;color:#555;cursor:pointer;background:none;white-space:nowrap}.toolbar-buttons button:focus-visible,.tesla-button:focus-visible{outline:3px solid #ff794a;outline-offset:4px}.music-bar{margin:20px 50px 0;display:flex;gap:10px;align-items:center;font:12px/1.4 monospace;color:#777}.music-bar .music-dot{width:5px;height:5px;border-radius:50%;background:#aaa}.music-bar.playing .music-dot{background:#639c85;box-shadow:0 0 0 3px #639c8515}.music-next{margin-left:3px;cursor:pointer;font:16px monospace;padding:3px 7px;background:none}.drive-note{margin:8px 50px 0;font:14px/1.4 Gertrude,sans-serif;color:#777;min-height:20px}.tesla-ranking{margin-top:96px!important;margin-bottom:100px!important}.tesla-ranking .ranking-head h2{font-size:clamp(50px,6vw,88px)}.tesla-ranking .ranking-head p{color:#777;font-size:16px}.tesla-ranking strong{font-weight:400;color:#111}.tesla-ranking td:first-child{color:#888}.tesla-ranking td:last-child{font-variant-numeric:tabular-nums}.tesla-ranking tr.your-result{background:#9ce6ed33!important}.tesla-ranking .empty-row{text-align:center!important;color:#888;font-size:16px;padding:35px}.result-distance{font:32px/1 monospace;margin:0 0 16px!important;color:#b9e6e9}.tesla-score-form{margin:20px auto 0;max-width:370px}.tesla-score-form label{font:12px/1.4 monospace;display:block;text-align:left;margin-bottom:8px;color:#c8cbd0}.tesla-score-form>div{display:flex;gap:8px}.tesla-score-form input{background:#f8f8f8;border:0;border-radius:25px;padding:12px 17px;min-width:0;flex:1;color:#111;font:16px Gertrude,sans-serif}.tesla-score-form .tesla-button{padding:12px 17px;font-size:14px}.tesla-score-form[hidden]{display:none}.overlay-card .save-status{margin:10px 0 0;font-size:12px;color:#d8dde0;min-height:18px}.rotation-prompt,.touch-hint{display:none}.tesla-page .mobile-game-projects,.tesla-page .mobile-game-footer{display:none}.tesla-page .ranking{max-width:1000px}.tesla-page .desktop-game-projects{margin-top:50px}.tesla-page .overlay-card .start-hint{max-width:450px}.tesla-page [hidden]{display:none!important}.tesla-shell #road:focus{outline:none}.tesla-page .game-toolbar button[aria-pressed=true]{color:#111}.tesla-page footer{margin-top:130rem}
@media(max-width:1050px){.tesla-hud{padding:0 16px}.hud-right{gap:12px}.control-hints{gap:10px}.game-toolbar{align-items:flex-start}.toolbar-buttons{gap:10px}.overlay-card{padding:14px}.overlay-card p{font-size:12px;margin-bottom:12px}.overlay-kicker{margin-bottom:8px}.overlay-card h2{margin-bottom:10px}.tesla-button{padding:12px 20px;min-height:40px}}
@media(max-width:700px){.tesla-main{padding-top:110px!important}.tesla-shell{margin:0 19px}.tesla-ranking{width:calc(100% - 38px);margin-top:50px!important}.tesla-page .desktop-game-projects,.tesla-page .desktop-game-footer{display:none}.tesla-page .mobile-game-projects,.tesla-page .mobile-game-footer{display:block}}

.tesla-page .more-projects .project-pensioners{grid-column:span 3}

.tesla-shell .fuel{position:absolute;inset:auto 0 0;z-index:2;display:flex;gap:18px;align-items:center;padding:9px 22px;background:#18202df2;color:#f5eddb;font:bold clamp(14px,1.3vw,22px)/1.15 monospace;pointer-events:none}
.tesla-shell .fuel-track{position:relative;flex:1;width:auto;height:clamp(16px,1.6vw,26px);background:#495264}
.tesla-shell .fuel-track::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 2px),#18202d99 calc(10% - 2px) 10%)}
.tesla-shell .hud-fuel{width:4ch}.tesla-shell .fuel.low .fuel-track span{background:#ff9267}
.road-radio{position:absolute;z-index:2;left:50%;top:7px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:#202937f5;color:#fff0d9;padding:5px 12px 5px 6px;font:14px/1.2 monospace;pointer-events:none;max-width:48%;border:1px solid #818e95}
.road-radio canvas{width:48px;height:40px;image-rendering:pixelated}.road-radio strong,.road-radio span{display:block}.road-radio strong{font-size:11px;color:#aed5d0;margin-bottom:3px}
#crash-art{display:block;width:var(--crash-width);height:auto;image-rendering:pixelated;margin:0 auto 8px}
.game-overlay:has(#crash-art:not([hidden])){background:#141c2be8;overflow:auto;align-items:safe center}
.game-overlay:has(#crash-art:not([hidden])) .overlay-card{padding:10px 18px;transform:none;width:min(100%,480px)}
.game-overlay:has(#crash-art:not([hidden])) .overlay-controls{width:var(--crash-width);margin-inline:auto}
.game-overlay:has(#crash-art:not([hidden])) #start{width:100%}
.tesla-shell{--crash-width:min(320px,33vw)}
.game-overlay:has(#crash-art:not([hidden])) h2{font-size:clamp(26px,3.4vw,48px);margin-bottom:5px}
.game-overlay:has(#crash-art:not([hidden])) p{margin-bottom:5px}
.game-overlay:has(#crash-art:not([hidden])) .overlay-kicker{display:none}
.game-overlay:has(#crash-art:not([hidden])) .tesla-score-form{margin-top:6px}

.road-radio{max-width:52%;gap:14px;top:8px;padding:6px 14px 6px 7px}
.road-radio canvas{width:clamp(84px,8vw,120px);height:auto}
.road-radio span{font-size:clamp(13px,1.2vw,18px)}.road-radio strong{font-size:clamp(12px,1vw,15px)}

.tesla-field{position:relative;width:100%}
.tesla-shell:fullscreen .tesla-field{width:min(100vw,192vh)}
.tesla-shell:fullscreen #road{width:100%}
#game-title{display:none}
.tesla-shell[data-state=ready] #road{aspect-ratio:1816/880;pointer-events:none}
.tesla-shell[data-state=ready] .tesla-hud,
.tesla-shell[data-state=ready] .fuel,
.tesla-shell[data-state=ready] .game-console,
.tesla-shell[data-state=ready] .overlay-kicker,
.tesla-shell[data-state=ready] #overlay-note,
.tesla-shell[data-state=ready] .start-hint,
.tesla-shell[data-state=ready] .save-status{display:none}
.tesla-shell[data-state=ready] .game-overlay{background:none}
.tesla-shell[data-state=ready] .overlay-card{
 position:absolute;inset:0;max-width:none;padding:0;transform:none
}
.tesla-shell[data-state=ready] #game-title{
 display:block;position:absolute;top:8.3%;left:0;width:100%;margin:0;
 color:#fff6e8;font:400 11.65cqw/.78 Gertrude,sans-serif;letter-spacing:-.04em;white-space:nowrap
}
.tesla-shell[data-state=ready] .overlay-controls{position:absolute;inset:31.8% 0 auto}
.tesla-shell[data-state=ready] #start{
 background:white;color:#111;border:.55cqw solid #eee;
 padding:.55cqw 1.54cqw;font:400 2.86cqw/1.15 Gertrude,sans-serif;min-height:0
}
.game-console{
 display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;
 background:#18202d;color:#e7dfd0;padding:10px 20px
}
.game-toolbar,.music-bar{margin:0;color:inherit}
.game-toolbar{flex:1 1 540px}
.game-toolbar kbd{background:#323d50;color:inherit;border-color:#596577}
.tesla-page .game-toolbar button,.tesla-page .game-toolbar button[aria-pressed=true],.music-next{color:inherit}
.drive-note{margin:0;color:#f4cda7;min-height:0;flex-basis:100%;font-size:13px}
.drive-note:empty{display:none}
.tesla-shell:fullscreen .game-console{width:min(100vw,192vh)}
.tesla-ranking .ranking-head h2{font-size:clamp(42px,5.2vw,95px)}
.track-notice{
 position:absolute;z-index:4;top:13px;left:50%;width:max-content;max-width:74%;
 transform:translateX(-50%);pointer-events:none;text-align:center;
 background:#18202de8;color:#fff0da;padding:7px 18px;border-radius:5px;
 font:700 clamp(22px,4cqw,64px)/1.08 Gertrude,sans-serif;
}
.tesla-field:has(.track-notice:not([hidden])) .road-radio{top:calc(clamp(22px,4cqw,64px) + 36px)}

#road{touch-action:none}
#game-shell,#game-shell *{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.tesla-page.tesla-immersive,.tesla-page.tesla-immersive *{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
#game-shell .tesla-score-form input{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
#game-shell:focus,#road:focus{outline:none}
#game-shell:focus-visible,#road:focus-visible{outline:3px solid #ff794a;outline-offset:3px}
.game-overlay:has(#crash-art:not([hidden])) .tesla-score-form{width:var(--crash-width);max-width:100%;margin-inline:auto}
.game-overlay:has(#crash-art:not([hidden])) .tesla-score-form label{text-align:center;max-width:100%;overflow-wrap:anywhere}
.game-overlay:has(#crash-art:not([hidden])) .tesla-score-form>div{width:100%;min-width:0}
.game-overlay:has(#crash-art:not([hidden])) .tesla-score-form input{width:0;min-width:0}
.game-overlay:has(#crash-art:not([hidden])) .tesla-score-form .tesla-button{flex:none}
#game-shell{scroll-margin-block-start:env(safe-area-inset-top,0px)}
.game-overlay:has(#crash-art:not([hidden])){padding-top:8px}
.tesla-field:has(.track-notice:not([hidden])) .game-overlay:has(#crash-art:not([hidden])){
 padding-top:calc(clamp(22px,4cqw,64px) * 1.08 + 34px)
}
@media(pointer:coarse) and (orientation:portrait){
 .rotation-prompt{
  display:grid;gap:5px;justify-items:center;padding:18px;text-align:center;
  background:#18202d;color:#fff3df;font:16px/1.35 Gertrude,sans-serif
 }
 .rotation-prompt span{font:32px/1 monospace;color:#9ce6ed}
 .rotation-prompt p{margin:0;font-size:22px}
 .rotation-prompt small{font-size:14px}
 .tesla-shell[data-state=ready] .overlay-controls,.tesla-shell .game-console{display:none}
 .tesla-field:has(#resume:not([hidden])) #resume,.tesla-field:has(#crash-art:not([hidden])) #start{visibility:hidden}
}
@media(pointer:coarse) and (orientation:landscape){
 .tesla-main{padding-top:calc(112rem + 15px)!important}
 .tesla-shell{
  --mobile-road-width:min(calc(100vw - 2 * max(10px,env(safe-area-inset-left,0px),env(safe-area-inset-right,0px))), calc((100dvh - 64px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)) * 960 / 450));
  --crash-width:min(280px,46vw);
  width:var(--mobile-road-width);margin-inline:auto;
 }
 .tesla-hud{height:34px;padding:0 10px}
 .hud-distance{font-size:18px}
 .tesla-shell .fuel{padding:4px 10px;gap:9px;font-size:12px}
 .tesla-shell .fuel-track{height:10px}
 .game-console{padding:2px 10px;gap:0 8px}
 .game-toolbar{flex:1 1 auto;gap:9px;align-items:center}
 .game-toolbar .control-hints{display:none}
 .touch-hint{display:block;font-size:11px}
 .toolbar-buttons button,.music-next{min-height:36px}
 .music-bar{flex:0 1 auto;gap:5px;font-size:10px}
 .drive-note{font-size:11px}
 .tesla-shell[data-state=ready] #start{min-height:40px;padding-inline:14px}
 .tesla-shell .track-notice{top:6px;max-width:72%;padding:5px 10px}
 .tesla-shell:fullscreen{width:100%}
 .tesla-shell:fullscreen .tesla-field,.tesla-shell:fullscreen .game-console{width:var(--mobile-road-width)}
 .road-radio canvas{width:42px}
 .road-radio span,.road-radio strong{font-size:11px}
 .game-overlay:has(#crash-art:not([hidden])) .overlay-card{padding-block:6px}
}

#immersive-exit{display:none}
@media(pointer:coarse) and (orientation:landscape){
 .tesla-page.tesla-immersive{overflow:hidden;overscroll-behavior:none}
 .tesla-page.tesla-immersive .tesla-shell,.tesla-page .tesla-shell:fullscreen{
  position:fixed;inset:0;z-index:2147483647;width:100vw!important;height:100dvh;
  margin:0!important;padding:0 env(safe-area-inset-right) 0 env(safe-area-inset-left);
  box-sizing:border-box;border-radius:0;background:#151c2a;
  display:flex;align-items:center;justify-content:center
 }
 .tesla-page.tesla-immersive .tesla-field,.tesla-page .tesla-shell:fullscreen .tesla-field{
  width:min(calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right)),205dvh)!important;
  flex:none
 }
 .tesla-page.tesla-immersive .game-console,.tesla-page .tesla-shell:fullscreen .game-console,
 .tesla-page.tesla-immersive .rotation-prompt,.tesla-page .tesla-shell:fullscreen .rotation-prompt{display:none!important}
 .tesla-page.tesla-immersive #immersive-exit,.tesla-page .tesla-shell:fullscreen #immersive-exit{
  display:grid;place-items:center;position:absolute;z-index:6;
  top:8px;right:8px;width:38px;height:38px;padding:0;
  border:1px solid #ffffff80;border-radius:50%;background:#18202de0;color:#fff;
  font:28px/1 Arial,sans-serif;cursor:pointer;-webkit-tap-highlight-color:transparent
 }
}
