/* A reserved guide lane and map chrome keep every instruction outside the road viewport. */
:root{--ink:#17333a;--paper:#f7f2df;--mint:#bdf184;--guide-height:138px}
.play-column{min-width:0;display:flex;flex-direction:column;gap:8px}.guide-dock[hidden]{display:none}.guide-dock{position:relative;min-height:var(--guide-height);height:var(--guide-height);padding:14px 18px 30px;border:1px solid #49615b;border-left:4px solid var(--mint);border-radius:16px;background:#1b3237;overflow:hidden}
.play-column .game-area{display:flex;flex-direction:column;border:2px solid #283f40;border-radius:20px;height:calc(100dvh - 144px);min-height:480px;box-shadow:0 6px 0 #0b1b21}
.play-column.has-guide .game-area{height:calc(100dvh - 152px - var(--guide-height));min-height:400px}
.map-viewport{position:relative;flex:1;min-height:0;overflow:hidden}.map-viewport canvas{width:100%;height:100%}
.game-area .map-top{position:static;flex:none;height:38px;padding:3px 12px;align-items:center;background:var(--paper);border-bottom:1px solid #cad0bc;visibility:visible}.game-area .map-label{padding:0;background:none;border:0;box-shadow:none;font-size:11px}.compass{width:28px;height:28px;font-size:17px;border:0;background:none;display:flex;align-items:end;justify-content:center}.compass small{top:0;left:11px;font-size:7px}.map-footer{flex:none;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 8px;background:var(--paper);border-top:1px solid #cad0bc}.map-footer .map-bottom{position:static;display:block;min-width:0}.map-credit{font-size:8px!important;letter-spacing:0!important;color:#667c6c}.map-footer .map-tools{position:static;padding:0;background:none;border:0;box-shadow:none;visibility:visible}.map-tools small{display:none}.map-tools>div{gap:4px}.map-tools button{min-width:30px;min-height:30px;padding:3px 7px;font-size:11px;background:#e4ecd9;color:#234737;border:1px solid #9cac90;border-bottom:2px solid #9cac90}.map-tools #mapReturn{margin-top:3px;font-size:10px;min-height:27px}.map-inspecting .map-top{visibility:visible}
.guide-dock .tutorial-coach,.guide-dock .tutorial-coach.is-traveling{position:static;display:flex;align-items:center;gap:16px;width:100%;min-width:0;max-width:none;padding:0;margin:0;transform:none;border:0;border-radius:0;box-shadow:none;background:none;text-align:left;line-height:1.4;pointer-events:auto;animation:none}
.guide-dock .tutorial-coach[hidden]{display:none}.lesson-copy{min-width:0;flex:1}.tutorial-coach small{display:block;color:#b5d6a4;font-size:10px;letter-spacing:.05em;margin-bottom:3px}.tutorial-coach strong{display:block;color:#f3ffdd;font-size:21px;line-height:1.25;word-break:keep-all}.tutorial-coach p{display:block;font-size:12px;line-height:1.5;color:#cbddda;margin:5px 0 0;word-break:keep-all;overflow-wrap:break-word}
.tutorial-action{display:flex;align-items:center;justify-content:center;flex:none;width:58px;height:62px;padding:0;color:#15372d;background:#bdf184;border:2px solid #e2f5b6;border-bottom:5px solid #77a264;border-radius:14px;pointer-events:auto;cursor:pointer}.tutorial-action span{font:900 42px/1 system-ui,sans-serif}.tutorial-action:active{background:#90c4ef;transform:translateY(2px)}.tutorial-action[hidden],.tutorial-wait[hidden]{display:none}.tutorial-wait{width:58px;flex:none;font-size:35px;text-align:center}.coach-pulse .tutorial-action{animation:key-nudge .8s ease-in-out 2}@keyframes key-nudge{50%{border-color:#fff;box-shadow:0 0 0 4px #bdf18433}}
.guide-dock .is-traveling .tutorial-action,.guide-dock .is-traveling .tutorial-wait{opacity:.35;pointer-events:none}.guide-dock .is-traveling strong{font-size:18px}.guide-dock .is-traveling p{display:block}
.guide-dock .overview-caption,.guide-dock .overview-caption.has-memory{position:absolute;top:15px;right:15px;left:auto;transform:none;display:block;min-width:0;width:64px;padding:5px;text-align:center;background:none;border:0;box-shadow:none;color:#d0e4ce}.overview-caption span,.overview-caption small{display:none!important}.overview-caption strong{font-size:34px!important;line-height:1.1;color:#bdf184!important}.overview-caption strong:only-child{display:block}.overview-caption[hidden]{display:none!important}
.guide-dock .memory-guide{position:static;transform:none;width:calc(100% - 60px);text-align:left;pointer-events:none}.memory-guide strong{font-size:21px;color:#f3ffdd;display:block}.memory-guide p{margin:4px 0 0;color:#b9cfc7;font-size:12px;background:none;text-shadow:none}.guide-dock .memory-choices{position:static;transform:none;width:100%;display:flex;gap:8px;margin-top:8px;justify-content:flex-start}.memory-choices[hidden],.memory-guide[hidden]{display:none!important}.memory-choice{padding:4px 10px;border:1px solid #829b67;border-radius:8px;background:#294438;color:#dae8d3;font-size:11px;box-shadow:none}.memory-choice b{font-size:15px;color:#c8f494}.memory-choice span{margin-right:7px}
.guide-dock .fork-coach{position:static;transform:none;width:100%;padding:0;border:0;border-radius:0;background:none;box-shadow:none;text-align:left}.fork-coach[hidden]{display:none}.fork-coach b{display:block;color:#c5f78f;font-size:20px}.fork-coach span,.fork-coach small{color:#c2d8ce;font-size:11px;display:block}.fork-coach strong{display:block;color:#f3ffdd;font-size:20px;margin:4px 0}.fork-coach i{font-style:normal;font-size:11px;color:#9fb5aa}
.guide-dock .junction{position:static;transform:none;width:100%;min-width:0;max-width:none;padding:8px 0;background:none;box-shadow:none;border:0;text-shadow:none;text-align:left;color:#f3ffdd;visibility:visible}.junction span{display:block;font-size:11px;color:#a7c3b9;letter-spacing:0;margin-bottom:6px}.junction strong{font-size:21px;color:#f3ffdd}.show-tutorial .junction,.show-fork .junction,.show-overview .junction{display:none}
.feedback-strip{position:absolute;left:18px;right:14px;bottom:6px;height:20px;display:flex;align-items:center;justify-content:space-between;gap:6px}.feedback-strip .toast{position:static;transform:none;min-width:0;max-width:100%;padding:0;border:0;border-radius:0;background:none!important;box-shadow:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;font-size:11px;color:#cfdfce;flex:1;transition:opacity .15s}.feedback-strip .toast.bad{color:#ffb293}.feedback-strip .hit-feedback{position:static;transform:none;filter:none;text-align:right;white-space:nowrap}.hit-feedback b,.hit-feedback span{display:inline;font-size:13px;letter-spacing:0;font-style:normal;-webkit-text-stroke:0}.hit-feedback span{margin-left:6px}.feedback-strip .decision-clock{position:static;font-size:12px;padding:2px 8px;box-shadow:none;border-radius:6px;flex:none}.hit-feedback.hit-good,.hit-feedback.hit-miss{animation:ink-hit .65s ease-out both}@keyframes ink-hit{0%{opacity:1;transform:translateY(3px)}15%,70%{opacity:1;transform:translateY(0)}100%{opacity:0}}
.dispatch-panels:empty{display:none}.dispatch-panels .support-notice,.dispatch-panels .bonus-offer{position:static;transform:none;width:100%;max-width:none;margin:0;border-radius:12px;box-shadow:none;padding:10px 14px}.dispatch-panels .bonus-offer p{margin:6px 0}.dispatch-panels:not(:has(:not([hidden]))){display:none}
.rider-style-options{display:flex;gap:8px;margin:12px 0}.rider-style-options button{flex:1;background:#223b3c;border:1px solid #527069;border-radius:10px;padding:10px;color:#bcd1c8;font-weight:700;font-size:13px}.rider-style-options button[aria-pressed=true]{background:#c1ec91;color:#244134;border-color:#d2f3ac;box-shadow:0 3px 0 #738f55}.vehicle-grid{gap:10px}.vehicle-grid .travel-choice{overflow:hidden;background:#e5ead4;border:2px solid #78917f;border-bottom:4px solid #52735f;border-radius:14px;padding:10px 6px 8px;color:#233e35}.vehicle-grid .travel-choice img{height:112px;width:100%;object-fit:contain;filter:none;border-radius:0;transition:transform .18s}.vehicle-grid .travel-choice span{color:#294435;font-size:13px;font-weight:800}.vehicle-grid .travel-choice[aria-pressed=true]{background:#d4efa9;border-color:#bdf184;box-shadow:0 0 0 2px #6ca582}.vehicle-grid .travel-choice[aria-pressed=true] img{transform:translateY(-3px)}
.modal{border:2px solid #496661;box-shadow:0 7px 0 #061a1f,0 24px 60px #07181640;background:#173035}.primary{border:1px solid #d9f8b9;border-bottom:4px solid #799e59;box-shadow:none}.secondary{border-color:#54716a}.howto div{border-color:#45645c;background:#213e3d}.key{border-radius:12px}.stage-title,.game-name{font-weight:900}
@media(max-width:650px){:root{--guide-height:144px}.play-column{width:100%;gap:6px}.guide-dock{padding:10px 11px 28px;border-radius:12px}.guide-dock .tutorial-coach{gap:10px}.tutorial-action{width:42px;height:48px;border-radius:10px;border-bottom-width:4px}.tutorial-action span{font-size:32px}.tutorial-wait{width:42px;font-size:29px}.tutorial-coach small{font-size:9px}.tutorial-coach strong{font-size:16px}.tutorial-coach p{font-size:11px;line-height:1.5;margin-top:4px}.guide-dock .is-traveling strong{font-size:16px}.play-column .game-area,.touch-mode .play-column .game-area{height:calc(100dvh - 356px);min-height:330px;border-radius:14px}.play-column.has-guide .game-area,.touch-mode .play-column.has-guide .game-area{height:calc(100dvh - 362px - var(--guide-height));min-height:318px}.game-area .map-top{height:30px;padding:2px 8px}.game-area .map-label{font-size:9px}.map-footer{min-height:36px;padding:2px 5px}.map-credit{font-size:7px!important}.map-tools button{font-size:10px;min-height:29px;padding:3px 6px}.memory-guide strong{font-size:17px}.memory-guide p{font-size:11px}.memory-choice{font-size:10px;padding:4px 8px}.memory-choice b{font-size:13px}.guide-dock .memory-choices{gap:5px}.guide-dock .overview-caption{right:6px;top:12px}.fork-coach b,.fork-coach strong{font-size:17px}.junction strong{font-size:17px}.junction span{font-size:10px}.feedback-strip{left:11px;right:9px;bottom:5px}.feedback-strip .toast{font-size:10px}.hit-feedback b,.hit-feedback span{font-size:11px}.feedback-strip .decision-clock{font-size:11px}.vehicle-grid .travel-choice img{height:84px}.vehicle-grid .travel-choice span{font-size:11px}.rider-style-options button{font-size:12px;padding:9px}.guide-dock .tutorial-coach.is-traveling{gap:10px}}
@media(prefers-reduced-motion:reduce){.coach-pulse .tutorial-action,.hit-feedback.hit-good,.hit-feedback.hit-miss{animation:none}.hit-feedback.hit-good,.hit-feedback.hit-miss{opacity:1}}

.guide-dock #overviewNumber{font-size:28px!important;white-space:nowrap}.guide-dock .tutorial-coach p{font-size:13px}@media(max-width:650px){.guide-dock .tutorial-coach p{font-size:12px}}
@media(min-width:651px){:root{--guide-height:116px}}
@media(max-width:650px){:root{--guide-height:132px}.guide-dock .tutorial-coach,.guide-dock .tutorial-coach.is-traveling{display:grid;grid-template-columns:42px 1fr;grid-template-rows:auto auto auto;gap:1px 10px}.lesson-copy{display:contents}.tutorial-action,.tutorial-wait{grid-column:1;grid-row:1/3;align-self:center}.tutorial-coach small{grid-column:2;grid-row:1;margin:0;align-self:end}.tutorial-coach strong{grid-column:2;grid-row:2;align-self:start}.tutorial-coach p{grid-column:1/-1;grid-row:3;margin-top:6px!important}.play-column.has-guide .game-area,.touch-mode .play-column.has-guide .game-area{min-height:285px}}

/* Tutorial callout lives in map scenery. Other HUD panels keep their reserved lane. */
.play-column.floating-lesson .game-area{height:calc(100dvh - 144px);min-height:560px}
.guide-dock.floating-guide{position:absolute;z-index:5;left:var(--coach-x,10px);top:var(--coach-y,10px);width:280px;max-width:calc(100% - 20px);height:auto;min-height:0;padding:12px 12px 30px;border:1px solid #c4eb9b88;border-left:3px solid #bdf184;border-radius:14px;background:#17333aeb;box-shadow:0 3px 12px #15332b18;overflow:visible;pointer-events:none}
.floating-guide .tutorial-coach,.floating-guide .tutorial-coach.is-traveling{display:grid;grid-template-columns:42px 1fr;gap:3px 10px;pointer-events:none}.floating-guide .lesson-copy{display:contents}.floating-guide .tutorial-action,.floating-guide .tutorial-wait{grid-column:1;grid-row:1/3;width:42px;height:48px;align-self:center}.floating-guide .tutorial-action{pointer-events:auto}.floating-guide .tutorial-action span{font-size:32px}.floating-guide .tutorial-coach small{grid-column:2;grid-row:1;font-size:9px;margin:0}.floating-guide .tutorial-coach strong{grid-column:2;grid-row:2;font-size:17px;line-height:1.3}.floating-guide .tutorial-coach p{grid-column:1/-1;grid-row:3;font-size:12px;line-height:1.5;margin:5px 0 0!important}.floating-guide .is-traveling p{display:none}.floating-guide .feedback-strip{left:12px;right:10px}.floating-guide .tutorial-coach.is-traveling strong{font-size:15px}.vehicle-traits{display:block;color:#456153;font-size:11px;line-height:1.6;margin-top:5px}.vehicle-traits b{color:#a54644;letter-spacing:2px}
@media(max-width:650px){.play-column.floating-lesson .game-area,.touch-mode .play-column.floating-lesson .game-area{height:calc(100dvh - 300px);min-height:550px}.guide-dock.floating-guide{width:238px;padding:10px 10px 28px}.floating-guide .tutorial-coach strong{font-size:16px}.floating-guide .tutorial-coach p{font-size:12px}.vehicle-traits{font-size:10px}}

.map-footer:has(.tutorial-skip:not([hidden])){flex-wrap:wrap}.tutorial-skip{width:100%;padding:6px 8px;border:1px solid #557c65;border-radius:7px;background:#d8ebbc;color:#244336;font:inherit;font-size:12px;font-weight:700;cursor:pointer}.tutorial-skip[hidden]{display:none}

.tutorial-complete-icon{font-size:64px;line-height:1.3;color:#bdf184;margin:8px auto}

/* Face-visible portrait artwork belongs only to the selection cards. */
.vehicle-grid .travel-choice{padding:0 0 10px;display:flex;flex-direction:column;align-items:stretch;text-align:center}
.vehicle-grid .travel-choice img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:10px 10px 0 0;transform:none!important;transition:none;background:#e5ead4}
.vehicle-grid .travel-choice>span{display:block;margin:8px 6px 0;font-size:14px}
.vehicle-grid .vehicle-traits{margin:4px 4px 0;font-size:11px;line-height:1.5}
.tutorial-entry{width:100%;margin-top:10px;background:#25443e;border:1px solid #8fbf71;color:#d5efbc;font-size:14px;padding:12px 8px}
@media(max-width:650px){.vehicle-grid{gap:10px}.vehicle-grid .travel-choice>span{font-size:13px}.vehicle-grid .vehicle-traits{font-size:11px}.tutorial-entry{font-size:13px}}

/* Keep start / practice actions visible while the selection list scrolls. */
.modal:has(>.selection-screen){height:100%;padding:0;overflow:hidden}
.selection-screen{display:flex;flex-direction:column;height:100%;min-height:0}
.selection-header{flex:none;padding:18px 18px 0}.selection-header h2{margin:8px 0!important}.selection-header .rider-style-options{margin:8px 0 12px}.selection-header .back-link{margin-bottom:8px}
.selection-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 18px 12px;scroll-padding:8px}.selection-scroll .map-choice{margin-top:14px}.selection-scroll .copyright{margin:8px 0 0}
.selection-footer{flex:none;padding:12px 18px;background:#173035;border-top:1px solid #53716a;box-shadow:0 -8px 18px #10282720}.selection-footer .primary{margin-top:0;min-height:44px;padding:10px}.selection-footer .tutorial-entry{margin-top:8px;min-height:42px;padding:9px}.selection-footer .online-error:empty{display:none}.selection-footer .device-options{margin:8px 0 0;padding-top:7px}
.modal:has(>.rank-list){display:flex;flex-direction:column;height:100%;overflow:hidden}.modal:has(>.rank-list)>:not(.rank-list){flex-shrink:0}.modal>.rank-list{flex:1;min-height:0;max-height:none;overscroll-behavior:contain}.modal:has(>.rank-list) #boardHome{margin-top:0;min-height:44px}
@media(max-width:650px){.selection-header{padding:12px 12px 0}.selection-scroll{padding:0 12px 10px}.selection-footer{padding:10px 12px max(10px,env(safe-area-inset-bottom))}.selection-header h2{font-size:24px}.selection-header .eyebrow{display:none}.selection-header .back-link{margin-bottom:3px}.selection-footer .device-options button{padding:5px 9px}}

/* Mobile play is one viewport: the map grows and the brake always stays on screen. */
@media(max-width:650px){
 body.mobile-playing{height:100dvh;overflow:hidden}
 .mobile-playing header{height:56px;padding:0 10px}.mobile-playing .brand{font-size:18px}.mobile-playing .brand-icon{width:30px;height:32px;font-size:23px}.mobile-playing .icon-btn{width:32px;height:32px;min-width:32px}
 .mobile-playing .layout{height:calc(100dvh - 56px);padding:0 8px max(6px,env(safe-area-inset-bottom));gap:5px;overflow:hidden}
 .mobile-playing .play-column{flex:1;min-height:0;gap:4px}
 .mobile-playing .play-column .game-area,.mobile-playing .play-column.has-guide .game-area,.mobile-playing .play-column.floating-lesson .game-area{flex:1;height:auto!important;min-height:0!important;max-height:none}
 .mobile-playing .guide-dock:not(.floating-guide){height:44px;min-height:44px;flex:none;padding:4px 9px 14px;border-radius:9px;border-width:0;background:transparent}
 .mobile-playing .guide-dock:not(.floating-guide) .junction{padding:0}.mobile-playing .junction span{display:none}.mobile-playing .junction strong{font-size:14px;line-height:22px}.mobile-playing .guide-dock:not(.floating-guide) .feedback-strip{height:13px;bottom:0;left:9px;right:8px}.mobile-playing .guide-dock:not(.floating-guide) .toast{font-size:9px}
 .mobile-playing .guide-dock.show-overview:not(.floating-guide){height:76px;min-height:76px}.mobile-playing .memory-guide strong{font-size:15px}.mobile-playing .memory-guide p{font-size:10px;margin-top:2px}.mobile-playing .guide-dock .memory-choices{margin-top:4px}.mobile-playing .guide-dock .overview-caption{top:4px}
 .mobile-playing .guide-dock.show-fork:not(.floating-guide){height:62px;min-height:62px}.mobile-playing .fork-coach b{font-size:14px}.mobile-playing .fork-coach strong{font-size:15px;margin:2px 0}.mobile-playing .fork-coach>span,.mobile-playing .fork-coach>small{display:none}
 .mobile-playing .sidebar{flex:none;display:grid;grid-template-columns:1fr 1fr;gap:4px 8px;padding:0 2px}
 .mobile-playing .stage-info{grid-row:1;grid-column:1}.mobile-playing .stage-info .eyebrow,.mobile-playing .stage-desc,.mobile-playing .stage-number,.mobile-playing .delivery-card{display:none}.mobile-playing .stage-heading{display:block}.mobile-playing .stage-title{font-size:14px;line-height:20px;margin:0}
 .mobile-playing .status-row{grid-row:1;grid-column:2;justify-content:flex-end;align-self:center;margin:0}.mobile-playing #lifeLabel{display:none}.mobile-playing .hearts{font-size:15px;letter-spacing:1px;white-space:nowrap}
 .mobile-playing .stats{grid-row:2;grid-column:1;gap:5px;align-self:stretch}.mobile-playing .stat{padding:5px 7px;border-radius:8px}.mobile-playing .stat-label{font-size:8px;white-space:nowrap;letter-spacing:0}.mobile-playing .stat strong{font-size:19px;margin-top:1px;line-height:23px}
 .mobile-playing .timer-wrap{grid-row:2;grid-column:2;padding:0;margin:0;align-self:center}.mobile-playing .timer-label{font-size:9px;line-height:12px;margin:0 0 2px;gap:3px}.mobile-playing .timer-label>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-playing #timerText{flex:none}.mobile-playing .timer{height:2px}
 .mobile-playing .deadline-badge{padding:3px 6px;margin-top:4px;border-radius:7px;gap:4px}.mobile-playing .deadline-badge>span{font-size:8px}.mobile-playing .deadline-badge b{font-size:20px;line-height:22px;white-space:nowrap}
 .mobile-playing .controls{grid-row:3;grid-column:1/-1;padding:4px 0 0;margin:0;position:relative}.mobile-playing .controls-title{font-size:9px;line-height:14px;margin:0;padding-right:75px}.mobile-playing .keys{gap:7px;margin:3px 0 5px}.mobile-playing .key{height:49px;min-height:49px;padding:3px 6px;border-radius:10px}.mobile-playing .key .arrow{font-size:25px;line-height:26px}.mobile-playing .key small{font-size:9px;line-height:12px}.mobile-playing .brake-button{display:block;height:40px;min-height:40px;margin:0;padding:6px;font-size:12px}.mobile-playing .control-note{display:none}.mobile-playing .pause-button{height:20px;top:0;font-size:9px}
 .mobile-playing .game-area .map-top{height:24px}.mobile-playing .map-footer{min-height:30px;padding:2px 5px}.mobile-playing .map-tools button{min-height:25px;height:25px;font-size:9px}.mobile-playing .tutorial-skip{padding:4px;min-height:27px;font-size:10px}
 .mobile-playing .dispatch-panels .support-notice,.mobile-playing .dispatch-panels .bonus-offer{padding:6px 9px;font-size:11px}.mobile-playing .dispatch-panels p{margin:4px 0}.mobile-playing .dispatch-panels .support-notice small{display:none}
 .mobile-playing .guide-dock.floating-guide{width:min(280px,calc(100% - 20px));padding:8px 9px 24px}.mobile-playing .floating-guide .tutorial-coach strong{font-size:15px}.mobile-playing .floating-guide .tutorial-coach p{font-size:11px;line-height:1.4}
}

/* Before departure, devote the phone to reading the route. */
@media(max-width:650px){
 .mobile-overview .sidebar,.mobile-overview .dispatch-panels{display:none}
 .mobile-overview .guide-dock.show-overview{padding-bottom:6px}
 .mobile-overview .guide-dock .feedback-strip{display:none}
 .mobile-overview .map-footer{min-height:24px}
 .mobile-playing.mobile-tutorial .sidebar>:not(.controls){display:none}
}

.bonus-breakdown{margin:12px 0 5px;padding:10px;border:1px solid #527567;border-radius:10px;background:#203d39;text-align:left;font-size:12px}.bonus-breakdown>div{display:flex;justify-content:space-between;gap:8px;padding:5px 0}.bonus-breakdown dt{color:#c9dcd0}.bonus-breakdown dd{margin:0;color:#d6f5a5;white-space:nowrap;font-weight:700;font-variant-numeric:tabular-nums}.bonus-note{font-size:10px;color:#99b3a8}
.modal:has(>.stage-clear-modal),.modal:has(>.milestone-modal){overflow:hidden;padding:0}.stage-clear-modal,.milestone-modal{max-height:100%;overflow-y:auto;padding:18px}.stage-clear-modal #nextDelivery,.milestone-modal #nextMilestone{position:sticky;bottom:0;z-index:2;box-shadow:0 -8px 10px #173035cc}
@media(max-width:650px){.modal:has(>.stage-clear-modal),.modal:has(>.milestone-modal){height:100%}.stage-clear-modal,.milestone-modal{padding:12px}.stage-clear-modal .delivery-reward-art{width:120px}.stage-clear-modal .stage-earnings{margin:8px 0}.stage-clear-modal .stage-earned{font-size:34px}.stage-clear-modal h2{font-size:23px;margin:4px 0 8px}.stage-clear-modal .intro{font-size:12px;margin:8px 0}.stage-clear-modal .stage-earnings p{margin:7px 0}.bonus-breakdown{font-size:11px;padding:6px 8px;margin-top:8px}.bonus-breakdown>div{padding:4px 0}}

.bonus-breakdown .full-combo-pay dt,.bonus-breakdown .full-combo-pay dd{color:#ffda83;font-weight:800}

/* Short, transparent hit effects live beside the rider, separate from instructions. */
.map-viewport .ride-feedback{position:absolute;z-index:6;width:164px;top:0;left:0;transform:none;padding:6px 3px;pointer-events:none;text-align:center;white-space:nowrap;filter:none;line-height:1.12;text-shadow:-1px -1px 0 #16343c,1px -1px 0 #16343c,-1px 1px 0 #16343c,2px 3px 0 #16343c,0 3px 7px #17333a66;transform-origin:center}
.ride-feedback[hidden]{display:none!important}.map-viewport .ride-feedback b{display:block;font-size:31px;line-height:1.14;font-weight:950;font-style:italic;letter-spacing:-1px;color:#d1ff68;-webkit-text-stroke:0}.map-viewport .ride-feedback span{display:block;font-size:12px;line-height:1.4;font-weight:850;color:#fff9dc;margin:3px 0 0;letter-spacing:0}.map-viewport .ride-feedback.hit-miss b{color:#ffa387}.map-viewport .ride-feedback.high-combo b{color:#ffe078;font-size:36px}
.map-viewport .ride-feedback.hit-good{animation:rider-hit .82s ease-out both}.map-viewport .ride-feedback.hit-miss{animation:rider-miss .82s ease-out both}
@keyframes rider-hit{0%{opacity:0;transform:scale(.55) rotate(-9deg)}12%{opacity:1;transform:scale(1.13) rotate(3deg)}27%{transform:scale(.98) rotate(-2deg)}42%,65%{opacity:1;transform:scale(1) rotate(0)}100%{opacity:0;transform:translateY(-12px) scale(.96)}}
@keyframes rider-miss{0%{opacity:0;transform:scale(1.17)}12%{opacity:1;transform:translateX(-4px) rotate(-3deg)}24%{transform:translateX(3px) rotate(2deg)}40%,70%{opacity:1;transform:none}100%{opacity:0;transform:translateY(9px)}}
.breaking-heart{display:block;position:relative;width:36px;height:32px;margin:2px auto 0;font-style:normal}.heart-half{position:absolute;inset:0;font-size:32px;line-height:32px;color:#ff777e;font-style:normal}.heart-half.left{clip-path:polygon(0 0,53% 0,44% 47%,56% 59%,44% 100%,0 100%);animation:heart-left .7s ease-out both}.heart-half.right{clip-path:polygon(53% 0,100% 0,100% 100%,44% 100%,56% 59%,44% 47%);animation:heart-right .7s ease-out both}
@keyframes heart-left{0%,12%{transform:none;opacity:1}100%{transform:translate(-11px,9px) rotate(-25deg);opacity:0}}@keyframes heart-right{0%,12%{transform:none;opacity:1}100%{transform:translate(11px,12px) rotate(25deg);opacity:0}}
.hearts.heart-hit{animation:heart-hud .45s ease-out}@keyframes heart-hud{15%{transform:scale(1.24);color:#fff0df}45%{transform:translateX(-3px);color:#ff746e}100%{transform:none}}
.map-viewport.damage-flash::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:4;border-radius:inherit;animation:damage-edge .35s ease-out both}@keyframes damage-edge{0%{box-shadow:inset 0 0 0 3px #ff715a99,inset 0 0 22px #ff715a38}100%{box-shadow:inset 0 0 0 0 #ff715a00,inset 0 0 0 #ff715a00}}
@media(max-width:650px){.map-viewport .ride-feedback{width:138px;padding:4px 2px}.map-viewport .ride-feedback b{font-size:25px}.map-viewport .ride-feedback.high-combo b{font-size:29px}.map-viewport .ride-feedback span{font-size:10px}.ride-feedback.has-damage .breaking-heart{height:26px}.ride-feedback .heart-half{font-size:28px;line-height:28px}}
@media(prefers-reduced-motion:reduce){.map-viewport .ride-feedback.hit-good,.map-viewport .ride-feedback.hit-miss{animation:rider-fade .8s linear both}.heart-half.left,.heart-half.right,.hearts.heart-hit,.map-viewport.damage-flash::after{animation:none}.heart-half.left{transform:translateX(-3px)}.heart-half.right{transform:translateX(3px)}@keyframes rider-fade{0%,75%{opacity:1}100%{opacity:0}}}

.map-viewport .ride-feedback.has-damage{min-height:64px}.ride-feedback.has-damage .breaking-heart{position:absolute;left:9px;top:29px;margin:0}.map-viewport .ride-feedback.has-damage span{padding-left:29px}.map-viewport .ride-feedback.hit-miss b{font-size:23px}
@media(max-width:650px){.map-viewport .ride-feedback.hit-miss b{font-size:19px}}

.map-viewport .ride-feedback.compact-hit{width:108px}.map-viewport .ride-feedback.compact-hit b{font-size:22px}.map-viewport .ride-feedback.compact-hit.high-combo b{font-size:25px}.map-viewport .ride-feedback.compact-hit span{font-size:9px;letter-spacing:-.35px}.map-viewport .ride-feedback.compact-hit.hit-miss b{font-size:16px}

/* Departure briefing: large route board, fixed-size pins and a clear visual hierarchy. */
.briefing-mode .layout{grid-template-columns:minmax(0,1fr)}
.briefing-mode .sidebar,.briefing-mode .dispatch-panels{display:none}
.briefing-mode .guide-dock.show-overview{height:132px;min-height:132px;padding:16px 22px;border:1px solid #71916a;border-left:5px solid #c8f77d;background:linear-gradient(110deg,#193c3c,#173039);box-shadow:inset 0 1px #e2ffab22}
.briefing-mode .guide-dock .memory-guide{width:calc(100% - 96px)}
.briefing-mode .memory-guide strong{font-size:27px;letter-spacing:-1px;line-height:1.2;color:#f5ffe4}
.briefing-mode .memory-guide p{font-size:16px;line-height:1.35;color:#d3ebde;margin-top:6px}
.briefing-mode .guide-dock .overview-caption{display:flex;align-items:center;justify-content:center;right:20px;top:16px;width:84px;height:84px;padding:6px;border-radius:50%;background:conic-gradient(#c8f77d var(--count-fill,100%),#52716a 0);box-shadow:0 0 22px #bbff7520}
.briefing-mode .overview-caption::before{content:'';position:absolute;inset:6px;border-radius:50%;background:#19343a}
.briefing-mode .guide-dock #overviewNumber{position:relative;font-size:42px!important;font-variant-numeric:tabular-nums;color:#e4ffad!important;letter-spacing:-2px}
.briefing-mode .overview-caption.count-beat{animation:count-beat .36s ease-out}
@keyframes count-beat{0%{transform:scale(.94);box-shadow:0 0 0 0 #c8f77d50}55%{transform:scale(1.05)}100%{transform:scale(1);box-shadow:0 0 0 12px #c8f77d00}}
.briefing-mode .guide-dock .memory-choices{width:calc(100% - 96px);gap:8px;margin-top:10px}
.briefing-mode .memory-choice{display:flex;align-items:center;padding:7px 12px;background:#284941;border:1px solid #82ab74;border-radius:10px;color:#edffdc;transition:background .2s,box-shadow .2s}
.briefing-mode .memory-choice b{font-size:17px;color:#edffdc}.briefing-mode .memory-choice span{font-weight:800;font-size:12px}
.briefing-mode .memory-choice.memory-focus{background:#d0f79d;color:#173b31;border-color:#edffd2;box-shadow:0 0 0 3px #c5f78025}.briefing-mode .memory-focus b{color:#173b31}
.briefing-mode .guide-dock .feedback-strip{display:none}
.briefing-mode .play-column.has-guide .game-area{height:calc(100dvh - 278px);min-height:380px;border-color:#859d7c}
.traffic-notice b,.traffic-notice span{display:block}.traffic-notice b{font-size:20px;color:#ffe2a3;line-height:1.3}.traffic-notice span{font-size:12px;color:#e3d5bd;margin-top:4px}.traffic-notice.traffic-clear b{color:#c7f594}.show-traffic .junction,.show-traffic .fork-coach{display:none}
.map-lesson{text-align:left}.map-lesson .eyebrow{color:#c5f486}.map-lesson h2{font-size:27px;margin:8px 0 12px;line-height:1.25}.map-lesson p{font-size:15px;line-height:1.65;color:#d3e4dc;margin:12px 0}.map-lesson p b{color:#dcffb0}.map-lesson-art{display:block;width:100%;height:210px;background:#f7f2df;border-radius:18px;border:2px solid #749377}.map-lesson-progress{display:flex;gap:6px;margin:14px 0}.map-lesson-progress i{height:5px;flex:1;background:#45615a;border-radius:5px}.map-lesson-progress i.active{background:#cbf58c}.map-lesson-actions{display:flex;gap:8px}.map-lesson-actions button{min-height:48px}.map-lesson-actions .primary{flex:1}.map-lesson-actions .secondary{width:76px}.map-lesson .text-button{margin-top:10px;width:100%;color:#bdd2c5}
@media(max-width:650px){
 .mobile-playing.briefing-mode .guide-dock.show-overview:not(.floating-guide){height:110px;min-height:110px;padding:10px 10px;border-radius:12px;border-left:4px solid #c8f77d;background:linear-gradient(110deg,#193c3c,#173039)}
 .briefing-mode .guide-dock .memory-guide{width:calc(100% - 66px)}.briefing-mode .memory-guide strong{font-size:20px;letter-spacing:-.65px}.briefing-mode .memory-guide p{font-size:12px;line-height:1.35;margin-top:6px;min-height:32px}
 .briefing-mode .guide-dock .overview-caption{right:8px;top:12px;width:58px;height:58px}.briefing-mode .guide-dock #overviewNumber{font-size:30px!important}
 .briefing-mode .guide-dock .memory-choices{width:100%;margin-top:2px;gap:5px}.briefing-mode .memory-choice{padding:5px 8px;gap:2px}.briefing-mode .memory-choice span{font-size:10px;margin-right:2px}.briefing-mode .memory-choice b{font-size:13px}
 .mobile-playing.briefing-mode .play-column.has-guide .game-area{height:auto;min-height:0;flex:1}
 .mobile-playing .guide-dock.show-traffic:not(.floating-guide){height:62px;min-height:62px;padding:5px 9px 14px;background:#344039;border-left:3px solid #ffd483}.traffic-notice b{font-size:15px}.traffic-notice span{font-size:11px;margin-top:2px}
 .map-lesson h2{font-size:23px}.map-lesson p{font-size:13px;margin:10px 0}.map-lesson-art{height:170px}.map-lesson-progress{margin:10px 0}
}
@media(max-height:650px){.map-lesson-art{height:135px}.map-lesson h2{font-size:21px;margin:6px 0}.map-lesson p{font-size:12px;line-height:1.5}}
@media(prefers-reduced-motion:reduce){.briefing-mode .overview-caption.count-beat{animation:none}.briefing-mode .memory-choice{transition:none}}
.arrival-pending{text-align:center}.arrival-pending .delivery-reward-art{width:190px;animation:arrival-float 1.8s ease-in-out infinite}.arrival-pending h2{font-size:29px;margin:10px 0}.arrival-pending p{color:#dcf0db;font-size:15px}.arrival-pending small{color:#a9c4b5;font-size:12px}.arrival-dots{display:flex;justify-content:center;gap:9px;margin:20px}.arrival-dots i{width:9px;height:9px;border-radius:50%;background:#c8f486;animation:arrival-dot 1s ease-in-out infinite}.arrival-dots i:nth-child(2){animation-delay:.15s}.arrival-dots i:nth-child(3){animation-delay:.3s}@keyframes arrival-dot{50%{opacity:.3;transform:translateY(-6px)}}@keyframes arrival-float{50%{transform:translateY(-6px)}}
.bonus-offer[aria-busy=true]{border-color:#cfec92}.bonus-offer[aria-busy=true] #bonusDescription::before{content:'◌ ';display:inline-block;animation:arrival-float 1s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.arrival-pending .delivery-reward-art,.arrival-dots i,.bonus-offer[aria-busy=true] #bonusDescription::before{animation:none}}

/* Only fork cues pulse on the departure board. Roads, food pins and timer stay still. */
.briefing-mode .overview-caption.count-beat{animation:none}
.roundabout-notice b,.roundabout-notice span{display:block}.roundabout-notice b{font-size:20px;color:#d6f9a7;line-height:1.3}.roundabout-notice span{font-size:12px;color:#d4e7d9;margin-top:5px}.show-roundabout .junction{display:none}.guide-dock.show-roundabout.show-traffic{height:146px;min-height:146px}.show-roundabout.show-traffic .traffic-notice{margin-top:8px;padding-top:6px;border-top:1px solid #69836b}
.penalty-history{text-align:left;margin:12px 0;padding:10px;background:#263b3a;border:1px solid #5b7265;border-radius:10px;font-size:12px;color:#d2e6d6}.penalty-history p{font-size:12px;line-height:1.6;margin:6px 0}.penalty-history b{color:#ffbd9c;white-space:nowrap}
@media(max-width:650px){.mobile-playing .guide-dock.show-roundabout:not(.floating-guide){height:62px;min-height:62px;padding:5px 9px 14px;background:#203d37;border-left:3px solid #bfe98b}.roundabout-notice b{font-size:15px}.roundabout-notice span{font-size:11px;margin-top:2px}.mobile-playing .guide-dock.show-roundabout.show-traffic:not(.floating-guide){height:100px;min-height:100px}.show-roundabout.show-traffic .traffic-notice{margin-top:4px;padding-top:3px}.show-roundabout.show-traffic .traffic-notice span{display:none}}

/* Additional delivery is a focused, bounded interruption; it never compresses the map. */
dialog.bonus-offer{position:fixed;inset:0;transform:none;margin:auto;width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;padding:24px;border:2px solid #c5ff80;border-radius:24px;background:#18383b;color:#f4ffef;word-break:keep-all;outline:none;box-shadow:0 20px 80px #061d2680;animation:bonus-arrival 650ms ease-out 2;z-index:100}
dialog.bonus-offer::backdrop{background:#07151cc2;backdrop-filter:blur(3px)}
dialog.bonus-offer .bonus-heading{display:flex;align-items:center;gap:12px}.bonus-bell{display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:#bcf779;font-size:32px;flex-shrink:0}
dialog.bonus-offer h2{font-size:25px;line-height:1.25;margin:5px 0;color:#f5ffec}dialog.bonus-offer .bonus-heading small{color:#c5ff80;margin:0;font-size:12px}
dialog.bonus-offer .bonus-paused{color:#c5ff80;font-weight:800;background:#bcf77914;border-radius:8px;padding:8px 10px;font-size:12px;margin:16px 0 8px}
dialog.bonus-offer #bonusDescription{font-size:15px;line-height:1.7;margin:14px 0 20px}
dialog.bonus-offer .bonus-choice-row{display:grid;grid-template-columns:1fr 1fr 66px;align-items:center;gap:10px}
dialog.bonus-offer button{min-height:52px;margin:0;font-size:17px;border:1px solid #bcf779;border-radius:12px;padding:10px;font-family:inherit}dialog.bonus-offer button:focus-visible{outline:3px solid #8bcfff;outline-offset:3px}dialog.bonus-offer button:disabled{opacity:.55}
dialog.bonus-offer .bonus-decline{background:#2b4e51;color:#f1ffe9;border-color:#839f94}.bonus-timer{display:flex;flex-direction:column;align-items:center;color:#c5ff80}.bonus-timer strong{font-size:40px;line-height:1;font-variant-numeric:tabular-nums}.bonus-timer span{font-size:10px;margin-top:4px}dialog.bonus-offer.bonus-urgent .bonus-timer{color:#ffd18a}
dialog.bonus-offer #bonusPolicy{font-size:12px;color:#c0d4cd;margin:15px 0 0}dialog.bonus-offer #bonusError{line-height:1.5}dialog.bonus-offer #retryBonus{margin-top:10px;font-size:14px;width:100%}
@keyframes bonus-arrival{0%,100%{box-shadow:0 20px 80px #061d2680}45%{box-shadow:0 0 0 6px #bcf77940,0 0 55px #bcf77950}}
@media(max-width:380px){dialog.bonus-offer{padding:18px}dialog.bonus-offer h2{font-size:21px}dialog.bonus-offer .bonus-choice-row{gap:8px;grid-template-columns:1fr 1fr 54px}}
@media(prefers-reduced-motion:reduce){dialog.bonus-offer{animation:none}}

/* Route tour: one readable fork at a time, in the actual delivery neighbourhood. */
.briefing-mode .guide-dock.show-overview{min-height:125px!important;height:125px!important;padding:16px 20px!important}
.briefing-mode .memory-guide{width:calc(100% - 84px)!important}.briefing-mode .memory-guide strong{font-size:25px!important}.briefing-mode .memory-guide p{font-size:14px!important;line-height:1.5!important;word-break:keep-all;max-width:680px}
#tourRule{font-size:12px;color:#d1e5bf;line-height:1.4;margin-top:10px;word-break:keep-all}#tourRule[hidden]{display:none}
.briefing-mode .memory-choices{display:none!important}
@media(max-width:650px){.mobile-playing.briefing-mode .guide-dock.show-overview:not(.floating-guide){height:110px!important;min-height:110px!important;padding:12px!important}.briefing-mode .memory-guide strong{font-size:19px!important}.briefing-mode .memory-guide p{font-size:12px!important;line-height:1.45!important;margin-top:6px!important;min-height:0!important}.briefing-mode #tourRule{font-size:10px;margin-top:8px}.briefing-mode .guide-dock .overview-caption{top:18px!important}.briefing-mode .memory-guide{width:calc(100% - 64px)!important}}

.briefing-mode .overview-caption::after{content:attr(data-label);position:absolute;bottom:-16px;left:0;width:100%;text-align:center;font-size:10px;color:#c8dbc4;white-space:nowrap}
@media(max-width:650px){.mobile-playing .guide-dock.show-fork:not(.floating-guide){height:106px;min-height:106px}.mobile-playing .fork-coach>span,.mobile-playing .fork-coach>small{display:block;font-size:10px;line-height:1.4}.mobile-playing .fork-coach>span{margin:3px 0}.mobile-playing .fork-coach>small{color:#f3d896}}

/* Site links stay in the menu scroll area and never cover driving controls. */
.site-links{display:flex;justify-content:center;flex-wrap:wrap;gap:7px 14px;padding:8px 0;font-size:11px}.site-links a,.footer a{color:#a9c8bf;text-underline-offset:3px}.legacy-records{display:block;text-align:center;color:#bcf779;font-size:11px;padding:7px 0 3px}.ad-playing header,.ad-playing main,.ad-playing footer{pointer-events:none}