/* Clear holographic canvas with a small, reachable way back on every screen. */
#city-full-mode{position:fixed;z-index:290;left:50%;bottom:calc(env(safe-area-inset-bottom) + 35px);transform:translateX(-50%);display:flex;align-items:center;gap:8px;min-height:44px;padding:10px 16px;border:1px solid #94c9c875;border-radius:24px;background:#123340f5;color:#e0f6f2;font:650 12px/1.3 system-ui;box-shadow:0 4px 18px #00151b55;touch-action:manipulation}#city-full-mode svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}body:not([data-mode=city]) #city-full-mode,body:has(.explore-tools[data-illinois-map=true]) #city-full-mode{display:none}
body.city-full-mode>:not(#city-canvas):not(.gps-route-overlay):not(.journey-map-ribbon):not(.city-full-controls):not(.city-car-controls):not(.navigator-hard-lock):not(.city-full-credit):not(.city-street-radio):not(.trip-radio-3d-tags):not(.illinois-yard-estimate-badge):not(.pro-preview-full-clock):not(.pro-preview-details):not(.pro-preview-announcement){display:none!important}body.city-full-mode #city-canvas{position:fixed!important;inset:0!important;display:block!important;visibility:visible!important;width:100vw!important;height:100dvh!important}body.city-full-mode .navigator-lock-card{display:none!important}body.city-full-mode .navigator-hard-lock::backdrop{background:transparent!important}body.city-full-mode .navigator-hard-lock{padding:0!important}
.city-full-controls{position:fixed;z-index:1000;left:50%;bottom:calc(env(safe-area-inset-bottom) + 28px);transform:translateX(-50%);width:max-content;max-width:calc(100vw - 24px);box-sizing:border-box;padding:7px;border:1px solid #a8d6cf50;border-radius:18px;background:#0c2937ee;box-shadow:0 8px 30px #00141f55;color:#def3f0;font:12px/1.4 system-ui}.city-full-controls[hidden],.city-full-credit[hidden]{display:none!important}.city-full-buttons{display:flex;gap:6px}.city-full-buttons button{flex:1;min-width:0;min-height:44px;padding:9px 14px;margin:0;border:1px solid #9bccca50;border-radius:11px;background:#214453;color:#e6f5f3;font:650 12px/1.4 system-ui;white-space:nowrap;cursor:pointer;touch-action:manipulation}.city-full-buttons button[aria-pressed=true]{background:#b5e4d1;color:#10392f;border-color:#c4f2de}.city-full-buttons [data-full-exit]{background:#d0e5e6;color:#123641}.city-full-controls p{max-width:460px;margin:7px 5px 1px;font-size:10px;color:#c3dbdd;text-align:center}.city-full-credit{position:fixed;z-index:1000;bottom:max(4px,env(safe-area-inset-bottom));left:max(10px,env(safe-area-inset-left));font:9px system-ui;color:#d3e5ea;background:#0b2432b3;border-radius:4px;padding:3px 5px;text-decoration:none}#city-full-mode:focus-visible,.city-full-controls button:focus-visible{outline:3px solid #ccf6e3;outline-offset:3px}
@media(max-width:1100px){#city-full-mode{bottom:calc(env(safe-area-inset-bottom) + 12px);left:auto;right:max(8px,env(safe-area-inset-right));transform:none;padding:9px 12px}.contact-launch{bottom:calc(env(safe-area-inset-bottom) + 12px)}}
@media(max-width:599px){#city-full-mode{bottom:calc(env(safe-area-inset-bottom) + 62px);right:auto;left:max(8px,env(safe-area-inset-left))}.city-full-buttons button{font-size:11px;padding:9px 10px}.city-full-controls{max-width:calc(100vw - 16px);bottom:calc(env(safe-area-inset-bottom) + 24px)}}
@media(max-height:450px){.city-full-controls p{max-width:600px;font-size:9px}.city-full-controls{bottom:calc(env(safe-area-inset-bottom) + 19px)}}
/* Reserve a separate row above the phone privacy links. */
@media(min-width:600px) and (max-width:1100px){#city-full-mode{left:50%;right:auto;transform:translateX(-50%)}}
@media(max-width:599px){#city-full-mode{left:50%;right:auto;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom) + 62px)}body[data-mode=city] #phone-local-navigation #city-navigation-hud:not([data-expanded=true]):not([data-fullscreen=true]){bottom:calc(env(safe-area-inset-bottom) + 116px)}body[data-mode=city]>.stop-ping-launch{bottom:calc(env(safe-area-inset-bottom) + 116px)}}
@media(max-width:380px){body[data-mode=city]>.stop-ping-launch{width:calc(100vw - 260px);min-width:56px;min-height:85px;padding:7px 4px;font-size:10px}body[data-mode=city]>.stop-ping-launch small{display:none}body[data-mode=city]>.stop-ping-launch svg{width:28px;height:28px}}
@media(max-width:599px){.city-full-buttons [data-full-exit] span{display:none}.city-full-buttons{display:grid;grid-template-columns:1fr 1fr 1.35fr}}
@media(min-width:600px){.city-full-buttons{display:grid;grid-template-columns:1fr 1fr 1.5fr}.city-full-controls{min-width:370px}}

/* Keep trip planning in the bottom action row, clear of the map and Navigator. */
body[data-mode=city]>.journey-launch{bottom:calc(env(safe-area-inset-bottom) + 35px);left:calc(50% + 84px);right:auto;min-height:44px;padding:9px 13px;font-size:12px;border-radius:24px;touch-action:manipulation}
body[data-mode=city]>.journey-launch svg{width:22px;height:22px}
@media(min-width:600px) and (max-width:1100px){body[data-mode=city]>.journey-launch{bottom:calc(env(safe-area-inset-bottom) + 12px);left:auto;right:max(8px,env(safe-area-inset-right))}body[data-mode=city]:has(>.journey-launch:not([hidden])) #phone-local-navigation #city-navigation-hud:not([data-expanded=true]):not([data-fullscreen=true]){bottom:calc(env(safe-area-inset-bottom) + 72px)}}
@media(max-width:599px){body[data-mode=city]>.journey-launch{bottom:calc(env(safe-area-inset-bottom) + 12px);left:auto;right:max(8px,env(safe-area-inset-right));max-width:150px}body[data-mode=city]:has(>.journey-launch:not([hidden]))>#city-full-mode{bottom:calc(env(safe-area-inset-bottom) + 12px);left:max(8px,env(safe-area-inset-left));right:auto;transform:none}body[data-mode=city]:has(>.journey-launch:not([hidden]))>.contact-launch{bottom:calc(env(safe-area-inset-bottom) + 62px)}}

.city-full-recover{display:block;width:100%;min-height:44px;margin-top:8px;border:1px solid #98d5c877;border-radius:11px;background:#b5e4d1;color:#10392f;font:650 12px/1.4 system-ui;touch-action:manipulation}.city-full-recover[hidden]{display:none!important}.city-full-recover:disabled{opacity:.55}.city-full-recover:focus-visible{outline:3px solid #ccf6e3;outline-offset:2px}

/* Guidance lives in the existing bottom dock, leaving the map uninterrupted. */
.city-full-journey{padding:8px 5px 0;min-width:0}.city-full-journey[hidden],.city-full-progress[hidden]{display:none!important}.city-full-journey strong{display:block;max-width:460px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#e5f6f2;font-size:12px;font-weight:650}.city-full-journey>span{display:block;color:#b8d9dc;font-size:10px;margin-top:3px}.city-full-journey>span[hidden]{display:none}.city-full-progress{height:3px;background:#325563;border-radius:4px;overflow:hidden;margin-top:7px}.city-full-progress i{display:block;height:100%;background:#78c4ff;border-radius:inherit}.city-full-controls p[hidden]{display:none}
@media(max-width:599px){.city-full-journey strong{max-width:calc(100vw - 50px)}}

/* Road essentials stay in Car and Bike/Scooter modes; the main full-map view stays clear. */
.city-full-bottom{display:flex;align-items:center;gap:8px;margin-top:6px}
.city-full-bottom:not(:has(> :not([hidden]))){display:none}
.city-full-bottom .city-full-journey{padding:0 4px;flex:1;min-width:0}
.city-full-bottom .city-full-journey strong{max-width:none}
.city-full-bottom .city-full-journey>span{font-size:9px}
.city-full-bottom .city-full-progress{margin-top:4px}
.city-full-cameras{display:flex;align-items:center;gap:6px;flex:none;min-height:44px}
.city-full-cameras[hidden],.city-full-camera-details[hidden]{display:none!important}
.city-full-camera-buttons{display:flex;gap:6px}
.city-full-camera-buttons button{display:flex;position:relative;align-items:center;justify-content:center;flex:none;width:44px;height:44px;padding:8px;border:1px solid #9bccca50;border-radius:11px;background:#173b49;color:#e6f5f3;touch-action:manipulation;cursor:pointer}
.city-full-camera-buttons img{width:26px;height:26px}
.city-full-camera-buttons button>span,.city-full-camera-buttons button>small,.camera-accessible-label{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.city-full-camera-buttons button[aria-pressed=true],.city-full-camera-buttons button[aria-pressed=mixed]{border-color:#b5e4d1;background:#285463}
.city-full-camera-buttons button[aria-pressed=true]::after,.city-full-camera-buttons button[aria-pressed=mixed]::after{content:'';position:absolute;top:4px;right:4px;width:5px;height:5px;border-radius:50%;background:#c4f2de}
.city-full-camera-buttons button[data-state=loading]::after,.city-full-camera-buttons button[data-state=error]::after{background:#ffd69d}
.city-full-camera-details{font:10px/1.5 system-ui}
.city-full-camera-details>summary{display:flex;box-sizing:border-box;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1px solid #9bccca50;border-radius:11px;background:#173b49;color:#d4ebeb;font-size:20px;list-style:none;cursor:pointer}
.city-full-camera-details>summary::-webkit-details-marker{display:none}
.city-full-camera-details>summary:focus-visible{outline:3px solid #ccf6e3;outline-offset:2px}
.city-full-camera-details[open]>summary{background:#285463}
.city-full-camera-panel{position:absolute;bottom:calc(100% + 8px);left:0;width:100%;box-sizing:border-box;background:#0c2937fa;border:1px solid #a8d6cf70;border-radius:16px;padding:10px;box-shadow:0 8px 30px #00141f88}
.city-full-camera-panel>p{margin:0 0 6px;text-align:left}
.city-full-camera-panel [data-camera-results]{max-height:min(24dvh,180px);overflow-y:auto;overscroll-behavior:contain;padding:3px 5px}
.city-full-camera-panel strong{display:block;font-size:11px;margin-top:8px}
.city-full-camera-panel [data-camera-results] p{margin:4px 0 6px;text-align:left}
.city-full-camera-result{display:flex;gap:10px;align-items:center;border-top:1px solid #9bccca25}
.city-full-camera-result span{flex:1;min-width:0}
.city-full-camera-panel a{display:inline-flex;align-items:center;min-height:44px;color:#b5e4d1}
.city-full-camera-result a{flex:none}
@media(max-width:380px){.city-full-bottom{gap:4px}.city-full-cameras,.city-full-camera-buttons{gap:4px}}

/* A quiet, reachable tool rail. The map keeps the remaining space. */
.city-street-tools{display:flex;gap:6px;align-items:center;flex:none;margin-left:auto}
.city-street-tools[hidden],.city-street-tools button[hidden],.street-bike-essentials[hidden]{display:none!important}
.city-street-tools>button{position:relative;display:grid;place-items:center;box-sizing:border-box;width:44px;height:44px;flex:none;padding:6px;border:1px solid #92c5c452;border-radius:12px;background:linear-gradient(145deg,#254958,#112c39);box-shadow:inset 0 1px #d1f3eb12;color:#dcefed;touch-action:manipulation;cursor:pointer}
.city-street-tools>button>img{width:28px;height:28px}.city-street-tools>button>svg{width:25px;height:34px;filter:drop-shadow(1px 2px 2px #0008)}
.city-street-tools>button>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.city-street-tools>button[aria-pressed=true],.city-street-tools>button[aria-expanded=true]{background:#285363;border-color:#b5e4d1}
.city-street-tools>button[aria-pressed=true]:after,.city-street-tools>button[data-layers]:not([data-layers=""]):after{content:'';position:absolute;right:4px;top:4px;width:5px;height:5px;border-radius:50%;background:#b5e4d1}
.city-street-tools [data-street-radio] i{position:absolute;right:4px;top:4px;width:5px;height:5px;border-radius:50%;background:#677e88}
.city-street-tools [data-radio-on=true] i{background:#b5e4d1}.city-street-tools [data-voice-active=true] i{background:var(--radio-voice-color,#b5e4d1);box-shadow:0 0 8px var(--radio-voice-color,#b5e4d1)}
.street-bike-essentials{position:absolute;bottom:calc(100% + 10px);left:0;box-sizing:border-box;width:100%;max-height:min(62dvh,510px);overflow:auto;overscroll-behavior:contain;border:1px solid #9dc9c86b;border-radius:20px;background:#0b2735fa;box-shadow:0 12px 35px #00121faa;scrollbar-width:thin}
.street-bike-essentials>header{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:8px;padding:9px 12px;background:#102e3cf5;border-bottom:1px solid #88b5be33}.street-bike-essentials>header div{flex:1}.street-bike-essentials>header small{display:block;color:#9abcc2;letter-spacing:1.5px;font-size:8px}.street-bike-essentials>header strong{font-size:14px;color:#e0f3f0}.street-bike-essentials>header button{width:44px;height:44px;border:1px solid #9bccca50;border-radius:11px;background:#214453;color:#e6f5f3;font-size:23px;cursor:pointer}
body #street-bike-essentials .ride-essentials{position:static;inset:auto;width:100%;max-width:none;transform:none;filter:none;margin:0}
body #street-bike-essentials .ride-essentials .ess-body{display:block;max-height:none;overflow:visible;border:0;border-radius:0;background:transparent;padding:12px;backdrop-filter:none}
body #street-bike-essentials .ess-types{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
body #street-bike-essentials .ess-types button{min-height:65px}.street-bike-essentials .ess-types span{font-size:10px}
body #street-bike-essentials p{text-align:left;max-width:none;margin:8px 0;line-height:1.55}
body #street-bike-essentials .ess-list>div{max-height:190px}body #street-bike-essentials .ess-list summary,body #street-bike-essentials .ess-list button{min-height:44px}
body #street-bike-essentials .ess-types img{width:30px;height:30px}body #street-bike-essentials .ess-options button,body #street-bike-essentials select,body #street-bike-essentials .ess-card button{min-height:44px}
body.city-car-mode .city-full-bottom{flex-wrap:wrap}body.city-car-mode .city-full-bottom .city-full-journey{flex-basis:100%}
@media(max-height:520px){.street-bike-essentials{max-height:calc(100dvh - 175px)}}
@media(max-width:380px){.city-street-tools{gap:4px}}

.city-full-controls:has(.street-bike-essentials:not([hidden])){z-index:1020}

.trip-radio-3d-tags .trip-rider-badge{display:inline-grid;place-items:center;vertical-align:middle;min-width:22px;height:22px;margin-right:6px;border-radius:7px;color:#071b26;font:800 10px/1 system-ui;box-shadow:0 0 0 1px #ffffff66}
.city-street-tools [data-team-warnings]{color:#ffcf86}.city-street-tools [data-team-warnings]>svg{width:25px;height:25px;filter:none}.city-street-tools [data-team-warnings]>b{position:absolute;top:-4px;right:-4px;min-width:15px;height:15px;padding:1px;border-radius:8px;background:#ffca7a;color:#1b2932;font:800 9px/15px system-ui}.city-street-tools [data-team-warnings]>b[hidden]{display:none}
.street-warning-body{padding:12px}.street-warning-body [hidden]{display:none!important}.street-warning-body p{margin:5px 0 12px;text-align:left;font-size:11px;line-height:1.5}.street-warning-kinds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:12px}.street-warning-body button{min-height:44px;border:1px solid #719ca25c;background:#193a49;color:#e3f0ed;border-radius:10px;font:600 11px/1.3 system-ui;padding:8px;cursor:pointer;touch-action:manipulation}.street-warning-kinds button{display:grid;gap:4px;place-items:center;min-height:66px}.street-warning-kinds i{font:700 23px/1 system-ui;color:var(--warning-color)}.street-warning-kinds [aria-pressed=true]{border-color:var(--warning-color);background:#2c4a54;box-shadow:inset 0 -2px var(--warning-color)}.street-warning-body label{display:block;font-size:11px;color:#c3dcd9}.street-warning-body input{box-sizing:border-box;display:block;width:100%;min-height:44px;margin:5px 0 10px;border:1px solid #81b5b767;border-radius:10px;background:#0e2734;color:#edf7f3;padding:10px;font:16px system-ui}.street-warning-body [data-warning-send]{width:100%;background:#f5cc8e;color:#183241;border-color:#f7d8a9}.street-warning-body button:disabled{opacity:.5;cursor:default}.street-warning-note{display:block;margin:10px 0 2px;color:#aec8ce;font-size:10px;line-height:1.55}.street-warning-body article{border-top:1px solid #83b5b845;padding:12px 0;margin:5px 0}.street-warning-body article>strong,.street-warning-body article>small{display:block;overflow-wrap:anywhere}.street-warning-body article>small{color:#b2cdd2;margin:5px 0 8px}.street-warning-body :focus-visible{outline:2px solid #cdf2e5;outline-offset:3px}

.trip-radio-3d-tags .trip-rider-connector{position:absolute;height:1px;transform-origin:0 50%;pointer-events:none;opacity:.7;z-index:0}.trip-radio-3d-tags .trip-rider-connector[hidden]{display:none}.trip-radio-3d-tags>button{z-index:1}

/* Keep every road and rider tool reachable at phone widths without squeezing
   the 44px touch targets. The destination owns its row when space is tight. */
@media(max-width:600px){
 body[data-street-mode] .city-full-bottom{flex-wrap:wrap;justify-content:space-between}
 body[data-street-mode] .city-full-bottom>.city-full-journey{flex:1 0 100%;box-sizing:border-box}
 body[data-street-mode] .city-street-tools{max-width:100%;flex-wrap:wrap}
 body[data-street-mode=bike] .city-street-tools{margin-left:0}
}

/* Air frames the whole trip without broadening nearby Essentials. */
#city-air-mode{position:fixed;z-index:850;left:calc(50% - 140px);bottom:calc(env(safe-area-inset-bottom) + 35px);min-width:44px;min-height:44px;padding:8px 14px;border:1px solid #91d9ec80;border-radius:14px;background:#123f55;color:#d9f5ff;font:700 12px system-ui;box-shadow:0 4px 14px #00101844;cursor:pointer;touch-action:manipulation}
#city-air-mode[hidden],.city-full-buttons>[hidden]{display:none!important}
body:not([data-mode=city])>#city-air-mode,body[data-map-world=community]>#city-air-mode{display:none!important}
#city-air-mode:focus-visible{outline:3px solid #c4f1ff;outline-offset:3px}
.city-full-buttons:has([data-full-air]:not([hidden])){grid-template-columns:1fr .7fr 1fr 1.3fr}
.city-full-buttons [data-full-air]{border-color:#91d9ec80;background:#123f55;color:#d9f5ff}
