/* Squid Drive: tomato-red delivery cabinet, sea-glass street, paper receipts. */
.drive-page{--drive-ink:#243e3c;--drive-red:#b84631;--drive-cream:#fff0cc;--drive-teal:#226d6a;--drive-gold:#f7ce72}
.drive-heading-title{display:flex;align-items:center;gap:14px}.drive-page .drive-layout{grid-template-columns:minmax(0,1fr) 270px;gap:25px}
.drive-cabinet{position:relative;overflow:hidden;min-width:0;border:2px solid var(--drive-ink);border-radius:5px;background:var(--drive-ink);color:var(--drive-cream);touch-action:manipulation;box-shadow:4px 5px 0 #243e3c14;isolation:isolate}
.drive-toolbar{height:44px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 13px;border-bottom:1px solid #fff0cc26;background:var(--drive-ink)}
.drive-brand{white-space:nowrap;font:700 10px/1 var(--mono);letter-spacing:1px}.drive-brand i{display:inline-block;width:5px;height:5px;margin-right:6px;background:var(--drive-gold);border-radius:50%}.drive-brand b{color:var(--drive-gold);margin-left:6px}
.drive-tools{display:flex;align-items:center;gap:3px}.drive-tools button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:44px;padding:5px 7px;color:var(--drive-cream);border:0;border-radius:2px;background:none;font:11px var(--body)}.drive-tools button:hover{background:#fff0cc14}.drive-tools button:disabled{opacity:.4}.drive-tools .icon{width:16px;height:16px}
.drive-hud{height:76px;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:8px;padding:10px 20px;background:var(--drive-cream);color:var(--drive-ink)}.drive-label{display:block;margin-bottom:6px;font:700 9px/1 var(--mono);letter-spacing:1px;color:#54706a}.drive-hud strong{font:900 30px/1 var(--display);letter-spacing:.4px;font-variant-numeric:tabular-nums}.drive-hud-strokes{text-align:center;display:grid;grid-template-columns:1fr}.drive-hud-strokes .drive-label{margin-bottom:3px}.drive-hud-strokes strong{font-size:24px}.drive-hud-strokes small{font:12px var(--mono);color:#54706a}.drive-stroke-dots{color:var(--drive-red);font:10px/1 var(--mono);letter-spacing:5px;margin-top:6px}.drive-hud-best{text-align:right}.drive-hud-best strong{color:var(--drive-teal)}
.drive-shot-strip{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:38px;padding:8px 15px;background:#315954;border-top:1px solid #426c61;border-bottom:1px solid #223d38;font:700 9px var(--mono);letter-spacing:.6px}.drive-meter-wrap{display:flex;align-items:center;gap:9px;min-width:0}.drive-meter-wrap>span{font-size:8px;color:#c4d6c2}.drive-meter-wrap b{min-width:37px;text-align:right;font-size:10px}#drive-meter{width:130px;height:8px;border:0;border-radius:1px;background:#193f3a;appearance:none}#drive-meter::-webkit-meter-bar{background:#193f3a;border:0;border-radius:0}#drive-meter::-webkit-meter-optimum-value{background:var(--drive-gold)}#drive-meter::-moz-meter-bar{background:var(--drive-gold)}
.drive-screen{position:relative;display:flex;align-items:center;justify-content:center;min-height:0;aspect-ratio:1.6;background:#afd7cd;overflow:hidden;isolation:isolate;touch-action:none}#drive-game{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;image-rendering:pixelated;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:crosshair;flex:none}#drive-game:focus-visible{outline:3px solid #fff0b9;outline-offset:-4px}.drive-fx{position:absolute;left:50%;top:20%;transform:translateX(-50%);font:900 clamp(19px,3vw,34px)/1 var(--display);color:#fff3c5;text-shadow:2px 2px #243e3c;pointer-events:none;white-space:nowrap}.drive-fx:empty{display:none}
.drive-overlay{position:absolute;inset:0;display:grid;place-items:center;padding:18px;background:#173f3a48;z-index:4;overflow:auto;overscroll-behavior:contain}.drive-lobby{justify-items:end;background:linear-gradient(90deg,transparent 18%,#173f3a22)}.drive-ticket{width:310px;max-width:100%;padding:24px 25px 18px;background:#fff0cc;color:#243e3c;box-shadow:5px 6px 0 #173f3a66;transform:rotate(-2deg);border:2px solid #243e3c;text-align:left}.drive-ticket-eyebrow{font:700 8px/1.4 var(--mono);letter-spacing:1.1px;color:#765b3d}.drive-ticket h2{font:900 79px/.82 var(--display);letter-spacing:-1px;margin:18px 0 14px}.drive-ticket h2 em{color:var(--drive-red);font-style:normal}.drive-ticket p{font:13px/1.7 var(--body);margin:12px 0;color:#4c5e50}.drive-ticket-route{display:flex;justify-content:space-between;align-items:center;gap:4px;margin:17px 0;padding:12px 0;border-block:1px dashed #9a9c7c;font:700 7px/1.4 var(--mono)}.drive-ticket-route b{font-size:14px;color:var(--drive-red)}
.drive-primary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;width:100%;padding:13px 15px;background:var(--drive-red);border:1px solid #852f24;border-radius:2px;color:#fff3d5;font:700 11px/1.3 var(--body);letter-spacing:.3px;text-align:left;box-shadow:0 3px 0 #7c332a}.drive-primary:hover{background:#c65136}.drive-primary:active{transform:translateY(2px);box-shadow:none}.drive-primary:disabled{opacity:.5;cursor:default}.drive-primary span{font-size:21px;line-height:.8}.drive-how{display:block;width:100%;min-height:36px;padding:9px 0 4px;background:none;border:0;font:11px/1.5 var(--body);color:#4c5e50;text-decoration:underline;text-underline-offset:3px}.drive-ticket-foot{display:block;text-align:center;font:700 7px var(--mono);letter-spacing:1px;color:#817651;margin-top:15px}.drive-small-ticket{transform:none}.drive-small-ticket h2{font-size:52px}.drive-small-ticket h2 em{font-size:40px}
.drive-actions{display:grid;grid-template-columns:auto 1fr 170px;align-items:center;gap:12px;padding:12px 15px;background:#243e3c;min-height:78px}.drive-secondary{display:flex;align-items:center;justify-content:center;gap:7px;min-height:46px;padding:8px 11px;background:#32554e;color:#fff0cc;border:1px solid #648074;border-radius:2px;font:11px/1.2 var(--body)}.drive-secondary[aria-pressed=true]{background:#fff0cc;color:#243e3c}.drive-secondary:disabled{opacity:.4}.drive-secondary kbd{background:none!important;color:inherit!important;border-color:#648074!important;font-size:8px!important}.drive-secondary .icon{width:16px;height:16px}.drive-action-prompt>span{font:700 8px var(--mono);letter-spacing:.7px;color:#edcd8b}.drive-action-prompt p{font:11px/1.5 var(--body);color:#ccdac4;margin:5px 0 0}.drive-action{min-height:48px}.drive-status{min-height:28px;margin:0;padding:6px 13px;background:#1c3431;border-top:1px solid #4a675933;color:#c1d3be;font:10px/1.6 var(--body)}
.drive-beta-note{font:11px/1.7 var(--body);color:var(--muted);margin:12px 0 0}.drive-beta-note a{text-decoration:underline;text-underline-offset:3px}.drive-guide>p{font:12px/1.9 var(--body);color:var(--muted)}.drive-obstacle-guide{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:22px 0}.drive-obstacle-guide>div{display:flex;flex-direction:column;gap:7px;min-width:0}.drive-obstacle-guide i{width:37px;height:24px;display:block;border:2px solid #243e3c;font:700 18px/20px var(--mono);text-align:center;color:#243e3c;font-style:normal}.drive-guide-awning{background:repeating-linear-gradient(90deg,#c75a3f 0 6px,#ffe8b9 6px 12px);transform:skew(-12deg);border-bottom-width:5px!important}.drive-guide-vent{background:#efc375}.drive-guide-flour{background:linear-gradient(90deg,#fff4d8 50%,#b74a31 50%);border-radius:50%}.drive-guide-cart{background:#5b9c91;border-bottom-width:6px!important}.drive-obstacle-guide strong{font-size:12px}.drive-obstacle-guide span{font-size:11px;line-height:1.7;color:var(--muted)}.drive-route-note{margin-top:23px;border:1px solid var(--line);padding:23px;background:var(--soft)}.drive-route-note .eyebrow{color:var(--muted);font-size:9px}.drive-route-note h2{font:900 33px/1.03 var(--display);margin:14px 0;color:var(--ink)}.drive-route-note p{font:12px/1.8 var(--body);color:var(--muted)}.drive-route-note a{display:block;font:700 11px/1.6 var(--body);margin-top:19px;color:var(--accent)}
.drive-result-ticket{width:570px;display:grid;grid-template-columns:1fr 1fr;gap:23px;transform:none;padding:23px}.drive-result-ticket h2{font-size:45px;margin:14px 0}.drive-final{display:block;font:900 42px/1.1 var(--display);color:#226d6a}.drive-result-ticket p{font-size:11px}.drive-scorecard{list-style:none;margin:12px 0 0;padding:10px 0 0;border-top:1px dashed #9a9c7c;display:grid;gap:4px}.drive-scorecard li{display:flex;align-items:center;justify-content:space-between;gap:12px;font:10px/1.5 var(--mono)}.drive-scorecard li span{color:#6e765e}.drive-result-entry{align-self:center;min-width:0}.drive-result-entry label{display:block;font:700 9px var(--mono);letter-spacing:.5px;margin-bottom:9px}.drive-name-row{display:flex;gap:5px;min-width:0}.drive-name-row input{min-width:0;width:100%;padding:10px 8px;min-height:44px;border:1px solid #9eaa89;border-radius:2px;background:#fff9e8;color:#243e3c;font:16px var(--body)}.drive-name-row button{border:1px solid #852f24;background:#b84631;color:#fff3d5;padding:8px;min-height:44px;font:bold 10px var(--body)}.drive-save-status{font:11px/1.7 var(--body);color:#4c5e50;overflow-wrap:anywhere}.drive-result-entry .score-sign-in{font-size:11px}.drive-result-entry .score-sign-in button{font-size:11px}.drive-result-entry .score-account-name{font:700 16px var(--body);overflow-wrap:anywhere}.drive-result-entry .score-signin-step{font-size:12px}.drive-result-entry .score-signin-step input{max-width:100%;font-size:16px}.drive-result-entry .human-check{max-width:100%;overflow:hidden}.drive-result-entry #drive-again{margin-top:15px}.drive-result-entry .score-registration-invite{font-size:11px}
#drive-help-dialog{max-width:570px;width:calc(100% - 30px);max-height:calc(100dvh - 30px);overflow:auto;padding:32px;color:var(--ink);background:var(--panel);border:2px solid var(--ink)}#drive-help-dialog h2{font:900 39px/1.05 var(--display);margin:16px 0}#drive-help-dialog h2 em{font-style:normal;color:var(--accent)}#drive-help-dialog p,.drive-help-steps{font:13px/1.9 var(--body)}.drive-help-steps{padding-left:21px;display:grid;gap:12px}.drive-help-steps strong{display:block}#drive-help-dialog::backdrop{background:#102f2acc}.drive-page .drive-cabinet :focus-visible{outline-color:#f4c766}
.drive-cabinet.is-expanded{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;margin:0;z-index:1000;display:grid;grid-template-rows:44px 65px 36px minmax(0,1fr) 72px auto;border:0;border-radius:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.drive-cabinet.is-expanded .drive-screen{width:100%;height:100%;aspect-ratio:auto;background:#4f8a80}.drive-cabinet.is-expanded .drive-toolbar{height:44px}.drive-cabinet.is-expanded .drive-hud{height:65px}.drive-cabinet.is-expanded .drive-actions{min-height:0}.drive-cabinet.is-expanded .drive-overlay{position:fixed;inset:44px 0 0;padding:15px;justify-items:center;background:#173f3a55}.drive-cabinet.is-expanded .drive-ticket{max-height:100%;overflow:auto;overscroll-behavior:contain;transform:none}.drive-cabinet.is-expanded:has(.drive-overlay:not([hidden])) .drive-actions{visibility:hidden}.drive-cabinet.is-expanded .drive-ticket h2{font-size:clamp(38px,11vh,79px)}
@media(max-width:1050px){.drive-brand{font-size:8px;letter-spacing:.4px}.drive-tools button{padding-inline:6px}.drive-tools button>span{display:none}.drive-actions{grid-template-columns:auto 1fr 145px}.drive-action-prompt p{font-size:10px}.drive-primary{font-size:10px}.drive-page .drive-layout{grid-template-columns:minmax(0,1fr) 250px;gap:20px}.drive-lobby .drive-ticket{width:270px;padding:18px 22px}.drive-lobby h2{font-size:65px}}
@media(max-width:800px){.drive-page .drive-layout{grid-template-columns:minmax(0,1fr)}.drive-page .drive-sidebar{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:20px}.drive-route-note{margin-top:0}.drive-tools button>span{display:inline}.drive-lobby .drive-ticket{width:300px}.drive-lobby h2{font-size:75px}}
@media(max-width:540px){.drive-toolbar{padding-inline:10px}.drive-brand{font-size:9px}.drive-tools button{min-width:34px;padding:5px}.drive-tools button>span{display:none}.drive-hud{height:66px;padding:10px 12px}.drive-hud strong{font-size:25px}.drive-hud-strokes strong{font-size:21px}.drive-label{font-size:7px;letter-spacing:.5px}.drive-stroke-dots{font-size:8px;letter-spacing:3px}.drive-shot-strip{font-size:8px;padding:7px 10px}.drive-meter-wrap{gap:6px}#drive-meter{width:76px}.drive-meter-wrap>span{font-size:7px}.drive-actions{grid-template-columns:1fr 1.4fr;gap:9px;padding:10px}.drive-action-prompt{grid-column:1/-1;grid-row:1;display:flex;align-items:baseline;justify-content:space-between;gap:8px}.drive-action-prompt>span{font-size:7px}.drive-action-prompt p{font-size:9px;margin:0}.drive-secondary{min-height:44px;font-size:10px}.drive-secondary kbd{display:none}.drive-action{min-height:44px}.drive-status{font-size:9px;padding:6px 10px}.drive-screen:has(.drive-overlay:not([hidden])){min-height:355px;aspect-ratio:auto}.drive-lobby{justify-items:center;padding:16px}.drive-lobby .drive-ticket{width:275px;padding:19px 22px;transform:rotate(-1deg)}.drive-lobby h2{font-size:67px;margin:14px 0}.drive-ticket p{font-size:12px}.drive-ticket-route{margin:13px 0}.drive-page .drive-sidebar{display:block}.drive-route-note{margin-top:20px}.drive-obstacle-guide{grid-template-columns:1fr 1fr;gap:22px}.drive-result-ticket{grid-template-columns:1fr;width:320px;gap:12px;padding:18px}.drive-result-ticket h2{font-size:33px;margin:10px 0}.drive-final{font-size:34px}.drive-result-summary>p{margin:7px 0}.drive-scorecard{grid-template-columns:1fr 1fr;gap:4px 15px}.drive-scorecard li{font-size:9px}.drive-result-entry #drive-again{margin-top:10px}.drive-cabinet.is-expanded{grid-template-rows:44px 62px 34px minmax(0,1fr) 91px auto}.drive-cabinet.is-expanded .drive-screen{min-height:0}.drive-cabinet.is-expanded .drive-hud{height:62px}.drive-cabinet.is-expanded .drive-actions{padding:8px 10px}.drive-cabinet.is-expanded .drive-lobby .drive-ticket{width:280px}.drive-cabinet.is-expanded .drive-result-ticket{width:340px}.drive-cabinet.is-expanded .drive-ticket h2{font-size:clamp(31px,10vh,67px)}#drive-help-dialog{padding:24px 20px}#drive-help-dialog h2{font-size:32px}}
@media(max-height:520px) and (min-width:541px){.drive-cabinet.is-expanded{grid-template-columns:minmax(0,1fr) 140px;grid-template-rows:44px minmax(0,1fr) 24px}.drive-cabinet.is-expanded .drive-toolbar{grid-column:1/-1;height:44px}.drive-cabinet.is-expanded .drive-screen{grid-column:1;grid-row:2}.drive-cabinet.is-expanded .drive-hud{grid-column:2;grid-row:2;height:auto;align-self:start;display:flex;flex-direction:column;text-align:center;gap:14px;padding:12px 7px;background:#243e3c;color:#fff0cc}.drive-cabinet.is-expanded .drive-hud-best{display:none}.drive-cabinet.is-expanded .drive-label{color:#c1d3be;font-size:7px}.drive-cabinet.is-expanded .drive-hud strong{font-size:24px}.drive-cabinet.is-expanded .drive-shot-strip{position:absolute;top:44px;left:0;right:140px;min-height:28px;background:#315954db;z-index:2;padding:5px 12px}.drive-cabinet.is-expanded .drive-actions{position:absolute;right:0;bottom:24px;width:140px;display:flex;flex-direction:column;padding:9px;gap:9px;background:none}.drive-cabinet.is-expanded .drive-action-prompt{display:none}.drive-cabinet.is-expanded .drive-action,.drive-cabinet.is-expanded .drive-secondary{width:100%;min-height:44px;font-size:9px}.drive-cabinet.is-expanded .drive-secondary kbd{display:none}.drive-cabinet.is-expanded .drive-status{grid-column:1/-1;grid-row:3;min-height:24px;padding:4px 12px;font-size:9px}.drive-cabinet.is-expanded .drive-overlay{inset:44px 0 0;padding:10px}.drive-cabinet.is-expanded .drive-lobby .drive-ticket{width:490px;display:grid;grid-template-columns:1fr 1.2fr;gap:0 24px;padding:15px 24px}.drive-cabinet.is-expanded .drive-lobby .drive-ticket-eyebrow{grid-column:1/-1}.drive-cabinet.is-expanded .drive-lobby h2{grid-column:1;grid-row:2/6;font-size:65px;margin:15px 0 5px}.drive-cabinet.is-expanded .drive-lobby p{grid-column:2;font-size:11px;margin:12px 0 0}.drive-cabinet.is-expanded .drive-ticket-route{grid-column:2;font-size:6px;margin:10px 0}.drive-cabinet.is-expanded .drive-lobby .drive-primary{grid-column:2;min-height:38px;padding:9px 12px}.drive-cabinet.is-expanded .drive-how{font-size:10px;min-height:30px}.drive-cabinet.is-expanded .drive-lobby .drive-how{grid-column:2}.drive-cabinet.is-expanded .drive-ticket-foot{grid-column:1/-1;margin-top:10px}.drive-cabinet.is-expanded .drive-result-ticket{grid-template-columns:1fr 1fr;width:570px;padding:14px 20px;gap:20px}.drive-cabinet.is-expanded .drive-result-ticket h2{font-size:32px;margin:10px 0}.drive-cabinet.is-expanded .drive-final{font-size:33px}.drive-cabinet.is-expanded .drive-result-ticket p{font-size:10px;margin:8px 0}.drive-cabinet.is-expanded .drive-scorecard{grid-template-columns:1fr 1fr;gap:3px 10px}.drive-cabinet.is-expanded .drive-small-ticket h2{font-size:37px}}
@media(prefers-reduced-motion:reduce){.drive-ticket{transform:none}.drive-primary:active{transform:none}}

/* Short portrait keeps the squid large and every toolbar target touchable. */
.drive-tools button{min-width:44px;min-height:44px}
.drive-cabinet.is-expanded .drive-toolbar{height:44px}
@media(max-width:360px){.drive-brand{display:none}.drive-tools{width:100%;justify-content:space-between}.drive-toolbar{padding-inline:8px}}
@media(max-height:520px) and (max-width:540px){
 .drive-cabinet.is-expanded{grid-template-rows:44px 50px 28px minmax(0,1fr) 60px 24px}
 .drive-cabinet.is-expanded .drive-hud{height:50px;padding:6px 12px}
 .drive-cabinet.is-expanded .drive-label{font-size:6px;margin-bottom:4px}
 .drive-cabinet.is-expanded .drive-hud strong{font-size:22px}
 .drive-cabinet.is-expanded .drive-stroke-dots{font-size:7px;margin-top:3px}
 .drive-cabinet.is-expanded .drive-shot-strip{min-height:28px;padding:5px 10px}
 .drive-cabinet.is-expanded .drive-actions{padding:8px 10px;grid-template-columns:1fr 1.4fr}
 .drive-cabinet.is-expanded .drive-action-prompt{display:none}
 .drive-cabinet.is-expanded .drive-status{min-height:24px;max-height:24px;overflow:hidden;padding:4px 8px;font-size:9px}
}
@media(max-width:540px){html[lang^=zh] #drive-help-dialog h2{font-family:var(--body);font-size:28px;line-height:1.3;letter-spacing:0;padding-right:0}}

html[lang^=zh] .drive-page .drive-cabinet .drive-lobby h2{font-size:52px;line-height:1.12;letter-spacing:0}
.drive-result-entry .score-register-invite{display:flex;align-items:center;flex-wrap:wrap;gap:0 14px;margin:8px 0;font:11px/1.5 var(--body)}
.drive-result-entry .score-register-invite :is(a,button){display:inline-flex;align-items:center;min-height:44px;font-size:11px}
.drive-result-entry .score-sign-in{display:flex;flex-direction:column;align-items:flex-start;margin-top:6px;gap:3px}
.drive-result-entry .score-sign-in-panel{--ink:#243e3c;--paper:#fff9e8;--muted:#4c5e50;--line:#9eaa89;color:#243e3c}
.drive-result-ticket.is-signing-in{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:390px!important;max-width:100%;gap:12px}
.drive-result-ticket.is-signing-in :is(.drive-result-summary h2,.drive-scorecard,#drive-result-copy,#drive-again,#drive-check){display:none!important}
.drive-result-ticket.is-signing-in .drive-result-summary{padding-bottom:10px;border-bottom:1px dashed #9a9c7c}
.drive-result-ticket.is-signing-in .drive-final{font-size:30px;margin-top:7px}
@media(max-width:540px){html[lang^=zh] .drive-page .drive-cabinet .drive-lobby h2{font-size:46px}}

/* Play surfaces use light outlines, distinct shapes and verbs against the night street. */
.drive-page{--drive-teal:#17546b}
.drive-screen,.drive-cabinet.is-expanded .drive-screen{background:#10213a}
.drive-shot-strip{background:#152a43;min-height:38px}
#drive-phase{display:inline-flex;align-items:center;max-width:60%;padding:4px 7px;border:1px solid transparent;border-radius:2px;font:700 10px/1.2 var(--body);letter-spacing:0;color:#f5f7ff}
#drive-phase[data-tone=boost]{background:#ffdb58;color:#132039;border-color:#fff4bc}
#drive-phase[data-tone=slide]{background:#f5f8fc;color:#132039;border-color:#fff}
#drive-phase[data-tone=danger]{background:#a82c49;color:#fff7ed;border-color:#ffb2b2}
#drive-phase[data-tone=lift]{background:#5ce5ee;color:#10243e;border-color:#e1ffff}
#drive-phase[data-tone=ride]{background:#ff9bce;color:#172139;border-color:#ffe5f2}
.drive-action.is-save-window{background:#ffe571;color:#16223b;border-color:#fff8c9;box-shadow:0 0 0 3px #fff2a7,0 3px 0 #715527}
.drive-scorecard li>span{display:flex;flex-direction:column;gap:2px}.drive-scorecard small{font:9px/1.3 var(--mono);letter-spacing:0;color:#55665d}
.drive-obstacle-guide{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.drive-obstacle-guide i{width:46px;height:30px;border:2px solid #14243a;font-size:23px;line-height:26px;box-shadow:0 0 0 2px #fff9eb;color:#132039;font-weight:900}
.drive-guide-awning{background:repeating-linear-gradient(90deg,#ffcb45 0 7px,#382f68 7px 14px);color:#fff!important;text-shadow:1px 1px #132039}
.drive-guide-vent{background:#5ce5ee}.drive-guide-flour{background:#fff;border-radius:0}.drive-guide-sauce{background:#b93151;color:#fff!important;border-radius:50%}.drive-guide-crates{background:repeating-linear-gradient(135deg,#ffd24b 0 7px,#233047 7px 14px);color:#fff!important;text-shadow:1px 1px #132039}.drive-obstacle-guide .drive-guide-scooter{border:0;box-shadow:none;background:none;width:51px}.drive-guide-scooter svg{width:51px;height:32px;display:block}
@media(max-width:540px){#drive-phase{font-size:9px;padding:3px 5px;max-width:57%}.drive-obstacle-guide{grid-template-columns:repeat(2,minmax(0,1fr))}.drive-shot-strip{gap:5px}.drive-meter-wrap{gap:5px}#drive-meter{width:65px}}
@media(max-height:520px) and (max-width:540px){.drive-cabinet.is-expanded .drive-shot-strip{padding-block:2px;min-height:28px}#drive-phase{font-size:8px}}
@media(max-width:540px){#drive-phase{font-size:11px}}
@media(max-height:520px) and (max-width:540px){#drive-phase{font-size:10px}}

/* Keep replay immediately reachable on a short phone; optional account copy follows it. */
@media(max-height:520px) and (max-width:540px){
 .drive-cabinet.is-expanded .drive-result-ticket{padding:13px 16px;gap:9px}
 .drive-cabinet.is-expanded .drive-result-ticket .drive-result-summary h2,.drive-cabinet.is-expanded #drive-result-copy{display:none}
 .drive-cabinet.is-expanded .drive-final{font-size:30px;margin-top:6px}
 .drive-cabinet.is-expanded .drive-scorecard{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin-top:8px;padding-top:7px}
 .drive-cabinet.is-expanded .drive-scorecard li{display:flex;flex-direction:column;align-items:flex-start;gap:3px;font-size:8px}
 .drive-cabinet.is-expanded .drive-scorecard li>span{font-size:7px;gap:2px}
 .drive-cabinet.is-expanded .drive-scorecard small{font-size:7px}
 .drive-cabinet.is-expanded .drive-result-entry label{margin-bottom:6px;font-size:8px}
 .drive-cabinet.is-expanded .drive-result-entry .drive-save-status{margin:6px 0}
 .drive-cabinet.is-expanded .drive-result-entry #drive-again{margin-top:8px}
}

/* Numeric distance and its unit fit independently, including Taiwan's longer unit. */
.drive-hud{grid-template-columns:minmax(0,1.25fr) minmax(44px,.7fr) minmax(0,1.25fr)}
.drive-hud>div,.drive-hud strong{min-width:0}
.drive-hud strong{white-space:nowrap}
.drive-hud .drive-distance-unit{font:700 12px/1 var(--body);letter-spacing:0}
.drive-hud strong[data-long=true]{font-size:24px}
@media(max-width:540px){.drive-hud .drive-distance-unit{font-size:9px}.drive-page .drive-cabinet .drive-hud strong[data-long=true]{font-size:17px;letter-spacing:0}.drive-page .drive-cabinet .drive-hud strong[data-huge=true]{font-size:15px;letter-spacing:0}}

@media(max-height:520px) and (min-width:541px){.drive-cabinet.is-expanded .drive-hud strong[data-long=true]{font-size:18px}}

/* Always-visible route planning replaces the separate Look ahead detour. */
.drive-route-strip{height:66px;min-height:0;background:#101e2e;overflow:hidden}
#drive-route-preview{display:block;width:100%;height:100%;image-rendering:pixelated;pointer-events:none}
.drive-actions{grid-template-columns:minmax(0,1fr) 190px}
.drive-action-prompt{min-width:0;grid-column:auto;grid-row:auto}
.drive-cabinet.is-expanded{grid-template-rows:44px 65px 38px minmax(0,1fr) 66px 72px auto}
@media(max-width:540px){
 .drive-route-strip{height:56px}
 .drive-actions{grid-template-columns:minmax(0,1fr);gap:6px}
 .drive-action-prompt{grid-column:1;grid-row:1}
 .drive-action{grid-column:1;grid-row:2;min-height:44px}
 .drive-cabinet.is-expanded{grid-template-rows:44px 62px 34px minmax(0,1fr) 56px 91px auto}
}
@media(max-height:520px) and (max-width:540px){
 .drive-cabinet.is-expanded{grid-template-rows:44px 44px 24px minmax(0,1fr) 44px 50px 22px}
 .drive-cabinet.is-expanded .drive-hud{height:44px;padding:4px 12px}
 .drive-cabinet.is-expanded .drive-label{margin-bottom:2px}
 .drive-cabinet.is-expanded .drive-shot-strip{min-height:24px;padding:2px 8px}
 .drive-cabinet.is-expanded .drive-route-strip{height:44px}
 .drive-cabinet.is-expanded .drive-actions{grid-template-columns:1fr;padding:3px 8px;gap:0}
 .drive-cabinet.is-expanded .drive-action{grid-row:1;min-height:44px;justify-content:center}
 .drive-cabinet.is-expanded .drive-status{min-height:22px;max-height:22px;padding:3px 8px}
}
@media(max-height:520px) and (min-width:541px){
 .drive-cabinet.is-expanded{grid-template-columns:minmax(0,1fr) 140px;grid-template-rows:44px minmax(0,1fr) 48px 24px}
 .drive-cabinet.is-expanded .drive-route-strip{grid-column:1;grid-row:3;height:48px}
 .drive-cabinet.is-expanded .drive-status{grid-row:4}
 .drive-cabinet.is-expanded .drive-action{grid-row:auto}
}
@media(min-width:541px){.drive-cabinet:not(.is-expanded) .drive-screen{max-height:max(160px,calc(100dvh - 350px))}}
.drive-cabinet{scroll-margin-top:8px}
.drive-screen{width:100%}
/* The receipt fits the viewport and keeps replay before optional score actions. */
.drive-result-ticket,.drive-result-summary,.drive-result-entry{min-width:0}
.drive-result-entry #drive-again{margin-top:0;margin-bottom:12px}
@media(max-width:540px){.drive-page .drive-cabinet.is-expanded .drive-result-ticket{width:min(340px,calc(100vw - 30px));max-width:calc(100vw - 30px)}}
@media(max-height:520px) and (max-width:540px){.drive-cabinet.is-expanded .drive-result-entry #drive-again{margin-top:0;margin-bottom:8px}}
.drive-obstacle-guide{grid-template-columns:repeat(4,minmax(0,1fr))}
.drive-obstacle-guide .drive-guide-truck{width:58px;height:32px;border:0;box-shadow:none;background:none}
.drive-guide-truck svg{display:block;width:58px;height:32px}
@media(max-width:650px){.drive-obstacle-guide{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Live distance is the reward; chains count useful contacts, not score multipliers. */
.drive-flight-reward{position:absolute;top:12px;left:12px;display:grid;gap:4px;pointer-events:none;padding:8px 10px;background:#101e2ee8;border-left:3px solid #8ba6aa;color:#fff3cf;max-width:calc(100% - 24px);font-variant-numeric:tabular-nums}
.drive-flight-reward[hidden]{display:none}.drive-flight-reward>span{font:700 8px/1.25 var(--mono);letter-spacing:.5px}.drive-flight-reward strong{font:900 clamp(16px,2.3vw,25px)/1 var(--display);white-space:nowrap}.drive-flight-reward #drive-chain{color:#ffe177;font-size:10px;letter-spacing:0}.drive-flight-reward[data-boosted=true]{border-color:#ffe177;background:#27342cf0}.drive-fx[data-tone=reward]{color:#ffe177}.drive-fx[data-tone=warning]{color:#ffb5a0}
@media(max-height:520px){.drive-flight-reward{top:6px;left:7px;padding:3px 7px;gap:2px}.drive-flight-reward>span{font-size:7px}.drive-flight-reward strong{font-size:16px}.drive-flight-reward #drive-chain{font-size:8px}}

@media(max-width:650px){.drive-fx{left:auto;right:8px;top:8px;transform:none;max-width:calc(100% - 144px);font-size:clamp(11px,3.8vw,16px);line-height:1.25;text-align:right;white-space:normal}}

.drive-obstacle-guide{grid-template-columns:repeat(3,minmax(0,1fr))}.drive-obstacle-guide .drive-guide-ramp{background:#ffb57c;clip-path:polygon(0 55%,100% 0,100% 100%,0 100%);line-height:29px}
@media(max-width:650px){.drive-obstacle-guide{grid-template-columns:repeat(2,minmax(0,1fr))}}

.drive-obstacle-guide :is(.drive-guide-bicycle,.drive-guide-stairs){border:0;box-shadow:none;background:none;width:54px}.drive-obstacle-guide :is(.drive-guide-bicycle,.drive-guide-stairs) svg{display:block;width:54px;height:34px}
.drive-fx[data-tone=collision]{color:#e6fff4;text-shadow:2px 2px #14243a,-1px -1px #14243a}

/* Keep Start visible when the in-page stage is capped by a short desktop. */
@media(min-width:541px) and (max-height:820px){
 .drive-cabinet:not(.is-expanded) .drive-screen:has(.drive-lobby:not([hidden])){min-height:280px}
 .drive-cabinet:not(.is-expanded) .drive-lobby .drive-ticket{width:490px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:0 20px;padding:15px 20px;transform:none}
 .drive-cabinet:not(.is-expanded) .drive-lobby .drive-ticket-eyebrow{grid-column:1/-1}
 .drive-cabinet:not(.is-expanded) .drive-lobby h2{grid-column:1;grid-row:2/6;font-size:56px;margin:12px 0 5px}
 .drive-cabinet:not(.is-expanded) .drive-lobby p{grid-column:2;font-size:11px;margin:9px 0 0}
 .drive-cabinet:not(.is-expanded) .drive-lobby .drive-ticket-route{grid-column:2;font-size:6px;margin:9px 0;padding:8px 0}
 .drive-cabinet:not(.is-expanded) .drive-lobby .drive-primary{grid-column:2;min-height:44px;padding:9px 12px}
 .drive-cabinet:not(.is-expanded) .drive-lobby .drive-how{grid-column:2;min-height:30px;font-size:10px}
 .drive-cabinet:not(.is-expanded) .drive-lobby .drive-ticket-foot{grid-column:1/-1;margin-top:8px}
 html[lang^=zh] .drive-page .drive-cabinet:not(.is-expanded) .drive-lobby h2{font-size:38px}
}

/* The bilingual start card fits a short portrait before the first tap. */
@media(max-height:520px) and (max-width:540px){
 .drive-cabinet.is-expanded .drive-lobby .drive-ticket{width:290px;padding:12px 18px;transform:none}
 .drive-cabinet.is-expanded .drive-lobby h2{font-size:40px;line-height:.9;margin:8px 0}
 html[lang^=zh] .drive-page .drive-cabinet.is-expanded .drive-lobby h2{font-size:30px;line-height:1.1}
 .drive-cabinet.is-expanded .drive-lobby p{font-size:11px;line-height:1.4;margin:6px 0}
 .drive-cabinet.is-expanded .drive-lobby .drive-ticket-route,.drive-cabinet.is-expanded .drive-lobby .drive-ticket-foot{display:none}
 .drive-cabinet.is-expanded .drive-lobby .drive-how{min-height:44px;padding:8px 0;font-size:10px}
}

/* The carried distance and launch countdown stay visible while controls rest. */
#drive-ride[hidden]{display:none}#drive-ride{display:grid;gap:4px;color:#ffc1e2;font:700 9px/1.2 var(--mono);letter-spacing:0}
#drive-ride-progress{display:block;width:100%;height:3px;border:0;border-radius:0;appearance:none;background:#455365;color:#ffc1e2}
#drive-ride-progress::-webkit-progress-bar{background:#455365}#drive-ride-progress::-webkit-progress-value{background:#ffc1e2}#drive-ride-progress::-moz-progress-bar{background:#ffc1e2}
.drive-cabinet[data-riding=true] .drive-action:disabled{opacity:1;background:#324c61;border-color:#799aa8;box-shadow:none;color:#ffe4f3}
@media(max-height:520px){#drive-ride{font-size:8px;gap:2px}}

/* Course choice stays outside active play and uses independent record boards. */
.drive-course-picker{margin:0 0 12px;padding:12px 14px;border:1px solid var(--line);background:var(--soft);color:var(--ink)}
.drive-course-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.drive-course-options button{min-height:44px;flex:1;padding:9px 12px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:700 12px/1.4 var(--body);border-radius:2px}
.drive-course-options button[aria-pressed=true]{background:#243e3c;color:#fff0cc;border-color:#243e3c;box-shadow:inset 0 -3px #f7ce72}.drive-course-options button:disabled{cursor:default;opacity:.65}.drive-course-options button[aria-pressed=true]:disabled{opacity:1}
.drive-course-picker p{font:11px/1.6 var(--body);margin:8px 0 4px;color:var(--muted)}.drive-course-location{font:700 11px/1.5 var(--body);color:var(--accent)}
.drive-cabinet[data-course=hualien]{--drive-teal:#086875}.drive-cabinet[data-course=hualien] .drive-lobby{background:linear-gradient(90deg,transparent 8%,#0d546125)}
[data-market-only][hidden],[data-coast-only][hidden],[data-road-only][hidden],[data-course-only][hidden]{display:none!important}
@media(max-width:700px){.drive-course-options{grid-template-columns:repeat(2,minmax(0,1fr))}}
.drive-cabinet[data-course=san-francisco]{--drive-teal:#515e74}.drive-cabinet[data-course=taroko]{--drive-teal:#275e48}

/* Nearby boarding is an optional stroke, with two reachable actions in one row. */
.drive-action-buttons{display:flex;gap:8px;min-width:0;grid-column:2;align-items:stretch}
.drive-action-buttons .drive-action{min-width:0;flex:1}
.drive-hop{flex:1;min-width:90px;background:#ffe177;color:#172139;border-color:#fff0ba;font-weight:700;box-shadow:0 3px 0 #80703e;white-space:nowrap}
.drive-hop:hover{background:#fff0b0}.drive-hop[hidden]{display:none}
.drive-cabinet[data-hop=true] .drive-actions{grid-template-columns:minmax(0,1fr) 280px}
@media(max-width:540px){.drive-action-buttons{grid-column:1;grid-row:2;width:100%}.drive-cabinet[data-hop=true] .drive-actions{grid-template-columns:minmax(0,1fr)}}
@media(max-height:520px) and (max-width:540px){.drive-cabinet.is-expanded .drive-action-buttons{grid-row:1}}
@media(max-height:520px) and (min-width:541px){.drive-cabinet.is-expanded .drive-action-buttons{flex-direction:column;width:100%}}

/* Optional scenic ending sits above the existing completed-round receipt. */
.drive-ferry-dialog{width:min(720px,calc(100vw - 24px));height:min(550px,calc(100dvh - 24px));max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:18px;border:2px solid #243e3c;border-radius:0;background:#fff0cc;color:#243e3c;box-sizing:border-box;overflow:hidden}
.drive-ferry-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:10px}
.drive-ferry-dialog::backdrop{background:#173f3acc}
.drive-ferry-dialog h2{margin:0;font:900 clamp(21px,5vw,32px)/1.1 var(--display)}
.drive-ferry-dialog p{margin:7px 0 0;font:12px/1.5 var(--body);color:inherit}
.drive-ferry-canvas{display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;image-rendering:pixelated;background:#c6e1d1}
.drive-ferry-dialog .drive-ferry-caption{margin:0;font-weight:700}
.drive-ferry-dialog .drive-primary,.drive-ferry-watch{min-height:44px}
.drive-ferry-watch[hidden]{display:none}
.drive-ferry-watch{display:block;width:100%;margin:0 0 8px;text-align:center}
@media(max-height:440px){.drive-ferry-dialog{padding:12px;gap:6px}.drive-ferry-dialog h2{font-size:21px}.drive-ferry-dialog p{font-size:11px;margin-top:4px}.drive-ferry-dialog .drive-ferry-caption{margin:0}}
