/* Active driving view only. Existing planning, discovery and global navigation stay intact. */
#navigation-screen{position:absolute;inset:0;z-index:6;pointer-events:none}
.navigation-maneuver,.navigation-bottom{pointer-events:auto;position:absolute;background:#151518f5;border:1px solid #414147;border-radius:16px;box-shadow:0 5px 22px #0005;left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right))}
.navigation-maneuver{top:10px;padding:10px;display:flex;align-items:center;gap:9px;max-height:38%;overflow:auto}
.navigation-turn{min-width:0;flex:1}.navigation-maneuver p{margin:0}.navigation-maneuver #navigation-turn-distance{font-size:24px;line-height:1.1;font-weight:750;font-variant-numeric:tabular-nums;color:#fff}
#navigation-road{font-size:15px;font-weight:650;line-height:1.3;color:#fff;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:4px}
.navigation-maneuver h1{font-size:12px;font-weight:450;line-height:1.35;color:#c0c0c8;letter-spacing:0;margin:3px 0 0;overflow-wrap:anywhere}
#navigation-arrow{font-size:36px;line-height:1;flex:none;width:34px;text-align:center;color:#fff}#navigation-road:empty,#navigation-turn-distance:empty{display:none}
#navigation-back{flex:none;min-width:44px;min-height:44px;padding:4px;background:transparent;border:0;font-size:23px;color:white}

.navigation-bottom{bottom:calc(27px + env(safe-area-inset-bottom));padding:10px 12px}
.navigation-trip{display:flex;align-items:center;gap:10px}.navigation-estimate{flex:1;min-width:0;font-variant-numeric:tabular-nums}#navigation-remaining{font-size:22px;font-weight:750;line-height:1.1;color:#fff;margin:0}#navigation-trip-detail{font-size:12px;line-height:1.4;margin:4px 0 0;color:#c3c3cb}
#navigation-end{flex:none;min-width:48px;min-height:44px;padding:6px 10px;background:#292024;color:#ffbdc6;border-color:#64404a;font-size:12px}
#navigation-status{font-size:11px;line-height:1.4;margin:7px 0 0;color:#d4d4db}#navigation-status:empty{display:none}.navigation-actions{display:flex;gap:8px;flex-wrap:wrap}.navigation-actions:has(button:not([hidden])){margin-top:8px}.navigation-actions button{flex:1;min-width:90px;min-height:44px;font-size:12px}
#navigation-options{margin:0;flex:none}#navigation-options summary{list-style:none;min-width:44px;min-height:44px;display:grid;place-items:center;cursor:pointer;border:1px solid #45454e;border-radius:10px;background:#25252b;font-size:16px;color:#fff}#navigation-options summary::-webkit-details-marker{display:none}#navigation-options[open] summary{background:#413038}
.navigation-options-body{position:absolute;bottom:calc(100% + 8px);left:0;right:0;max-height:min(52dvh,400px);overflow:auto;overscroll-behavior:contain;padding:14px;background:#17171bf7;border:1px solid #45454e;border-radius:16px;box-shadow:0 5px 22px #0005}.navigation-options-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.navigation-options-grid button{min-height:44px;font-size:12px;white-space:normal}.navigation-options-grid label{grid-column:1/-1;font-size:12px}.navigation-options-grid select{display:block;width:100%;min-height:44px;margin-top:6px;background:#25252b;color:#fff;border-radius:10px;font-size:16px}
#navigation-voice-description,#navigation-voice-status,#navigation-options small{font-size:11px;line-height:1.45;color:#c6c6ce;margin:10px 0}
html[data-navigating] :is(#panel,.drive-nav,#drive-layers,#floating-tools,.mapboxgl-ctrl-top-right){display:none!important}html[data-navigating] .drive-header .drive-account,html[data-navigating] .drive-header .settings{visibility:hidden}
.navigation-position{width:34px;height:42px;filter:drop-shadow(0 2px 4px #000b);pointer-events:none}.navigation-position svg{display:block}.navigation-position[data-reliable=false]{opacity:.55}.navigation-position[data-heading=uncertain]{filter:drop-shadow(0 0 4px #fff8)}
#start-navigation{width:100%;margin:4px 0 8px}#navigation-availability{font-size:11px;color:#c9bec5;line-height:1.5}#navigation-availability:empty{display:none}
@media(min-width:701px){.navigation-maneuver,.navigation-bottom{left:50%;transform:translateX(-50%);width:min(520px,80%);right:auto}}
@media(max-width:360px){.navigation-maneuver{gap:5px;padding:8px}#navigation-arrow{width:26px;font-size:30px}.navigation-trip{gap:6px}}
@media(max-height:480px) and (min-width:540px){.navigation-maneuver{left:max(10px,env(safe-area-inset-left));right:auto;transform:none;width:42%;max-height:65%;padding:8px}.navigation-bottom{left:auto;right:max(10px,env(safe-area-inset-right));transform:none;width:42%;padding:8px;bottom:calc(25px + env(safe-area-inset-bottom))}.navigation-maneuver #navigation-turn-distance{font-size:21px}.navigation-options-body{max-height:60dvh}}

/* Three existing actions, one active-navigation rail. No additional map controllers. */
.navigation-control-rail{position:absolute;right:max(10px,env(safe-area-inset-right));top:var(--navigation-rail-top,calc(38% + 20px));display:flex;flex-direction:column;gap:8px;pointer-events:auto}
.navigation-control-rail button{width:44px;height:44px;min-height:44px;padding:10px;display:grid;place-items:center;border:1px solid #45454e;border-radius:13px;background:#202025f5;color:#fff;box-shadow:0 3px 12px #0005}
.navigation-control-rail svg{width:22px;height:22px}
.navigation-control-rail button[aria-pressed=true]{border-color:#8d3445}
#navigation-voice[data-muted=false] .voice-slash,#navigation-voice[data-muted=true] .voice-waves{display:none}
#navigation-voice[data-blocked=true]{border-color:#df9c62}
#navigation-screen:has(#navigation-options[open]) .navigation-control-rail{visibility:hidden}
.navigation-voice-all{display:flex;align-items:center;gap:9px;min-height:44px}.navigation-voice-all input{width:20px;height:20px;accent-color:#d7193f}
@media(max-height:480px){
 .navigation-control-rail{top:10px}
 .navigation-maneuver,.navigation-bottom{right:calc(max(10px,env(safe-area-inset-right)) + 56px)}
}
@media(max-height:480px) and (max-width:539px){
 .navigation-maneuver{max-height:45%}
}

#navigation-screen[data-compact-controls=true] .navigation-control-rail{top:10px}
@media(max-width:700px){
 #navigation-screen[data-compact-controls=true] :is(.navigation-maneuver,.navigation-bottom){right:calc(max(10px,env(safe-area-inset-right)) + 56px)}
}

/* Completion remains a compact map card, never a modal or a forced overview. */
.navigation-position[data-uncertain=true]{filter:drop-shadow(0 0 5px #c8c8d599)}
#navigation-screen[data-complete=true] :is(.navigation-trip,.navigation-control-rail){display:none}
#navigation-screen[data-complete=true] .navigation-bottom{border-top-color:#a72a43;max-height:45%;overflow:auto}
.navigation-complete-heading{display:flex;align-items:center;gap:10px}
.navigation-complete-heading svg{flex:none}
.navigation-complete-heading h2{font-size:18px;line-height:1.2;letter-spacing:.07em;margin:0;color:#fff}
.navigation-complete-heading p{font-size:12px;color:#c4c4cd;margin:4px 0 0}
#navigation-complete-destination{font-size:14px;color:#fff;margin:12px 0 4px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#navigation-complete-time{font-size:11px;color:#aaaab6;margin:0 0 10px}
.navigation-complete-actions{display:flex;gap:8px}.navigation-complete-actions button{min-height:44px;flex:1;font-size:12px;background:#24242b;color:#fff;border:1px solid #484852;border-radius:10px}
#navigation-done{border-color:#973349;background:#342027}
@media(prefers-reduced-motion:no-preference){#navigation-completion:not([hidden]) .navigation-complete-heading{animation:navigation-complete-reveal .3s ease-out}}
@keyframes navigation-complete-reveal{from{opacity:.4;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(max-height:480px){#navigation-screen[data-complete=true] .navigation-bottom{max-height:70%}.navigation-complete-heading h2{font-size:15px}.navigation-complete-heading svg{width:24px;height:24px}}