:root{--o:#4E50D8;--o2:#ff9a62;--bg:#07080a;--glass:rgba(10,12,15,.86);--glass2:rgba(16,18,22,.965);--line:rgba(255,255,255,.075);--text:#f7f8fa;--muted:#9198a3;--green:#55d7a0;--red:#ff666d;--blue:#7fb3ff;--ink:#0b0d10;--soft:#171a1f}
html,body{width:100%;height:100%;min-height:100%;overflow:hidden;background:#030405;-webkit-text-size-adjust:100%}.topbar,footer,.mobile-dock,.flash-wrap{display:none!important}body{padding:0!important;margin:0!important;overscroll-behavior:none;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input{font:inherit}.ws-app{position:relative;width:100%;max-width:600px;height:var(--vaizu-vh,100dvh);min-height:var(--vaizu-vh,100dvh);max-height:var(--vaizu-vh,100dvh);margin:auto;background:var(--bg);overflow:hidden;isolation:isolate;box-shadow:0 0 100px rgba(0,0,0,.55)}
#map{position:absolute;inset:0;background:#101318;touch-action:none;-webkit-user-select:none;user-select:none}.mapboxgl-map{font-family:inherit}.mapboxgl-ctrl-logo{transform:scale(.75);transform-origin:left bottom}.mapboxgl-ctrl-bottom-right{bottom:92px}.mapboxgl-ctrl-attrib{font-size:8px!important;background:rgba(9,10,13,.68)!important;color:#bbb!important}.mapboxgl-popup-content{background:#15181d!important;color:#fff!important;border-radius:16px!important;border:1px solid #2b3038!important;box-shadow:0 14px 38px rgba(0,0,0,.38)!important;padding:12px 14px!important}.mapboxgl-popup-tip{border-top-color:#15181d!important}
.map-vignette{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(5,6,8,.64) 0,rgba(5,6,8,.12) 22%,transparent 42%,transparent 70%,rgba(5,6,8,.2) 100%)}
.header{position:absolute;z-index:12;top:max(10px,env(safe-area-inset-top));left:12px;right:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;transition:.25s}
.brand{height:48px;padding:0 13px 0 8px;display:flex;align-items:center;gap:10px;border-radius:18px;border:1px solid var(--line);background:rgba(9,11,14,.74);backdrop-filter:blur(26px) saturate(135%);box-shadow:0 14px 38px rgba(0,0,0,.20);color:#fff}.brand-logo{width:34px;height:34px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,var(--o),#ffa06b);color:#111;box-shadow:0 8px 20px rgba(255,107,24,.28)}.brand-copy b{display:block;font-size:14px;letter-spacing:-.35px}.brand-copy span{display:flex;align-items:center;gap:5px;margin-top:2px;font-size:9px;color:#9ca3ad}.online{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(75,212,154,.1)}
.header-actions{display:flex;gap:8px}.icon-btn{width:48px;height:48px;border:1px solid var(--line);background:rgba(10,12,15,.82);backdrop-filter:blur(22px);border-radius:17px;color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 12px 34px rgba(0,0,0,.2);text-decoration:none}.icon-btn:active{transform:scale(.96)}.avatar{width:31px;height:31px;border-radius:12px;object-fit:cover;border:1px solid rgba(255,255,255,.16)}
.permission{position:absolute;z-index:40;left:10px;right:10px;top:max(10px,env(safe-area-inset-top));display:flex;align-items:center;gap:10px;padding:11px;border-radius:19px;background:rgba(15,17,21,.97);border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 48px rgba(0,0,0,.42);backdrop-filter:blur(24px);transform:translateY(calc(-100% - 28px));opacity:0;pointer-events:none;transition:.28s}.permission.show{transform:none;opacity:1;pointer-events:auto}.permission-icon{width:40px;height:40px;flex:0 0 40px;border-radius:14px;display:grid;place-items:center;background:rgba(255,107,24,.14);color:var(--o2)}.permission-copy{min-width:0;flex:1}.permission-copy b{display:block;font-size:11px}.permission-copy span{display:block;color:#8a919d;font-size:9px;line-height:1.3;margin-top:3px}.permission button{height:37px;border:0;border-radius:12px;background:var(--o);color:#101114;font-size:10px;font-weight:900;padding:0 12px}
.search-card{position:absolute;z-index:14;left:12px;right:12px;top:max(70px,calc(env(safe-area-inset-top) + 62px));border:1px solid var(--line);border-radius:24px;background:rgba(13,15,19,.93);backdrop-filter:blur(26px);box-shadow:0 20px 48px rgba(0,0,0,.32);padding:7px;transition:.25s}.location-row{min-height:51px;display:grid;grid-template-columns:28px 1fr 40px;align-items:center;gap:4px}.location-row+.location-row{border-top:1px solid rgba(255,255,255,.07)}.pin{display:grid;place-items:center}.pin i{position:relative;width:14px;height:14px;border-radius:50%;background:linear-gradient(145deg,#fff,#dfe4ec);box-shadow:0 0 0 4px rgba(255,255,255,.08),0 6px 14px rgba(0,0,0,.22)}.pin i:after{content:'';position:absolute;inset:4px;border-radius:50%;background:#14181d}.pin.end i{background:linear-gradient(145deg,#ffb98a,#5B5CE2);box-shadow:0 0 0 4px rgba(255,107,24,.13),0 6px 14px rgba(0,0,0,.22)}.pin.end i:after{content:'';position:absolute;inset:3px;background:#121419;border-radius:4px;clip-path:polygon(0 0,100% 0,100% 72%,48% 72%,35% 100%,35% 72%,0 72%)}.location-input{width:100%;min-width:0;border:0;background:transparent;outline:0;color:#fff;font-size:14px;font-weight:720;padding:13px 3px}.location-input::placeholder{color:#747c88;font-weight:600}.row-btn{width:38px;height:38px;border:0;border-radius:12px;background:transparent;color:#aeb5bf;display:grid;place-items:center}.row-btn:active{background:#24282f}
.search-results{display:none;position:absolute;left:6px;right:6px;top:calc(100% + 8px);max-height:44vh;overflow:auto;border:1px solid var(--line);border-radius:20px;background:#111318;box-shadow:0 22px 52px rgba(0,0,0,.48);padding:6px}.search-results.show{display:block}.search-label{padding:8px 10px 5px;color:#6f7782;font-size:9px;font-weight:850;letter-spacing:.09em;text-transform:uppercase}.search-item{display:grid;grid-template-columns:40px 1fr auto;gap:9px;align-items:center;padding:9px;border-radius:15px;cursor:pointer}.search-item:active{background:#22262d}.result-icon{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#20242a;color:var(--o2)}.result-copy{min-width:0}.result-copy b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-copy small{display:block;margin-top:3px;color:#7f8793;font-size:9px}.result-meta{font-size:9px;color:#6f7782}.search-message{padding:16px;text-align:center;color:#9199a5;font-size:11px}
.status-chip{position:absolute;z-index:9;left:12px;top:198px;max-width:60%;height:36px;padding:0 11px;border:1px solid var(--line);border-radius:999px;background:rgba(12,14,17,.82);backdrop-filter:blur(18px);display:flex;align-items:center;gap:7px;color:#c8cdd4;font-size:9px;font-weight:760;box-shadow:0 10px 28px rgba(0,0,0,.18)}.status-chip .dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(75,212,154,.1)}.status-chip span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.map-tools{position:absolute;z-index:10;right:12px;top:198px;display:flex;flex-direction:column;gap:8px}.map-btn{width:46px;height:46px;border:1px solid var(--line);border-radius:16px;background:rgba(12,14,17,.86);backdrop-filter:blur(20px);display:grid;place-items:center;color:#fff;text-decoration:none;box-shadow:0 12px 30px rgba(0,0,0,.21);cursor:pointer}.map-btn.active{background:var(--o);color:#101114}.map-btn:active{transform:scale(.96)}
.gps-quality{position:absolute;z-index:10;right:68px;top:204px;height:32px;padding:0 9px;border-radius:999px;border:1px solid var(--line);background:rgba(12,14,17,.82);backdrop-filter:blur(18px);display:none;align-items:center;gap:6px;color:#c8cdd4;font-size:9px;font-weight:800}.gps-quality.show{display:flex}.gps-bars{display:flex;align-items:flex-end;gap:2px;height:10px}.gps-bars i{width:2px;border-radius:2px;background:#69717c}.gps-bars i:nth-child(1){height:4px}.gps-bars i:nth-child(2){height:7px}.gps-bars i:nth-child(3){height:10px}.gps-bars.good i{background:var(--green)}.gps-bars.mid i:nth-child(-n+2){background:#f1b94d}
.sheet{position:absolute;z-index:18;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));border:1px solid var(--line);border-radius:34px;background:linear-gradient(180deg,rgba(17,19,23,.955),rgba(9,11,14,.975));backdrop-filter:blur(32px) saturate(125%);box-shadow:0 -16px 54px rgba(0,0,0,.36);padding:8px 12px 12px;transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .25s}.sheet.hidden{transform:translateY(calc(100% + 30px));opacity:0;pointer-events:none}.grab{width:42px;height:4px;border-radius:999px;background:#444b55;margin:2px auto 11px}.welcome{padding:0 2px 3px}.welcome-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.welcome h1{font-size:19px;letter-spacing:-.65px;margin:0}.welcome p{font-size:10px;line-height:1.45;color:#858d99;margin:5px 0 0}.safety-orb{width:48px;height:48px;flex:0 0 48px;border-radius:17px;background:radial-gradient(circle at 32% 30%,#ffb184,var(--o) 60%,#d94f00);display:grid;place-items:center;color:#17120f;box-shadow:0 10px 25px rgba(255,107,24,.22)}
.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:11px}.quick{border:1px solid #292e35;background:#14171b;border-radius:16px;padding:10px 8px;text-align:left;color:#fff;min-height:67px;cursor:pointer}.quick:active{background:#1c2026}.quick i{color:var(--o2);margin-bottom:7px}.quick b{display:block;font-size:10px}.quick span{display:block;margin-top:3px;color:#7c8490;font-size:8px;line-height:1.25}.route-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:0 2px 8px}.route-head h2{font-size:18px;letter-spacing:-.55px;margin:0}.route-head p{font-size:9px;color:#808894;margin:4px 0 0}.route-time{font-size:26px;font-weight:920;letter-spacing:-1.2px;white-space:nowrap}.route-time small{display:block;font-size:9px;color:#7d8591;letter-spacing:0;text-align:right;font-weight:650}
.segment{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:4px;border:1px solid #272c33;border-radius:15px;background:#101216}.segment button{height:38px;border:0;border-radius:11px;background:transparent;color:#8f97a3;font-size:10px;font-weight:850;display:flex;align-items:center;justify-content:center;gap:6px}.segment button.active{background:#252930;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.18)}.segment button.active.safe{color:#77e0ad}.segment button.active.fast{color:#ff9a61}.segment button.active.smart{color:#9cc5ff}.segment button.smart{display:none}.travel{display:flex;gap:6px;margin-top:7px}.travel button{flex:1;height:38px;border:1px solid #282d34;border-radius:13px;background:#121419;color:#8e96a1;font-size:9px;font-weight:820;display:flex;align-items:center;justify-content:center;gap:5px}.travel button.active{background:rgba(255,107,24,.12);border-color:rgba(255,107,24,.38);color:#ff9b64}.route-card{margin-top:9px;border:1px solid #2a2f37;border-radius:18px;background:#121419;padding:12px}.route-card-top{display:flex;justify-content:space-between;gap:12px}.route-card h3{margin:0;font-size:12px}.route-card .score{margin-top:5px;font-size:10px;color:#75dda9;font-weight:850}.route-card .mins{font-size:20px;font-weight:920}.route-card-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px;font-size:9px;color:#8a929e}.route-card-meta span{padding:5px 7px;border-radius:999px;background:#1a1d22;border:1px solid #282d34}.primary{width:100%;height:52px;margin-top:10px;border:0;border-radius:18px;background:linear-gradient(135deg,var(--o),#ff9051);color:#111;font-size:13px;font-weight:920;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 12px 30px rgba(255,107,24,.22)}.primary:active{transform:scale(.987)}.primary:disabled{opacity:.48}.sub-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:7px}.sub-action{height:40px;border:1px solid #292e35;border-radius:14px;background:#14171b;color:#aeb5bf;font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:6px}.disclaimer{text-align:center;color:#6f7782;font-size:8px;line-height:1.35;margin:8px 5px 0}

.safety-level{display:flex;align-items:center;gap:8px;margin-top:7px}.safety-level strong{font-size:11px}.safety-dots{display:flex;gap:3px}.safety-dots i{width:14px;height:5px;border-radius:99px;background:#2a2e34}.safety-dots i.on{background:linear-gradient(90deg,var(--o),#ff9a62)}.level-pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 8px;background:rgba(255,104,23,.1);border:1px solid rgba(255,104,23,.2);color:#ffad7d;font-size:8px;font-weight:850}.traffic-line{margin-top:9px;display:flex;align-items:center;gap:7px;color:#8e96a1;font-size:8px}.traffic-bar{height:4px;flex:1;background:#252a30;border-radius:99px;overflow:hidden}.traffic-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#65d9a4,#f0bb58,#ff6d72)}.smart-note{margin-top:8px;padding:8px 9px;border-radius:12px;background:rgba(127,179,255,.07);border:1px solid rgba(127,179,255,.14);color:#a8caff;font-size:8px;line-height:1.4}.risk-note{margin-top:8px;padding:8px 9px;border-radius:12px;background:rgba(255,104,23,.07);border:1px solid rgba(255,104,23,.14);color:#ffad7d;font-size:8px;line-height:1.4}
.nav-panel{position:absolute;z-index:25;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));border:1px solid var(--line);border-radius:29px;background:rgba(13,15,19,.97);backdrop-filter:blur(30px);box-shadow:0 -16px 55px rgba(0,0,0,.4);padding:8px 12px 12px;transform:translateY(calc(100% + 35px));opacity:0;pointer-events:none;transition:.3s cubic-bezier(.2,.8,.2,1)}.nav-panel.show{transform:none;opacity:1;pointer-events:auto}.maneuver{display:grid;grid-template-columns:50px 1fr auto;align-items:center;gap:10px}.maneuver-icon{width:50px;height:50px;border-radius:17px;background:linear-gradient(145deg,var(--o),#ff955d);color:#111;display:grid;place-items:center}.maneuver-copy{min-width:0}.maneuver-copy b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.maneuver-copy span{display:block;margin-top:4px;color:#8c949f;font-size:9px}.remaining{font-size:26px;font-weight:930;letter-spacing:-1.1px;text-align:right}.remaining small{display:block;font-size:8px;color:#7f8793;letter-spacing:0;font-weight:650}.nav-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:10px}.nav-stat{min-width:0;border:1px solid #272c33;background:#121419;border-radius:14px;padding:9px 5px;text-align:center}.nav-stat strong{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-stat span{display:block;color:#727a86;font-size:7px;margin-top:3px}.progress{height:4px;border-radius:999px;background:#252a31;overflow:hidden;margin:10px 2px 0}.progress>div{height:100%;width:0;background:linear-gradient(90deg,#fff,var(--o));border-radius:999px;transition:width .3s}.nav-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-top:9px}.nav-action{height:41px;border:1px solid #292e35;border-radius:14px;background:#15181c;color:#afb6c0;font-size:8px;font-weight:830;display:flex;align-items:center;justify-content:center;gap:5px}.nav-action.active{color:#5B5CE2;border-color:rgba(255,107,24,.35);background:rgba(255,107,24,.09)}.nav-action.danger{color:#ff878b}.reroute{display:none;margin-top:8px;padding:8px 10px;border-radius:12px;border:1px solid rgba(255,176,72,.24);background:rgba(255,176,72,.08);color:#f0bc6a;font-size:9px;font-weight:750}.reroute.show{display:flex;align-items:center;gap:7px}
.toast{position:absolute;z-index:50;left:50%;top:max(14px,env(safe-area-inset-top));width:calc(100% - 36px);max-width:460px;transform:translate(-50%,-140%);padding:11px 13px;border:1px solid #30353d;border-radius:15px;background:#16191e;color:#fff;font-size:10px;font-weight:750;box-shadow:0 16px 42px rgba(0,0,0,.4);transition:.28s}.toast.show{transform:translate(-50%,0)}
.user-marker{position:relative;width:34px;height:34px;display:grid;place-items:center}.user-marker .pulse{position:absolute;width:46px;height:46px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.12),rgba(255,255,255,.02) 70%,transparent 72%);animation:pulse 2s ease-out infinite}.user-marker .ring{position:absolute;width:30px;height:30px;border-radius:50%;border:2px solid rgba(255,255,255,.68);box-shadow:0 0 0 2px rgba(15,17,21,.36)}.user-marker .core{position:relative;width:16px;height:16px;border-radius:50%;background:linear-gradient(145deg,#fefefe,#d9dee6);border:3px solid #11151a;box-shadow:0 0 0 2px rgba(255,255,255,.84),0 9px 22px rgba(0,0,0,.5)}.user-marker .heading{position:absolute;width:40px;height:40px;left:-3px;top:-3px;transform-origin:50% 50%;opacity:0;transition:opacity .2s}.user-marker .heading:before{content:'';position:absolute;left:50%;top:0;transform:translateX(-50%);width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:14px solid #fff;filter:drop-shadow(0 4px 8px rgba(0,0,0,.28))}.user-marker.has-heading .heading{opacity:.96}.user-marker .heading:after{content:'';position:absolute;left:50%;top:13px;transform:translateX(-50%);width:2px;height:10px;border-radius:99px;background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,0))}@keyframes pulse{0%{transform:scale(.6);opacity:.66}70%,100%{transform:scale(1.38);opacity:0}}
.token-overlay{position:absolute;z-index:100;inset:0;background:rgba(5,6,8,.92);backdrop-filter:blur(20px);display:grid;place-items:center;padding:22px}.token-card{border:1px solid #30353d;border-radius:25px;background:#15181d;padding:25px;max-width:430px;color:#fff}.token-card h2{margin:14px 0 7px}.token-card p{color:#939ba6;font-size:12px;line-height:1.55}.token-card code{display:block;margin-top:12px;padding:11px;border-radius:12px;background:#0d0f12;color:#ff9c65;font-size:10px;overflow:auto}
.body-nav .header,.body-nav .search-card,.body-nav .status-chip{opacity:0;pointer-events:none}.body-nav .map-tools{top:max(12px,env(safe-area-inset-top))}.body-nav .gps-quality{top:max(19px,calc(env(safe-area-inset-top) + 7px));right:68px}.body-nav .mapboxgl-ctrl-bottom-right{bottom:236px}
.loading{width:17px;height:17px;border:2px solid rgba(255,255,255,.22);border-top-color:#fff;border-radius:50%;animation:spin .75s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(min-width:601px){body{background:radial-gradient(circle at 50% 15%,#171b22,#030405 58%)}.ws-app{border-left:1px solid #1d2127;border-right:1px solid #1d2127}}
@media(max-height:690px){.welcome p,.quick span,.disclaimer{display:none}.quick{min-height:53px}.quick i{margin-bottom:4px}.sheet{padding-bottom:9px}.search-card{top:max(65px,calc(env(safe-area-inset-top) + 57px))}.status-chip,.map-tools{top:188px}}

/* ============================================================
   WESAFE AURORA UI — premium mobile navigation shell
   ============================================================ */
:root{
  --o:#ff6a1a;--o-bright:#ff9b62;--o-soft:#ffb88e;--glass-0:rgba(8,10,13,.48);
  --glass-1:rgba(17,20,25,.64);--glass-2:rgba(18,21,27,.82);--glass-edge:rgba(255,255,255,.13);
  --glass-hi:rgba(255,255,255,.18);--shadow-premium:0 22px 70px rgba(0,0,0,.34),0 2px 0 rgba(255,255,255,.035) inset;
  --ease:cubic-bezier(.22,.82,.22,1)
}
.ws-app:before{content:"";position:absolute;z-index:1;inset:-22%;pointer-events:none;background:radial-gradient(circle at 85% 8%,rgba(255,111,31,.14),transparent 26%),radial-gradient(circle at 8% 72%,rgba(83,125,255,.08),transparent 28%);mix-blend-mode:screen}
.map-vignette{background:linear-gradient(180deg,rgba(4,6,8,.68) 0,rgba(4,6,8,.18) 19%,transparent 41%,transparent 68%,rgba(4,6,8,.22) 100%),radial-gradient(circle at 50% 35%,transparent 46%,rgba(0,0,0,.12) 100%)}
.ambient-halo{position:absolute;z-index:3;inset:0;pointer-events:none;opacity:.72;transition:opacity .35s var(--ease),background .35s var(--ease);background:radial-gradient(circle at 50% 54%,transparent 0 56%,rgba(78,217,158,.035) 80%,rgba(78,217,158,.08) 100%)}
.ambient-halo.attention{background:radial-gradient(circle at 50% 54%,transparent 0 54%,rgba(255,159,73,.05) 78%,rgba(255,107,26,.13) 100%)}
.ambient-halo.elevated{background:radial-gradient(circle at 50% 54%,transparent 0 52%,rgba(255,85,91,.07) 75%,rgba(255,85,91,.16) 100%)}

/* glass material */
.header,.search-card,.status-chip,.map-btn,.gps-quality,.sheet,.nav-panel,.permission,.search-results,.toast{backdrop-filter:blur(28px) saturate(150%);-webkit-backdrop-filter:blur(28px) saturate(150%)}
.header{top:max(12px,env(safe-area-inset-top));left:12px;right:12px;min-height:58px;padding:5px;border:1px solid var(--glass-edge);border-radius:23px;background:linear-gradient(145deg,rgba(22,25,31,.74),rgba(8,10,13,.58));box-shadow:var(--shadow-premium);overflow:hidden}
.header:before,.search-card:before,.sheet:before,.nav-panel:before{content:"";position:absolute;left:9%;right:9%;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);pointer-events:none}
.brand{height:47px;padding:0 10px 0 5px;border:0;background:transparent;box-shadow:none;backdrop-filter:none;position:relative}
.brand-logo{width:39px;height:39px;border-radius:15px;background:linear-gradient(145deg,#ffb17e 0%,#ff7a2c 40%,#ff5f0f 100%);color:#0e1013;box-shadow:0 12px 26px rgba(255,93,14,.26),inset 0 1px 0 rgba(255,255,255,.42)}
.brand-copy b{font-size:15px;letter-spacing:-.55px;font-weight:900}.brand-copy span{font-size:8px;letter-spacing:.02em;color:#aab1bc}.brand-copy .product-tag{color:#ffac7d;font-weight:850}
.header-actions{gap:5px}.icon-btn{width:45px;height:45px;border:0;background:rgba(255,255,255,.035);border-radius:16px;box-shadow:none;transition:.2s var(--ease)}.icon-btn:hover,.icon-btn:active{background:rgba(255,255,255,.09);transform:scale(.96)}
.nav-alert-dot{position:absolute;width:7px;height:7px;border-radius:50%;background:#ff7357;right:9px;top:8px;border:2px solid #15181d;box-shadow:0 0 0 4px rgba(255,98,69,.08)}

.search-card{top:max(82px,calc(env(safe-area-inset-top) + 72px));left:12px;right:12px;padding:7px;border-radius:26px;border:1px solid var(--glass-edge);background:linear-gradient(160deg,rgba(20,23,29,.82),rgba(10,12,15,.67));box-shadow:0 24px 62px rgba(0,0,0,.3);overflow:visible}
.location-row{min-height:55px;grid-template-columns:31px 1fr 42px}.location-row+.location-row{border-top:1px solid rgba(255,255,255,.075)}
.pin{position:relative}.pin:after{content:"";position:absolute;width:1px;height:37px;top:22px;background:linear-gradient(rgba(255,255,255,.18),rgba(255,106,26,.18));left:50%;transform:translateX(-50%)}.location-row:last-of-type .pin:after{display:none}
.pin i{width:9px;height:9px;background:#f5f7fb;box-shadow:0 0 0 5px rgba(255,255,255,.07),0 0 18px rgba(255,255,255,.25)}.pin.end i{background:var(--o);box-shadow:0 0 0 5px rgba(255,106,26,.11),0 0 19px rgba(255,106,26,.26)}
.location-input{font-size:14px;font-weight:760;letter-spacing:-.18px}.location-input::placeholder{color:#7f8792}
.row-btn{border-radius:14px;background:rgba(255,255,255,.035);transition:.2s var(--ease)}.row-btn:active{background:rgba(255,255,255,.10);transform:scale(.95)}
.search-results{top:calc(100% + 10px);border-radius:24px;border-color:var(--glass-edge);background:rgba(13,16,21,.94);padding:8px;box-shadow:0 28px 70px rgba(0,0,0,.46)}
.search-item{border:1px solid transparent;border-radius:17px;padding:10px;transition:.18s var(--ease)}.search-item:active{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.06)}.result-icon{background:linear-gradient(145deg,rgba(255,106,26,.14),rgba(255,255,255,.035));border:1px solid rgba(255,106,26,.16)}

.status-chip{top:215px;left:12px;height:38px;border-color:var(--glass-edge);background:rgba(13,16,20,.67);box-shadow:0 12px 30px rgba(0,0,0,.15);padding:0 12px;font-size:9px}.status-chip .dot{background:#65e0a9;box-shadow:0 0 0 4px rgba(101,224,169,.09),0 0 14px rgba(101,224,169,.28)}
.map-tools{top:215px;right:12px;gap:8px}.map-btn{width:48px;height:48px;border-radius:17px;border:1px solid var(--glass-edge);background:rgba(13,16,20,.70);box-shadow:0 13px 34px rgba(0,0,0,.19);transition:.18s var(--ease)}.map-btn.active{background:linear-gradient(145deg,#ff995a,#4E50D8);border-color:rgba(255,255,255,.15);color:#101216;box-shadow:0 10px 26px rgba(255,104,23,.23)}.map-btn:active{transform:scale(.94)}
.gps-quality{top:222px;right:71px;border-color:var(--glass-edge);background:rgba(13,16,20,.7)}

/* premium planning sheet */
.sheet{left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));border-radius:35px;border:1px solid var(--glass-edge);background:linear-gradient(175deg,rgba(24,28,34,.86) 0%,rgba(11,13,17,.93) 72%);box-shadow:0 -18px 70px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.055);padding:8px 12px 12px;overflow:hidden}
.sheet:after{content:"";position:absolute;right:-40px;top:-80px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,rgba(255,105,25,.10),transparent 68%);pointer-events:none}
.grab{width:34px;height:4px;background:rgba(255,255,255,.24);margin-top:3px;margin-bottom:12px}
.welcome{position:relative;z-index:1}.welcome h1{font-size:21px;line-height:1.05;letter-spacing:-.85px;font-weight:900}.welcome p{font-size:10px;line-height:1.5;max-width:330px;color:#949ca7}.safety-orb{width:52px;height:52px;flex-basis:52px;border-radius:19px;background:linear-gradient(145deg,#ffc098 0%,#ff7b30 48%,#f15400 100%);box-shadow:0 13px 29px rgba(255,94,10,.22),inset 0 1px 0 rgba(255,255,255,.5)}
.hero-kicker{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 8px;margin-bottom:8px;border:1px solid rgba(101,224,169,.16);border-radius:999px;background:rgba(101,224,169,.065);color:#86e8bb;font-size:8px;font-weight:850;letter-spacing:.03em}.hero-kicker i{width:6px;height:6px;border-radius:50%;background:#65e0a9;box-shadow:0 0 12px #65e0a9}
.quick-grid{grid-template-columns:repeat(4,1fr);gap:7px}.quick{position:relative;min-height:72px;padding:10px 7px;border-radius:18px;border-color:rgba(255,255,255,.08);background:linear-gradient(150deg,rgba(255,255,255,.055),rgba(255,255,255,.018));overflow:hidden;transition:.18s var(--ease)}.quick:before{content:"";position:absolute;inset:0;background:linear-gradient(125deg,rgba(255,255,255,.08),transparent 35%);opacity:.45;pointer-events:none}.quick:active{transform:scale(.97);background:rgba(255,255,255,.07)}.quick i{color:#ffac7d}.quick b{font-size:9px}.quick span{font-size:7px}.quick.special i{color:#9bc0ff}

.route-head h2{font-size:19px;font-weight:900}.route-time{font-size:28px}.segment{padding:4px;border-radius:17px;border-color:rgba(255,255,255,.08);background:rgba(4,6,8,.38)}.segment button{height:40px;border-radius:13px}.segment button.active{background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.045));box-shadow:0 7px 18px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.08)}
.travel button{border-color:rgba(255,255,255,.075);background:rgba(255,255,255,.025);border-radius:14px}.travel button.active{background:rgba(255,106,26,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.route-card{border-color:rgba(255,255,255,.09);border-radius:21px;background:linear-gradient(150deg,rgba(255,255,255,.052),rgba(255,255,255,.018));padding:13px;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.route-insight{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-top:9px}.insight{border:1px solid rgba(255,255,255,.07);border-radius:13px;background:rgba(255,255,255,.025);padding:8px}.insight strong{display:block;font-size:10px}.insight span{display:block;margin-top:3px;font-size:7px;color:#777f8b}
.primary{height:54px;border-radius:19px;background:linear-gradient(135deg,#ff9d62 0%,#5B5CE2 50%,#f35300 100%);box-shadow:0 15px 36px rgba(255,93,10,.23),inset 0 1px 0 rgba(255,255,255,.42);letter-spacing:-.1px}.sub-action{border-radius:15px;background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.075)}

/* navigation glass */
.nav-panel{border-radius:33px;border-color:var(--glass-edge);background:linear-gradient(170deg,rgba(24,28,34,.90),rgba(9,11,14,.96));box-shadow:0 -22px 72px rgba(0,0,0,.41),inset 0 1px 0 rgba(255,255,255,.05)}
.maneuver-icon{border-radius:19px;background:linear-gradient(145deg,#ffb080,#5B5CE2 58%,#ef5000);box-shadow:0 12px 28px rgba(255,96,12,.22),inset 0 1px 0 rgba(255,255,255,.4)}
.nav-stat{border-color:rgba(255,255,255,.07);background:rgba(255,255,255,.027);border-radius:15px}.progress{height:5px;background:rgba(255,255,255,.07)}.progress>div{background:linear-gradient(90deg,#fff,#ffb184 48%,#ff6a1a)}.nav-action{border-color:rgba(255,255,255,.075);background:rgba(255,255,255,.026);border-radius:15px}
.permission{border-color:rgba(255,173,117,.2);background:linear-gradient(145deg,rgba(30,24,21,.96),rgba(13,15,19,.96));box-shadow:0 22px 60px rgba(0,0,0,.44)}.permission button{background:linear-gradient(135deg,#ffad75,#4E50D8);box-shadow:0 9px 22px rgba(255,104,23,.2)}
.user-marker .core{width:17px;height:17px;border:3px solid #0e1115;box-shadow:0 0 0 2px rgba(255,255,255,.85),0 7px 21px rgba(0,0,0,.5)}.user-marker .pulse{width:48px;height:48px;background:radial-gradient(circle,rgba(255,255,255,.12),rgba(255,255,255,.02) 68%,transparent 72%)}
.route-marker{position:relative;display:grid;place-items:center;filter:drop-shadow(0 10px 20px rgba(0,0,0,.34))}.route-marker.origin{width:28px;height:28px}.route-marker.origin .shell{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#fcfdff,#dce2ea);border:2px solid rgba(255,255,255,.32)}.route-marker.origin .shell:before{content:'';width:11px;height:11px;border-radius:50%;background:#0f1216;box-shadow:0 0 0 3px rgba(15,18,22,.12)}.route-marker.destination{width:30px;height:34px}.route-marker.destination .glow{position:absolute;bottom:2px;width:20px;height:10px;border-radius:50%;background:rgba(255,107,26,.18);filter:blur(6px)}.route-marker.destination svg{display:block}

.focus-mode .search-card,.focus-mode .status-chip,.focus-mode .header{opacity:0;pointer-events:none;transform:translateY(-12px)}.focus-mode .sheet{transform:translateY(calc(100% - 72px))}.focus-mode .map-tools{top:max(14px,env(safe-area-inset-top))}.focus-mode .gps-quality{top:max(20px,calc(env(safe-area-inset-top) + 6px))}
.header,.search-card,.status-chip,.sheet{transition:opacity .28s var(--ease),transform .28s var(--ease),background .28s var(--ease)}

@media(max-width:380px){.quick-grid{grid-template-columns:repeat(2,1fr)}.quick{min-height:58px}.quick span{display:none}.status-chip{max-width:58%}.brand-copy span{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
@media(max-height:720px){.quick-grid{grid-template-columns:repeat(4,1fr)}.quick{min-height:58px}.quick span{display:none}.welcome p{display:none}.sheet{padding-bottom:9px}}


/* VAIZO Navigation X */
.segment button.smart{position:relative;overflow:hidden;border:1px solid rgba(255,132,61,.18);color:#ffbb8e}
.segment button.smart em{font-style:normal;font-size:6px;line-height:1;padding:3px 4px;border-radius:999px;background:rgba(255,126,45,.13);border:1px solid rgba(255,137,73,.20);letter-spacing:.08em;color:#ffc6a3}
.segment button.smart::after{content:"";position:absolute;inset:-80% -35%;background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.16) 50%,transparent 58%);transform:translateX(-70%);pointer-events:none}
.segment button.smart.active{color:#fff4ed!important;background:linear-gradient(135deg,rgba(255,95,18,.82),rgba(255,139,70,.34))!important;border-color:rgba(255,150,88,.42);box-shadow:0 10px 28px rgba(255,94,18,.24),inset 0 1px 0 rgba(255,255,255,.20)!important}
.segment button.smart.active::after{animation:smartShine 2.6s ease-in-out infinite}
@keyframes smartShine{0%,55%{transform:translateX(-72%)}85%,100%{transform:translateX(72%)}}
.route-card.smart-selected{border-color:rgba(255,118,47,.34);background:linear-gradient(145deg,rgba(255,101,24,.09),rgba(18,20,25,.96) 48%);box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 14px 34px rgba(0,0,0,.18)}
.smart-note{position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(255,103,22,.12),rgba(127,179,255,.06));border-color:rgba(255,125,56,.22);color:#ffd1b5}
.smart-note b{color:#fff}.smart-note .live-dot{display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:#73e5ad;box-shadow:0 0 0 4px rgba(115,229,173,.09)}
.road-awareness{margin:8px 0 9px;display:grid;grid-template-columns:40px 1fr auto;gap:9px;align-items:center;padding:9px 10px;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018));backdrop-filter:blur(18px)}
.road-awareness-icon{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:rgba(255,107,24,.10);color:#ffab78;border:1px solid rgba(255,132,65,.13)}
.road-awareness-copy{min-width:0}.road-awareness-copy small{display:block;color:#777f8b;font-size:7px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.road-awareness-copy b{display:block;margin-top:3px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.road-awareness-copy span{display:block;margin-top:2px;color:#868e9a;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.speed-sign{min-width:44px;height:44px;padding:0 6px;border-radius:50%;display:grid;place-items:center;background:#f5f6f7;color:#111;border:4px solid #e25757;font-size:12px;font-weight:950;box-shadow:0 6px 18px rgba(0,0,0,.25)}.speed-sign.unknown{border-color:#4c535e;background:#171a1f;color:#8d95a0;font-size:9px}
.road-data-note{font-size:7px;color:#676f7a;margin:6px 3px 0;line-height:1.35}
.nav-panel .remaining{min-width:68px}.nav-panel .remaining.long{font-size:18px;letter-spacing:-.5px}
.map-road-dot{pointer-events:none}

@media(max-height:720px){.road-awareness{margin:6px 0 7px;padding:7px 8px}.road-awareness-icon{width:34px;height:34px;border-radius:11px}.speed-sign{min-width:38px;height:38px;border-width:3px}.nav-stats{margin-top:7px}.nav-actions{margin-top:7px}.road-awareness-copy span{display:none}}

/* VAIZO clean routing UI */
:root{--glass-bg:rgba(12,14,17,.84);--glass-line:rgba(255,255,255,.09)}
.ws-app{max-width:620px;background:#07090b}
.header{top:max(9px,env(safe-area-inset-top));left:10px;right:10px}.brand-clean{height:44px;padding:0 14px;border-radius:15px;background:rgba(10,12,15,.72);box-shadow:0 10px 30px rgba(0,0,0,.18)}.brand-clean .brand-copy b{font-size:17px;letter-spacing:-.7px}.brand-clean .brand-copy span{font-size:8px;color:#9aa1ab}.brand-logo{display:none}
.icon-btn,.map-btn{background:rgba(10,12,15,.72);border-color:rgba(255,255,255,.085);box-shadow:0 10px 26px rgba(0,0,0,.16)}
.search-card{background:rgba(11,13,16,.88);border-color:var(--glass-line);box-shadow:0 18px 44px rgba(0,0,0,.28);border-radius:22px}.location-input{font-size:14px}.status-chip,.gps-quality{background:rgba(10,12,15,.72);border-color:var(--glass-line)}
.sheet,.nav-panel{background:linear-gradient(180deg,rgba(16,18,22,.93),rgba(9,11,14,.97));border-color:var(--glass-line);box-shadow:0 -16px 48px rgba(0,0,0,.32);border-radius:28px}.welcome h1{font-size:21px}.welcome p{max-width:420px;font-size:10px}.safety-orb{display:none}
.quick-grid{grid-template-columns:repeat(4,1fr);gap:6px}.quick{min-height:62px;padding:9px 7px;border-radius:14px;background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.07)}.quick b{font-size:9px}.quick span{font-size:7px}.quick i{margin-bottom:6px}
.segment{border-color:rgba(255,255,255,.075);background:rgba(0,0,0,.18)}.segment button{height:40px}.segment button.active{background:rgba(255,255,255,.075);box-shadow:none}.segment button.smart.active{background:rgba(255,107,24,.14)!important;border-color:rgba(255,124,54,.28)!important;box-shadow:none!important;color:#ffd5bd!important}
.route-card{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.075)}.route-card.smart-selected{box-shadow:none}.primary{height:50px;border-radius:16px;box-shadow:0 10px 24px rgba(255,94,14,.16)}.sub-action{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.07)}
.road-awareness{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.065)}.nav-stat{background:rgba(255,255,255,.02);border-color:rgba(255,255,255,.065)}
.traffic-live-row{display:flex;align-items:center;gap:7px;margin:8px 2px 0;color:#8f97a2;font-size:8px;font-weight:760}.traffic-live-dot{width:7px;height:7px;border-radius:50%;background:#55d7a0;box-shadow:0 0 0 4px rgba(85,215,160,.08)}
.traffic-suggestion{display:none;margin-top:9px;padding:10px;border:1px solid rgba(255,141,78,.2);border-radius:17px;background:linear-gradient(145deg,rgba(255,107,24,.10),rgba(255,255,255,.025))}.traffic-suggestion.show{display:block}.traffic-suggestion-main{display:grid;grid-template-columns:38px 1fr;gap:9px;align-items:center}.traffic-suggestion-icon{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;color:#ffab78;background:rgba(255,107,24,.11);border:1px solid rgba(255,139,73,.14)}.traffic-suggestion-main small{display:block;color:#ffaf80;font-size:7px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.traffic-suggestion-main b{display:block;margin-top:2px;font-size:11px}.traffic-suggestion-main span{display:block;margin-top:3px;color:#8d95a0;font-size:8px;line-height:1.35}.traffic-suggestion-actions{display:grid;grid-template-columns:1.35fr 1fr;gap:6px;margin-top:9px}.traffic-suggestion-actions button{height:38px;border-radius:12px;font-size:9px;font-weight:850}.traffic-accept{border:0;background:#5B5CE2;color:#121212}.traffic-dismiss{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:#aeb5bf}
.traffic-radar{position:fixed;left:12px;top:116px;z-index:24;display:none;align-items:center;gap:8px;max-width:min(330px,calc(100vw - 76px));padding:8px 10px;border-radius:15px;background:rgba(12,14,17,.91);border:1px solid rgba(255,102,47,.18);color:#eef1f4;box-shadow:0 10px 28px rgba(0,0,0,.22);pointer-events:none}.traffic-radar.show{display:flex}.traffic-radar-dot{width:8px;height:8px;border-radius:50%;background:#ff7848;box-shadow:0 0 0 4px rgba(255,120,72,.11);flex:0 0 auto}.traffic-radar.severe .traffic-radar-dot{background:#ff535e;box-shadow:0 0 0 4px rgba(255,83,94,.12)}.traffic-radar-copy{min-width:0}.traffic-radar-copy b{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.traffic-radar-copy span{display:block;margin-top:2px;color:#8f98a3;font-size:7.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.body-nav .traffic-radar{top:12px;left:12px;max-width:min(360px,calc(100vw - 24px))}@media(max-width:640px){.traffic-radar{left:8px;top:106px;max-width:calc(100vw - 64px);padding:7px 9px;border-radius:13px}.body-nav .traffic-radar{top:8px;left:8px;max-width:calc(100vw - 16px)}}
@media(max-width:390px){.quick-grid{grid-template-columns:repeat(2,1fr)}.quick{min-height:54px}.search-card{top:max(63px,calc(env(safe-area-inset-top) + 55px))}.status-chip,.map-tools{top:190px}}

/* ============================================================
   SPARK CLEAN MOTION 2.0 — quieter surfaces + navigation puck
   ============================================================ */
:root{--panel-bg:rgba(11,13,16,.88);--panel-border:rgba(255,255,255,.085);--panel-soft:rgba(255,255,255,.035)}
.ws-app{max-width:680px;background:#080a0d}
.ws-app:before{opacity:.34}
.map-vignette{background:linear-gradient(180deg,rgba(4,6,8,.42),rgba(4,6,8,.08) 24%,transparent 43%,transparent 72%,rgba(4,6,8,.16))}
.header{min-height:46px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;overflow:visible}
.header:before{display:none}.brand-clean{height:44px;padding:0 14px;border:1px solid var(--panel-border);border-radius:16px;background:rgba(10,12,15,.76);backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%);box-shadow:0 10px 28px rgba(0,0,0,.17)}
.brand-clean .brand-copy b{font-size:16px;letter-spacing:-.6px}.brand-clean .brand-copy span{font-size:8px;color:#9ca4af}
.header-actions .icon-btn{width:44px;height:44px;border:1px solid var(--panel-border);border-radius:16px;background:rgba(10,12,15,.76);backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%);box-shadow:0 10px 28px rgba(0,0,0,.17)}
.search-card{top:max(67px,calc(env(safe-area-inset-top) + 58px));left:10px;right:10px;padding:6px;border-radius:20px;border-color:var(--panel-border);background:var(--panel-bg);box-shadow:0 16px 40px rgba(0,0,0,.25)}
.search-card:before,.sheet:before,.nav-panel:before{opacity:.32}.location-row{min-height:50px}.location-input{font-size:13px;font-weight:740}.row-btn{width:37px;height:37px;border-radius:12px}.status-chip{top:177px;left:10px;height:33px;padding:0 10px;font-size:8px;background:rgba(10,12,15,.72);border-color:var(--panel-border)}
.map-tools{top:177px;right:10px}.map-btn{width:44px;height:44px;border-radius:15px;background:rgba(10,12,15,.74);border-color:var(--panel-border);box-shadow:0 10px 26px rgba(0,0,0,.16)}.gps-quality{top:183px;right:64px;height:30px}
.sheet{left:7px;right:7px;border-radius:27px;padding:7px 11px 11px;background:rgba(10,12,15,.94);border-color:var(--panel-border);box-shadow:0 -12px 42px rgba(0,0,0,.31)}.sheet:after{opacity:.35}.grab{width:30px;height:3px;margin-bottom:10px}.hero-kicker{height:22px;margin-bottom:7px}.welcome h1{font-size:20px}.welcome p{font-size:9px;max-width:390px}.quick-grid{gap:6px;margin-top:9px}.quick{min-height:59px;border-radius:14px;padding:8px 7px;background:var(--panel-soft);border-color:rgba(255,255,255,.065)}.quick:before{display:none}.quick i{margin-bottom:5px}.quick b{font-size:8px}.quick span{font-size:7px}
.route-head{padding-bottom:7px}.route-head h2{font-size:18px}.route-time{font-size:25px}.segment{border-radius:14px;padding:3px}.segment button{height:37px;border-radius:11px;font-size:9px}.travel{gap:5px}.travel button{height:35px;border-radius:12px}.route-card{border-radius:17px;padding:11px;background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.07)}.route-insight{margin-top:7px}.insight{border-radius:11px;padding:7px}.primary{height:48px;border-radius:15px}.sub-actions{gap:5px}.sub-action{height:37px;border-radius:12px}.disclaimer{font-size:7px;line-height:1.4;margin-top:7px}
.nav-panel{left:7px;right:7px;border-radius:26px;padding:7px 11px 11px;background:rgba(9,11,14,.95);border-color:var(--panel-border);box-shadow:0 -14px 46px rgba(0,0,0,.36)}.maneuver{grid-template-columns:46px 1fr auto;gap:9px}.maneuver-icon{width:46px;height:46px;border-radius:15px}.maneuver-copy b{font-size:12px}.remaining{font-size:24px}.traffic-live-row{margin-top:6px}.road-awareness{margin:7px 0;padding:8px 9px;border-radius:14px}.road-awareness-icon{width:37px;height:37px;border-radius:11px}.speed-sign{min-width:40px;height:40px;border-width:3px}.nav-stats{margin-top:7px;gap:4px}.nav-stat{padding:7px 4px;border-radius:12px}.nav-stat strong{font-size:10px}.nav-actions{margin-top:7px}.nav-action{height:38px;border-radius:12px}.progress{margin-top:7px}
.body-nav .map-tools{top:max(10px,env(safe-area-inset-top))}.body-nav .gps-quality{top:max(17px,calc(env(safe-area-inset-top) + 7px));right:62px}.body-nav .mapboxgl-ctrl-bottom-right{bottom:220px}

/* Navigation puck: compact, directional and readable over any map */
.user-marker{width:48px;height:48px;display:grid;place-items:center;filter:drop-shadow(0 8px 14px rgba(0,0,0,.35))}
.user-marker .pulse{width:58px;height:58px;background:radial-gradient(circle,rgba(255,120,49,.17) 0 21%,rgba(255,120,49,.07) 38%,transparent 68%);animation:puckPulse 2.15s ease-out infinite}
.user-marker .ring{width:38px;height:38px;border:1px solid rgba(255,255,255,.64);background:rgba(8,10,13,.60);box-shadow:0 0 0 3px rgba(8,10,13,.28),inset 0 1px 0 rgba(255,255,255,.10);backdrop-filter:blur(6px)}
.user-marker .core{width:25px;height:25px;border:0;border-radius:50%;background:linear-gradient(145deg,#ffb37f,#4E50D8 62%,#e94b00);box-shadow:0 0 0 2px rgba(255,255,255,.94),0 0 0 5px rgba(9,11,14,.76),0 8px 20px rgba(0,0,0,.42)}
.user-marker .core:before{content:"";position:absolute;left:50%;top:50%;width:7px;height:11px;transform:translate(-50%,-56%);clip-path:polygon(50% 0,100% 100%,50% 76%,0 100%);background:#111419;filter:drop-shadow(0 1px 0 rgba(255,255,255,.2))}
.user-marker .heading{width:48px;height:48px;left:0;top:0;transition:opacity .18s,transform .18s cubic-bezier(.2,.8,.2,1)}
.user-marker .heading:before{left:50%;top:-2px;border-left-width:5px;border-right-width:5px;border-bottom:10px solid rgba(255,255,255,.96);filter:drop-shadow(0 4px 8px rgba(0,0,0,.35))}.user-marker .heading:after{display:none}.user-marker.has-heading .heading{opacity:1}
.body-nav .user-marker .ring{border-color:rgba(255,255,255,.82)}.body-nav .user-marker .core{box-shadow:0 0 0 2px #fff,0 0 0 6px rgba(9,11,14,.82),0 9px 24px rgba(0,0,0,.46)}
@keyframes puckPulse{0%{transform:scale(.68);opacity:.72}70%,100%{transform:scale(1.26);opacity:0}}

/* Compact route tracking indicator shown only while navigating */
.nav-tracking{position:absolute;z-index:16;left:10px;top:max(10px,env(safe-area-inset-top));height:43px;max-width:calc(100% - 124px);display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid var(--panel-border);border-radius:15px;background:rgba(10,12,15,.78);backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%);box-shadow:0 10px 28px rgba(0,0,0,.17);opacity:0;transform:translateY(-8px);pointer-events:none;transition:.24s ease}
.body-nav .nav-tracking{opacity:1;transform:none}.nav-tracking-live{width:7px;height:7px;border-radius:50%;background:#61dda7;box-shadow:0 0 0 4px rgba(97,221,167,.09)}.nav-tracking-copy{min-width:0}.nav-tracking-copy b{display:block;font-size:9px;letter-spacing:-.1px}.nav-tracking-copy span{display:block;margin-top:2px;color:#858e99;font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-tracking-score{margin-left:auto;color:#ffad7c;font-size:9px;font-weight:900;white-space:nowrap}
@media(max-width:390px){.search-card{top:max(62px,calc(env(safe-area-inset-top) + 53px))}.status-chip,.map-tools{top:169px}.quick-grid{grid-template-columns:repeat(4,1fr)}.quick{min-height:54px}.quick span{display:none}.nav-tracking{max-width:calc(100% - 116px)}}



/* ============================================================
   SPARK NAVIGATION X2 — elevated tracking + predictive HUD
   ============================================================ */
.nav-camera-btn{display:none}.body-nav .nav-camera-btn{display:grid}.body-nav .map-tools{top:max(10px,env(safe-area-inset-top));gap:7px}
.maneuver-glyph{font-size:27px;font-weight:900;line-height:1;transform-origin:center;transition:transform .22s ease;filter:drop-shadow(0 2px 5px rgba(0,0,0,.18))}
.lane-guidance{display:none;margin:7px 0 0;padding:8px 10px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.022);align-items:center;gap:10px}.lane-guidance.show{display:flex}.lane-guidance>small{font-size:7px;font-weight:900;letter-spacing:.1em;color:#737c88;text-transform:uppercase;white-space:nowrap}.lane-items{display:flex;gap:4px;min-width:0;overflow:hidden}.lane{width:31px;height:31px;border-radius:10px;border:1px solid rgba(255,255,255,.07);background:#13161b;color:#59616c;display:grid;place-items:center;font-size:17px;font-weight:900;flex:0 0 31px}.lane.valid{color:#fff;background:rgba(255,107,24,.12);border-color:rgba(255,126,57,.28);box-shadow:inset 0 0 0 1px rgba(255,151,91,.05)}.lane.active{background:linear-gradient(145deg,#706DF2,#4E50D8);color:#111;border-color:transparent}
.risk-ahead{display:none;margin:7px 0 0;padding:8px 10px;border-radius:14px;border:1px solid rgba(255,184,89,.15);background:rgba(255,169,66,.055);grid-template-columns:34px 1fr auto;align-items:center;gap:8px}.risk-ahead.show{display:grid}.risk-ahead-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(255,166,57,.09);color:#ffc078}.risk-ahead-copy{min-width:0}.risk-ahead-copy small{display:block;font-size:7px;font-weight:900;text-transform:uppercase;letter-spacing:.09em;color:#c19b69}.risk-ahead-copy b{display:block;margin-top:2px;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.risk-ahead-copy span{display:block;margin-top:2px;font-size:7px;color:#868f9a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.risk-distance{font-size:9px;color:#ffc58c;font-weight:900;white-space:nowrap}
.nav-actions{grid-template-columns:repeat(4,1fr)}.nav-action{min-width:0;padding:0 3px}.nav-action.live-active{color:#80eab8;border-color:rgba(94,224,166,.28);background:rgba(94,224,166,.07)}
.route-ai{display:flex;align-items:center;gap:6px;margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.06);color:#8c95a1;font-size:8px}.route-ai b{color:#f4f6f8}.route-ai .spark-dot{width:6px;height:6px;border-radius:50%;background:#5B5CE2;box-shadow:0 0 0 4px rgba(255,107,24,.08)}
.body-nav .nav-panel{max-height:min(46vh,390px);overflow:auto;scrollbar-width:none}.body-nav .nav-panel::-webkit-scrollbar{display:none}
/* Smaller, sharper puck: the arrow is the main identity, the halo only supports GPS context. */
.user-marker{width:46px;height:46px}.user-marker .ring{width:37px;height:37px;background:rgba(10,12,15,.66);border:1px solid rgba(255,255,255,.75)}.user-marker .core{width:27px;height:27px;background:linear-gradient(145deg,#ff9d61,#4E50D8 65%,#e95000);box-shadow:0 0 0 2px rgba(255,255,255,.97),0 0 0 5px rgba(8,10,13,.82),0 9px 22px rgba(0,0,0,.46)}.user-marker .core:before{width:9px;height:15px;transform:translate(-50%,-54%);clip-path:polygon(50% 0,100% 100%,50% 76%,0 100%);background:#101318}.user-marker .pulse{width:61px;height:61px;background:radial-gradient(circle,rgba(255,112,33,.18) 0 19%,rgba(255,112,33,.06) 39%,transparent 68%)}
@media(max-height:740px){.risk-ahead,.lane-guidance{padding:6px 8px;margin-top:5px}.lane{width:27px;height:27px;flex-basis:27px}.body-nav .nav-panel{max-height:48vh}}



/* ============================================================
   SPARK X4 — Live Road context, traffic skin and mobile HUD
   ============================================================ */
.live-context-strip{display:none;margin:7px 0 0;padding:8px 9px;border-radius:14px;border:1px solid rgba(112,224,177,.11);background:linear-gradient(145deg,rgba(83,211,160,.045),rgba(255,255,255,.018));overflow:hidden}.body-nav .live-context-strip{display:block}.live-context-main{display:flex;align-items:center;gap:8px;min-width:0}.live-context-pulse{width:7px;height:7px;border-radius:50%;background:#65e1ad;box-shadow:0 0 0 4px rgba(101,225,173,.08);flex:0 0 auto}.live-context-main>div{min-width:0}.live-context-main small{display:block;color:#75d8b1;font-size:6.5px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.live-context-main b{display:block;margin-top:1px;font-size:8.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.live-context-chips{display:flex;gap:5px;margin-top:6px;overflow:hidden}.live-chip{min-width:0;max-width:38%;padding:4px 6px;border:1px solid rgba(255,255,255,.055);border-radius:8px;background:rgba(255,255,255,.025);color:#8d96a1;font-size:6.6px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.live-chip.good{color:#85dfb6;border-color:rgba(104,220,169,.13)}.live-chip.warn{color:#f5bf78;border-color:rgba(244,181,97,.15)}.live-chip.bad{color:#ff8c85;border-color:rgba(255,112,105,.16)}
.live-source-note{display:block;margin:5px 1px 0;color:#5f6873;font-size:6px;line-height:1.25}.live-source-note b{color:#747e8b}.body-nav .traffic-live-row{margin-top:6px}.mapboxgl-popup.live-road-popup .mapboxgl-popup-content{padding:9px 10px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(10,12,15,.96);color:#fff;box-shadow:0 14px 34px rgba(0,0,0,.35);font:inherit}.mapboxgl-popup.live-road-popup .mapboxgl-popup-tip{border-top-color:rgba(10,12,15,.96)}
@media(max-width:390px){.live-context-strip{padding:7px 8px}.live-context-chips{gap:4px}.live-chip{padding:4px 5px;font-size:6.2px}.body-nav .nav-panel{left:7px;right:7px}}
@media(max-height:720px){.live-context-strip{padding:6px 8px;margin-top:5px}.live-source-note{display:none}.live-context-chips{margin-top:4px}.body-nav .road-awareness{margin-top:5px}.body-nav .nav-panel{max-height:49vh}}

/* VAIZO route preview */
.sub-actions.preview-actions{grid-template-columns:1fr 1fr 1fr}.sub-action.previewing{color:#ff9c67;border-color:rgba(255,107,24,.34);background:rgba(255,107,24,.08)}@media(max-width:370px){.sub-actions.preview-actions{grid-template-columns:1fr 1fr}.sub-actions.preview-actions #previewRouteBtn{grid-column:1/-1}}

/* Segurança VAIZO */
.nav-safety-btn{display:none}.body-nav .nav-safety-btn{display:grid}.map-btn.safety-open{color:#8aebbc;border-color:rgba(97,221,167,.26);background:rgba(24,86,64,.42)}
.safety-drawer{position:absolute;z-index:39;left:9px;right:9px;top:max(62px,calc(env(safe-area-inset-top) + 52px));max-height:min(54vh,430px);overflow:auto;border:1px solid rgba(255,255,255,.095);border-radius:24px;background:rgba(9,11,14,.965);backdrop-filter:blur(30px) saturate(130%);-webkit-backdrop-filter:blur(30px) saturate(130%);box-shadow:0 22px 70px rgba(0,0,0,.46);padding:12px;opacity:0;transform:translateY(-10px) scale(.985);pointer-events:none;transition:.22s cubic-bezier(.2,.8,.2,1);scrollbar-width:none}.safety-drawer::-webkit-scrollbar{display:none}.safety-drawer.show{opacity:1;transform:none;pointer-events:auto}
.safety-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.safety-head small{display:block;color:#62dda8;font-size:7px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.safety-head h3{margin:3px 0 0;font-size:16px;letter-spacing:-.45px}.safety-close{width:34px;height:34px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:#15181d;color:#9da5b0;display:grid;place-items:center}.safety-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:11px}.safety-tool{min-height:66px;text-align:left;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:#12151a;color:#fff;padding:10px;display:grid;grid-template-columns:31px 1fr;gap:8px;align-items:center}.safety-tool i{width:31px;height:31px;padding:7px;border-radius:10px;background:rgba(255,255,255,.045);color:#b5bdc7}.safety-tool b{display:block;font-size:9px}.safety-tool span{display:block;margin-top:3px;color:#777f8b;font-size:7px;line-height:1.25}.safety-tool.live i{color:#7ee8b8;background:rgba(94,224,166,.075)}.safety-tool.emergency i{color:#ff8f91;background:rgba(255,93,100,.08)}
.support-results{display:none;margin-top:9px;border-top:1px solid rgba(255,255,255,.06);padding-top:9px}.support-results.show{display:block}.support-title{display:flex;align-items:center;justify-content:space-between;color:#8a929e;font-size:7px;text-transform:uppercase;letter-spacing:.09em;font-weight:900;margin-bottom:6px}.support-list{display:grid;gap:5px}.support-item{width:100%;border:1px solid rgba(255,255,255,.065);border-radius:13px;background:rgba(255,255,255,.025);color:#fff;padding:8px 9px;display:grid;grid-template-columns:1fr auto;gap:8px;text-align:left}.support-item b{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.support-item span{display:block;margin-top:2px;color:#7e8793;font-size:7px}.support-item strong{align-self:center;color:#a7e6c8;font-size:8px;white-space:nowrap}.safety-foot{margin:9px 3px 0;color:#626b77;font-size:7px;line-height:1.35}
.quick.pulse-on{border-color:rgba(255,112,85,.25);background:rgba(255,93,76,.07)}.quick.pulse-on i{color:#ff8274}.mapboxgl-map.safety-pulse-on{filter:saturate(1.05)}
@media(max-height:690px){.safety-drawer{top:max(54px,calc(env(safe-area-inset-top) + 44px));max-height:47vh}.safety-tool{min-height:58px;padding:8px}.safety-tool span{display:none}}


/* ============================================================
   SPARK X3 — MOBILE PRECISION / SEARCH / SAFETY
   ============================================================ */
.ws-app{max-width:520px}
.header{left:8px;right:8px;top:max(7px,env(safe-area-inset-top));gap:6px}.brand{height:44px;padding:0 11px;border-radius:15px}.brand-copy b{font-size:13px}.header-actions{gap:5px}.icon-btn{width:44px;height:44px;border-radius:15px;box-shadow:0 8px 24px rgba(0,0,0,.16)}.avatar{width:29px;height:29px;border-radius:10px}
.search-card{left:8px;right:8px;top:max(58px,calc(env(safe-area-inset-top) + 51px));padding:5px;border-radius:19px;box-shadow:0 16px 38px rgba(0,0,0,.27)}.location-row{min-height:47px;grid-template-columns:25px 1fr 36px;gap:2px}.location-input{font-size:13px;font-weight:760;padding:11px 2px;letter-spacing:-.18px}.row-btn{width:35px;height:35px;border-radius:11px}.row-btn:active,.row-btn:focus-visible{background:#20242a;color:#fff}.pin i{width:12px;height:12px}.pin.end i{border-radius:5px}
.search-results{left:2px;right:2px;top:calc(100% + 6px);max-height:min(48vh,410px);padding:5px;border-radius:17px;background:rgba(12,14,17,.985);box-shadow:0 18px 46px rgba(0,0,0,.5);overscroll-behavior:contain}.search-label{display:flex;justify-content:space-between;gap:8px;padding:7px 8px 5px;font-size:7px;letter-spacing:.11em}.search-label span{letter-spacing:0;text-transform:none;color:#565e69;font-weight:700}.search-item{width:100%;border:0;background:transparent;color:#fff;text-align:left;grid-template-columns:34px minmax(0,1fr) auto;gap:8px;padding:7px;border-radius:13px;min-height:56px}.search-item:active{background:#1d2127}.result-icon{width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.045);color:#aeb7c2}.result-icon.address{color:#ff9a61;background:rgba(255,104,23,.08)}.result-icon.street{color:#a9c8ff;background:rgba(104,158,255,.08)}.result-icon.postcode{color:#92e3bc;background:rgba(74,213,154,.07)}.result-copy b{font-size:11px;line-height:1.15;letter-spacing:-.15px}.result-address{display:block;margin-top:2px;color:#9aa2ad;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-copy small{margin-top:2px;font-size:7px;color:#69727d}.result-meta{padding:4px 5px;border-radius:999px;border:1px solid rgba(255,255,255,.07);font-size:6px;font-weight:900;letter-spacing:.05em;color:#7e8792}.result-meta.precise{color:#9be6c2;border-color:rgba(85,215,160,.16);background:rgba(85,215,160,.055)}.search-message{padding:14px 10px;font-size:9px}
.status-chip{left:8px;top:max(166px,calc(env(safe-area-inset-top) + 159px));height:31px;max-width:58%;padding:0 9px;font-size:8px}.map-tools{right:8px;top:max(166px,calc(env(safe-area-inset-top) + 159px));gap:6px}.map-btn{width:42px;height:42px;border-radius:14px}.gps-quality{right:56px;top:max(172px,calc(env(safe-area-inset-top) + 165px));height:28px;padding:0 8px;font-size:8px}
.sheet{left:6px;right:6px;bottom:max(6px,env(safe-area-inset-bottom));border-radius:28px;padding-left:10px;padding-right:10px}.quick-grid{gap:6px}.quick{border-radius:14px;padding:9px 7px}.sub-actions{gap:6px}.sub-action{border-radius:13px}
/* arrival marker: one strong silhouette, readable over buildings and road lines */
.route-marker.destination{width:44px;height:54px;filter:none}.arrival-shadow{position:absolute;left:50%;bottom:-1px;width:26px;height:9px;transform:translateX(-50%);border-radius:50%;background:rgba(0,0,0,.46);filter:blur(5px)}.arrival-pin{position:absolute;inset:0;display:block;filter:drop-shadow(0 9px 17px rgba(0,0,0,.38)) drop-shadow(0 2px 8px rgba(255,104,23,.18))}.arrival-pin svg,.arrival-pin img{display:block;width:44px;height:54px;object-fit:contain}
.safety-evidence{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:8px}.safety-evidence span{min-width:0;padding:7px 4px;border-radius:11px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.055);text-align:center}.safety-evidence b{display:block;font-size:10px;line-height:1;color:#f5f7f9}.safety-evidence small{display:block;margin-top:4px;font-size:6px;color:#69727e;text-transform:uppercase;letter-spacing:.055em}.risk-note{display:flex;align-items:flex-start;gap:6px}.risk-note svg{flex:0 0 auto;margin-top:1px}.route-ai{flex-wrap:wrap;line-height:1.35}
.body-nav .map-tools{right:8px;top:max(8px,env(safe-area-inset-top))}.body-nav .gps-quality{right:56px;top:max(14px,calc(env(safe-area-inset-top) + 6px))}
@media(max-width:390px){.header{left:7px;right:7px}.brand{height:42px;padding:0 9px}.icon-btn{width:42px;height:42px}.search-card{left:7px;right:7px;top:max(55px,calc(env(safe-area-inset-top) + 48px))}.location-row{min-height:45px}.location-input{font-size:12px}.status-chip,.map-tools{top:max(159px,calc(env(safe-area-inset-top) + 152px))}.gps-quality{top:max(165px,calc(env(safe-area-inset-top) + 158px))}.sheet{left:5px;right:5px}.safety-evidence{gap:4px}.safety-evidence span{padding:6px 2px}}
@media(max-width:340px){.brand-copy span{display:none}.brand{padding:0 10px}.search-card{top:max(54px,calc(env(safe-area-inset-top) + 47px))}.location-input{font-size:11.5px}.result-meta{display:none}.search-item{grid-template-columns:32px minmax(0,1fr)}.result-icon{width:32px;height:32px}.safety-evidence small{letter-spacing:0;font-size:5.5px}}


/* X9 uploaded WaySafe marker assets */
.user-marker.spark-uploaded-user{width:64px;height:64px;display:grid;place-items:center;filter:drop-shadow(0 9px 16px rgba(0,0,0,.38))}
.user-marker.spark-uploaded-user .pulse{position:absolute;width:66px;height:66px;border-radius:50%;background:radial-gradient(circle,rgba(255,104,23,.13) 0 24%,rgba(255,104,23,.05) 42%,transparent 70%);animation:puckPulse 2.2s ease-out infinite}
.user-marker.spark-uploaded-user .user-puck-image{position:relative;width:58px;height:58px;display:block;object-fit:contain;transform-origin:50% 50%;transition:transform .18s cubic-bezier(.2,.8,.2,1);will-change:transform}
.body-nav .user-marker.spark-uploaded-user{width:68px;height:68px}.body-nav .user-marker.spark-uploaded-user .user-puck-image{width:62px;height:62px}
.route-marker.destination{width:48px;height:58px}.arrival-pin svg,.arrival-pin img{width:48px!important;height:58px!important;object-fit:contain}.arrival-shadow{width:28px!important}

/* X10 Adaptive Routing + personalization */
.route-variants{display:flex;gap:6px;margin:7px 0 8px;overflow-x:auto;scrollbar-width:none;padding-bottom:1px}.route-variants::-webkit-scrollbar{display:none}.route-variant{flex:0 0 auto;min-width:86px;max-width:118px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.025);color:#aab1bb;border-radius:13px;padding:7px 9px;text-align:left}.route-variant.active{border-color:rgba(255,118,47,.34);background:rgba(255,107,24,.09);color:#fff}.route-variant b{display:block;font-size:10px}.route-variant span{display:block;margin-top:2px;font-size:6.5px;color:#737c88;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.route-variant.active span{color:#d39a79}.prefs-drawer{position:absolute;z-index:40;right:8px;top:max(58px,calc(env(safe-area-inset-top) + 50px));width:min(330px,calc(100% - 16px));border:1px solid rgba(255,255,255,.09);border-radius:22px;background:rgba(9,11,14,.97);backdrop-filter:blur(28px);box-shadow:0 20px 60px rgba(0,0,0,.45);padding:11px;opacity:0;transform:translateY(-8px) scale(.985);pointer-events:none;transition:.2s cubic-bezier(.2,.8,.2,1)}.prefs-drawer.show{opacity:1;transform:none;pointer-events:auto}.prefs-head{display:flex;align-items:flex-start;justify-content:space-between;gap:9px}.prefs-head small{display:block;color:#ff9d68;font-size:6.5px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.prefs-head h3{font-size:15px;margin:2px 0 0}.prefs-close{width:32px;height:32px;border-radius:10px;border:1px solid rgba(255,255,255,.07);background:#15181d;color:#a1a8b2}.prefs-list{display:grid;gap:6px;margin-top:10px}.pref-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:9px 10px;border:1px solid rgba(255,255,255,.055);border-radius:14px;background:rgba(255,255,255,.022)}.pref-row b{display:block;font-size:9px}.pref-row span{display:block;margin-top:2px;color:#727b87;font-size:7px;line-height:1.25}.pref-switch{appearance:none;width:36px;height:21px;border-radius:999px;background:#282d34;position:relative;transition:.18s}.pref-switch:before{content:"";position:absolute;width:15px;height:15px;left:3px;top:3px;border-radius:50%;background:#9aa2ad;transition:.18s}.pref-switch:checked{background:#e8621b}.pref-switch:checked:before{transform:translateX(15px);background:#fff}.prefs-foot{margin:8px 3px 0;color:#5f6873;font-size:6.5px;line-height:1.3}.route-alt-hidden{display:none!important}@media(max-width:360px){.route-variant{min-width:80px;padding:6px 8px}.prefs-drawer{right:6px;width:calc(100% - 12px)}}

/* X12 — draggable planning sheet + admin simulation */
.grab{position:relative;z-index:3;cursor:grab;touch-action:none;padding:8px 0;margin:-6px auto 3px;background-clip:content-box}.grab:active{cursor:grabbing}.sheet.sheet-dragging{transition:none!important}.sheet.sheet-collapsed{transform:translateY(calc(100% - 74px))!important}.sheet.sheet-collapsed .welcome,.sheet.sheet-collapsed #routeState{opacity:.16;pointer-events:none}.sheet.sheet-collapsed .grab{background:#717984}.sheet.sheet-collapsed:after{opacity:0}.admin-sim{width:100%;margin-top:7px;height:42px;border:1px solid rgba(255,122,47,.22);border-radius:14px;background:rgba(255,107,24,.07);color:#ff9c66;font-size:9px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:7px}.admin-sim.running{background:rgba(81,216,157,.08);border-color:rgba(81,216,157,.25);color:#7ee0ae}.sim-badge{position:absolute;z-index:36;left:50%;top:max(12px,env(safe-area-inset-top));transform:translateX(-50%);display:none;align-items:center;gap:7px;height:30px;padding:0 11px;border-radius:999px;border:1px solid rgba(255,122,47,.28);background:rgba(9,11,14,.9);font-size:8px;font-weight:900;color:#ff9d68;box-shadow:0 8px 24px rgba(0,0,0,.25)}.sim-badge.show{display:flex}.sim-badge i{width:7px;height:7px;border-radius:50%;background:#5B5CE2;box-shadow:0 0 0 5px rgba(255,107,24,.10);animation:puckPulse 1.5s infinite}

/* SPARK X13 — interaction + visual polish */
:root{--spark-ease:cubic-bezier(.22,.82,.24,1);--spark-hairline:rgba(255,255,255,.075)}
button{-webkit-tap-highlight-color:transparent}.map-btn,.quick,.sub-action,.nav-action,.segment button,.travel button,.primary{transition:transform .18s var(--spark-ease),background .2s var(--spark-ease),border-color .2s var(--spark-ease),box-shadow .2s var(--spark-ease),opacity .2s var(--spark-ease)}
button:focus-visible{outline:2px solid rgba(255,139,76,.92);outline-offset:2px}.sheet{border-radius:30px;background:linear-gradient(180deg,rgba(18,21,25,.965),rgba(8,10,13,.985));box-shadow:0 -18px 58px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.055)}
.grab{width:34px;height:4px;background:rgba(197,203,211,.36);box-shadow:0 1px 0 rgba(255,255,255,.07);transition:width .22s var(--spark-ease),background .22s var(--spark-ease),transform .22s var(--spark-ease)}.grab:hover,.grab:active{width:48px;background:rgba(235,238,242,.62)}
#routeState{scrollbar-width:none}#routeState::-webkit-scrollbar{display:none}.route-head{align-items:center}.route-head h2{letter-spacing:-.55px}.route-time{letter-spacing:-.9px}.segment{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.065)}.segment button.active{background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.045));box-shadow:inset 0 1px 0 rgba(255,255,255,.075)}
.route-card{box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}.route-variants{scrollbar-width:none}.route-variants::-webkit-scrollbar{display:none}.quick{position:relative;overflow:hidden}.quick:after{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(255,255,255,.035),transparent 55%);pointer-events:none}.quick:active,.sub-action:active,.map-btn:active,.nav-action:active{transform:scale(.97)}
.start-trip-cta{position:relative;z-index:4;min-height:56px;height:auto;padding:9px 11px 9px 10px;display:grid;grid-template-columns:38px 1fr 28px;align-items:center;gap:9px;text-align:left;background:linear-gradient(135deg,#ff9a5e 0%,#ff6d1c 46%,#f35600 100%);border:1px solid rgba(255,176,126,.28);box-shadow:0 13px 30px rgba(255,92,10,.23),inset 0 1px 0 rgba(255,255,255,.35)}.start-trip-cta:active{transform:scale(.985)}.start-trip-cta.is-starting{filter:saturate(.8);box-shadow:0 8px 20px rgba(255,92,10,.14)}.start-trip-icon{width:38px;height:38px;border-radius:12px;background:rgba(17,14,12,.13);display:grid;place-items:center;border:1px solid rgba(61,26,5,.12)}.start-trip-copy{display:block;min-width:0}.start-trip-copy b{display:block;font-size:12px;font-weight:950;letter-spacing:-.25px}.start-trip-copy small{display:block;margin-top:2px;font-size:7px;font-weight:760;color:rgba(31,20,13,.68);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.start-trip-arrow{justify-self:end;font-size:28px;line-height:1;font-weight:450;opacity:.58;transform:translateY(-1px)}
.nav-panel{background:linear-gradient(180deg,rgba(14,17,21,.975),rgba(7,9,12,.99));border-color:rgba(255,255,255,.075);box-shadow:0 -18px 62px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.045)}.maneuver-icon{box-shadow:0 8px 20px rgba(255,94,13,.16),inset 0 1px 0 rgba(255,255,255,.25)}.nav-stat{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.06)}.nav-action{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.065)}
@media(max-width:640px){.sheet{left:5px;right:5px;bottom:max(5px,env(safe-area-inset-bottom));padding:7px 10px 10px}.sheet:not(.sheet-collapsed) #routeState{max-height:min(58vh,515px);overflow-y:auto;padding-bottom:2px}.start-trip-cta{position:sticky;bottom:0;margin-top:9px;backdrop-filter:blur(16px)}.route-card{margin-top:7px}.route-insight{gap:4px}.insight{padding:7px 5px}.sub-actions{margin-top:6px}.welcome p{line-height:1.42}.nav-panel{left:5px;right:5px;bottom:max(5px,env(safe-area-inset-bottom));border-radius:27px}.body-nav .nav-panel{max-height:min(48vh,410px)}}
@media(max-width:380px){.start-trip-cta{grid-template-columns:34px 1fr 22px}.start-trip-icon{width:34px;height:34px}.start-trip-copy small{font-size:6.5px}.sheet:not(.sheet-collapsed) #routeState{max-height:56vh}}


/* SPARK X14 — minimal navigation + mobile performance */
.nav-compat{display:none!important}.body-nav .nav-tracking,.body-nav .gps-quality,.body-nav .map-tools{display:none!important}.nav-panel.nav-minimal{left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));padding:10px;border-radius:24px;background:rgba(10,12,15,.96);border:1px solid rgba(255,255,255,.09);box-shadow:0 -12px 34px rgba(0,0,0,.34);max-height:none!important;overflow:visible}.nav-primary-row{display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:center}.nav-direction-copy{min-width:0}.nav-direction-copy small{display:block;color:#777f89;font-size:7px;font-weight:900;letter-spacing:.12em}.nav-direction-copy b{display:block;margin-top:2px;font-size:15px;line-height:1.12;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-direction-copy span{display:block;margin-top:3px;color:#a2a9b2;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-essential-row{display:grid;grid-template-columns:minmax(62px,1fr) minmax(76px,1fr) 58px 78px;gap:6px;margin-top:9px}.nav-essential{height:46px;border-radius:13px;border:1px solid rgba(255,255,255,.065);background:rgba(255,255,255,.025);display:flex;flex-direction:column;justify-content:center;padding:0 9px;min-width:0}.nav-essential small{font-size:6.5px;font-weight:900;letter-spacing:.08em;color:#737b86}.nav-essential strong{font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-sos,.nav-cancel{height:46px;border-radius:13px;border:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:8px;font-weight:900}.nav-sos{background:rgba(255,82,82,.11);color:#ff7d80;border-color:rgba(255,82,82,.22)}.nav-cancel{background:rgba(255,255,255,.035);color:#d9dde2}.nav-sos:active,.nav-cancel:active{transform:scale(.97)}.nav-panel .traffic-suggestion{display:none!important}.body-nav .mapboxgl-ctrl-bottom-right{bottom:128px}.body-nav .mapboxgl-ctrl-bottom-left{bottom:128px}
@media(max-width:390px){.nav-essential-row{grid-template-columns:1fr 1fr 52px 68px;gap:5px}.nav-panel.nav-minimal{left:5px;right:5px;bottom:max(5px,env(safe-area-inset-bottom));padding:9px}.nav-direction-copy b{font-size:14px}.nav-essential{padding:0 7px}.nav-sos,.nav-cancel{font-size:7px}}
@media(pointer:coarse){.header,.search-card,.status-chip,.map-btn,.gps-quality,.sheet,.nav-panel,.permission,.search-results,.toast{-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important}.ambient-halo{display:none}.map-vignette{opacity:.28}.sheet,.nav-panel{box-shadow:0 -10px 34px rgba(0,0,0,.3)}.route-card,.quick,.sub-action,.segment button,.travel button{transition:transform .12s ease,background .12s ease,border-color .12s ease!important}}


/* SPARK X15 — ultra-clean launch + account drawer + fast GPS */
.header{top:max(8px,env(safe-area-inset-top));left:auto;right:8px;width:44px;height:44px;display:block}.header .brand{display:none}.header-actions{display:block}.options-btn{width:44px;height:44px;border-radius:15px;border:1px solid rgba(255,255,255,.08);background:rgba(10,12,15,.90);color:#fff;display:grid;place-items:center;box-shadow:0 10px 28px rgba(0,0,0,.22);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.search-card{top:max(8px,env(safe-area-inset-top));left:8px;right:60px;padding:3px 5px;border-radius:16px;background:rgba(10,12,15,.93);box-shadow:0 10px 28px rgba(0,0,0,.21);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.search-card .origin-hidden{display:none}.search-card .location-row{min-height:38px;grid-template-columns:25px minmax(0,1fr) 34px;border:0}.search-card .location-input{font-size:12px;padding:8px 2px}.search-card .row-btn{width:32px;height:32px}.search-results{top:calc(100% + 6px)}.status-chip,.gps-quality{display:none!important}.map-vignette{background:linear-gradient(180deg,rgba(5,6,8,.30) 0,transparent 20%,transparent 100%)}
.floating-locate{position:absolute;z-index:15;left:10px;bottom:max(92px,calc(env(safe-area-inset-bottom) + 92px));width:46px;height:46px;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:rgba(10,12,15,.91);color:#fff;display:grid;place-items:center;box-shadow:0 10px 28px rgba(0,0,0,.24);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.floating-locate:active{transform:scale(.96)}.body-nav .floating-locate{bottom:max(126px,calc(env(safe-area-inset-bottom) + 126px))}.map-tools{display:none!important}
.sheet{left:6px;right:6px;padding:7px 10px 10px;border-radius:25px;background:rgba(10,12,15,.965);box-shadow:0 -10px 30px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.welcome{padding:0 2px 2px}.welcome h1{font-size:16px;letter-spacing:-.45px}.welcome p,.hero-kicker{display:none}.quick-grid{display:flex;gap:6px;margin-top:8px;overflow:auto;scrollbar-width:none}.quick-grid::-webkit-scrollbar{display:none}.quick{min-height:39px;min-width:max-content;padding:0 11px;border-radius:12px;display:flex;align-items:center;gap:6px}.quick i{margin:0}.quick b{font-size:9px}.quick span{display:none}.grab{margin-bottom:8px}.sheet.sheet-collapsed{transform:translateY(calc(100% - 58px))!important}
.account-backdrop{position:absolute;z-index:79;inset:0;background:rgba(0,0,0,.30);opacity:0;pointer-events:none;transition:.2s}.account-backdrop.show{opacity:1;pointer-events:auto}.account-drawer{position:absolute;z-index:80;left:6px;right:6px;bottom:0;transform:translateY(calc(100% + 20px));transition:transform .28s cubic-bezier(.2,.8,.2,1);padding:10px 12px max(14px,env(safe-area-inset-bottom));border:1px solid rgba(255,255,255,.08);border-bottom:0;border-radius:26px 26px 0 0;background:#0c0e11;box-shadow:0 -18px 60px rgba(0,0,0,.42)}.account-drawer.show{transform:none}.drawer-grab{width:36px;height:4px;border-radius:999px;background:#454b54;margin:1px auto 12px}.drawer-user{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:11px;align-items:center}.drawer-avatar{width:52px;height:52px;border-radius:17px;object-fit:cover;border:1px solid rgba(255,255,255,.10);background:#171a1f}.drawer-avatar.fallback{display:grid;place-items:center}.drawer-user b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drawer-user span{display:block;margin-top:3px;color:#7f8791;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drawer-profile{height:34px;padding:0 10px;border-radius:11px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);color:#fff;font-size:9px;font-weight:850;display:flex;align-items:center}.drawer-divider{height:1px;background:rgba(255,255,255,.06);margin:12px 0}.drawer-list{display:grid;gap:4px}.drawer-link{height:48px;padding:0 11px;border:0;border-radius:13px;background:transparent;color:#e7e9ed;display:flex;align-items:center;gap:10px;font-size:11px;font-weight:800;text-align:left}.drawer-link i{color:#9099a4}.drawer-link:active{background:rgba(255,255,255,.055)}.drawer-logout{width:100%}.drawer-login{padding:6px 1px}.drawer-login p{color:#858d97;font-size:10px;line-height:1.45}
.nearby-driver-dot{width:14px;height:14px;border-radius:50%;background:#ff7b2e;border:2px solid #fff;box-shadow:0 0 0 5px rgba(255,107,24,.15),0 7px 16px rgba(0,0,0,.34)}
@media(pointer:coarse){.header,.search-card,.sheet,.nav-panel,.floating-locate,.account-drawer{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.map-vignette{opacity:.18}.route-card,.quick,.sub-action,.segment button,.travel button{transition:none!important}}


/* SPARK X16 — small launch polish + stable road signs */
.header{top:max(8px,env(safe-area-inset-top));right:8px;width:47px;height:47px}.options-btn{width:47px;height:47px;border-radius:16px}.search-card{top:max(8px,env(safe-area-inset-top));right:63px;padding:4px 6px;border-radius:17px;min-height:47px}.search-card .location-row{min-height:39px;grid-template-columns:26px minmax(0,1fr) 35px}.search-card .location-input{font-size:13px;padding:9px 3px}.search-card .row-btn{width:33px;height:33px}.notif-count{font-style:normal;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#4E50D8;color:#111;display:grid;place-items:center;font-size:8px;font-weight:950}.notif-count[hidden]{display:none!important}
@media(max-width:390px){.header{right:7px;width:46px;height:46px}.options-btn{width:46px;height:46px}.search-card{left:7px;right:60px;min-height:46px}.search-card .location-row{min-height:38px}.search-card .location-input{font-size:12.7px}}
/* SPARK X17 — environmental map + lively, fixed-shape road controls */
.map-mood-fade{position:absolute;z-index:6;inset:0;background:#090b0e;opacity:0;pointer-events:none;transition:opacity .22s ease}.map-mood-fade.active{opacity:.22}.road-mood-hint{position:absolute;z-index:12;left:50%;top:max(66px,calc(env(safe-area-inset-top) + 66px));transform:translate(-50%,-6px);opacity:0;pointer-events:none;padding:6px 9px;border-radius:999px;background:rgba(9,11,14,.82);border:1px solid rgba(255,255,255,.07);font-size:7px;font-weight:900;letter-spacing:.08em;color:#b9c0c8;transition:.24s}.road-mood-hint.show{opacity:1;transform:translate(-50%,0)}


/* SPARK X19 — vivid traffic, destination confirmation and nearby parking */
.destination-confirm{position:absolute;z-index:42;left:7px;right:7px;bottom:max(7px,env(safe-area-inset-bottom));display:none;padding:9px 11px 11px;border:1px solid rgba(255,255,255,.09);border-radius:25px;background:rgba(9,11,14,.97);box-shadow:0 -14px 42px rgba(0,0,0,.36)}.destination-confirm.show{display:block;animation:x19SheetIn .24s cubic-bezier(.2,.8,.2,1)}@keyframes x19SheetIn{from{transform:translateY(18px);opacity:.2}to{transform:none;opacity:1}}.destination-confirm .grab-mini{width:38px;height:4px;border-radius:999px;background:#454b54;margin:0 auto 10px}.destination-confirm small{display:block;color:#7f8792;font-size:7px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.destination-confirm h3{margin:4px 0 0;font-size:15px;line-height:1.2;letter-spacing:-.35px}.destination-confirm p{margin:5px 0 0;color:#9098a3;font-size:9px;line-height:1.4}.destination-confirm-actions{display:grid;grid-template-columns:.72fr 1.3fr;gap:7px;margin-top:11px}.destination-confirm-actions button{height:45px;border-radius:14px;font-size:10px;font-weight:900}.destination-edit{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);color:#dfe3e8}.destination-accept{border:0;background:#4E50D8;color:#111}.customize-route-kicker{display:flex;align-items:center;justify-content:space-between;margin:4px 2px 7px;color:#8d96a1;font-size:7px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.customize-route-kicker b{color:#f0f2f5;font-size:8px;letter-spacing:.06em}.parking-nearby{display:none;margin-top:8px;padding:9px;border:1px solid rgba(255,255,255,.065);border-radius:16px;background:rgba(255,255,255,.022)}.parking-nearby.show{display:block}.parking-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.parking-head div{min-width:0}.parking-head small{display:block;color:#78818c;font-size:6.5px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.parking-head b{display:block;margin-top:2px;font-size:10px}.parking-head span{font-size:7px;color:#7f8893}.parking-list{display:grid;gap:5px;margin-top:7px}.parking-item{width:100%;min-height:44px;border:1px solid rgba(255,255,255,.055);border-radius:12px;background:rgba(255,255,255,.02);color:#fff;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;padding:7px 9px;text-align:left}.parking-item b{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.parking-item span{display:block;margin-top:2px;color:#818a95;font-size:7px}.parking-item strong{color:#ff9a61;font-size:9px;white-space:nowrap}.parking-empty{padding:8px 2px;color:#7f8893;font-size:8px;line-height:1.4}@media(pointer:coarse){.destination-confirm{box-shadow:0 -10px 30px rgba(0,0,0,.3)}}



/* V29 — clean map UI + gamified live traffic, no simulated cars */
.header{left:auto;right:12px;top:max(10px,calc(env(safe-area-inset-top) + 8px));width:50px;z-index:33}
.header-actions{width:50px}.options-btn{width:50px;height:58px;border-radius:19px;border:1px solid rgba(255,255,255,.10);background:rgba(11,14,18,.94);backdrop-filter:blur(20px);box-shadow:0 12px 34px rgba(0,0,0,.32)}
.search-card{left:12px;right:70px;top:max(10px,calc(env(safe-area-inset-top) + 8px));padding:7px;border-radius:20px;border:1px solid rgba(255,112,35,.23);background:rgba(10,13,17,.965);box-shadow:0 14px 40px rgba(0,0,0,.32),0 0 0 1px rgba(255,104,23,.035),0 0 28px rgba(255,92,17,.07);backdrop-filter:blur(22px)}
.location-row{min-height:58px;grid-template-columns:30px minmax(0,1fr) 40px;gap:4px}.location-input{font-size:15px;font-weight:760;letter-spacing:-.28px;padding:13px 4px;color:#fff}.location-input::placeholder{color:#c3c8cf;opacity:.78}.pin.end{width:26px;height:26px;border-radius:9px;background:rgba(255,104,23,.11);display:grid;place-items:center}.pin.end i{width:12px;height:12px;background:#5B5CE2;box-shadow:0 0 0 5px rgba(255,107,24,.10),0 0 18px rgba(255,107,24,.35)}.row-btn{width:40px;height:40px;border-radius:13px;background:rgba(255,255,255,.045)}
.status-chip,.gps-quality{display:none!important}.map-tools{right:12px;top:max(82px,calc(env(safe-area-inset-top) + 80px))}.map-btn{width:46px;height:46px;border-radius:16px}
.traffic-radar{top:max(182px,calc(env(safe-area-inset-top) + 180px));left:12px;border-radius:14px;background:rgba(10,13,17,.92);border-color:rgba(255,112,35,.12);box-shadow:0 10px 28px rgba(0,0,0,.18)}
@media(max-width:390px){.header{right:8px;top:max(8px,calc(env(safe-area-inset-top) + 6px));width:48px}.options-btn{width:48px;height:56px}.search-card{left:8px;right:64px;top:max(8px,calc(env(safe-area-inset-top) + 6px));padding:6px}.location-row{min-height:56px}.location-input{font-size:14px}.map-tools{right:8px;top:max(76px,calc(env(safe-area-inset-top) + 74px))}.traffic-radar{left:8px;top:max(174px,calc(env(safe-area-inset-top) + 172px));max-width:calc(100vw - 16px)}}

/* V29 route traffic card polish */
.search-card:focus-within{border-color:rgba(255,112,35,.48);box-shadow:0 16px 44px rgba(0,0,0,.34),0 0 0 3px rgba(255,104,23,.06),0 0 30px rgba(255,92,17,.10)}
.traffic-line{display:grid;grid-template-columns:minmax(0,1fr) 76px auto;align-items:center;gap:7px;margin-top:10px;padding:8px 9px;border-radius:13px;background:linear-gradient(90deg,rgba(255,208,0,.045),rgba(255,105,20,.055),rgba(255,49,35,.04));border:1px solid rgba(255,255,255,.055);color:#a5adb8}.traffic-line>span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.traffic-bar{height:7px;background:#1f242b;border:1px solid rgba(255,255,255,.035);box-shadow:inset 0 1px 3px rgba(0,0,0,.45)}.traffic-bar i{background:linear-gradient(90deg,#ffd400 0%,#ff8a00 48%,#ff3025 100%);box-shadow:0 0 9px rgba(255,100,20,.22)}
@media(max-width:370px){.traffic-line{grid-template-columns:minmax(0,1fr) 58px auto;padding:7px}}

/* V30 — simple top bar: no floating live-traffic card */
.header{
  top:max(9px,calc(env(safe-area-inset-top) + 7px));
  right:10px;
  width:56px;
  height:64px;
}
.header-actions{width:56px;height:64px}
.options-btn{
  width:56px;
  height:64px;
  border-radius:20px;
  display:grid;
  place-items:center;
}
.search-card{
  top:max(9px,calc(env(safe-area-inset-top) + 7px));
  left:10px;
  right:74px;
  height:64px;
  min-height:64px;
  padding:5px 7px;
  border-radius:20px;
  box-sizing:border-box;
}
.search-card .location-row{
  height:52px;
  min-height:52px;
  grid-template-columns:30px minmax(0,1fr) 42px;
  gap:5px;
}
.search-card .location-input{
  font-size:15.5px;
  font-weight:780;
  padding:13px 4px;
}
.search-card .row-btn{width:42px;height:42px;border-radius:14px}
.map-tools{top:max(82px,calc(env(safe-area-inset-top) + 80px))}
.traffic-radar{top:max(82px,calc(env(safe-area-inset-top) + 80px))}
@media(max-width:390px){
  .header{right:8px;top:max(8px,calc(env(safe-area-inset-top) + 6px));width:52px;height:60px}
  .header-actions{width:52px;height:60px}
  .options-btn{width:52px;height:60px;border-radius:19px}
  .search-card{left:8px;right:68px;top:max(8px,calc(env(safe-area-inset-top) + 6px));height:60px;min-height:60px;padding:4px 6px}
  .search-card .location-row{height:50px;min-height:50px;grid-template-columns:29px minmax(0,1fr) 40px}
  .search-card .location-input{font-size:14.8px}
  .search-card .row-btn{width:40px;height:40px}
  .traffic-radar{left:8px;top:max(76px,calc(env(safe-area-inset-top) + 74px));max-width:calc(100vw - 16px)}
}


/* V32 — route calculation overlay */
.route-loading-overlay{position:absolute;inset:0;z-index:94;display:grid;place-items:center;padding:24px;background:rgba(0,0,0,.12);backdrop-filter:blur(1.8px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease}
.route-loading-overlay.show{opacity:1;visibility:visible;pointer-events:auto}
.route-loading-card{width:min(260px,calc(100vw - 46px));padding:18px 18px 16px;border-radius:23px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(155deg,rgba(12,14,18,.88),rgba(6,8,11,.80));box-shadow:0 22px 70px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.055);backdrop-filter:blur(22px);text-align:center;color:#f6f7f8}
.route-loading-spinner{position:relative;width:48px;height:48px;margin:0 auto 12px;border-radius:50%;border:3px solid rgba(255,255,255,.10);border-top-color:#5B5CE2;border-right-color:#ff9b58;box-shadow:0 0 28px rgba(255,91,16,.14);animation:routeSpin .72s linear infinite}
.route-loading-spinner:after{content:"";position:absolute;inset:8px;border-radius:50%;border:2px solid rgba(255,107,24,.13);border-bottom-color:rgba(255,107,24,.72);animation:routeSpin 1.15s linear reverse infinite}
.route-loading-card b{display:block;font-size:13px;letter-spacing:-.15px}.route-loading-card span{display:block;margin-top:5px;color:#8f97a3;font-size:8.5px;line-height:1.4}.route-loading-dots{display:flex;justify-content:center;gap:5px;margin-top:11px}.route-loading-dots i{width:5px;height:5px;border-radius:50%;background:#5B5CE2;opacity:.22;animation:routeDot 1.05s ease-in-out infinite}.route-loading-dots i:nth-child(2){animation-delay:.14s}.route-loading-dots i:nth-child(3){animation-delay:.28s}
@keyframes routeSpin{to{transform:rotate(360deg)}}@keyframes routeDot{0%,100%{opacity:.2;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.route-loading-spinner,.route-loading-spinner:after,.route-loading-dots i{animation:none!important}}


/* V33 — persistent unfinished-trip resume card */
.resume-trip-card{position:absolute;z-index:97;left:50%;bottom:max(14px,calc(env(safe-area-inset-bottom) + 12px));width:min(420px,calc(100vw - 22px));transform:translate(-50%,calc(100% + 28px));opacity:0;visibility:hidden;pointer-events:none;padding:13px;border:1px solid rgba(255,255,255,.105);border-radius:25px;background:linear-gradient(155deg,rgba(14,17,21,.96),rgba(7,9,12,.93));box-shadow:0 24px 70px rgba(0,0,0,.44),inset 0 1px 0 rgba(255,255,255,.055);backdrop-filter:blur(24px);color:#f5f6f7;transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .22s ease,visibility .22s ease}
.resume-trip-card.show{transform:translate(-50%,0);opacity:1;visibility:visible;pointer-events:auto}
.resume-trip-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:2px 3px 9px}.resume-trip-head small{display:block;color:#ff7b31;font-size:7px;font-weight:950;letter-spacing:.14em}.resume-trip-head h3{margin:3px 0 0;font-size:17px;letter-spacing:-.55px}.resume-trip-age{flex:none;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.045);color:#8e96a2;font-size:7px;font-weight:800}
.resume-trip-preview{display:grid;grid-template-columns:86px minmax(0,1fr);gap:11px;align-items:center;padding:9px;border-radius:18px;background:rgba(255,255,255,.028);border:1px solid rgba(255,255,255,.055)}
.resume-trip-map{height:72px;border-radius:14px;overflow:hidden;background:radial-gradient(circle at 55% 42%,rgba(255,103,24,.10),transparent 40%),#090b0e;border:1px solid rgba(255,255,255,.05)}.resume-trip-map svg{width:100%;height:100%;display:block}.resume-trip-path-shadow{fill:none;stroke:rgba(255,96,18,.18);stroke-width:8;stroke-linecap:round;stroke-linejoin:round}.resume-trip-path{fill:none;stroke:url(#resumeRouteGradient);stroke-width:3.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(255,91,18,.58))}
.resume-trip-destination{min-width:0}.resume-trip-destination small{display:block;color:#747d89;font-size:7px;font-weight:900;letter-spacing:.09em}.resume-trip-destination b{display:block;margin-top:3px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.resume-trip-destination span{display:block;margin-top:5px;color:#929aa5;font-size:8px;line-height:1.35}
.resume-trip-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}.resume-trip-metric{padding:8px 7px;border-radius:13px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.045)}.resume-trip-metric small{display:block;color:#707986;font-size:6.5px;font-weight:900;letter-spacing:.08em}.resume-trip-metric b{display:block;margin-top:3px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.resume-trip-actions{display:grid;grid-template-columns:.82fr 1.3fr;gap:7px;margin-top:9px}.resume-trip-actions button{height:46px;border-radius:15px;font-size:10px;font-weight:950}.resume-trip-end{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);color:#aab1ba}.resume-trip-continue{border:0;background:linear-gradient(135deg,#706DF2,#4E50D8);color:#0b0b0c;box-shadow:0 8px 22px rgba(255,91,10,.18)}
@media(max-width:390px){.resume-trip-card{width:calc(100vw - 16px);padding:11px;border-radius:22px}.resume-trip-preview{grid-template-columns:78px minmax(0,1fr);gap:9px}.resume-trip-map{height:66px}.resume-trip-head h3{font-size:16px}}


/* V34 — navigation-only route + dual camera modes */
.nav-camera-toggle{display:none;position:absolute;z-index:36;right:10px;bottom:max(196px,calc(env(safe-area-inset-bottom) + 196px));height:44px;min-width:60px;padding:0 11px;border:1px solid rgba(255,255,255,.10);border-radius:15px;background:rgba(9,11,14,.92);color:#f4f6f8;align-items:center;justify-content:center;gap:6px;font-size:9px;font-weight:900;letter-spacing:.04em;box-shadow:0 12px 30px rgba(0,0,0,.28);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.body-nav .nav-camera-toggle{display:flex}.nav-camera-toggle:active{transform:scale(.96)}.nav-camera-toggle.perspective{background:linear-gradient(145deg,rgba(255,126,51,.96),rgba(255,90,8,.96));color:#0a0b0d;border-color:rgba(255,255,255,.16);box-shadow:0 10px 26px rgba(255,98,15,.22)}
.body-nav .floating-locate{bottom:max(138px,calc(env(safe-area-inset-bottom) + 138px))}
.body-nav .traffic-radar{max-width:calc(100vw - 76px)}
@media(max-width:390px){.nav-camera-toggle{right:8px;bottom:max(194px,calc(env(safe-area-inset-bottom) + 194px));height:42px;min-width:58px;border-radius:14px}.body-nav .floating-locate{bottom:max(134px,calc(env(safe-area-inset-bottom) + 134px))}}


/* V36 — smart suggestions + weather pill + floating speedometer */
.road-mood-hint{display:none!important}
.search-card{transition:transform .26s var(--ease),box-shadow .26s var(--ease),background .26s var(--ease),border-color .26s var(--ease)}
.search-card:focus-within{transform:translateY(-1px);box-shadow:0 26px 66px rgba(0,0,0,.34)}
.search-shortcuts{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:center;padding:8px 4px 2px}
.chip-shortcut,.chip-weather{height:42px;border-radius:15px;border:1px solid rgba(255,255,255,.09);display:flex;align-items:center;justify-content:center;gap:8px;padding:0 12px;font-size:10px;font-weight:880;letter-spacing:-.1px}
.chip-shortcut{background:rgba(255,255,255,.04);color:#fff;transition:transform .18s var(--ease),background .18s var(--ease),border-color .18s var(--ease)}
.chip-shortcut:active{transform:scale(.97);background:rgba(255,255,255,.09)}
.chip-shortcut i,.chip-weather i{color:#ff7a24}
.chip-weather{min-width:72px;justify-content:flex-end;background:rgba(10,12,15,.78);color:#fff;padding-inline:10px 12px}
#weatherPillValue{font-size:12px;font-weight:950;letter-spacing:-.3px}
.floating-speedo{position:absolute;z-index:16;left:12px;bottom:calc(max(8px,env(safe-area-inset-bottom)) + 214px);min-width:80px;height:78px;padding:10px 12px;border-radius:22px;border:1px solid rgba(255,255,255,.11);background:linear-gradient(180deg,rgba(12,15,18,.94),rgba(9,11,14,.9));box-shadow:0 18px 40px rgba(0,0,0,.28);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);pointer-events:none;transition:opacity .2s var(--ease),transform .2s var(--ease)}
.floating-speedo small{font-size:7px;font-weight:900;color:#88919c;letter-spacing:.12em}.floating-speedo strong{font-size:28px;line-height:1;font-weight:950;letter-spacing:-1px;color:#fff}.floating-speedo span{font-size:9px;color:#aeb7c2}.floating-speedo.active{transform:translateY(-2px)}
.search-results{padding:9px}
.search-item.rich{grid-template-columns:72px minmax(0,1fr) auto;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.04);background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.014))}
.search-item.rich+.search-item.rich{margin-top:4px}
.search-item.rich:active{background:rgba(255,255,255,.065)}
.place-thumb{width:72px;height:72px;border-radius:17px;background:#1b1f25 center/cover no-repeat;overflow:hidden;position:relative;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.place-thumb:after{content:"";position:absolute;inset:auto 0 0 0;height:34px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.6))}
.place-thumb-badge{position:absolute;left:7px;bottom:6px;z-index:1;padding:4px 6px;border-radius:999px;background:rgba(10,12,15,.76);border:1px solid rgba(255,255,255,.11);color:#fff;font-size:7px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.result-copy .result-address{display:block;margin-top:3px;color:#a4adb9;font-size:9px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.result-topline{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.result-stars{display:inline-flex;align-items:center;gap:5px;margin-top:6px;color:#ffbe63;font-size:8px;font-weight:800}
.result-stars em{font-style:normal;color:#7d8691}
.result-meta{align-self:flex-start;margin-top:3px;padding:5px 7px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.055)}
.place-popup{min-width:244px;max-width:272px}.place-popup-image{width:100%;height:116px;border-radius:14px;background:#1a1f25 center/cover no-repeat;margin-bottom:10px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.place-popup small{display:block;color:#818b98;font-size:7px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.place-popup h4{margin:5px 0 0;font-size:14px;line-height:1.2}.place-popup p{margin:5px 0 0;color:#a0a8b3;font-size:9px;line-height:1.45}.place-popup-rating{display:flex;align-items:center;gap:6px;margin-top:8px;color:#ffbf69;font-size:9px;font-weight:850}.place-popup-rating em{font-style:normal;color:#7f8894}.place-popup-actions{display:flex;gap:6px;margin-top:10px}.place-popup-actions a,.place-popup-actions button{flex:1;height:38px;border-radius:12px;border:0;display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:9px;font-weight:900}.place-popup-actions .gmaps{background:#fff;color:#111}.place-popup-actions .use{background:linear-gradient(135deg,#706DF2,#4E50D8);color:#111}
body[data-mood="day"] .search-card{background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(245,247,250,.94));border-color:rgba(12,18,28,.08);box-shadow:0 22px 56px rgba(0,0,0,.16)}
body[data-mood="day"] .location-input{color:#111820}body[data-mood="day"] .location-input::placeholder{color:#697281}body[data-mood="day"] .row-btn{background:rgba(12,18,28,.05);color:#27303a}body[data-mood="day"] .chip-shortcut{background:#fff;color:#14181d;border-color:rgba(12,18,28,.08)}body[data-mood="day"] .chip-weather{background:#111417;color:#fff;border-color:rgba(0,0,0,.08)}
body[data-mood="night"] .search-card,body:not([data-mood]) .search-card{background:linear-gradient(160deg,rgba(19,23,29,.92),rgba(9,11,14,.88))}
.options-btn{background:#0f1216!important;color:#fff!important;border-color:rgba(255,255,255,.08)!important;box-shadow:0 12px 32px rgba(0,0,0,.32)!important}
#trafficRadar{backdrop-filter:blur(20px)}
@media(max-width:390px){.search-shortcuts{grid-template-columns:1fr 1fr auto;gap:6px}.chip-shortcut,.chip-weather{height:39px;padding:0 10px;border-radius:13px}.floating-speedo{left:8px;bottom:calc(max(8px,env(safe-area-inset-bottom)) + 204px);min-width:74px;height:72px;padding:9px 10px}.floating-speedo strong{font-size:25px}.search-item.rich{grid-template-columns:64px minmax(0,1fr) auto}.place-thumb{width:64px;height:64px}}


/* V37 — polish + lightweight map rendering */
.search-card{
  border-radius:22px;
  padding:6px;
  box-shadow:0 14px 38px rgba(0,0,0,.18);
  backdrop-filter:blur(16px) saturate(125%);
  -webkit-backdrop-filter:blur(16px) saturate(125%);
  transition:box-shadow .18s ease,border-color .18s ease,background .22s ease;
}
.search-card:focus-within{transform:none;box-shadow:0 18px 44px rgba(0,0,0,.22)}
.location-row{height:56px;min-height:56px;border-radius:17px;padding:0 2px;transition:background .22s ease,border-color .22s ease,box-shadow .22s ease}
.location-input{font-size:15px;font-weight:740;letter-spacing:-.22px;padding:13px 5px}
.location-input::placeholder{font-weight:620}
.pin.end{border-radius:10px;transition:transform .18s ease}.search-card:focus-within .pin.end{transform:scale(1.05)}
.row-btn{width:39px;height:39px;border-radius:12px;transition:background .16s ease,transform .16s ease}.row-btn:active{transform:scale(.95)}
.search-shortcuts{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:7px;padding:7px 2px 1px}
.chip-shortcut,.chip-weather{height:41px;border-radius:14px;gap:7px;padding:0 10px;box-shadow:none;transition:transform .15s ease,background .18s ease,border-color .18s ease}
.chip-shortcut{justify-content:flex-start;font-size:9.5px;font-weight:860}
.chip-shortcut svg,.chip-weather svg{width:15px;height:15px;padding:6px;box-sizing:content-box;border-radius:9px;background:rgba(255,104,23,.10);color:#ff6f1c;flex:0 0 auto}
.chip-shortcut:active{transform:scale(.975)}
.chip-weather{min-width:78px;justify-content:flex-start;padding-right:11px}
#weatherPillValue{font-size:12.5px;font-weight:920}
body[data-mood="day"] .search-card{background:rgba(245,247,250,.76);border-color:rgba(12,18,28,.07)}
body[data-mood="day"] .location-row{background:#fff;border:1px solid rgba(13,20,29,.07);box-shadow:0 8px 22px rgba(22,28,36,.08)}
body[data-mood="day"] .search-card:focus-within .location-row{border-color:rgba(255,104,23,.22);box-shadow:0 10px 26px rgba(26,31,38,.10),0 0 0 3px rgba(255,104,23,.055)}
body[data-mood="day"] .chip-shortcut{background:rgba(255,255,255,.84);color:#171b20;border-color:rgba(13,20,29,.07)}
body[data-mood="day"] .chip-weather{background:#121519;color:#fff;border-color:#121519}
body[data-mood="night"] .search-card,body:not([data-mood]) .search-card{background:rgba(11,14,18,.88);border-color:rgba(255,255,255,.075)}
body[data-mood="night"] .location-row,body:not([data-mood]) .location-row{background:rgba(19,23,29,.92);border:1px solid rgba(255,255,255,.065);box-shadow:0 10px 28px rgba(0,0,0,.20)}
body[data-mood="night"] .search-card:focus-within .location-row,body:not([data-mood]) .search-card:focus-within .location-row{border-color:rgba(255,116,45,.22);box-shadow:0 0 0 3px rgba(255,104,23,.045)}
body[data-mood="night"] .chip-shortcut,body:not([data-mood]) .chip-shortcut{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.065)}
body[data-mood="night"] .chip-weather,body:not([data-mood]) .chip-weather{background:rgba(20,24,30,.96);border-color:rgba(255,255,255,.07)}
.options-btn{border-radius:18px!important;background:rgba(8,10,13,.96)!important;box-shadow:0 10px 28px rgba(0,0,0,.28)!important;transition:transform .16s ease,background .18s ease!important}.options-btn:active{transform:scale(.96)}
.search-results{max-height:min(46vh,420px);border-radius:20px;box-shadow:0 20px 48px rgba(0,0,0,.34);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);animation:v37ResultsIn .16s ease-out}
@keyframes v37ResultsIn{from{opacity:0;transform:translateY(-4px) scale(.992)}to{opacity:1;transform:none}}
.search-item.rich{grid-template-columns:62px minmax(0,1fr) auto;min-height:76px;padding:8px;border-radius:15px}.place-thumb{width:62px;height:62px;border-radius:14px}

/* Speedometer exists only while active navigation is running. */
.floating-speedo{display:none;--speed-angle:0deg;position:absolute;z-index:24;left:auto;right:10px;bottom:max(126px,calc(env(safe-area-inset-bottom) + 126px));width:60px;height:60px;min-width:60px;padding:0;border:0;border-radius:50%;background:conic-gradient(from 210deg,#4E50D8 0deg var(--speed-angle),rgba(255,255,255,.10) var(--speed-angle) 300deg,transparent 300deg 360deg);box-shadow:0 12px 30px rgba(0,0,0,.28);align-items:center;justify-content:center;gap:0;overflow:hidden;backdrop-filter:none;-webkit-backdrop-filter:none;transition:transform .16s ease,opacity .16s ease}
.body-nav .floating-speedo{display:flex;flex-direction:column}
.floating-speedo:after{content:"";position:absolute;inset:4px;border-radius:50%;background:radial-gradient(circle at 38% 28%,rgba(38,43,50,.98),rgba(9,11,14,.98) 68%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.floating-speedo>*{position:relative;z-index:1}.floating-speedo small{display:none}.floating-speedo strong{font-size:21px;line-height:.95;font-weight:950;letter-spacing:-.7px}.floating-speedo span{font-size:6.5px;font-weight:800;letter-spacing:.03em;color:#8f98a3;margin-top:2px}.floating-speedo.active{transform:scale(1.025)}
.body-nav .floating-locate{left:10px;right:auto;bottom:max(126px,calc(env(safe-area-inset-bottom) + 126px));width:48px;height:48px;border-radius:50%;background:rgba(10,12,15,.92);border-color:rgba(255,255,255,.09);box-shadow:0 12px 30px rgba(0,0,0,.26)}

/* Cleaner traffic: less glow, no animated repaint. */
#trafficRadar{box-shadow:0 8px 22px rgba(0,0,0,.18)}
@media(pointer:coarse){.search-card,.search-results{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}
@media(max-width:390px){.search-card{left:8px;right:64px;padding:5px;border-radius:19px}.location-row{height:54px;min-height:54px;border-radius:15px}.search-shortcuts{gap:5px}.chip-shortcut,.chip-weather{height:38px;border-radius:12px;padding:0 8px}.chip-shortcut svg,.chip-weather svg{padding:5px;border-radius:8px}.chip-weather{min-width:69px}.floating-speedo{right:8px;width:58px;height:58px;min-width:58px}.body-nav .floating-locate{left:8px;width:46px;height:46px}}


/* V38 — camera stack + stable destination framing */
.body-nav .nav-camera-toggle{right:10px;bottom:max(196px,calc(env(safe-area-inset-bottom) + 196px));box-shadow:0 10px 26px rgba(0,0,0,.24)}
.body-nav .floating-speedo{right:10px;bottom:max(126px,calc(env(safe-area-inset-bottom) + 126px))}
@media(max-width:390px){.body-nav .nav-camera-toggle{right:8px;bottom:max(194px,calc(env(safe-area-inset-bottom) + 194px))}.body-nav .floating-speedo{right:8px}}


/* V39 — compact place popup + cleaner destination field */
.search-card{padding:5px;border-radius:20px;box-shadow:0 12px 34px rgba(0,0,0,.16)}
.search-card .location-row{height:54px;min-height:54px;border-radius:16px;grid-template-columns:28px minmax(0,1fr) 40px;padding:0 3px}
.search-card .location-input{font-size:14.6px;font-weight:730;letter-spacing:-.18px;padding:12px 4px}
.search-card .location-input::placeholder{font-weight:600;letter-spacing:-.08px}
.search-card .pin.end{width:25px;height:25px;border-radius:9px;background:rgba(255,104,23,.08)}
.search-card .pin.end i{width:10px;height:10px;box-shadow:0 0 0 4px rgba(255,107,24,.08)}
.search-card .row-btn{width:37px;height:37px;border-radius:11px;background:transparent}
body[data-mood="day"] .search-card{background:rgba(247,248,250,.82);box-shadow:0 12px 32px rgba(23,29,38,.12)}
body[data-mood="day"] .location-row{background:rgba(255,255,255,.96);border-color:rgba(15,22,31,.065);box-shadow:0 5px 16px rgba(28,35,44,.055)}
body[data-mood="day"] .search-card:focus-within .location-row{border-color:rgba(255,104,23,.17);box-shadow:0 7px 20px rgba(28,35,44,.075),0 0 0 2px rgba(255,104,23,.035)}
body[data-mood="night"] .location-row,body:not([data-mood]) .location-row{background:rgba(16,20,25,.94);border-color:rgba(255,255,255,.06);box-shadow:0 7px 20px rgba(0,0,0,.16)}
body[data-mood="night"] .search-card:focus-within .location-row,body:not([data-mood]) .search-card:focus-within .location-row{border-color:rgba(255,116,45,.16);box-shadow:0 0 0 2px rgba(255,104,23,.03)}
.search-item.rich.has-photo{grid-template-columns:58px minmax(0,1fr) auto;min-height:70px}
.search-item.rich.no-photo{grid-template-columns:minmax(0,1fr) auto;min-height:58px;padding:9px 10px}
.search-item.rich.no-photo .result-copy{padding-left:1px}
.place-thumb{width:58px;height:58px;border-radius:13px}
.mapboxgl-popup-content{padding:9px 10px!important;border-radius:15px!important}
.place-popup{min-width:0!important;width:214px;max-width:214px}
.place-popup.no-image{width:200px;max-width:200px}
.place-popup-image{width:100%;height:82px;border-radius:11px;margin:0 0 8px;background:#1a1f25 center/cover no-repeat}
.place-popup h4{margin:0;font-size:12.5px;line-height:1.18;letter-spacing:-.2px;padding-right:12px}
.place-popup p{margin:4px 0 0;color:#9ca5b0;font-size:8.4px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.place-popup-rating{margin-top:6px;gap:4px;font-size:8px}
.place-popup-rating em{font-size:7px;color:#79828d}
.place-popup-meta{display:block;margin-top:5px;color:#707986;font-size:7.2px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.place-popup-use{width:100%;height:35px;margin-top:8px;border:0;border-radius:10px;background:linear-gradient(135deg,#706DF2,#4E50D8);color:#101114;font-size:8.8px;font-weight:920;box-shadow:0 7px 18px rgba(255,104,23,.14)}
.place-popup-use:active{transform:scale(.985)}
.place-popup-actions,.place-popup .gmaps{display:none!important}
@media(max-width:390px){.search-card .location-row{height:52px;min-height:52px;border-radius:15px}.search-card .location-input{font-size:14px}.place-popup{width:205px;max-width:205px}.place-popup.no-image{width:192px;max-width:192px}}



/* V40 — navigation HUD hierarchy: maneuver top, street chip, compact trip summary */
.nav-maneuver-top,.nav-street-chip,.nav-audio-toggle{display:none}
.body-nav .nav-maneuver-top{display:flex;position:absolute;z-index:35;top:max(12px,calc(env(safe-area-inset-top) + 8px));left:12px;right:12px;min-height:68px;align-items:center;gap:11px;padding:9px 12px 9px 9px;border:1px solid rgba(255,255,255,.095);border-radius:22px;background:linear-gradient(150deg,rgba(12,15,19,.95),rgba(7,9,12,.91));box-shadow:0 14px 38px rgba(0,0,0,.29),inset 0 1px 0 rgba(255,255,255,.045);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);animation:v40HudIn .24s cubic-bezier(.2,.8,.2,1)}
.nav-maneuver-icon{width:50px;height:50px;flex:0 0 50px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(145deg,#ff9a5f,#4E50D8);color:#0b0d10;box-shadow:0 9px 24px rgba(255,104,23,.21),inset 0 1px 0 rgba(255,255,255,.34)}
.nav-maneuver-icon .maneuver-glyph{font-size:27px;line-height:1;font-weight:850}.nav-maneuver-copy{min-width:0;flex:1}.nav-maneuver-copy small{display:block;color:#7f8995;font-size:6.8px;font-weight:900;letter-spacing:.13em}.nav-maneuver-copy b{display:block;margin-top:3px;color:#f7f8fa;font-size:16px;line-height:1.08;letter-spacing:-.36px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-maneuver-copy span{display:block;margin-top:4px;color:#a5adb7;font-size:9px;font-weight:720}
.body-nav .nav-street-chip{display:flex;position:absolute;z-index:31;left:76px;right:82px;bottom:max(100px,calc(env(safe-area-inset-bottom) + 100px));height:38px;align-items:center;justify-content:center;padding:0 13px;border:1px solid rgba(255,255,255,.075);border-radius:14px;background:rgba(10,13,17,.91);box-shadow:0 9px 26px rgba(0,0,0,.22);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);animation:v40HudIn .22s .04s both cubic-bezier(.2,.8,.2,1)}
.nav-street-chip span{min-width:0;color:#e9edf2;font-size:10px;font-weight:820;letter-spacing:-.12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.nav-panel.nav-minimal{padding:8px!important;border-radius:22px!important;background:linear-gradient(165deg,rgba(14,17,21,.965),rgba(7,9,12,.985))!important;box-shadow:0 -11px 34px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.04)!important}
.nav-summary-row{display:grid;grid-template-columns:1fr 1fr 1fr 48px;gap:6px;align-items:stretch}.nav-summary-item{height:52px;min-width:0;padding:0 9px;border:1px solid rgba(255,255,255,.055);border-radius:14px;background:rgba(255,255,255,.025);display:flex;flex-direction:column;justify-content:center}.nav-summary-item small{font-size:6.4px;font-weight:900;letter-spacing:.1em;color:#747e8a}.nav-summary-item strong{display:block;margin-top:3px;font-size:11.5px;font-weight:900;color:#f4f6f8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-search-btn{width:48px;height:52px;border:0;border-radius:15px;background:linear-gradient(145deg,#ff9558,#4E50D8);color:#0c0e11;display:grid;place-items:center;box-shadow:0 8px 22px rgba(255,104,23,.18);transition:transform .15s ease,filter .15s ease}.nav-search-btn:active{transform:scale(.95);filter:brightness(.96)}
.body-nav .nav-audio-toggle{display:grid;position:absolute;z-index:36;right:16px;bottom:max(194px,calc(env(safe-area-inset-bottom) + 194px));width:48px;height:48px;place-items:center;border:1px solid rgba(255,255,255,.085);border-radius:50%;background:rgba(9,12,15,.93);color:#f3f5f7;box-shadow:0 10px 26px rgba(0,0,0,.24);transition:transform .15s ease,background .18s ease,color .18s ease}.nav-audio-toggle:active{transform:scale(.94)}.nav-audio-toggle:not(.active){color:#77818d;background:rgba(12,15,19,.84)}
.body-nav .floating-speedo{right:10px;bottom:max(126px,calc(env(safe-area-inset-bottom) + 126px))}.body-nav .nav-camera-toggle{right:10px;bottom:max(254px,calc(env(safe-area-inset-bottom) + 254px));height:44px;min-width:60px;border-radius:16px}
.body-nav .floating-locate{bottom:max(126px,calc(env(safe-area-inset-bottom) + 126px))}
.body-nav .nav-panel .traffic-suggestion{display:none!important}.body-nav .nav-panel .reroute.show{position:absolute;left:10px;right:10px;bottom:calc(100% + 48px);margin:0;z-index:34;justify-content:center;background:rgba(17,20,24,.94);box-shadow:0 9px 26px rgba(0,0,0,.22)}
@keyframes v40HudIn{from{opacity:0;transform:translateY(-5px) scale(.99)}to{opacity:1;transform:none}}
@media(pointer:coarse){.body-nav .nav-maneuver-top,.body-nav .nav-street-chip{backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(max-width:390px){.body-nav .nav-maneuver-top{left:8px;right:8px;min-height:64px;padding:8px;border-radius:20px}.nav-maneuver-icon{width:47px;height:47px;flex-basis:47px;border-radius:15px}.nav-maneuver-copy b{font-size:15px}.body-nav .nav-street-chip{left:67px;right:76px;bottom:max(96px,calc(env(safe-area-inset-bottom) + 96px));height:36px}.nav-summary-row{grid-template-columns:1fr 1fr 1fr 44px;gap:5px}.nav-summary-item{height:49px;padding:0 7px;border-radius:13px}.nav-summary-item strong{font-size:10.5px}.nav-search-btn{width:44px;height:49px;border-radius:14px}.body-nav .nav-audio-toggle{right:13px;bottom:max(190px,calc(env(safe-area-inset-bottom) + 190px));width:46px;height:46px}.body-nav .nav-camera-toggle{right:8px;bottom:max(248px,calc(env(safe-area-inset-bottom) + 248px))}}

/* V43 — progressive route, fixed-camera navigation, reroute + voice polish */
:root{--v43-nav-bottom:16px;--v43-stack-right:10px;--v43-speed-bottom:122px}
.body-nav .nav-panel.nav-minimal{bottom:max(var(--v43-nav-bottom),calc(env(safe-area-inset-bottom) + var(--v43-nav-bottom)));padding:9px!important;border-radius:23px!important}
.nav-summary-item{height:55px}.nav-search-btn{height:55px}
.body-nav .nav-street-chip{left:66px;right:82px;bottom:max(103px,calc(env(safe-area-inset-bottom) + 103px));height:42px;padding:4px 4px 4px 12px;display:grid;grid-template-columns:minmax(0,1fr) 34px;gap:7px;justify-content:stretch}
.nav-street-chip span{font-size:11.5px;font-weight:880;letter-spacing:-.18px;text-align:left}
.nav-recalc-btn{width:34px;height:34px;border:1px solid rgba(255,255,255,.075);border-radius:11px;background:rgba(255,255,255,.04);color:#d7dde5;display:grid;place-items:center;transition:transform .15s ease,background .15s ease,color .15s ease}
.nav-recalc-btn:active{transform:scale(.94);background:rgba(255,255,255,.08)}.nav-recalc-btn.recalculating{color:#5B5CE2}.nav-recalc-btn.recalculating svg{animation:v43Spin .75s linear infinite}@keyframes v43Spin{to{transform:rotate(360deg)}}
.body-nav .floating-speedo{right:var(--v43-stack-right);bottom:max(var(--v43-speed-bottom),calc(env(safe-area-inset-bottom) + var(--v43-speed-bottom)))}
.body-nav .nav-audio-toggle{right:16px;bottom:max(190px,calc(env(safe-area-inset-bottom) + 190px));width:48px;height:48px}
.body-nav .nav-camera-toggle{right:var(--v43-stack-right);bottom:max(248px,calc(env(safe-area-inset-bottom) + 248px));height:44px;min-width:60px}
.body-nav .floating-locate{bottom:max(122px,calc(env(safe-area-inset-bottom) + 122px))}
.body-nav .nav-panel .reroute.show{left:auto;right:76px;bottom:calc(100% + 10px);width:auto;min-width:112px;height:34px;padding:0 10px;border-radius:11px;font-size:7.5px;gap:6px;white-space:nowrap;background:rgba(13,16,20,.94);border-color:rgba(255,138,72,.14)}
.body-nav .nav-panel .reroute .loading{width:13px;height:13px;border-width:1.5px}
.voice-pref-row{grid-template-columns:minmax(0,1fr) minmax(120px,42%)}.voice-select{width:100%;height:36px;border:1px solid rgba(255,255,255,.075);border-radius:11px;background:#15181d;color:#eef1f5;padding:0 9px;font-size:8px;font-weight:760;outline:none}.voice-select option{background:#15181d;color:#fff}
.nav-voice-popover{display:none;position:absolute;z-index:88;right:76px;bottom:max(176px,calc(env(safe-area-inset-bottom) + 176px));width:min(255px,calc(100vw - 96px));padding:9px;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:rgba(10,13,17,.97);box-shadow:0 16px 38px rgba(0,0,0,.34)}.body-nav .nav-voice-popover.show{display:block;animation:v40HudIn .18s both}.nav-voice-popover small{display:block;color:#7c8692;font-size:6.5px;font-weight:900;letter-spacing:.1em}.nav-voice-popover select{width:100%;height:38px;margin-top:6px;border:1px solid rgba(255,255,255,.075);border-radius:11px;background:#171b20;color:#fff;padding:0 9px;font-size:8px}.nav-voice-popover button{width:100%;height:34px;margin-top:6px;border:0;border-radius:10px;background:rgba(255,104,23,.11);color:#ff9a62;font-size:8px;font-weight:900}
@media(max-width:390px){.body-nav .nav-street-chip{left:58px;right:74px;bottom:max(101px,calc(env(safe-area-inset-bottom) + 101px));height:40px;padding-left:10px;grid-template-columns:minmax(0,1fr) 32px}.nav-street-chip span{font-size:10.8px}.nav-recalc-btn{width:32px;height:32px}.nav-summary-item{height:53px}.nav-search-btn{height:53px}.body-nav .floating-speedo{right:8px;bottom:max(118px,calc(env(safe-area-inset-bottom) + 118px))}.body-nav .nav-audio-toggle{right:14px;bottom:max(184px,calc(env(safe-area-inset-bottom) + 184px));width:46px;height:46px}.body-nav .nav-camera-toggle{right:7px;bottom:max(240px,calc(env(safe-area-inset-bottom) + 240px))}.body-nav .floating-locate{bottom:max(118px,calc(env(safe-area-inset-bottom) + 118px))}}

/* V44 — cleaner live navigation, aligned controls and softer traffic */
:root{--v44-nav-bottom:22px;--v44-street-bottom:112px;--v44-speed-bottom:130px;--v44-stack-right:10px}
.body-nav .nav-panel.nav-minimal{bottom:max(var(--v44-nav-bottom),calc(env(safe-area-inset-bottom) + var(--v44-nav-bottom)));border-radius:22px!important;background:rgba(10,12,15,.955);box-shadow:0 -10px 30px rgba(0,0,0,.27)}
.body-nav .nav-street-chip{left:64px;right:80px;bottom:max(var(--v44-street-bottom),calc(env(safe-area-inset-bottom) + var(--v44-street-bottom)));height:40px;padding:3px 3px 3px 12px;border-radius:13px;background:rgba(11,14,18,.94);box-shadow:0 8px 20px rgba(0,0,0,.18)}
.nav-street-chip span{font-size:11.7px;letter-spacing:-.2px}.nav-recalc-btn{width:33px;height:33px;border-radius:10px;background:rgba(255,255,255,.028);border-color:rgba(255,255,255,.065);box-shadow:none}.nav-recalc-btn:hover{background:rgba(255,255,255,.055)}
.body-nav .floating-speedo{right:var(--v44-stack-right);bottom:max(var(--v44-speed-bottom),calc(env(safe-area-inset-bottom) + var(--v44-speed-bottom)));box-shadow:0 9px 24px rgba(0,0,0,.22)}
.body-nav .nav-audio-toggle{right:16px;bottom:max(198px,calc(env(safe-area-inset-bottom) + 198px));width:48px;height:48px;box-shadow:0 8px 22px rgba(0,0,0,.2)}
.body-nav .nav-camera-toggle{right:var(--v44-stack-right);bottom:max(256px,calc(env(safe-area-inset-bottom) + 256px));height:44px;min-width:60px;box-shadow:0 8px 22px rgba(0,0,0,.2)}
.body-nav .floating-locate{bottom:max(var(--v44-speed-bottom),calc(env(safe-area-inset-bottom) + var(--v44-speed-bottom)));box-shadow:0 9px 24px rgba(0,0,0,.22)}
.body-nav .nav-panel .reroute.show{right:80px;bottom:calc(100% + 9px);height:32px;border-radius:10px;background:rgba(12,15,19,.93);box-shadow:0 7px 18px rgba(0,0,0,.18)}
.body-nav .user-marker.spark-uploaded-user{width:60px;height:60px;filter:drop-shadow(0 7px 13px rgba(0,0,0,.30))}.body-nav .user-marker.spark-uploaded-user .user-puck-image{width:54px;height:54px}.body-nav .user-marker.spark-uploaded-user .pulse{width:60px;height:60px;opacity:.58;animation-duration:2.8s}
@media(max-width:390px){:root{--v44-nav-bottom:18px;--v44-street-bottom:106px;--v44-speed-bottom:124px}.body-nav .nav-street-chip{left:57px;right:73px;height:39px;padding-left:10px}.nav-street-chip span{font-size:11px}.body-nav .floating-speedo{right:8px}.body-nav .nav-audio-toggle{right:14px;bottom:max(190px,calc(env(safe-area-inset-bottom) + 190px));width:46px;height:46px}.body-nav .nav-camera-toggle{right:7px;bottom:max(246px,calc(env(safe-area-inset-bottom) + 246px))}}


/* V45 — live alternatives, ultra-fast feedback and tighter navigation HUD */
:root{--v45-nav-bottom:30px;--v45-street-bottom:120px;--v45-speed-bottom:138px;--v45-audio-bottom:206px;--v45-camera-bottom:264px;--v45-stack-right:10px}
.body-nav .nav-panel.nav-minimal{bottom:max(var(--v45-nav-bottom),calc(env(safe-area-inset-bottom) + var(--v45-nav-bottom)));background:rgba(9,11,14,.965);border-color:rgba(255,255,255,.075);box-shadow:0 -8px 24px rgba(0,0,0,.24)}
.body-nav .nav-street-chip{left:64px;right:80px;bottom:max(var(--v45-street-bottom),calc(env(safe-area-inset-bottom) + var(--v45-street-bottom)));height:40px;border-radius:13px;background:rgba(9,12,15,.95)}
.nav-recalc-btn{display:grid!important;align-items:center!important;justify-content:center!important;place-items:center!important;padding:0!important}.nav-recalc-btn svg{display:block;margin:auto}.nav-recalc-btn.recalculating{background:rgba(255,104,23,.09);border-color:rgba(255,126,63,.18)}
.body-nav .floating-speedo{right:var(--v45-stack-right);bottom:max(var(--v45-speed-bottom),calc(env(safe-area-inset-bottom) + var(--v45-speed-bottom)))}
.body-nav .nav-audio-toggle{right:16px;bottom:max(var(--v45-audio-bottom),calc(env(safe-area-inset-bottom) + var(--v45-audio-bottom)))}
.body-nav .nav-camera-toggle{right:var(--v45-stack-right);bottom:max(var(--v45-camera-bottom),calc(env(safe-area-inset-bottom) + var(--v45-camera-bottom)))}
.body-nav .floating-locate{bottom:max(var(--v45-speed-bottom),calc(env(safe-area-inset-bottom) + var(--v45-speed-bottom)))}
.nav-alt-hint,.nav-feedback{display:none;position:absolute;z-index:34;left:12px;border:1px solid rgba(255,255,255,.075);background:rgba(10,12,15,.91);box-shadow:0 8px 22px rgba(0,0,0,.19);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:v40HudIn .18s both}
.body-nav .nav-alt-hint.show{display:flex;top:max(91px,calc(env(safe-area-inset-top) + 87px));min-height:34px;max-width:calc(100% - 24px);align-items:center;gap:8px;padding:0 10px;border-radius:12px;color:#c8ced6}
.nav-alt-hint i{width:7px;height:7px;flex:0 0 7px;border-radius:999px;background:#8d949d;box-shadow:0 0 0 4px rgba(141,148,157,.08)}.nav-alt-hint small{font-size:6.5px;font-weight:950;letter-spacing:.11em;color:#858d98}.nav-alt-hint b{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-alt-hint em{font-style:normal;font-size:7.5px;color:#9fa7b1;white-space:nowrap}
.body-nav .nav-feedback.show{display:flex;top:max(91px,calc(env(safe-area-inset-top) + 87px));align-items:center;gap:5px;padding:5px 6px 5px 9px;border-radius:13px}.body-nav.nav-alt-visible .nav-feedback.show{top:max(132px,calc(env(safe-area-inset-top) + 128px))}.nav-feedback span{font-size:7.5px;font-weight:850;color:#a8afb8;margin-right:2px;white-space:nowrap}.nav-feedback button{height:28px;border-radius:9px;padding:0 9px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.035);color:#e8ebef;font-size:7.5px;font-weight:900}.nav-feedback button:first-of-type{color:#91e8bd;border-color:rgba(94,224,166,.18);background:rgba(94,224,166,.06)}.nav-feedback button:last-of-type{color:#ffb181;border-color:rgba(255,137,70,.16);background:rgba(255,104,23,.05)}
@media(pointer:coarse){.nav-alt-hint,.nav-feedback{backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(max-width:390px){:root{--v45-nav-bottom:26px;--v45-street-bottom:114px;--v45-speed-bottom:132px;--v45-audio-bottom:198px;--v45-camera-bottom:254px}.body-nav .nav-street-chip{left:57px;right:73px}.body-nav .floating-speedo{right:8px}.body-nav .nav-audio-toggle{right:14px}.body-nav .nav-camera-toggle{right:7px}.body-nav .nav-alt-hint.show,.body-nav .nav-feedback.show{left:8px;max-width:calc(100% - 16px)}}


/* V46 — stacked navigation controls, compact faster-route prompt and motorcycle mode */
.moto-ico{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}.travel button{min-width:0}.travel button.active{border-color:rgba(255,111,28,.5);background:linear-gradient(180deg,rgba(255,111,28,.13),rgba(255,111,28,.07));color:#ff9a5e;box-shadow:inset 0 1px 0 rgba(255,255,255,.045)}
.nav-control-stack{display:none}.body-nav .nav-control-stack{display:flex;position:absolute;z-index:37;right:10px;bottom:max(254px,calc(env(safe-area-inset-bottom) + 254px));flex-direction:column;gap:7px}.nav-stack-btn{width:44px;height:44px;padding:0;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:rgba(9,12,15,.94);color:#eef1f4;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.23);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:transform .15s ease,background .18s ease,border-color .18s ease,color .18s ease}.nav-stack-btn:active{transform:scale(.94)}.nav-stack-btn.active{color:#ff9a5d;border-color:rgba(255,110,30,.30);background:rgba(255,103,20,.10)}.body-nav .floating-locate{display:none!important}.body-nav .nav-audio-toggle{right:10px;bottom:max(198px,calc(env(safe-area-inset-bottom) + 198px));width:44px;height:44px;border-radius:15px}.body-nav .floating-speedo{right:10px;bottom:max(138px,calc(env(safe-area-inset-bottom) + 138px))}
.body-nav .nav-alt-hint.show{display:grid;grid-template-columns:minmax(0,1fr) auto 28px;align-items:center;column-gap:8px;top:max(92px,calc(env(safe-area-inset-top) + 88px));width:min(340px,calc(100% - 24px));min-height:58px;max-width:none;padding:8px 7px 8px 11px;border-radius:16px;background:rgba(9,12,15,.955);border-color:rgba(255,255,255,.085);box-shadow:0 13px 35px rgba(0,0,0,.27)}.nav-alt-copy{display:flex;flex-direction:column;min-width:0}.nav-alt-hint .nav-alt-copy small{font-size:6.5px;line-height:1;color:#ff975c;letter-spacing:.12em;margin-bottom:4px}.nav-alt-hint .nav-alt-copy b{font-size:10px;line-height:1.25;white-space:normal;color:#f1f3f5}.nav-alt-hint .nav-alt-copy em{font-size:7.5px;margin-top:3px;color:#929aa4}.nav-alt-accept{height:34px;padding:0 11px;border:0;border-radius:11px;background:linear-gradient(135deg,#ff7c2c,#ff5e0b);color:#111;font-size:8px;font-weight:950}.nav-alt-dismiss{width:28px;height:34px;padding:0;border:0;border-radius:10px;background:rgba(255,255,255,.035);color:#838c97;display:grid;place-items:center}.nav-alt-hint>i{display:none}.body-nav.nav-alt-visible .nav-feedback.show{top:max(158px,calc(env(safe-area-inset-top) + 154px))}
.traffic-suggestion{display:none!important}
@media(pointer:coarse){.nav-stack-btn{backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(max-width:390px){.body-nav .nav-control-stack{right:7px;bottom:max(248px,calc(env(safe-area-inset-bottom) + 248px));gap:6px}.nav-stack-btn{width:42px;height:42px;border-radius:14px}.body-nav .nav-audio-toggle{right:7px;bottom:max(194px,calc(env(safe-area-inset-bottom) + 194px));width:42px;height:42px;border-radius:14px}.body-nav .floating-speedo{right:7px;bottom:max(136px,calc(env(safe-area-inset-bottom) + 136px))}.body-nav .nav-alt-hint.show{left:8px;width:calc(100% - 16px);grid-template-columns:minmax(0,1fr) auto 26px;padding-left:10px}.nav-alt-accept{padding:0 9px}}


/* V58 — immersive navigation camera chooser */
.immersive-choice{position:fixed;inset:0;z-index:4900;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(16,18,32,.32);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.immersive-choice.show{display:flex}.immersive-choice-card{width:min(440px,calc(100vw - 28px));border:1px solid rgba(91,92,226,.16);border-radius:26px;background:rgba(255,255,255,.98);box-shadow:0 28px 90px rgba(37,42,84,.18);padding:20px;color:#171A2B}.immersive-choice-head{display:flex;align-items:flex-start;gap:12px}.immersive-choice-icon{width:44px;height:44px;flex:0 0 44px;border-radius:15px;display:grid;place-items:center;background:#EFEEFF;color:#5B5CE2}.immersive-choice-head small{display:block;color:#5B5CE2;font-size:9px;font-weight:900;letter-spacing:.14em}.immersive-choice-head h3{margin:4px 0 5px;font-size:20px;letter-spacing:-.5px}.immersive-choice-head p{margin:0;color:#70798A;font-size:12px;line-height:1.45}.immersive-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.immersive-option{min-height:116px;border:1px solid #E2E5EE;border-radius:18px;background:#FAFAFD;padding:14px;text-align:left;color:#252A3B;display:flex;flex-direction:column;gap:8px}.immersive-option i,.immersive-option svg{color:#5B5CE2}.immersive-option b{font-size:14px}.immersive-option span{font-size:10px;line-height:1.4;color:#7A8392}.immersive-option.primary{background:linear-gradient(145deg,#F1F0FF,#F8F7FF);border-color:#CFCFFF}.immersive-option:active{transform:scale(.985)}
.nav-stack-btn.immersive-active{background:linear-gradient(145deg,#706DF2,#5B5CE2)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 8px 22px rgba(91,92,226,.25)!important}.nav-immersive-chip{display:none;position:absolute;z-index:38;left:50%;transform:translateX(-50%);top:max(88px,calc(env(safe-area-inset-top) + 88px));padding:7px 10px;border-radius:999px;background:rgba(18,20,31,.84);color:#fff;border:1px solid rgba(255,255,255,.10);backdrop-filter:blur(12px);font-size:9px;font-weight:850;letter-spacing:.04em;box-shadow:0 10px 28px rgba(0,0,0,.18)}.body-nav.nav-immersive .nav-immersive-chip{display:flex;align-items:center;gap:6px}
html[data-vaizu-theme="black"] .immersive-choice{background:rgba(0,0,0,.50)}html[data-vaizu-theme="black"] .immersive-choice-card{background:#11131B;color:#F4F5F8;border-color:#2D3050;box-shadow:0 28px 90px rgba(0,0,0,.50)}html[data-vaizu-theme="black"] .immersive-choice-icon{background:#20213D;color:#A9A7FF}html[data-vaizu-theme="black"] .immersive-choice-head p,html[data-vaizu-theme="black"] .immersive-option span{color:#8F97A5}html[data-vaizu-theme="black"] .immersive-option{background:#171923;border-color:#292C3A;color:#F2F3F7}html[data-vaizu-theme="black"] .immersive-option.primary{background:#1D1E35;border-color:#3C3E70}
@media(max-width:420px){.immersive-choice{padding:12px}.immersive-choice-card{border-radius:22px;padding:16px}.immersive-options{grid-template-columns:1fr}.immersive-option{min-height:88px}.nav-immersive-chip{top:max(82px,calc(env(safe-area-inset-top) + 82px))}}
@media(min-width:700px){.immersive-choice-card{width:min(520px,calc(100vw - 44px));padding:24px}.immersive-option{min-height:128px;padding:16px}.immersive-choice-head h3{font-size:23px}}

/* VAIZO V77 — voice destination search */
.planner-location-row{grid-template-columns:26px minmax(0,1fr) 36px 36px!important}.voice-search-btn.listening{background:rgba(91,92,226,.16)!important;color:var(--o)!important;box-shadow:0 0 0 3px rgba(91,92,226,.08)}.voice-search-btn.listening svg{animation:voicePulse .9s ease-in-out infinite alternate}@keyframes voicePulse{to{transform:scale(1.14);opacity:.72}}@media(max-width:360px){.planner-location-row{grid-template-columns:24px minmax(0,1fr) 34px 34px!important}.planner-location-row .row-btn{width:34px!important;height:34px!important}}


/* VAIZO V92 — resilient mobile map gestures (Safari/iPhone included) */
#map .mapboxgl-canvas-container,#map .mapboxgl-canvas{touch-action:none!important;-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important}
#map .mapboxgl-canvas-container{width:100%!important;height:100%!important}
.ws-app,.mapboxgl-map{overscroll-behavior:none;-webkit-overflow-scrolling:auto}
@supports (-webkit-touch-callout:none){html,body{height:-webkit-fill-available}.ws-app{height:var(--vaizu-vh,100%);min-height:var(--vaizu-vh,100%);max-height:var(--vaizu-vh,100%)}}
@media(max-width:699px){.ws-app{max-width:none;box-shadow:none}.mapboxgl-ctrl-bottom-right{bottom:max(82px,calc(env(safe-area-inset-bottom) + 74px))}}
@media(orientation:landscape) and (max-height:520px){.header{top:max(5px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right))}.search-card{top:max(58px,calc(env(safe-area-inset-top) + 52px));left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right))}.sheet{left:max(6px,env(safe-area-inset-left));right:max(6px,env(safe-area-inset-right));max-height:56%;overflow:auto}.body-nav .nav-panel{left:max(6px,env(safe-area-inset-left));right:max(6px,env(safe-area-inset-right))}}

/* VAIZO V93 — planner / route polish */
#map,.mapboxgl-map,.mapboxgl-canvas,.mapboxgl-canvas-container{overscroll-behavior:none}
.mapboxgl-canvas-container.mapboxgl-touch-drag-pan,.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate,.mapboxgl-canvas{touch-action:pan-x pan-y pinch-zoom}
.ws-app{max-width:min(100vw,620px)}
.planner-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start}
.planner-search-card{position:relative;padding:10px;border-radius:24px;background:linear-gradient(180deg,rgba(14,16,20,.97),rgba(11,13,17,.95));border-color:rgba(255,255,255,.09);box-shadow:0 18px 44px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.04)}
.planner-search-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:1px 2px 9px}
.planner-search-copy{min-width:0}.planner-search-copy small{display:block;font-size:8px;font-weight:900;letter-spacing:.12em;color:#7f8894}.planner-search-copy b{display:block;margin-top:4px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.planner-gps-chip{height:34px;min-width:94px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(91,92,226,.14);color:#fff;padding:0 11px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:9px;font-weight:850;flex:0 0 auto}
.planner-gps-chip i{color:#b6b7ff}.planner-gps-chip:active{transform:scale(.98)}
.planner-location-row{min-height:56px;border:1px solid rgba(255,255,255,.065);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));padding:0 4px 0 2px;gap:6px}
.planner-location-row .location-input{font-size:15px;font-weight:760;padding:15px 4px}
.planner-location-row .row-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.045)}
.planner-search-icon{width:30px;height:30px;border-radius:11px;display:grid;place-items:center;background:rgba(255,111,28,.11);color:#ff9d66}
.search-shortcuts{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;margin-top:9px}
.planner-search-tip{justify-content:flex-start;min-width:0;padding:0 10px;background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.06)}
.planner-search-tip span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-results{left:0;right:0;top:calc(100% + 9px);padding:9px 8px;border-radius:22px}
.search-item.rich,.search-item{border-radius:16px}
.search-item.rich small,.search-item small{line-height:1.35}
.planner-adjust-btn{height:54px;min-width:60px;border:1px solid rgba(255,255,255,.08);border-radius:19px;background:linear-gradient(180deg,rgba(20,23,29,.95),rgba(11,13,17,.95));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#dce0e5;box-shadow:0 16px 36px rgba(0,0,0,.24)}
.planner-adjust-btn span{font-size:9px;font-weight:850;letter-spacing:.02em}
.planner-preset{border-radius:18px;padding:12px 13px;min-height:66px;border-color:rgba(255,255,255,.07);background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.018));box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.route-summary-pills{display:flex;flex-wrap:wrap;gap:7px;margin:-1px 0 11px}
.route-summary-pill{height:31px;padding:0 11px;border-radius:999px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.038);display:inline-flex;align-items:center;gap:7px;color:#d6dae0;font-size:8.5px;font-weight:820}
.route-summary-pill i{color:#ff9a64}.route-summary-pill.emphasis{background:rgba(91,92,226,.16);border-color:rgba(143,144,255,.19);color:#fff}
.route-chooser-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:10px 2px 8px}.route-chooser-head small{display:block;font-size:8px;font-weight:900;letter-spacing:.12em;color:#7f8894}.route-chooser-head b{display:block;margin-top:3px;font-size:12px}.route-chooser-head span{font-size:8px;color:#8b93a0;font-weight:780;text-align:right}
.route-variants{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px 0 10px;overflow:visible}
.route-variant{min-width:0;max-width:none;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:10px;border-radius:17px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.018));box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.route-variant small{display:block;font-size:7px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;color:#818a96}.route-variant b{display:block;font-size:16px;line-height:1}.route-variant span{display:block;margin-top:0;font-size:9px;line-height:1.25;color:#eff2f6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.route-variant em{display:block;margin-top:1px;font-style:normal;font-size:8px;line-height:1.25;color:#87909c}
.route-variant.active{border-color:rgba(255,116,42,.32);background:linear-gradient(180deg,rgba(255,116,42,.14),rgba(91,92,226,.08));color:#fff;box-shadow:0 12px 28px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.05)}.route-variant.active small,.route-variant.active em{color:#f2c2a5}
.route-card{margin-top:10px;padding:14px;border-radius:22px;background:linear-gradient(160deg,rgba(255,255,255,.058),rgba(255,255,255,.02));box-shadow:0 14px 34px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.03)}
.route-card.fast-selected{border-color:rgba(255,133,66,.25);background:linear-gradient(160deg,rgba(255,121,46,.12),rgba(255,255,255,.02) 54%,rgba(91,92,226,.07))}
.route-card-top{align-items:flex-start}.route-card h3{font-size:14px;letter-spacing:-.2px}.route-card .mins{font-size:23px}.route-card-meta{gap:6px;margin-top:10px}.route-card-meta span{font-size:8px;padding:6px 8px;border-radius:999px;background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.06)}
.start-trip-cta{min-height:58px;padding:10px 12px;border-radius:21px;background:linear-gradient(135deg,#ff9d62 0%,#5B5CE2 46%,#f05a00 100%);box-shadow:0 16px 34px rgba(93,76,226,.24),inset 0 1px 0 rgba(255,255,255,.28)}
.sub-actions.preview-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.preview-actions .sub-action{min-width:0;padding:0 8px;font-size:8px}
.parking-nearby{margin-top:10px;padding:11px;border-radius:18px;background:rgba(255,255,255,.022);border:1px solid rgba(255,255,255,.055)}
@media(max-width:420px){.planner-search-row{grid-template-columns:minmax(0,1fr) 58px}.planner-search-card{padding:9px}.planner-gps-chip{min-width:86px;padding:0 9px}.planner-search-copy b{font-size:10px}.planner-location-row{min-height:53px}.route-variants{grid-template-columns:1fr 1fr}.route-variant b{font-size:15px}.sub-actions.preview-actions{grid-template-columns:1fr 1fr 1fr}.planner-adjust-btn{height:53px;min-width:58px}}
@media(max-width:380px){.planner-search-row{grid-template-columns:minmax(0,1fr) 54px;gap:8px}.planner-search-meta{padding-bottom:8px}.planner-gps-chip{height:32px;min-width:78px;font-size:8px}.search-shortcuts{grid-template-columns:1fr 1fr auto;gap:6px}.planner-search-tip{padding:0 8px}.planner-search-tip span{font-size:8px}.route-summary-pill{height:29px;padding:0 9px;font-size:8px}.route-chooser-head{margin-top:9px}.route-variants{gap:7px}.route-variant{padding:9px}.route-variant b{font-size:14px}.route-variant span{font-size:8px}.route-variant em{font-size:7px}.sub-actions.preview-actions{gap:6px}.preview-actions .sub-action{font-size:7.2px;padding:0 6px}}
@media(orientation:landscape) and (max-height:520px){.planner-search-meta{padding-bottom:6px}.planner-location-row{min-height:50px}.search-shortcuts{margin-top:7px}.route-summary-pills{margin-bottom:8px}.route-chooser-head{margin:8px 2px 6px}.route-variants{grid-template-columns:repeat(4,minmax(0,1fr))}}
body[data-mood="day"] .planner-search-card{background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(244,247,252,.96));border-color:rgba(10,18,28,.08)}
body[data-mood="day"] .planner-location-row{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,249,252,.94));border-color:rgba(12,18,28,.08)}
body[data-mood="day"] .planner-search-copy small,body[data-mood="day"] .route-chooser-head small{color:#6a7381}body[data-mood="day"] .planner-search-copy b,body[data-mood="day"] .route-chooser-head b,body[data-mood="day"] .route-variant span{color:#141a21}body[data-mood="day"] .route-chooser-head span,body[data-mood="day"] .route-variant em{color:#66707d}
body[data-mood="day"] .route-summary-pill,body[data-mood="day"] .route-card,body[data-mood="day"] .parking-nearby,body[data-mood="day"] .route-variant{background:rgba(255,255,255,.92);border-color:rgba(12,18,28,.08);color:#11161d}
body[data-mood="day"] .planner-adjust-btn{background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(240,244,249,.96));border-color:rgba(12,18,28,.08);color:#16202b}
/* bundled vaizu-map-v63.css */
/* ============================================================
   VAIZO V63 — MAP / NAVIGATION COCKPIT
   Desktop: full canvas + bottom-left planning cockpit.
   Mobile: touch-first bottom sheet with stable safe areas.
   Loaded after legacy embedded CSS and intentionally owns geometry.
   ============================================================ */
:root{
  --v63-accent:#665CF6;
  --v63-accent-2:#827AFF;
  --v63-ink:#171A29;
  --v63-copy:#697286;
  --v63-surface:rgba(255,255,255,.96);
  --v63-surface-strong:#FFFFFF;
  --v63-soft:#F5F6FA;
  --v63-line:#E1E5ED;
  --v63-shadow:0 22px 70px rgba(37,43,75,.15),0 4px 18px rgba(37,43,75,.06);
  --v63-radius:25px;
  --v63-edge:20px;
}
html,body{height:100%;overflow:hidden!important;background:#E9ECF2!important}
body:has(.ws-app){margin:0!important;padding:0!important;overscroll-behavior:none!important}
body:has(.ws-app) .topbar,body:has(.ws-app) footer,body:has(.ws-app) .mobile-dock,body:has(.ws-app) .flash-wrap{display:none!important}
.ws-app{position:relative!important;width:100vw!important;max-width:none!important;height:100dvh!important;height:100svh!important;margin:0!important;background:#E9ECF2!important;overflow:hidden!important;isolation:isolate!important;box-shadow:none!important;color:var(--v63-ink)!important}
#map{position:absolute!important;inset:0!important;background:#E8EBF1!important}
.map-vignette{z-index:2!important;background:linear-gradient(180deg,rgba(247,248,251,.34),transparent 21%,transparent 75%,rgba(234,237,243,.14))!important;pointer-events:none!important}
.ambient-halo{opacity:.28!important}.road-mood-hint{display:none!important}.map-mood-fade{z-index:3!important}

/* Mapbox legal controls stay visible but quiet and out of the primary controls. */
.mapboxgl-ctrl-bottom-left{left:50%!important;bottom:max(4px,env(safe-area-inset-bottom))!important;transform:translateX(-50%)!important;z-index:7!important}.mapboxgl-ctrl-logo{opacity:.60!important;transform:scale(.68)!important;transform-origin:center bottom!important}.mapboxgl-ctrl-bottom-right{right:max(6px,env(safe-area-inset-right))!important;bottom:max(5px,env(safe-area-inset-bottom))!important;z-index:7!important}.mapboxgl-ctrl-attrib.mapboxgl-compact{margin:0!important;border:1px solid rgba(214,218,227,.8)!important;border-radius:10px!important;background:rgba(255,255,255,.82)!important;box-shadow:0 5px 18px rgba(42,49,78,.07)!important;backdrop-filter:blur(12px)!important}.mapboxgl-ctrl-attrib-button{width:26px!important;height:26px!important}
.mapboxgl-popup-content{padding:12px 14px!important;border:1px solid #DFE3EC!important;border-radius:16px!important;background:rgba(255,255,255,.96)!important;color:#202536!important;box-shadow:0 18px 48px rgba(34,41,70,.16)!important}.mapboxgl-popup-tip{border-top-color:#fff!important}.mapboxgl-popup-close-button{color:#7A8394!important}

/* Universal surfaces and buttons. */
.ws-app button,.ws-app input,.ws-app select{font:inherit}.ws-app button{-webkit-tap-highlight-color:transparent}.options-btn,.map-btn,.floating-locate,.nav-stack-btn,.nav-audio-toggle,.row-btn,.planner-adjust-btn,.safety-close,.prefs-close,.nav-search-btn,.nav-recalc-btn{outline:0!important}.options-btn:focus-visible,.map-btn:focus-visible,.floating-locate:focus-visible,.nav-stack-btn:focus-visible,.nav-audio-toggle:focus-visible,.row-btn:focus-visible,.planner-adjust-btn:focus-visible{box-shadow:0 0 0 4px rgba(102,92,246,.16)!important}
.toast{z-index:500!important;max-width:min(420px,calc(100vw - 28px))!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:14px!important;background:rgba(23,26,38,.94)!important;color:#fff!important;box-shadow:0 14px 40px rgba(0,0,0,.18)!important;backdrop-filter:blur(16px)!important;font-size:10px!important}

/* Top-right system controls */
.header{position:absolute!important;z-index:45!important;top:max(var(--v63-edge),calc(env(safe-area-inset-top) + 12px))!important;right:max(var(--v63-edge),calc(env(safe-area-inset-right) + 12px))!important;left:auto!important;width:48px!important;height:48px!important}.header-actions{width:48px!important;height:48px!important}.options-btn{width:48px!important;height:48px!important;display:grid!important;place-items:center!important;padding:0!important;border:1px solid rgba(218,222,231,.92)!important;border-radius:16px!important;background:rgba(255,255,255,.94)!important;color:#4E5668!important;box-shadow:0 12px 32px rgba(37,44,77,.11)!important;backdrop-filter:blur(18px)!important}.options-btn:hover{background:#fff!important;transform:translateY(-1px)!important}
.map-tools{position:absolute!important;z-index:43!important;right:max(var(--v63-edge),calc(env(safe-area-inset-right) + 12px))!important;top:max(80px,calc(env(safe-area-inset-top) + 72px))!important;display:grid!important;gap:7px!important}.map-tools .map-btn{width:44px!important;height:44px!important;display:grid!important;place-items:center!important;padding:0!important;border:1px solid rgba(218,222,231,.9)!important;border-radius:15px!important;background:rgba(255,255,255,.93)!important;color:#5D6678!important;box-shadow:0 10px 28px rgba(37,44,77,.09)!important;backdrop-filter:blur(16px)!important}.map-tools .map-btn:hover{color:#5C54DB!important;background:#fff!important}
.guest-trial-pill{position:absolute!important;z-index:42!important;top:max(var(--v63-edge),calc(env(safe-area-inset-top) + 12px))!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;min-height:38px!important;padding:0 12px!important;border:1px solid rgba(218,222,231,.9)!important;border-radius:13px!important;background:rgba(255,255,255,.92)!important;color:#525B6D!important;box-shadow:0 10px 28px rgba(37,44,77,.08)!important;backdrop-filter:blur(16px)!important;font-size:9px!important}.guest-trial-pill b{color:#5E56DF!important}

/* Planning cockpit */
.sheet#planSheet{position:absolute!important;z-index:38!important;background:var(--v63-surface)!important;border:1px solid rgba(221,225,234,.95)!important;box-shadow:var(--v63-shadow)!important;color:var(--v63-ink)!important;backdrop-filter:blur(22px)!important;-webkit-backdrop-filter:blur(22px)!important;overflow:visible!important;transition:transform .26s cubic-bezier(.2,.78,.2,1),opacity .2s ease!important}
.sheet#planSheet .grab{background:#D8DCE6!important}.planner-welcome{color:var(--v63-ink)!important}.planner-heading{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important}.planner-heading-copy small{display:block!important;color:#8C94A4!important;font-size:7px!important;font-weight:950!important;letter-spacing:.14em!important}.planner-heading-copy b{display:block!important;margin-top:2px!important;color:#1C2030!important;font-size:20px!important;letter-spacing:-.6px!important}.chip-weather.planner-weather{height:34px!important;padding:0 10px!important;border:1px solid #E4E7EE!important;border-radius:11px!important;background:#F8F9FB!important;color:#626A7C!important;font-size:9px!important;font-weight:850!important}
.planner-presets{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin-top:12px!important;overflow:visible!important}.planner-preset{min-width:0!important;width:100%!important;height:52px!important;padding:0 10px!important;display:grid!important;grid-template-columns:31px minmax(0,1fr)!important;align-items:center!important;gap:8px!important;border:1px solid #E4E7EE!important;border-radius:14px!important;background:#FAFBFC!important;color:#343A4C!important;text-align:left!important}.planner-preset:hover{border-color:#CFD0F5!important;background:#F7F6FF!important}.planner-preset-icon{width:31px!important;height:31px!important;border:0!important;border-radius:10px!important;background:#F0EFFF!important;color:#5F57DF!important;display:grid!important;place-items:center!important}.planner-preset b{display:block!important;font-size:9px!important;font-weight:900!important}.planner-preset small{display:block!important;max-width:100%!important;margin-top:2px!important;color:#9299A7!important;font-size:6.5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.planner-search-row{display:grid!important;grid-template-columns:minmax(0,1fr) 58px!important;gap:8px!important;margin-top:8px!important}.planner-search-card.search-card{position:relative!important;inset:auto!important;width:auto!important;height:58px!important;min-height:58px!important;padding:5px 7px!important;border:1px solid #D9DDE7!important;border-radius:16px!important;background:#fff!important;box-shadow:none!important;backdrop-filter:none!important}.planner-search-card.search-card:focus-within{border-color:#AAA5FA!important;box-shadow:0 0 0 4px rgba(102,92,246,.08)!important}.planner-location-row.location-row{height:46px!important;min-height:46px!important;display:grid!important;grid-template-columns:30px minmax(0,1fr) 38px!important;align-items:center!important;gap:4px!important}.planner-search-icon{width:30px!important;height:30px!important;display:grid!important;place-items:center!important;color:#6962E8!important}.planner-search-card .location-input{height:46px!important;padding:0 4px!important;background:transparent!important;border:0!important;outline:0!important;color:#222637!important;font-size:13px!important;font-weight:760!important;letter-spacing:-.2px!important}.planner-search-card .location-input::placeholder{color:#959CAA!important;opacity:1!important}.planner-search-card .row-btn{width:38px!important;height:38px!important;border:0!important;border-radius:11px!important;background:#F4F5F8!important;color:#727B8C!important}.planner-search-card .search-results{position:absolute!important;z-index:80!important;left:0!important;right:0!important;top:calc(100% + 7px)!important;max-height:min(360px,46dvh)!important;overflow:auto!important;border:1px solid #E0E3EB!important;border-radius:16px!important;background:rgba(255,255,255,.98)!important;box-shadow:0 18px 50px rgba(37,43,75,.15)!important}.planner-adjust-btn{width:58px!important;min-width:58px!important;height:58px!important;padding:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;border:1px solid #E1E4EC!important;border-radius:16px!important;background:#F8F9FB!important;color:#626A7C!important;box-shadow:none!important}.planner-adjust-btn span{font-size:6px!important;font-weight:850!important}.planner-adjust-btn:hover{background:#F0EFFF!important;color:#5F57DF!important;border-color:#D4D1FA!important}
.planner-expand-hint{height:27px!important;margin-top:7px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;color:#9AA1AF!important;font-size:7px!important;font-weight:750!important}.planner-expanded{margin-top:4px!important}.planner-section-head small{color:#8C94A4!important}.planner-section-head b{color:#252A3A!important}.planner-section-head span{color:#9AA1AF!important}.nearby-services{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}.nearby-service{min-width:0!important;min-height:75px!important;padding:8px 5px!important;border:1px solid #E5E7EE!important;border-radius:14px!important;background:#FAFBFC!important;color:#454D60!important}.nearby-service-icon{width:31px!important;height:31px!important;margin:auto!important;border-radius:10px!important;background:#F0EFFF!important;color:#625AE4!important}.nearby-service b{font-size:8px!important}.nearby-service small{font-size:6px!important;color:#969DAB!important}.planner-tip{border:1px solid #E4E2FC!important;background:#F7F6FF!important;color:#6E69B9!important;border-radius:13px!important}

/* Route preview inside planner */
#routeState{color:#232738!important}.route-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px!important}.route-head h2{margin:0!important;font-size:18px!important;color:#202536!important;letter-spacing:-.5px!important}.route-head p{margin:3px 0 0!important;color:#8A92A2!important;font-size:8px!important}.route-time{text-align:right!important}.route-time span{display:block!important;color:#5E56DF!important;font-size:22px!important;font-weight:950!important;letter-spacing:-.7px!important}.route-time small{color:#858D9D!important;font-size:8px!important}.customize-route-kicker{color:#8991A1!important}.customize-route-kicker b{color:#5E56DF!important}.segment,.travel{display:grid!important;gap:6px!important}.segment{grid-template-columns:repeat(3,minmax(0,1fr))!important}.travel{grid-template-columns:repeat(3,minmax(0,1fr))!important}.segment button,.travel button{min-width:0!important;height:38px!important;border:1px solid #E1E4EC!important;border-radius:12px!important;background:#F7F8FA!important;color:#626B7C!important;font-size:8px!important;font-weight:850!important}.segment button.active,.travel button.active{border-color:#D3D0FA!important;background:#EFEEFF!important;color:#5E56DF!important;box-shadow:none!important}.segment button em{color:#5E56DF!important}.route-variants{display:grid!important;gap:6px!important}.route-card{border:1px solid #E1E4EC!important;border-radius:17px!important;background:#FAFBFC!important;color:#2D3344!important;box-shadow:none!important}.route-card h3{color:#232839!important}.route-card-meta,.route-ai,.route-card .safety-level strong{color:#838C9D!important}.level-pill{background:#EEEDFF!important;color:#5D56DD!important;border-color:#D6D3FC!important}.traffic-line{background:#F7F8FA!important;border-color:#E6E8EE!important;color:#70798B!important}.route-insight{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}.route-insight .insight{border:1px solid #E4E7EE!important;border-radius:12px!important;background:#FAFBFC!important}.route-insight strong{color:#343A4C!important}.route-insight span{color:#929AA8!important}.start-trip-cta.primary{min-height:58px!important;border:0!important;border-radius:16px!important;background:linear-gradient(135deg,#7168F8,#5B52E8)!important;color:#fff!important;box-shadow:0 14px 30px rgba(102,92,246,.24)!important}.start-trip-cta:hover{filter:brightness(1.03)!important;transform:translateY(-1px)!important}.start-trip-icon{background:rgba(255,255,255,.14)!important}.preview-actions .sub-action{border:1px solid #E2E5ED!important;background:#F9FAFB!important;color:#666F80!important;border-radius:12px!important}.disclaimer{color:#A0A6B2!important}.parking-nearby{border-color:#E2E5ED!important;background:#FAFBFC!important}.parking-item{background:#fff!important;color:#343A4C!important;border-color:#E4E7EE!important}.parking-item span{color:#949CAA!important}.parking-item strong{color:#5E56DF!important}

/* Dynamically placed recenter/calibrate button. */
.floating-locate{position:absolute!important;z-index:41!important;width:48px!important;height:48px!important;padding:0!important;display:grid!important;place-items:center!important;border:1px solid rgba(216,221,231,.94)!important;border-radius:16px!important;background:rgba(255,255,255,.96)!important;color:#5F57DF!important;box-shadow:0 13px 32px rgba(37,44,77,.12)!important;backdrop-filter:blur(18px)!important}.floating-locate:hover{transform:translateY(-1px)!important;background:#fff!important}.floating-locate:active{transform:scale(.97)!important}

/* Permission card */
.permission{z-index:75!important;border:1px solid #E0E4EC!important;border-radius:18px!important;background:rgba(255,255,255,.97)!important;color:#2B3041!important;box-shadow:0 18px 50px rgba(37,43,75,.16)!important}.permission-icon{background:#EEEDFF!important;color:#5F57DF!important}.permission-copy span{color:#818A9A!important}.permission button{border:0!important;border-radius:11px!important;background:#665CF6!important;color:#fff!important;font-weight:900!important}

/* Account and secondary drawers */
.account-backdrop{background:rgba(21,24,35,.23)!important;backdrop-filter:blur(5px)!important}.account-drawer,.safety-drawer,.prefs-drawer{border:1px solid #DFE3EB!important;background:rgba(255,255,255,.98)!important;color:#252A3A!important;box-shadow:0 28px 80px rgba(30,36,65,.20)!important;backdrop-filter:blur(22px)!important}.account-drawer{border-radius:23px 0 0 23px!important}.drawer-user{border-color:#E6E8EF!important}.drawer-user b,.safety-head h3,.prefs-head h3{color:#202536!important}.drawer-user span,.safety-head small,.prefs-head small,.safety-foot,.prefs-foot{color:#8A92A1!important}.drawer-profile{color:#5E56DF!important}.drawer-divider{background:#E8EAF0!important}.drawer-link{color:#4D5668!important;border-radius:12px!important}.drawer-link:hover{background:#F5F6FA!important;color:#5E56DF!important}.drawer-theme-switch{background:#E8EAF0!important}.drawer-theme-switch i{background:#fff!important}.drawer-logout{color:#C55B64!important}.safety-tool,.pref-row{border-color:#E2E5ED!important;background:#FAFBFC!important;color:#454D60!important;border-radius:14px!important}.safety-tool span span,.pref-row>span>span{color:#8E96A6!important}.safety-tool.live{background:#F3F2FF!important;border-color:#DCD9FF!important}.safety-tool.emergency{background:#FFF7F7!important;border-color:#F4DEDF!important}.support-results{border-color:#E5E7EE!important}.support-title{color:#727B8C!important}.support-list{color:#626B7C!important}.pref-switch{accent-color:#665CF6!important}.voice-select{border-color:#DDE1E9!important;background:#fff!important;color:#40475A!important}.safety-close,.prefs-close{background:#F4F5F8!important;color:#6E7788!important;border-color:#E3E6ED!important}

/* Destination confirmation */
.destination-confirm{z-index:70!important;border:1px solid #DFE3EB!important;border-radius:21px!important;background:rgba(255,255,255,.98)!important;color:#252A3A!important;box-shadow:0 20px 60px rgba(35,41,72,.17)!important;backdrop-filter:blur(20px)!important}.destination-confirm small{color:#7770E6!important}.destination-confirm h3{color:#202536!important}.destination-confirm p{color:#858D9D!important}.destination-edit{border-color:#E1E4EC!important;background:#F7F8FA!important;color:#626B7C!important}.destination-accept{background:#665CF6!important;color:#fff!important}

/* Loading and resume */
.route-loading-overlay{z-index:100!important;background:rgba(233,236,243,.28)!important;backdrop-filter:blur(3px)!important}.route-loading-card{border:1px solid #DFE3EB!important;border-radius:22px!important;background:rgba(255,255,255,.96)!important;color:#252A3A!important;box-shadow:0 22px 70px rgba(34,40,70,.18)!important}.route-loading-card span{color:#8991A1!important}.route-loading-spinner{border-color:#E7E8F1!important;border-top-color:#665CF6!important;border-right-color:#8E87FF!important;box-shadow:none!important}.route-loading-spinner:after{border-color:#E0DFFD!important;border-bottom-color:#665CF6!important}.route-loading-dots i{background:#665CF6!important}.resume-trip-card{border-color:#DFE3EB!important;background:rgba(255,255,255,.98)!important;color:#252A3A!important;box-shadow:0 24px 70px rgba(34,40,70,.18)!important}.resume-trip-head small,.resume-trip-destination small,.resume-trip-metric small{color:#8B93A3!important}.resume-trip-head h3,.resume-trip-destination b,.resume-trip-metric b{color:#252A3A!important}.resume-trip-destination span{color:#858D9D!important}.resume-trip-end{background:#F5F6F9!important;color:#6B7485!important;border-color:#E3E5EC!important}.resume-trip-continue{background:#665CF6!important;color:#fff!important}

/* Navigation mode */
.nav-maneuver-top{border:1px solid #DFE3EB!important;border-radius:20px!important;background:rgba(255,255,255,.97)!important;color:#252A3A!important;box-shadow:0 18px 50px rgba(37,43,75,.14)!important;backdrop-filter:blur(20px)!important}.nav-maneuver-icon{background:#EEEDFF!important;color:#5E56DF!important}.nav-maneuver-copy small{color:#8A92A2!important}.nav-maneuver-copy b{color:#222738!important}.nav-maneuver-copy span{color:#665CF6!important}.nav-street-chip{border:1px solid #DFE3EB!important;background:rgba(255,255,255,.95)!important;color:#363D4F!important;box-shadow:0 12px 34px rgba(37,43,75,.10)!important;backdrop-filter:blur(18px)!important}.nav-recalc-btn{background:#F0EFFF!important;color:#5E56DF!important}.nav-panel.nav-minimal{border:1px solid #DFE3EB!important;border-radius:22px!important;background:rgba(255,255,255,.98)!important;color:#252A3A!important;box-shadow:0 20px 64px rgba(37,43,75,.16)!important;backdrop-filter:blur(22px)!important}.nav-summary-item small{color:#9098A7!important}.nav-summary-item strong{color:#252A3A!important}.nav-search-btn{background:#665CF6!important;color:#fff!important;border:0!important}.nav-control-stack{z-index:44!important}.nav-stack-btn,.nav-audio-toggle{border:1px solid #DDE1EA!important;background:rgba(255,255,255,.94)!important;color:#626B7D!important;box-shadow:0 10px 28px rgba(37,43,75,.10)!important;backdrop-filter:blur(16px)!important}.nav-stack-btn.active,.nav-stack-btn.immersive-active,.nav-audio-toggle.active{border-color:#665CF6!important;background:#665CF6!important;color:#fff!important;box-shadow:0 10px 26px rgba(102,92,246,.22)!important}.floating-speedo{border:1px solid #DFE3EB!important;background:rgba(255,255,255,.95)!important;color:#252A3A!important;box-shadow:0 12px 34px rgba(37,43,75,.11)!important;backdrop-filter:blur(16px)!important}.floating-speedo small,.floating-speedo span{color:#8C94A4!important}.floating-speedo strong{color:#252A3A!important}.nav-map-mode,.nav-tracking,.nav-immersive-chip{border-color:#DFE3EB!important;background:rgba(255,255,255,.95)!important;color:#343A4C!important;box-shadow:0 12px 34px rgba(37,43,75,.10)!important}.nav-map-mode small,.nav-tracking span{color:#8991A1!important}.nav-tracking-live{background:#55C98B!important}.nav-tracking-score{color:#5E56DF!important}.nav-voice-popover{border-color:#DFE3EB!important;background:rgba(255,255,255,.98)!important;color:#343A4C!important;box-shadow:0 18px 48px rgba(37,43,75,.14)!important}.nav-voice-popover select{background:#F7F8FA!important;color:#454D60!important;border-color:#E2E5ED!important}.nav-voice-popover button{background:#665CF6!important;color:#fff!important}.nav-alt-hint{border-color:#DCD9FB!important;background:rgba(255,255,255,.98)!important;color:#303648!important;box-shadow:0 16px 44px rgba(37,43,75,.14)!important}.nav-alt-hint .nav-alt-copy small{color:#665CF6!important}.nav-alt-hint .nav-alt-copy b{color:#252A3A!important}.nav-alt-hint .nav-alt-copy em{color:#8A92A2!important}.nav-alt-accept{background:#665CF6!important;color:#fff!important}.nav-alt-dismiss{background:#F3F4F7!important;color:#7B8494!important}.nav-feedback{border-color:#DFE3EB!important;background:rgba(255,255,255,.96)!important;color:#6C7485!important}.nav-feedback button{background:#F3F4F8!important;color:#5E56DF!important;border-color:#E2E5ED!important}.reroute{color:#6E7788!important}.loading{border-color:#E1E3F5!important;border-top-color:#665CF6!important}
.traffic-radar{border:1px solid #E0E3EB!important;background:rgba(255,255,255,.94)!important;color:#363D4E!important;box-shadow:0 12px 34px rgba(37,43,75,.10)!important;backdrop-filter:blur(16px)!important}.traffic-radar-dot{background:#F6A64D!important}.traffic-radar-copy span{color:#8A92A1!important}

/* Immersive camera chooser */
.immersive-choice{background:rgba(29,32,46,.24)!important;backdrop-filter:blur(10px)!important}.immersive-choice-card{border-color:#DFE3EB!important;background:#fff!important;color:#222738!important;box-shadow:0 28px 90px rgba(34,40,70,.20)!important}.immersive-choice-icon{background:#EEEDFF!important;color:#5E56DF!important}.immersive-choice-head small{color:#665CF6!important}.immersive-choice-head p,.immersive-option span{color:#838C9C!important}.immersive-option{border-color:#E1E4EC!important;background:#F9FAFB!important;color:#343A4C!important}.immersive-option.primary{border-color:#D4D1FA!important;background:#F1F0FF!important}.immersive-option i,.immersive-option svg{color:#5E56DF!important}

/* ============================================================
   DESKTOP / LAPTOP — real desktop map, not a 600px phone canvas.
   ============================================================ */
@media(min-width:900px){
  :root{--v63-edge:24px}
  body:not(.body-nav) .sheet#planSheet{left:var(--v63-edge)!important;right:auto!important;bottom:var(--v63-edge)!important;top:auto!important;width:420px!important;max-width:calc(100vw - 2 * var(--v63-edge))!important;max-height:min(72dvh,700px)!important;padding:11px 12px 12px!important;border-radius:27px!important;transform:none!important;overflow:auto!important;scrollbar-width:thin!important;scrollbar-color:#D5D9E2 transparent!important}
  body:not(.body-nav) .sheet#planSheet.sheet-collapsed,body:not(.body-nav) .sheet#planSheet.sheet-expanded{transform:none!important}
  body:not(.body-nav) .sheet#planSheet.hidden{transform:translateY(calc(100% + 80px))!important;opacity:0!important;pointer-events:none!important}
  body:not(.body-nav) .sheet#planSheet .planner-grab{display:none!important}
  body:not(.body-nav) .floating-locate{left:var(--v63-edge)!important;right:auto!important;top:auto!important;bottom:var(--v63-recenter-bottom,314px)!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important}
  .permission{left:calc(var(--v63-edge) + 432px)!important;right:auto!important;bottom:var(--v63-edge)!important;width:min(430px,calc(100vw - 500px))!important}
  .destination-confirm{left:calc(var(--v63-edge) + 432px)!important;right:auto!important;bottom:var(--v63-edge)!important;width:360px!important}
  .account-drawer{right:0!important;left:auto!important;top:0!important;bottom:0!important;width:min(390px,92vw)!important;max-width:none!important}
  .safety-drawer,.prefs-drawer{right:var(--v63-edge)!important;left:auto!important;top:82px!important;bottom:auto!important;width:390px!important;max-height:calc(100dvh - 108px)!important;border-radius:24px!important;overflow:auto!important}
  .planner-expanded{max-height:270px!important;overflow:auto!important;padding-right:2px!important}
  .routeState,#routeState{overflow:visible!important}
  .mapboxgl-ctrl-bottom-left{left:50%!important}

  /* Active navigation desktop layout */
  body.body-nav .nav-maneuver-top{left:var(--v63-edge)!important;right:auto!important;top:var(--v63-edge)!important;width:430px!important;max-width:calc(100vw - 2 * var(--v63-edge))!important;padding:12px 14px!important}
  body.body-nav .nav-street-chip{left:var(--v63-edge)!important;right:auto!important;top:108px!important;width:430px!important;max-width:calc(100vw - 2 * var(--v63-edge))!important}
  body.body-nav #activeNav.nav-panel.nav-minimal{left:var(--v63-edge)!important;right:auto!important;bottom:var(--v63-edge)!important;width:520px!important;max-width:calc(100vw - 2 * var(--v63-edge))!important;padding:11px!important;border-radius:22px!important;transform:translateY(calc(100% + 80px))!important}
  body.body-nav #activeNav.nav-panel.nav-minimal.show{transform:none!important}
  body.body-nav .nav-control-stack{left:var(--v63-edge)!important;right:auto!important;bottom:146px!important;display:flex!important;flex-direction:row!important;gap:7px!important}
  body.body-nav .nav-stack-btn{width:44px!important;height:44px!important;border-radius:14px!important}
  body.body-nav .nav-audio-toggle{left:228px!important;right:auto!important;bottom:146px!important;width:44px!important;height:44px!important;border-radius:14px!important}
  body.body-nav .floating-speedo{left:282px!important;right:auto!important;bottom:138px!important}
  body.body-nav .nav-alt-hint.show{left:calc(var(--v63-edge) + 442px)!important;right:auto!important;top:var(--v63-edge)!important;width:min(360px,calc(100vw - 500px))!important;transform:none!important}
  body.body-nav .nav-feedback.show{left:calc(var(--v63-edge) + 442px)!important;right:auto!important;top:94px!important;transform:none!important}
  body.body-nav .nav-map-mode{left:calc(var(--v63-edge) + 442px)!important;right:auto!important;top:var(--v63-edge)!important;transform:none!important}
  body.body-nav .nav-tracking{left:50%!important;right:auto!important;top:var(--v63-edge)!important;transform:translateX(-50%)!important}
  body.body-nav .nav-immersive-chip{left:50%!important;right:auto!important;top:var(--v63-edge)!important;transform:translateX(-50%)!important}
}

@media(min-width:900px) and (max-width:1180px){
  :root{--v63-edge:16px}
  body:not(.body-nav) .sheet#planSheet{width:390px!important;max-height:min(74dvh,650px)!important}
  .planner-heading-copy b{font-size:18px!important}.planner-presets{gap:5px!important}.planner-preset{padding:0 7px!important}.nearby-services{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important}.nearby-service{min-height:69px!important}
  .permission{left:418px!important;width:min(390px,calc(100vw - 440px))!important}.destination-confirm{left:418px!important;width:340px!important}
  body.body-nav .nav-maneuver-top,body.body-nav .nav-street-chip{width:390px!important}body.body-nav #activeNav.nav-panel.nav-minimal{width:470px!important}body.body-nav .nav-alt-hint.show,body.body-nav .nav-feedback.show,body.body-nav .nav-map-mode{left:418px!important}
}

/* ============================================================
   MOBILE / TABLET — touch-first and safe-area aware.
   ============================================================ */
@media(max-width:899px){
  :root{--v63-edge:10px}
  .header{top:max(10px,calc(env(safe-area-inset-top) + 7px))!important;right:max(10px,calc(env(safe-area-inset-right) + 7px))!important;width:46px!important;height:46px!important}.header-actions,.options-btn{width:46px!important;height:46px!important}.options-btn{border-radius:15px!important}
  .map-tools{right:max(10px,calc(env(safe-area-inset-right) + 7px))!important;top:max(64px,calc(env(safe-area-inset-top) + 61px))!important}.map-tools .map-btn{width:42px!important;height:42px!important;border-radius:14px!important}
  .guest-trial-pill{top:max(12px,calc(env(safe-area-inset-top) + 8px))!important;left:12px!important;right:auto!important;transform:none!important;max-width:calc(100vw - 80px)!important}
  body:not(.body-nav) .sheet#planSheet{left:max(8px,env(safe-area-inset-left))!important;right:max(8px,env(safe-area-inset-right))!important;bottom:max(8px,calc(env(safe-area-inset-bottom) + 4px))!important;top:auto!important;width:auto!important;max-width:none!important;max-height:min(68dvh,620px)!important;padding:7px 8px max(9px,env(safe-area-inset-bottom))!important;border-radius:23px!important;overflow:auto!important;transform:none!important}
  body:not(.body-nav) .sheet#planSheet.sheet-collapsed{max-height:min(330px,45dvh)!important;transform:none!important}
  body:not(.body-nav) .sheet#planSheet.sheet-expanded{max-height:min(72dvh,650px)!important;transform:none!important}
  body:not(.body-nav) .sheet#planSheet.hidden{transform:translateY(calc(100% + 60px))!important;opacity:0!important;pointer-events:none!important}
  .planner-grab{width:38px!important;height:4px!important;margin:0 auto 7px!important}
  .planner-heading-copy b{font-size:17px!important}.chip-weather.planner-weather{height:31px!important}.planner-presets{display:flex!important;grid-template-columns:none!important;gap:6px!important;overflow-x:auto!important;scrollbar-width:none!important;margin-top:9px!important}.planner-presets::-webkit-scrollbar{display:none}.planner-preset{flex:0 0 118px!important;width:118px!important;height:48px!important;padding:0 8px!important;grid-template-columns:28px minmax(0,1fr)!important;gap:6px!important}.planner-preset-icon{width:28px!important;height:28px!important}.planner-search-row{grid-template-columns:minmax(0,1fr) 54px!important;gap:6px!important;margin-top:7px!important}.planner-search-card.search-card{height:54px!important;min-height:54px!important}.planner-location-row.location-row{height:42px!important;min-height:42px!important;grid-template-columns:28px minmax(0,1fr) 36px!important}.planner-search-card .location-input{height:42px!important;font-size:13px!important}.planner-search-card .row-btn{width:36px!important;height:36px!important}.planner-adjust-btn{width:54px!important;min-width:54px!important;height:54px!important;border-radius:15px!important}.planner-expand-hint{height:23px!important;margin-top:3px!important}.nearby-services{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important}.nearby-service{min-height:68px!important;padding:7px 3px!important}.planner-tip{font-size:7px!important}.planner-expanded{padding-bottom:3px!important}.planner-section-head span{display:none!important}
  body:not(.body-nav) .floating-locate{left:max(10px,calc(env(safe-area-inset-left) + 8px))!important;right:auto!important;bottom:min(48dvh,348px)!important;width:44px!important;height:44px!important;border-radius:14px!important}
  .permission{left:10px!important;right:10px!important;bottom:max(290px,calc(env(safe-area-inset-bottom) + 284px))!important;width:auto!important;border-radius:17px!important}.destination-confirm{left:8px!important;right:8px!important;bottom:max(8px,calc(env(safe-area-inset-bottom) + 4px))!important;width:auto!important}
  .account-drawer{left:auto!important;right:8px!important;top:max(8px,env(safe-area-inset-top))!important;bottom:max(8px,env(safe-area-inset-bottom))!important;width:min(350px,calc(100vw - 16px))!important;border-radius:22px!important}.safety-drawer,.prefs-drawer{left:8px!important;right:8px!important;bottom:max(8px,env(safe-area-inset-bottom))!important;top:auto!important;width:auto!important;max-height:min(76dvh,660px)!important;border-radius:22px!important;overflow:auto!important}
  .mapboxgl-ctrl-logo{transform:scale(.62)!important}.mapboxgl-ctrl-attrib-button{width:24px!important;height:24px!important}.mapboxgl-ctrl-bottom-left{bottom:3px!important}.mapboxgl-ctrl-bottom-right{bottom:3px!important;right:4px!important}

  /* nav mobile */
  body.body-nav .nav-maneuver-top{left:8px!important;right:62px!important;top:max(8px,calc(env(safe-area-inset-top) + 6px))!important;width:auto!important;min-height:70px!important;padding:9px 10px!important;border-radius:18px!important}
  body.body-nav .nav-street-chip{left:8px!important;right:62px!important;top:max(84px,calc(env(safe-area-inset-top) + 82px))!important;width:auto!important}
  body.body-nav #activeNav.nav-panel.nav-minimal{left:8px!important;right:8px!important;bottom:max(8px,calc(env(safe-area-inset-bottom) + 5px))!important;width:auto!important;padding:8px!important;border-radius:20px!important;transform:translateY(calc(100% + 60px))!important}.body-nav #activeNav.nav-panel.nav-minimal.show{transform:none!important}
  body.body-nav .nav-control-stack{left:auto!important;right:8px!important;bottom:max(182px,calc(env(safe-area-inset-bottom) + 178px))!important;display:grid!important;grid-template-columns:1fr!important;gap:6px!important}.body-nav .nav-stack-btn{width:42px!important;height:42px!important;border-radius:14px!important}.body-nav .nav-audio-toggle{left:auto!important;right:8px!important;bottom:max(132px,calc(env(safe-area-inset-bottom) + 128px))!important;width:42px!important;height:42px!important;border-radius:14px!important}.body-nav .floating-speedo{left:auto!important;right:8px!important;bottom:max(74px,calc(env(safe-area-inset-bottom) + 70px))!important}.body-nav .nav-alt-hint.show{left:8px!important;right:8px!important;top:max(128px,calc(env(safe-area-inset-top) + 126px))!important;width:auto!important;transform:none!important}.body-nav .nav-feedback.show{left:8px!important;right:auto!important;top:max(190px,calc(env(safe-area-inset-top) + 188px))!important;transform:none!important}.body-nav .nav-map-mode{left:8px!important;right:62px!important;top:max(128px,calc(env(safe-area-inset-top) + 126px))!important;transform:none!important}.body-nav .nav-tracking,.body-nav .nav-immersive-chip{left:50%!important;right:auto!important;top:max(8px,calc(env(safe-area-inset-top) + 6px))!important;transform:translateX(-50%)!important}
}

@media(max-width:430px){
  .header{right:max(7px,env(safe-area-inset-right))!important}.map-tools{right:max(7px,env(safe-area-inset-right))!important}.guest-trial-pill{left:8px!important}.planner-heading-copy b{font-size:16px!important}.planner-preset{flex-basis:108px!important;width:108px!important}.planner-preset small{max-width:64px!important}.planner-search-row{grid-template-columns:minmax(0,1fr) 50px!important}.planner-adjust-btn{width:50px!important;min-width:50px!important}.planner-adjust-btn span{display:none!important}.nearby-services{grid-template-columns:repeat(4,minmax(0,1fr))!important}.nearby-service small{display:none!important}.route-head h2{font-size:16px!important}.route-time span{font-size:20px!important}.segment button,.travel button{font-size:7.5px!important}.route-insight .insight{padding-inline:4px!important}.route-insight span{font-size:6px!important}.preview-actions{gap:5px!important}.preview-actions .sub-action{font-size:7px!important}
}
@media(max-width:350px){.planner-preset{flex-basis:99px!important;width:99px!important}.planner-preset-icon{width:26px!important;height:26px!important}.planner-heading-copy b{font-size:15px!important}.chip-weather.planner-weather{display:none!important}.planner-search-card .location-input{font-size:12px!important}.nearby-services{grid-template-columns:repeat(3,minmax(0,1fr))!important}.route-insight{grid-template-columns:1fr 1fr 1fr!important}.segment,.travel{gap:4px!important}.segment button,.travel button{padding-inline:3px!important}.map-tools .map-btn,.options-btn{box-shadow:0 7px 20px rgba(37,44,77,.09)!important}}

/* Black appearance: same geometry, no separate layout. */
html[data-vaizu-theme="black"] .ws-app{background:#0B0D13!important;color:#F2F3F7!important}html[data-vaizu-theme="black"] #map{background:#11141B!important}html[data-vaizu-theme="black"] .map-vignette{background:linear-gradient(180deg,rgba(9,11,16,.30),transparent 24%,transparent 72%,rgba(5,7,10,.17))!important}
html[data-vaizu-theme="black"] .sheet#planSheet,html[data-vaizu-theme="black"] .options-btn,html[data-vaizu-theme="black"] .map-tools .map-btn,html[data-vaizu-theme="black"] .floating-locate,html[data-vaizu-theme="black"] .permission,html[data-vaizu-theme="black"] .destination-confirm,html[data-vaizu-theme="black"] .account-drawer,html[data-vaizu-theme="black"] .safety-drawer,html[data-vaizu-theme="black"] .prefs-drawer,html[data-vaizu-theme="black"] .nav-maneuver-top,html[data-vaizu-theme="black"] .nav-street-chip,html[data-vaizu-theme="black"] .nav-panel.nav-minimal,html[data-vaizu-theme="black"] .floating-speedo,html[data-vaizu-theme="black"] .nav-stack-btn,html[data-vaizu-theme="black"] .nav-audio-toggle,html[data-vaizu-theme="black"] .nav-map-mode,html[data-vaizu-theme="black"] .nav-tracking,html[data-vaizu-theme="black"] .nav-voice-popover,html[data-vaizu-theme="black"] .nav-alt-hint,html[data-vaizu-theme="black"] .nav-feedback,html[data-vaizu-theme="black"] .traffic-radar,html[data-vaizu-theme="black"] .route-loading-card,html[data-vaizu-theme="black"] .resume-trip-card{background:rgba(18,21,29,.95)!important;border-color:#2B303C!important;color:#F2F3F6!important;box-shadow:0 18px 54px rgba(0,0,0,.32)!important}
html[data-vaizu-theme="black"] .planner-heading-copy b,html[data-vaizu-theme="black"] .route-head h2,html[data-vaizu-theme="black"] .route-card h3,html[data-vaizu-theme="black"] .nav-maneuver-copy b,html[data-vaizu-theme="black"] .nav-summary-item strong,html[data-vaizu-theme="black"] .floating-speedo strong,html[data-vaizu-theme="black"] .drawer-user b,html[data-vaizu-theme="black"] .safety-head h3,html[data-vaizu-theme="black"] .prefs-head h3,html[data-vaizu-theme="black"] .destination-confirm h3{color:#F2F3F7!important}
html[data-vaizu-theme="black"] .planner-preset,html[data-vaizu-theme="black"] .planner-search-card.search-card,html[data-vaizu-theme="black"] .planner-adjust-btn,html[data-vaizu-theme="black"] .nearby-service,html[data-vaizu-theme="black"] .segment button,html[data-vaizu-theme="black"] .travel button,html[data-vaizu-theme="black"] .route-card,html[data-vaizu-theme="black"] .route-insight .insight,html[data-vaizu-theme="black"] .preview-actions .sub-action,html[data-vaizu-theme="black"] .safety-tool,html[data-vaizu-theme="black"] .pref-row,html[data-vaizu-theme="black"] .parking-nearby,html[data-vaizu-theme="black"] .parking-item{background:#181B24!important;border-color:#2B303B!important;color:#D8DCE5!important}html[data-vaizu-theme="black"] .planner-search-card .location-input{color:#F2F3F7!important}html[data-vaizu-theme="black"] .planner-search-card .row-btn,html[data-vaizu-theme="black"] .planner-preset-icon,html[data-vaizu-theme="black"] .nearby-service-icon,html[data-vaizu-theme="black"] .nav-recalc-btn{background:#24213F!important;color:#AAA5FF!important}html[data-vaizu-theme="black"] .segment button.active,html[data-vaizu-theme="black"] .travel button.active{background:#24213F!important;border-color:#3A3569!important;color:#BBB7FF!important}html[data-vaizu-theme="black"] .mapboxgl-popup-content{background:#171A22!important;border-color:#2B303B!important;color:#F2F3F7!important}html[data-vaizu-theme="black"] .mapboxgl-popup-tip{border-top-color:#171A22!important}html[data-vaizu-theme="black"] .mapboxgl-ctrl-attrib.mapboxgl-compact{background:rgba(17,20,28,.85)!important;border-color:#2B303A!important;color:#B6BCC8!important}

@media(prefers-reduced-motion:reduce){.sheet#planSheet,.options-btn,.map-btn,.floating-locate,.nav-stack-btn,.nav-audio-toggle,.auth-sheet{transition:none!important}}

/* V63 cascade locks against older responsive/tablet rules. */
.ws-app #quickRecent{display:grid!important}.ws-app #quickRecentTop{display:grid!important}
.ws-app .account-drawer{left:auto!important;right:0!important;top:0!important;bottom:0!important;width:min(390px,92vw)!important;max-height:none!important;overflow:auto!important;opacity:1!important;pointer-events:none!important;transform:translateX(calc(100% + 42px))!important;transition:transform .24s cubic-bezier(.2,.78,.2,1)!important}
.ws-app .account-drawer.show{transform:none!important;pointer-events:auto!important}
.ws-app .account-backdrop{opacity:0!important;pointer-events:none!important}.ws-app .account-backdrop.show{opacity:1!important;pointer-events:auto!important}
@media(max-width:899px){.ws-app .account-drawer{right:8px!important;top:max(8px,env(safe-area-inset-top))!important;bottom:max(8px,env(safe-area-inset-bottom))!important;width:min(350px,calc(100vw - 16px))!important;border-radius:22px!important}}

/* Compact default state. Nearby discovery opens intentionally. */
.sheet#planSheet.sheet-collapsed .planner-expanded{display:none!important}.sheet#planSheet.sheet-expanded .planner-expanded{display:block!important}
.planner-expand-hint{width:100%!important;padding:0!important;border:0!important;background:transparent!important;cursor:pointer!important}.planner-expand-hint[aria-expanded="true"] svg{transform:rotate(180deg)!important}
.segment button.smart{display:flex!important}
body.body-nav .guest-trial-pill{display:none!important}
@media(max-width:899px){body:not(.body-nav) .floating-locate{bottom:var(--v63-recenter-bottom,min(48dvh,348px))!important}}

/* Final interaction locks — neutralize legacy collapsed opacity / hidden overlays. */
.ws-app .sheet#planSheet.sheet-collapsed .welcome.planner-welcome{opacity:1!important;pointer-events:auto!important}
.ws-app .sheet#planSheet.sheet-collapsed #routeState{opacity:1!important;pointer-events:auto!important}
.ws-app .toast{visibility:hidden!important;opacity:0!important;pointer-events:none!important;transform:translate(-50%,-170%)!important}
.ws-app .toast.show{visibility:visible!important;opacity:1!important;pointer-events:auto!important;transform:translate(-50%,0)!important}
.ws-app .guest-limit-modal{position:fixed!important;z-index:1200!important;inset:0!important;display:grid!important;place-items:center!important;padding:18px!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important;transition:opacity .2s ease,visibility .2s ease!important}
.ws-app .guest-limit-modal.show{visibility:visible!important;opacity:1!important;pointer-events:auto!important}
.ws-app .guest-limit-backdrop{position:absolute!important;inset:0!important;border:0!important;background:rgba(23,27,39,.34)!important;backdrop-filter:blur(8px)!important}
.ws-app .guest-limit-card{position:relative!important;z-index:1!important;width:min(420px,calc(100vw - 28px))!important;padding:22px!important;border:1px solid #E1E4EC!important;border-radius:24px!important;background:rgba(255,255,255,.98)!important;color:#222738!important;box-shadow:0 28px 90px rgba(31,37,66,.22)!important;text-align:left!important}
.ws-app .guest-limit-icon{width:44px!important;height:44px!important;display:grid!important;place-items:center!important;border-radius:14px!important;background:#F0EFFF!important;color:#665CF6!important}.ws-app .guest-limit-card>small{display:block!important;margin-top:15px!important;color:#665CF6!important;font-size:8px!important;font-weight:950!important;letter-spacing:.13em!important}.ws-app .guest-limit-card h2{margin:5px 0 0!important;font-size:25px!important;letter-spacing:-.8px!important}.ws-app .guest-limit-card p{margin:8px 0 0!important;color:#747D8F!important;font-size:11px!important;line-height:1.55!important}.ws-app .guest-limit-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:18px!important}.ws-app .guest-limit-primary,.ws-app .guest-limit-secondary,.ws-app .guest-limit-later{min-height:46px!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:13px!important;font-size:10px!important;font-weight:900!important}.ws-app .guest-limit-primary{background:#665CF6!important;color:#fff!important}.ws-app .guest-limit-secondary{border:1px solid #E1E4EC!important;background:#F7F8FA!important;color:#394154!important}.ws-app .guest-limit-later{width:100%!important;margin-top:8px!important;border:0!important;background:transparent!important;color:#838B9A!important;min-height:36px!important}
html[data-vaizu-theme="black"] .ws-app .guest-limit-card{background:#151821!important;border-color:#2B303B!important;color:#F3F4F7!important}html[data-vaizu-theme="black"] .ws-app .guest-limit-secondary{background:#1B1F29!important;border-color:#303644!important;color:#E4E7ED!important}
@media(max-width:520px){.ws-app .guest-limit-modal{align-items:end!important;padding:8px!important}.ws-app .guest-limit-card{width:100%!important;border-radius:22px!important;padding:19px!important}.ws-app .guest-limit-actions{grid-template-columns:1fr!important}}


/* bundled vaizu-map-v64.css */
/* VAIZO V64 — focused polish requested after V63.
   This file intentionally changes only search results, nearby/support reliability UI,
   route alternatives, preview controls, navigation camera chooser and active HUD. */

/* Search results: on phones they open upward from the search field. */
@media (max-width: 899px){
  .planner-search-card .search-results{
    top:auto!important;
    bottom:calc(100% + 7px)!important;
    max-height:min(42dvh,340px)!important;
    overscroll-behavior:contain!important;
    scroll-padding-top:6px!important;
    z-index:96!important;
  }
  .planner-search-card .search-results.show{animation:v64ResultsUp .16s ease-out both!important}
}
@keyframes v64ResultsUp{from{opacity:0;transform:translateY(7px) scale(.99)}to{opacity:1;transform:none}}

/* Alternatives stay in one fluid horizontal row. */
.route-variants{
  display:flex!important;
  grid-template-columns:none!important;
  gap:7px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x proximity!important;
  scrollbar-width:none!important;
  -webkit-overflow-scrolling:touch!important;
  padding:1px 1px 4px!important;
  margin:7px 0 8px!important;
}
.route-variants::-webkit-scrollbar{display:none!important}
.route-variant{
  flex:0 0 clamp(104px,27%,132px)!important;
  min-width:104px!important;
  max-width:132px!important;
  min-height:54px!important;
  scroll-snap-align:start!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  border-radius:14px!important;
  padding:8px 10px!important;
  background:#F8F9FB!important;
  border:1px solid #E2E5EC!important;
  color:#475064!important;
  box-shadow:none!important;
}
.route-variant b{font-size:12px!important;line-height:1!important;color:#2F3547!important;letter-spacing:-.2px!important}
.route-variant span{font-size:7.2px!important;line-height:1.25!important;color:#8B93A2!important;margin-top:5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.route-variant.active{background:#EFEEFF!important;border-color:#CFCBFA!important;box-shadow:0 6px 18px rgba(102,92,246,.10)!important}
.route-variant.active b,.route-variant.active span{color:#5F57DF!important}
@media(max-width:430px){.route-variant{flex-basis:112px!important;min-width:112px!important;max-width:112px!important}}

/* Preview cancellation appears as a separate X beside the recenter/calibrate button. */
.floating-preview-cancel{
  position:absolute!important;
  z-index:42!important;
  width:48px!important;
  height:48px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:1px solid #E2E5EC!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.97)!important;
  color:#6B7282!important;
  box-shadow:0 13px 32px rgba(37,44,77,.12)!important;
  backdrop-filter:blur(18px)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:scale(.92)!important;
  transition:opacity .16s ease,transform .16s ease,visibility .16s!important;
}
.floating-preview-cancel.show{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important}
.floating-preview-cancel:active{transform:scale(.96)!important}
.route-previewing #recenterBtn{box-shadow:0 13px 32px rgba(37,44,77,.12),0 0 0 4px rgba(102,92,246,.08)!important}
@media(max-width:899px){.floating-preview-cancel{width:44px!important;height:44px!important;border-radius:14px!important}}

/* Camera chooser: two identical stacked choices, easier to tap and impossible to collide. */
.immersive-choice-card{width:min(500px,calc(100vw - 28px))!important;padding:20px!important;border-radius:24px!important}
.immersive-options{display:flex!important;flex-direction:column!important;grid-template-columns:none!important;gap:9px!important;margin-top:17px!important}
.immersive-option,.immersive-option.primary{
  width:100%!important;
  min-height:78px!important;
  display:grid!important;
  grid-template-columns:46px minmax(0,1fr) 22px!important;
  align-items:center!important;
  gap:11px!important;
  padding:11px 12px!important;
  text-align:left!important;
  border:1px solid #E2E5EC!important;
  border-radius:17px!important;
  background:#FAFBFC!important;
  color:#303649!important;
  box-shadow:none!important;
}
.immersive-option:hover{border-color:#CBC8F8!important;background:#F7F6FF!important}
.immersive-option-icon{width:46px!important;height:46px!important;display:grid!important;place-items:center!important;border-radius:14px!important;background:#EFEEFF!important;color:#625BE3!important}
.immersive-option-copy{display:block!important;min-width:0!important}
.immersive-option-copy b{display:block!important;font-size:14px!important;line-height:1.1!important;color:#292F41!important}
.immersive-option-copy>span{display:block!important;margin-top:5px!important;font-size:9px!important;line-height:1.4!important;color:#7E8797!important}
.immersive-option-arrow{color:#A3AABA!important}
@media(max-width:420px){
  .immersive-choice{padding:10px!important}
  .immersive-choice-card{padding:15px!important;border-radius:21px!important}
  .immersive-choice-head h3{font-size:18px!important}
  .immersive-option,.immersive-option.primary{min-height:74px!important;grid-template-columns:42px minmax(0,1fr) 18px!important;padding:10px!important}
  .immersive-option-icon{width:42px!important;height:42px!important;border-radius:13px!important}
}

/* Active navigation HUD: compact route info card and street chip directly above it. */
body.body-nav #activeNav.nav-panel.nav-minimal{
  padding:7px!important;
  border-radius:19px!important;
  overflow:visible!important;
}
body.body-nav .nav-summary-row{grid-template-columns:repeat(3,minmax(0,1fr)) 46px!important;gap:5px!important}
body.body-nav .nav-summary-item{
  height:46px!important;
  padding:0 8px!important;
  border-radius:12px!important;
  background:#FAFBFC!important;
  border:1px solid #E5E7EE!important;
}
body.body-nav .nav-summary-item small{font-size:6px!important;letter-spacing:.09em!important;color:#929AA8!important}
body.body-nav .nav-summary-item strong{font-size:10.5px!important;margin-top:2px!important;color:#2D3345!important}
body.body-nav .nav-search-btn{width:46px!important;height:46px!important;border-radius:13px!important;box-shadow:none!important}
body.body-nav .nav-street-chip{
  top:auto!important;
  right:auto!important;
  width:max-content!important;
  max-width:min(72vw,340px)!important;
  min-width:0!important;
  height:auto!important;
  min-height:32px!important;
  padding:7px 12px!important;
  border-radius:12px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  font-size:10px!important;
  font-weight:850!important;
  line-height:1.15!important;
  box-shadow:0 9px 24px rgba(37,43,75,.10)!important;
}
body.body-nav .nav-street-chip span{display:block!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
body.body-nav .nav-control-stack{z-index:45!important}
body.body-nav .nav-stack-btn{box-shadow:0 8px 22px rgba(37,43,75,.09)!important}

/* Route feedback card: clean, compact and tap-friendly. */
body.body-nav .nav-feedback.show{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:9px!important;
  padding:7px!important;
  border-radius:15px!important;
  min-height:46px!important;
  max-width:min(370px,calc(100vw - 16px))!important;
}
.nav-feedback-copy{display:flex!important;align-items:center!important;gap:7px!important;min-width:0!important;padding-left:3px!important;color:#625BE3!important}
.nav-feedback-copy>span{display:block!important;min-width:0!important;margin:0!important}
.nav-feedback-copy small{display:block!important;font-size:5.8px!important;font-weight:950!important;letter-spacing:.1em!important;color:#9AA1AE!important;line-height:1!important}
.nav-feedback-copy b{display:block!important;margin-top:3px!important;font-size:9px!important;line-height:1!important;color:#3B4254!important;white-space:nowrap!important}
.nav-feedback-actions{display:flex!important;gap:5px!important}
body.body-nav .nav-feedback button{height:32px!important;padding:0 8px!important;display:flex!important;align-items:center!important;gap:4px!important;border-radius:10px!important;font-size:7.4px!important}

/* Black mode keeps exactly the same geometry. */
html[data-vaizu-theme="black"] .route-variant,
html[data-vaizu-theme="black"] .immersive-option,
html[data-vaizu-theme="black"] .immersive-option.primary,
html[data-vaizu-theme="black"] body.body-nav .nav-summary-item,
html[data-vaizu-theme="black"] .floating-preview-cancel{background:#181B24!important;border-color:#2B303B!important;color:#DCE0E7!important}
html[data-vaizu-theme="black"] .route-variant b,
html[data-vaizu-theme="black"] .immersive-option-copy b,
html[data-vaizu-theme="black"] body.body-nav .nav-summary-item strong,
html[data-vaizu-theme="black"] .nav-feedback-copy b{color:#F0F2F6!important}
html[data-vaizu-theme="black"] .route-variant span,
html[data-vaizu-theme="black"] .immersive-option-copy>span{color:#969EAC!important}
html[data-vaizu-theme="black"] .route-variant.active{background:#24213F!important;border-color:#3B3769!important}
html[data-vaizu-theme="black"] .immersive-option-icon{background:#24213F!important;color:#B4B0FF!important}

@media(prefers-reduced-motion:reduce){.planner-search-card .search-results.show,.floating-preview-cancel{animation:none!important;transition:none!important}}

/* V64 final conflict guards against legacy flex/grid sizing. */
.route-variants{flex-wrap:nowrap!important;align-items:stretch!important}
.route-variant{width:auto!important}

/* V64 final specificity guard: keep route alternatives in one fluid row even over legacy responsive rules. */
.ws-app .route-variants{
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:stretch!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  overscroll-behavior-x:contain!important;
  scroll-snap-type:x proximity!important;
  -webkit-overflow-scrolling:touch!important;
}
.ws-app .route-variant{
  flex:0 0 clamp(104px,27%,132px)!important;
  width:auto!important;
  min-width:104px!important;
  max-width:132px!important;
  scroll-snap-align:start!important;
}
@media(max-width:430px){
  .ws-app .route-variant{
    flex:0 0 112px!important;
    width:112px!important;
    min-width:112px!important;
    max-width:112px!important;
  }
}

/* V64 mobile search portal: results escape the bottom-sheet scroll area and open upward. */
@media(max-width:899px){
  .ws-app>.search-results.search-results-portal{
    position:absolute!important;
    display:none;
    z-index:96!important;
    margin:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    border:1px solid #E1E5ED!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.985)!important;
    color:#202536!important;
    box-shadow:0 20px 48px rgba(31,38,55,.18)!important;
  }
  .ws-app>.search-results.search-results-portal.show{display:block!important}
  html[data-vaizu-theme="black"] .ws-app>.search-results.search-results-portal{
    background:rgba(18,21,29,.985)!important;
    border-color:#2B303C!important;
    color:#F2F3F6!important;
    box-shadow:0 20px 48px rgba(0,0,0,.36)!important;
  }
}


/* bundled vaizu-map-v65.css */
/* VAIZO V65 — compact mobile free-map indicator.
   Scope: legacy free-map navigation chip styles retained for compatibility. */

@media (max-width: 899px){
  body.body-nav .nav-map-mode.show{
    left:10px!important;
    right:auto!important;
    top:max(128px,calc(env(safe-area-inset-top) + 126px))!important;
    width:max-content!important;
    max-width:132px!important;
    min-width:0!important;
    min-height:32px!important;
    padding:7px 10px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:6px!important;
    border-radius:999px!important;
    line-height:1!important;
    box-shadow:0 8px 22px rgba(37,43,75,.10)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
  }
  body.body-nav .nav-map-mode.show>svg{
    width:13px!important;
    height:13px!important;
    min-width:13px!important;
    flex:0 0 13px!important;
  }
  body.body-nav .nav-map-mode.show>span{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
  }
  body.body-nav .nav-map-mode.show b{
    display:block!important;
    margin:0!important;
    font-size:9px!important;
    font-weight:900!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  body.body-nav .nav-map-mode.show small{
    display:none!important;
  }
}

@media (max-width: 360px){
  body.body-nav .nav-map-mode.show{
    left:8px!important;
    max-width:120px!important;
    min-height:30px!important;
    padding:6px 9px!important;
  }
}


/* bundled vaizu-map-v69.css */
/* ================================================================
   VAIZO V69 — MAP ONLY / MOBILE POLISH
   Scope: templates/index.html only. No backend/auth/database changes.
   ================================================================ */

:root{
  --v69-purple:#5b5ce2;
  --v69-purple-strong:#4d4fd6;
  --v69-safe-top:max(8px, env(safe-area-inset-top));
  --v69-safe-bottom:max(8px, env(safe-area-inset-bottom));
  --v69-edge:8px;
  --planner-collapsed-h:118px;
}

body[data-mood="day"], body:not([data-mood]){
  --v69-panel:rgba(255,255,255,.94);
  --v69-panel-solid:#fff;
  --v69-panel-soft:rgba(247,249,252,.96);
  --v69-text:#202636;
  --v69-muted:#727d90;
  --v69-faint:#9099a9;
  --v69-line:rgba(28,35,49,.085);
  --v69-line-strong:rgba(28,35,49,.13);
  --v69-shadow:0 12px 32px rgba(28,38,55,.12);
  --v69-shadow-lg:0 20px 54px rgba(28,38,55,.16);
}
body[data-mood="night"]{
  --v69-panel:rgba(15,18,24,.94);
  --v69-panel-solid:#12161d;
  --v69-panel-soft:rgba(20,24,31,.96);
  --v69-text:#f4f6f9;
  --v69-muted:#a2aab7;
  --v69-faint:#7d8694;
  --v69-line:rgba(255,255,255,.085);
  --v69-line-strong:rgba(255,255,255,.14);
  --v69-shadow:0 12px 32px rgba(0,0,0,.25);
  --v69-shadow-lg:0 20px 56px rgba(0,0,0,.35);
}

/* Global overflow protection for every map card. */
.ws-app *, .ws-app *::before, .ws-app *::after{box-sizing:border-box}
.ws-app button,.ws-app input,.ws-app select{max-width:100%}
.ws-app .result-copy,.ws-app .nav-maneuver-copy,.ws-app .nav-alt-copy,
.ws-app .nav-feedback-copy,.ws-app .start-trip-copy,.ws-app .welcome,
.ws-app .parking-head>div,.ws-app .route-head>div,.ws-app .support-item>span,
.ws-app .pref-row>div,.ws-app .safety-tool>span{min-width:0}

@media (max-width:899px){
  html,body{width:100%;height:100%;height:100dvh;overflow:hidden}
  .ws-app{width:100%;max-width:none!important;height:100dvh!important;min-height:100svh;margin:0!important}

  /* Header — fixed safe margins, no collision with notches. */
  .header{
    left:var(--v69-edge)!important;
    right:var(--v69-edge)!important;
    top:var(--v69-safe-top)!important;
    gap:6px!important;
  }
  .brand{
    min-width:0;
    height:44px!important;
    padding:0 10px 0 7px!important;
    border-radius:16px!important;
  }
  .brand-logo{width:30px!important;height:30px!important;flex:0 0 30px;border-radius:11px!important}
  .brand-copy{min-width:0}
  .brand-copy b{font-size:12.5px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .brand-copy span{font-size:8px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .header-actions{flex:0 0 auto;gap:5px!important}
  .icon-btn{width:44px!important;height:44px!important;border-radius:15px!important;flex:0 0 44px}

  /* Search — always inside screen, with enough room for touch. */
  .search-card{
    left:var(--v69-edge)!important;
    right:var(--v69-edge)!important;
    top:max(58px,calc(env(safe-area-inset-top) + 50px))!important;
    width:auto!important;
    padding:5px!important;
    border-radius:20px!important;
  }
  .search-card .location-row{
    min-height:52px!important;
    height:auto!important;
    grid-template-columns:27px minmax(0,1fr) 38px!important;
    gap:3px!important;
    padding:0 2px!important;
    border-radius:15px!important;
  }
  .search-card .location-input{
    min-width:0!important;
    width:100%!important;
    height:50px!important;
    padding:0 4px!important;
    font-size:13.5px!important;
    line-height:1.2!important;
    text-overflow:ellipsis;
  }
  .search-card .row-btn{width:36px!important;height:36px!important;border-radius:11px!important}
  .search-shortcuts{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
  .search-shortcuts::-webkit-scrollbar{display:none}
  .chip-shortcut,.chip-weather{flex:0 0 auto;max-width:160px}
  .chip-shortcut span,.chip-weather span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  /* Search results — text can never eat icons/meta or leave viewport. */
  .search-results,.search-results.search-results-portal{
    max-width:calc(100% - (var(--v69-edge) * 2))!important;
    border-radius:18px!important;
    padding:5px!important;
    overscroll-behavior:contain;
    scrollbar-width:none;
  }
  .search-results::-webkit-scrollbar{display:none}
  .search-item{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:36px minmax(0,1fr) auto!important;
    gap:8px!important;
    min-height:58px!important;
    padding:8px!important;
    border-radius:14px!important;
    overflow:hidden;
  }
  .search-item.rich.has-photo{grid-template-columns:52px minmax(0,1fr) auto!important}
  .search-item.rich.no-photo{grid-template-columns:minmax(0,1fr) auto!important}
  .place-thumb{width:52px!important;height:52px!important;border-radius:12px!important}
  .result-copy b,.result-address,.result-copy small{
    display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .result-copy b{font-size:11.5px!important;line-height:1.25!important}
  .result-address{font-size:8px!important;line-height:1.3!important}
  .result-meta{max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  /* Floating map controls — geometry follows header/search and sheet. */
  .status-chip{
    left:var(--v69-edge)!important;
    top:max(166px,calc(env(safe-area-inset-top) + 158px))!important;
    max-width:min(60%,220px)!important;
    height:32px!important;
    padding:0 10px!important;
  }
  .status-chip span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .map-tools{
    right:var(--v69-edge)!important;
    top:max(166px,calc(env(safe-area-inset-top) + 158px))!important;
    gap:6px!important;
  }
  .map-btn{width:43px!important;height:43px!important;border-radius:14px!important}
  .gps-quality{
    right:58px!important;
    top:max(171px,calc(env(safe-area-inset-top) + 163px))!important;
    max-width:130px;
  }
  .floating-locate{
    left:var(--v69-edge)!important;
    width:48px!important;height:48px!important;border-radius:16px!important;
    transition:bottom .34s cubic-bezier(.22,.82,.24,1),transform .16s ease,opacity .2s ease!important;
  }

  /* Bottom planner sheet — smooth, predictable, safe-area aware. */
  .sheet{
    left:6px!important;
    right:6px!important;
    width:auto!important;
    bottom:max(6px,env(safe-area-inset-bottom))!important;
    max-height:calc(100dvh - max(64px,calc(env(safe-area-inset-top) + 56px)))!important;
    padding:7px 10px max(10px,env(safe-area-inset-bottom))!important;
    border-radius:28px!important;
    overflow:hidden!important;
    transform:translateY(var(--planner-drag-y,0px));
    transition:transform .38s cubic-bezier(.22,.82,.24,1),opacity .24s ease,box-shadow .28s ease!important;
    will-change:transform;
    contain:layout paint;
  }
  .sheet.sheet-dragging{transition:none!important;user-select:none;-webkit-user-select:none}
  .sheet.sheet-collapsed{
    transform:translateY(calc(100% - var(--planner-collapsed-h) + var(--planner-drag-y,0px)))!important;
  }
  .sheet.hidden{transform:translateY(calc(100% + 28px))!important}
  .sheet #routeState{
    max-height:calc(100dvh - max(175px,calc(env(safe-area-inset-top) + 165px)))!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    scrollbar-width:none;
    padding-bottom:2px;
  }
  .sheet #routeState::-webkit-scrollbar{display:none}
  .sheet.sheet-collapsed #routeState{pointer-events:none;overflow:hidden!important}
  .sheet.sheet-collapsed .welcome p{opacity:.72}

  .grab{
    width:46px!important;height:5px!important;
    padding:9px 0!important;
    margin:-5px auto 4px!important;
    border-radius:999px!important;
    background-clip:content-box!important;
    transition:width .22s ease,background .22s ease!important;
  }
  .sheet.sheet-dragging .grab{width:58px!important}

  /* Welcome/actions — no clipped content. */
  .welcome{padding:0 1px 2px!important}
  .welcome-top{gap:9px!important;align-items:center!important}
  .welcome h1{font-size:17px!important;line-height:1.18!important;overflow-wrap:anywhere}
  .welcome p{font-size:9.5px!important;line-height:1.42!important;margin-top:4px!important}
  .safety-orb{flex:0 0 44px!important;width:44px!important;height:44px!important;border-radius:15px!important}
  .quick-grid{gap:6px!important;margin-top:9px!important;overflow-x:auto!important;scrollbar-width:none}
  .quick-grid::-webkit-scrollbar{display:none}
  .quick{flex:0 0 auto;min-width:max-content;max-width:170px;min-height:42px!important;padding:7px 10px!important;border-radius:14px!important}
  .quick b{font-size:9px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .quick span{font-size:7px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  /* Route chooser/cards — every grid item is allowed to shrink. */
  .travel,.segment{width:100%;min-width:0}
  .travel button,.segment button{min-width:0;min-height:40px;line-height:1.15}
  .travel button{white-space:nowrap}
  .route-variants{gap:6px!important;max-width:100%;overflow-x:auto!important;scrollbar-width:none}
  .route-variants::-webkit-scrollbar{display:none}
  .route-variant{flex:0 0 auto;min-width:94px!important;max-width:124px!important;padding:8px!important}
  .route-variant b,.route-variant span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  .route-card,.parking-nearby,.route-insight,.safety-strip{max-width:100%;overflow:hidden}
  .route-head{gap:8px!important;min-width:0}
  .route-head h2,.route-head b,.route-head strong{overflow-wrap:anywhere}
  .route-time{flex:0 0 auto;white-space:nowrap}
  .route-meta,.route-ai,.risk-note,.disclaimer{overflow-wrap:anywhere;word-break:normal}
  .route-ai{max-width:100%}

  .parking-head{gap:8px!important;min-width:0}
  .parking-head b,.parking-head small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #parkingSource{flex:0 0 auto;max-width:42%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .parking-item{min-width:0;overflow:hidden}
  .parking-item b,.parking-item span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  .route-insight{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
  .insight{min-width:0;padding:7px 4px!important}
  .insight strong{font-size:10px!important;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .insight span{font-size:6px!important;line-height:1.25!important;overflow-wrap:anywhere}

  .start-trip-cta{
    width:100%!important;min-width:0!important;
    grid-template-columns:36px minmax(0,1fr) 24px!important;
    gap:8px!important;
    min-height:55px!important;
    border-radius:17px!important;
  }
  .start-trip-copy b{font-size:11.5px!important;line-height:1.2!important}
  .start-trip-copy small{font-size:7px!important;line-height:1.25!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
  .start-trip-arrow{font-size:24px!important}

  .sub-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
  .sub-action{min-width:0!important;min-height:42px!important;padding:6px 4px!important;font-size:8px!important;line-height:1.15!important;border-radius:13px!important}
  .sub-action svg{flex:0 0 auto}

  /* Active navigation: maneuver can wrap to two lines instead of disappearing. */
  .body-nav .nav-maneuver-top{
    left:8px!important;right:8px!important;
    top:var(--v69-safe-top)!important;
    min-height:70px!important;height:auto!important;
    padding:9px 10px!important;
    border-radius:21px!important;
    gap:9px!important;
  }
  .nav-maneuver-icon{width:48px!important;height:48px!important;flex:0 0 48px!important;border-radius:16px!important}
  .nav-maneuver-copy b{
    font-size:15px!important;line-height:1.15!important;
    white-space:normal!important;
    overflow:hidden!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
  .nav-maneuver-copy span{font-size:9px!important;line-height:1.25!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  .nav-panel.nav-minimal{
    left:6px!important;right:6px!important;
    bottom:max(6px,env(safe-area-inset-bottom))!important;
    width:auto!important;
    padding:7px!important;
    border-radius:23px!important;
    overflow:hidden!important;
  }
  .nav-summary-row{grid-template-columns:repeat(3,minmax(0,1fr)) 46px!important;gap:5px!important}
  .nav-summary-item{min-width:0!important;height:50px!important;padding:0 7px!important;border-radius:13px!important}
  .nav-summary-item small{font-size:6px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .nav-summary-item strong{font-size:10.5px!important;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .nav-search-btn{width:46px!important;height:50px!important;border-radius:13px!important}

  .body-nav .nav-street-chip{
    min-width:0!important;
    width:min(62vw,265px)!important;
    max-width:calc(100vw - 142px)!important;
    height:auto!important;min-height:38px!important;
    padding:7px 10px!important;
    border-radius:13px!important;
  }
  .nav-street-chip span{font-size:10px!important;line-height:1.2!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  .nav-alt-hint,.nav-feedback{
    left:8px!important;right:8px!important;width:auto!important;max-width:none!important;
    overflow:hidden!important;
  }
  .nav-alt-copy b,.nav-feedback-copy b{white-space:normal!important;overflow-wrap:anywhere;line-height:1.22!important}
  .nav-alt-copy em{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .nav-feedback-actions{flex:0 0 auto}

  .nav-control-stack{right:8px!important;gap:6px!important}
  .nav-stack-btn{width:43px!important;height:43px!important;border-radius:14px!important}
  .floating-speedo{right:8px!important}

  /* Drawers/modals — never touch screen edges. */
  .safety-drawer,.prefs-drawer{
    left:8px!important;right:8px!important;width:auto!important;
    max-width:calc(100% - 16px)!important;
    max-height:min(60dvh,470px)!important;
    overscroll-behavior:contain;
  }
  .safety-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .safety-tool{min-width:0!important}
  .safety-tool b,.safety-tool span,.pref-row b,.pref-row span{overflow-wrap:anywhere}

  /* Popup cards stay readable on narrow phones. */
  .mapboxgl-popup{max-width:calc(100vw - 24px)!important}
  .mapboxgl-popup-content{max-width:calc(100vw - 24px)!important}
  .place-popup,.place-popup.no-image{width:min(214px,calc(100vw - 50px))!important;max-width:min(214px,calc(100vw - 50px))!important}
  .place-popup h4,.place-popup p,.place-popup-meta{overflow-wrap:anywhere}

  /* Motion: fluid but short enough to feel immediate. */
  .sheet,.search-results,.prefs-drawer,.safety-drawer,.nav-panel,.nav-maneuver-top,
  .nav-alt-hint,.nav-feedback,.destination-confirm-card,.account-drawer{
    animation-duration:.28s!important;
    animation-timing-function:cubic-bezier(.22,.82,.24,1)!important;
  }
}

@media(max-width:390px){
  :root{--v69-edge:7px;--planner-collapsed-h:112px}
  .search-card .location-input{font-size:13px!important}
  .status-chip{max-width:55%!important}
  .route-variant{min-width:88px!important}
  .sub-action{font-size:7.5px!important}
  .nav-summary-item{padding:0 5px!important}
  .nav-summary-item strong{font-size:10px!important}
}

@media(max-width:350px){
  :root{--v69-edge:6px;--planner-collapsed-h:106px}
  .brand-copy span{display:none!important}
  .brand{max-width:190px}
  .search-card .location-row{grid-template-columns:24px minmax(0,1fr) 35px!important}
  .search-card .location-input{font-size:12px!important}
  .result-meta{display:none!important}
  .search-item{grid-template-columns:34px minmax(0,1fr)!important}
  .search-item.rich.has-photo{grid-template-columns:48px minmax(0,1fr)!important}
  .sub-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .sub-actions #previewRouteBtn{grid-column:1/-1}
  .nav-summary-row{grid-template-columns:repeat(3,minmax(0,1fr)) 42px!important}
  .nav-search-btn{width:42px!important}
}

/* Respect reduced-motion accessibility without making controls jump. */
@media(prefers-reduced-motion:reduce){
  .sheet,.floating-locate,.search-results,.prefs-drawer,.safety-drawer,.nav-panel,
  .nav-maneuver-top,.nav-alt-hint,.nav-feedback{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* Final text-flow hardening for horizontal route/recent chips. */
@media(max-width:899px){
  .route-variant b,.route-variant span,.quick b,.quick span{display:block!important;min-width:0!important}
  .route-variant b{margin:0 0 2px!important;line-height:1.15!important}
  .route-variant span{line-height:1.2!important}
  .route-variants,.quick-grid,.search-shortcuts{-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
  .route-variant,.quick,.chip-shortcut,.chip-weather{scroll-snap-align:start}
}


/* bundled vaizu-map-v70.css */
/* VAIZO V70 — polish focused on the main destination card */
:root{
  --planner-glass-dark: rgba(12,15,20,.92);
  --planner-glass-light: rgba(248,249,252,.78);
  --planner-card-border: rgba(255,255,255,.08);
  --planner-card-border-day: rgba(14,20,31,.08);
  --planner-soft-text: #8e97a3;
  --planner-strong-text: #f7f9fc;
  --planner-accent: #ff6a1a;
  --planner-accent-soft: rgba(255,106,26,.12);
  --planner-shadow: 0 22px 52px rgba(0,0,0,.24);
}

.planner-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.planner-heading-copy{min-width:0;display:flex;flex-direction:column;gap:4px}
.planner-heading-copy small{
  display:inline-flex;
  align-items:center;
  gap:6px;
  width:max-content;
  max-width:100%;
  padding:5px 10px;
  border-radius:999px;
  font-size:9px;
  line-height:1;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#ffb48a;
  background:rgba(255,106,26,.11);
  border:1px solid rgba(255,106,26,.14);
}
.planner-heading-copy b{
  display:block;
  font-size:25px;
  line-height:1.04;
  letter-spacing:-1px;
  font-weight:950;
  color:var(--planner-strong-text);
}
.planner-weather{
  flex:0 0 auto;
  align-self:flex-start;
  min-width:72px;
  height:38px;
  padding:0 11px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.planner-weather svg,.planner-weather i{color:#ffc062}
.planner-weather span{font-size:12px;font-weight:850;letter-spacing:-.25px}

.planner-presets{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-bottom:12px;
}
.planner-preset{
  min-width:0;
  min-height:70px;
  padding:9px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.075);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  display:flex;
  align-items:center;
  gap:9px;
  text-align:left;
  color:#fff;
  transition:transform .18s ease,background .18s ease,border-color .18s ease;
}
.planner-preset:active{transform:scale(.98)}
.planner-preset-icon{
  width:36px;
  height:36px;
  border-radius:13px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  color:#ffb58d;
  background:linear-gradient(180deg,rgba(255,106,26,.18),rgba(255,106,26,.08));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1);
}
.planner-preset > span:last-child{min-width:0;display:flex;flex-direction:column;gap:2px}
.planner-preset b{
  display:block;
  font-size:12px;
  line-height:1.15;
  font-weight:850;
  letter-spacing:-.2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.planner-preset small{
  display:block;
  font-size:10px;
  line-height:1.2;
  color:var(--planner-soft-text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.planner-search-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:stretch;
  gap:8px;
}
.planner-search-card{
  position:relative;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  margin:0;
  min-width:0;
  width:100%;
  padding:6px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.085);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:0 14px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.planner-location-row{
  min-height:62px!important;
  height:auto!important;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 40px!important;
  align-items:center;
  gap:6px;
  padding:0 4px;
  border-radius:17px;
  border:1px solid rgba(255,255,255,.065);
  background:rgba(15,19,24,.96);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.planner-search-icon{
  width:32px;
  height:32px;
  border-radius:11px;
  display:grid;
  place-items:center;
  color:#ffae84;
  background:rgba(255,106,26,.10);
}
.planner-search-card .location-input{
  min-width:0;
  width:100%;
  font-size:15.5px;
  line-height:1.2;
  font-weight:820;
  letter-spacing:-.28px;
  padding:17px 4px;
  color:#fff;
}
.planner-search-card .location-input::placeholder{
  color:#cbd2da;
  opacity:.82;
  font-weight:700;
}
.planner-search-card .row-btn{
  width:40px;
  height:40px;
  border-radius:13px;
  background:rgba(255,255,255,.045);
  color:#d1d8e0;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.planner-search-card .row-btn:active{
  transform:scale(.97);
  background:rgba(255,255,255,.08);
  color:#fff;
}
.planner-search-card .search-results{
  top:calc(100% + 8px);
  left:0;
  right:0;
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,.24);
}

.planner-adjust-btn{
  min-width:66px;
  padding:0 12px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  color:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  box-shadow:0 10px 26px rgba(0,0,0,.16);
}
.planner-adjust-btn i,.planner-adjust-btn svg{color:#c7d0da}
.planner-adjust-btn span{font-size:10px;font-weight:800;line-height:1;letter-spacing:-.15px}

.planner-expand-hint{
  width:100%;
  margin-top:10px;
  height:42px;
  border-radius:15px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px dashed rgba(255,255,255,.09);
  background:rgba(255,255,255,.03);
  color:#dde3ea;
}
.planner-expand-hint span{font-size:11px;font-weight:760}
.planner-expanded{margin-top:11px}

body[data-mood="day"] .planner-heading-copy b{color:#111722}
body[data-mood="day"] .planner-heading-copy small{color:#b24f0c;background:rgba(255,106,26,.09);border-color:rgba(255,106,26,.11)}
body[data-mood="day"] .planner-weather{
  background:rgba(255,255,255,.72);
  border-color:rgba(13,20,31,.08);
  box-shadow:0 10px 22px rgba(22,30,39,.08);
}
body[data-mood="day"] .planner-weather span{color:#18202c}
body[data-mood="day"] .planner-preset{
  background:rgba(255,255,255,.88);
  border-color:rgba(12,18,28,.07);
  box-shadow:0 10px 24px rgba(24,31,40,.07);
  color:#111722;
}
body[data-mood="day"] .planner-preset small{color:#707988}
body[data-mood="day"] .planner-preset-icon{background:rgba(255,106,26,.10);color:#ef6d14}
body[data-mood="day"] .planner-search-card{
  background:rgba(247,248,251,.86);
  border-color:rgba(12,18,28,.08);
  box-shadow:0 14px 34px rgba(24,31,40,.11);
}
body[data-mood="day"] .planner-location-row{
  background:#fff;
  border-color:rgba(13,20,29,.08);
  box-shadow:0 9px 22px rgba(26,34,43,.07);
}
body[data-mood="day"] .planner-search-card .location-input{color:#0f1723}
body[data-mood="day"] .planner-search-card .location-input::placeholder{color:#717b88}
body[data-mood="day"] .planner-search-card .row-btn,
body[data-mood="day"] .planner-adjust-btn,
body[data-mood="day"] .planner-expand-hint{
  background:rgba(255,255,255,.9);
  color:#131a25;
  border-color:rgba(13,20,31,.08);
  box-shadow:0 10px 22px rgba(26,34,43,.07);
}
body[data-mood="day"] .planner-adjust-btn i,
body[data-mood="day"] .planner-adjust-btn svg{color:#48515e}
body[data-mood="day"] .planner-expand-hint{border-style:solid;color:#35404d}

@media (max-width:390px){
  .planner-heading-copy b{font-size:22px;line-height:1.06}
  .planner-weather{min-width:64px;height:36px;padding:0 9px}
  .planner-presets{gap:7px}
  .planner-preset{min-height:66px;padding:8px;gap:8px;border-radius:16px}
  .planner-preset-icon{width:34px;height:34px;border-radius:12px}
  .planner-preset b{font-size:11px}
  .planner-preset small{font-size:9px}
  .planner-search-row{gap:7px}
  .planner-search-card{padding:5px;border-radius:19px}
  .planner-location-row{min-height:58px!important;grid-template-columns:34px minmax(0,1fr) 38px!important;gap:5px;padding:0 3px}
  .planner-search-icon{width:30px;height:30px;border-radius:10px}
  .planner-search-card .location-input{font-size:14.4px;padding:15px 3px}
  .planner-search-card .row-btn{width:38px;height:38px;border-radius:12px}
  .planner-adjust-btn{min-width:58px;padding:0 9px;border-radius:16px}
  .planner-adjust-btn span{font-size:9px}
}

@media (max-width:350px){
  .planner-presets{grid-template-columns:1fr;gap:6px}
  .planner-preset{min-height:58px}
  .planner-search-row{grid-template-columns:minmax(0,1fr) 54px}
  .planner-adjust-btn{padding:0 6px}
  .planner-adjust-btn span{display:none}
}


/* bundled vaizu-map-v74.css */
/* ============================================================
   VAIZO V74 — MAP UI REBUILD
   Mobile-first / tablet / desktop / White + Black
   Visual layer rebuilt from zero while preserving existing IDs,
   routing logic and event hooks.
   ============================================================ */

:root{
  --vg-primary:#5B5CE2;
  --vg-primary-strong:#4C4ED4;
  --vg-primary-soft:#F0F0FF;
  --vg-primary-ring:rgba(91,92,226,.18);
  --vg-bg:#F6F7FB;
  --vg-surface:rgba(255,255,255,.96);
  --vg-surface-solid:#FFFFFF;
  --vg-surface-soft:#F7F8FC;
  --vg-surface-glass:rgba(255,255,255,.88);
  --vg-text:#161821;
  --vg-text-2:#4F5667;
  --vg-muted:#7A8190;
  --vg-border:rgba(20,24,36,.09);
  --vg-border-strong:rgba(20,24,36,.14);
  --vg-shadow:0 18px 52px rgba(28,33,51,.14);
  --vg-shadow-soft:0 8px 24px rgba(28,33,51,.09);
  --vg-success:#20B783;
  --vg-warning:#F29C38;
  --vg-danger:#E95C67;
  --vg-map-control:rgba(255,255,255,.94);
  --vg-radius-xl:28px;
  --vg-radius-lg:22px;
  --vg-radius-md:17px;
  --vg-radius-sm:13px;
  --planner-collapsed-h:176px;
  --vg-safe-top:max(12px,env(safe-area-inset-top));
  --vg-safe-bottom:max(10px,env(safe-area-inset-bottom));
}

html[data-vaizu-theme="black"]{
  --vg-bg:#090A0F;
  --vg-surface:rgba(18,20,28,.97);
  --vg-surface-solid:#12141C;
  --vg-surface-soft:#191C26;
  --vg-surface-glass:rgba(16,18,25,.89);
  --vg-text:#F7F7FB;
  --vg-text-2:#C0C5D0;
  --vg-muted:#8C93A3;
  --vg-border:rgba(255,255,255,.085);
  --vg-border-strong:rgba(255,255,255,.13);
  --vg-shadow:0 22px 58px rgba(0,0,0,.42);
  --vg-shadow-soft:0 10px 28px rgba(0,0,0,.26);
  --vg-primary-soft:rgba(91,92,226,.14);
  --vg-primary-ring:rgba(111,111,255,.22);
  --vg-map-control:rgba(18,20,28,.95);
}

html,body{
  width:100%;height:100%;margin:0!important;padding:0!important;
  overflow:hidden!important;background:var(--vg-bg)!important;
}
body{color:var(--vg-text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
body *{box-sizing:border-box}
button,input,select{font:inherit}
button{-webkit-tap-highlight-color:transparent}

/* ----- app canvas ----- */
.ws-app{
  position:fixed!important;inset:0!important;width:100%!important;max-width:none!important;
  height:100dvh!important;min-height:100svh!important;margin:0!important;
  overflow:hidden!important;background:var(--vg-bg)!important;box-shadow:none!important;
  isolation:isolate;
}
#map{position:absolute!important;inset:0!important;background:#EDEFF5!important}
html[data-vaizu-theme="black"] #map{background:#10121A!important}
.map-vignette{
  z-index:2!important;pointer-events:none!important;
  background:linear-gradient(180deg,rgba(16,18,28,.09) 0,transparent 18%,transparent 72%,rgba(16,18,28,.08) 100%)!important;
}
html[data-vaizu-theme="black"] .map-vignette{
  background:linear-gradient(180deg,rgba(0,0,0,.18) 0,transparent 22%,transparent 70%,rgba(0,0,0,.2) 100%)!important;
}
.ambient-halo,.road-mood-hint{opacity:.35}

/* ----- top navigation ----- */
.header.vaizu-map-topbar{
  position:absolute!important;z-index:32!important;top:var(--vg-safe-top)!important;
  left:12px!important;right:12px!important;height:52px!important;
  display:grid!important;grid-template-columns:48px 1fr 48px!important;align-items:center!important;
  gap:10px!important;opacity:1!important;pointer-events:auto!important;
  transition:opacity .2s ease,transform .24s ease!important;
}
.map-top-action{
  width:48px;height:48px;border:1px solid var(--vg-border)!important;border-radius:17px!important;
  background:var(--vg-map-control)!important;color:var(--vg-text)!important;
  display:grid!important;place-items:center!important;box-shadow:var(--vg-shadow-soft)!important;
  backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%);
  cursor:pointer;transition:transform .15s ease,background .18s ease,border-color .18s ease!important;
}
.map-top-action:active{transform:scale(.95)}
.map-top-action:focus-visible{outline:3px solid var(--vg-primary-ring);outline-offset:2px}
.map-brand{
  justify-self:center;display:flex;align-items:center;gap:8px;height:46px;padding:0 14px 0 10px;
  border-radius:17px;border:1px solid var(--vg-border);background:var(--vg-map-control);
  color:var(--vg-text)!important;text-decoration:none!important;box-shadow:var(--vg-shadow-soft);
  backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%);
}
.map-brand-mark{width:29px;height:29px;border-radius:10px;display:grid;place-items:center;background:var(--vg-primary-soft);overflow:hidden}
.map-brand-mark img{width:25px;height:25px;display:block;object-fit:contain}
.map-brand-name{font-size:13px;font-weight:900;letter-spacing:.07em}
html[data-vaizu-theme="black"] .map-brand-mark{background:rgba(91,92,226,.16)}
.body-nav .header.vaizu-map-topbar{opacity:0!important;transform:translateY(-8px)!important;pointer-events:none!important}

/* ----- guest pill / GPS ----- */
.guest-trial-pill{
  top:calc(var(--vg-safe-top) + 60px)!important;right:12px!important;left:auto!important;
  height:34px!important;padding:0 10px!important;border-radius:999px!important;
  border:1px solid var(--vg-border)!important;background:var(--vg-map-control)!important;
  color:var(--vg-text-2)!important;box-shadow:var(--vg-shadow-soft)!important;
}
.status-chip{
  top:calc(var(--vg-safe-top) + 62px)!important;left:12px!important;height:34px!important;max-width:160px!important;
  padding:0 10px!important;border:1px solid var(--vg-border)!important;border-radius:999px!important;
  background:var(--vg-map-control)!important;color:var(--vg-text-2)!important;box-shadow:var(--vg-shadow-soft)!important;
  backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;
}
.status-chip .dot{background:var(--vg-success)!important;box-shadow:0 0 0 4px rgba(32,183,131,.11)!important}
.gps-quality{
  top:calc(var(--vg-safe-top) + 62px)!important;right:12px!important;height:34px!important;
  border-color:var(--vg-border)!important;background:var(--vg-map-control)!important;color:var(--vg-text-2)!important;
  box-shadow:var(--vg-shadow-soft)!important;
}

/* ----- map floating tools ----- */
.map-tools{
  z-index:23!important;right:12px!important;top:calc(var(--vg-safe-top) + 110px)!important;
  gap:8px!important;
}
.map-btn,.floating-locate,.nav-stack-btn,.nav-audio-toggle{
  width:46px!important;height:46px!important;border-radius:16px!important;
  border:1px solid var(--vg-border)!important;background:var(--vg-map-control)!important;
  color:var(--vg-text)!important;box-shadow:var(--vg-shadow-soft)!important;
  backdrop-filter:blur(16px) saturate(140%)!important;-webkit-backdrop-filter:blur(16px) saturate(140%)!important;
  transition:transform .14s ease,background .18s ease,color .18s ease!important;
}
.map-btn:active,.floating-locate:active,.nav-stack-btn:active,.nav-audio-toggle:active{transform:scale(.94)}
.map-btn.active,.map-btn.safety-open,.nav-stack-btn.immersive-active,.nav-audio-toggle.active{
  background:var(--vg-primary)!important;color:#fff!important;border-color:transparent!important;
  box-shadow:0 10px 26px rgba(91,92,226,.28)!important;
}
.floating-locate{
  z-index:25!important;right:12px!important;left:auto!important;
  bottom:calc(var(--vg-safe-bottom) + var(--planner-collapsed-h) + 12px)!important;
  top:auto!important;
}
.floating-preview-cancel{background:var(--vg-surface-solid)!important;color:var(--vg-text)!important;border-color:var(--vg-border)!important}

/* ----- location permission ----- */
.permission{
  z-index:70!important;top:calc(var(--vg-safe-top) + 2px)!important;left:10px!important;right:10px!important;
  max-width:520px;margin:0 auto!important;padding:12px!important;border-radius:20px!important;
  border:1px solid var(--vg-border)!important;background:var(--vg-surface)!important;color:var(--vg-text)!important;
  box-shadow:var(--vg-shadow)!important;backdrop-filter:blur(22px)!important;-webkit-backdrop-filter:blur(22px)!important;
}
.permission-icon{background:var(--vg-primary-soft)!important;color:var(--vg-primary)!important}
.permission-copy b{font-size:12px!important;color:var(--vg-text)!important}
.permission-copy span{font-size:10px!important;color:var(--vg-muted)!important}
.permission button{background:var(--vg-primary)!important;color:#fff!important;border-radius:12px!important}

/* ============================================================
   MAIN PLANNER — MOBILE BOTTOM SHEET
   ============================================================ */
.sheet{
  --planner-drag-y:0px;
  position:absolute!important;z-index:30!important;
  left:10px!important;right:10px!important;bottom:var(--vg-safe-bottom)!important;
  width:auto!important;max-width:620px!important;margin:0 auto!important;
  max-height:min(78dvh,720px)!important;padding:7px 14px 14px!important;
  border:1px solid var(--vg-border)!important;border-radius:30px!important;
  background:var(--vg-surface)!important;color:var(--vg-text)!important;
  box-shadow:var(--vg-shadow)!important;
  backdrop-filter:blur(30px) saturate(150%)!important;-webkit-backdrop-filter:blur(30px) saturate(150%)!important;
  overflow:hidden!important;
  transform:translateY(var(--planner-drag-y))!important;
  transition:transform .36s cubic-bezier(.22,.84,.24,1),opacity .22s ease,border-radius .22s ease!important;
}
.sheet.sheet-dragging{transition:none!important}
.sheet.sheet-collapsed{
  transform:translateY(calc(100% - var(--planner-collapsed-h) + var(--planner-drag-y)))!important;
}
.sheet.hidden{transform:translateY(calc(100% + 32px))!important;opacity:0!important;pointer-events:none!important}
.sheet.sheet-collapsed .welcome,.sheet.sheet-collapsed #routeState{opacity:1!important;pointer-events:auto!important}
.sheet.sheet-collapsed .planner-presets,.sheet.sheet-collapsed .planner-expanded{opacity:0!important;pointer-events:none!important}
.sheet.sheet-collapsed .planner-welcome{height:auto!important;overflow:visible!important}

.grab.planner-grab{
  width:56px!important;height:24px!important;margin:-3px auto 0!important;padding:10px 0!important;
  border-radius:999px!important;background:transparent!important;cursor:grab!important;
}
.grab.planner-grab:before{
  content:"";display:block;width:42px;height:4px;margin:auto;border-radius:999px;
  background:rgba(122,129,144,.42);
}
.grab.planner-grab:active{cursor:grabbing!important}

.welcome.planner-welcome{padding:0!important}
.planner-heading{
  display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px!important;
  padding:0 2px 12px!important;
}
.planner-heading-copy{min-width:0;display:block!important}
.planner-heading-copy small{
  display:block!important;margin-bottom:4px!important;color:var(--vg-primary)!important;
  font-size:9px!important;font-weight:900!important;letter-spacing:.1em!important;
}
.planner-heading-copy b{
  display:block!important;color:var(--vg-text)!important;font-size:22px!important;line-height:1.08!important;
  letter-spacing:-.65px!important;font-weight:850!important;
}
.planner-heading-copy span{
  display:block;margin-top:5px;color:var(--vg-muted);font-size:10px;line-height:1.35;
}
.planner-weather{
  flex:0 0 auto!important;height:34px!important;padding:0 9px!important;border-radius:12px!important;
  border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;
  color:var(--vg-text-2)!important;box-shadow:none!important;
}

/* search */
.planner-search-row{
  display:grid!important;grid-template-columns:minmax(0,1fr) 48px!important;gap:8px!important;
  align-items:stretch!important;margin:0!important;
}
.search-card.planner-search-card{
  position:relative!important;inset:auto!important;display:block!important;width:100%!important;
  padding:0!important;border-radius:18px!important;border:1px solid var(--vg-border-strong)!important;
  background:var(--vg-surface-solid)!important;color:var(--vg-text)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.35),0 5px 18px rgba(24,29,45,.05)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
.location-row.planner-location-row{
  min-height:54px!important;height:54px!important;display:grid!important;
  grid-template-columns:44px minmax(0,1fr) 40px!important;gap:0!important;align-items:center!important;
  border:0!important;padding:0 5px 0 3px!important;
}
.planner-search-icon{display:grid!important;place-items:center!important;color:var(--vg-primary)!important}
.location-input#destinationInput{
  min-width:0!important;width:100%!important;height:52px!important;border:0!important;outline:0!important;
  background:transparent!important;color:var(--vg-text)!important;font-size:14px!important;font-weight:720!important;
  padding:0 4px!important;caret-color:var(--vg-primary)!important;
}
.location-input#destinationInput::placeholder{color:var(--vg-muted)!important;font-weight:560!important;opacity:.92!important}
.row-btn#quickRecentTop{
  width:38px!important;height:38px!important;border-radius:12px!important;border:0!important;
  background:var(--vg-surface-soft)!important;color:var(--vg-text-2)!important;
}
.planner-adjust-btn{
  width:48px!important;height:54px!important;border-radius:18px!important;border:1px solid var(--vg-border)!important;
  background:var(--vg-surface-solid)!important;color:var(--vg-text)!important;box-shadow:none!important;
  display:grid!important;place-items:center!important;padding:0!important;
}
.planner-adjust-btn span{display:none!important}
.planner-adjust-btn:active{transform:scale(.96)}

/* search dropdown / portal */
.search-results,.search-results.search-results-portal{
  z-index:65!important;max-height:min(46dvh,430px)!important;padding:7px!important;
  border-radius:20px!important;border:1px solid var(--vg-border)!important;
  background:var(--vg-surface-solid)!important;color:var(--vg-text)!important;
  box-shadow:var(--vg-shadow)!important;overflow:auto!important;overscroll-behavior:contain!important;
}
.search-label{padding:8px 10px 5px!important;color:var(--vg-muted)!important;font-size:9px!important;font-weight:900!important}
.search-item{
  min-height:58px!important;display:grid!important;grid-template-columns:42px minmax(0,1fr) auto!important;
  gap:10px!important;align-items:center!important;padding:8px!important;border-radius:15px!important;
  color:var(--vg-text)!important;transition:background .15s ease!important;
}
.search-item:hover,.search-item:active{background:var(--vg-surface-soft)!important}
.result-icon{width:42px!important;height:42px!important;border-radius:13px!important;background:var(--vg-primary-soft)!important;color:var(--vg-primary)!important}
.result-copy b{color:var(--vg-text)!important;font-size:12px!important;font-weight:790!important}
.result-copy small{color:var(--vg-muted)!important;font-size:9px!important;line-height:1.32!important;white-space:normal!important;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden!important}
.result-meta{color:var(--vg-muted)!important;font-size:9px!important}
.search-message{color:var(--vg-muted)!important}

/* presets */
.planner-presets{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;
  margin:11px 0 0!important;transition:opacity .18s ease!important;
}
.planner-preset{
  min-width:0!important;min-height:62px!important;padding:9px!important;border-radius:16px!important;
  border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;color:var(--vg-text)!important;
  display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;gap:8px!important;align-items:center!important;
  text-align:left!important;overflow:hidden!important;
}
.planner-preset:active{transform:scale(.98)}
.planner-preset-icon{width:34px!important;height:34px!important;border-radius:11px!important;background:var(--vg-primary-soft)!important;color:var(--vg-primary)!important;display:grid!important;place-items:center!important}
.planner-preset b{display:block!important;color:var(--vg-text)!important;font-size:10px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.planner-preset small{display:block!important;margin-top:2px!important;color:var(--vg-muted)!important;font-size:7.5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}

/* expand */
.planner-expand-hint{
  width:100%!important;height:35px!important;margin:8px 0 0!important;border:0!important;border-radius:12px!important;
  background:transparent!important;color:var(--vg-text-2)!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;
  font-size:9px!important;font-weight:800!important;transition:background .15s ease!important;
}
.planner-expand-hint:hover,.planner-expand-hint:active{background:var(--vg-surface-soft)!important}
.planner-expand-hint svg{transition:transform .25s ease}
.planner-expand-hint[aria-expanded="true"] svg{transform:rotate(180deg)}

.planner-expanded{
  max-height:min(48dvh,430px)!important;overflow:auto!important;overscroll-behavior:contain!important;
  padding:5px 2px 0!important;scrollbar-width:none!important;transition:opacity .18s ease!important;
}
.planner-expanded::-webkit-scrollbar{display:none}
.planner-section-head{
  display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:10px!important;
  padding:8px 2px 8px!important;border-top:1px solid var(--vg-border)!important;
}
.planner-section-head>div{min-width:0}
.planner-section-head small{display:block!important;color:var(--vg-primary)!important;font-size:8px!important;font-weight:900!important;letter-spacing:.09em!important;margin:0 0 3px!important}
.planner-section-head b{display:block!important;color:var(--vg-text)!important;font-size:13px!important;line-height:1.15!important}
.planner-section-head>span{flex:0 0 auto;color:var(--vg-muted)!important;font-size:8px!important}
.nearby-services{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;
}
.nearby-service{
  min-width:0!important;min-height:79px!important;padding:9px 6px!important;border-radius:16px!important;
  border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;color:var(--vg-text)!important;
  text-align:center!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;
}
.nearby-service:active{transform:scale(.97)}
.nearby-service-icon{width:34px!important;height:34px!important;border-radius:11px!important;background:var(--vg-primary-soft)!important;color:var(--vg-primary)!important;display:grid!important;place-items:center!important}
.nearby-service b{font-size:9px!important;color:var(--vg-text)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
.nearby-service small{font-size:7px!important;color:var(--vg-muted)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
.planner-tip{
  margin:10px 0 0!important;padding:10px!important;border-radius:15px!important;
  border:1px solid var(--vg-border)!important;background:var(--vg-primary-soft)!important;color:var(--vg-text-2)!important;
  display:grid!important;grid-template-columns:18px minmax(0,1fr)!important;gap:8px!important;align-items:flex-start!important;
}
.planner-tip svg{color:var(--vg-primary)!important;margin-top:1px!important}
.planner-tip span{font-size:8px!important;line-height:1.4!important;overflow-wrap:anywhere!important}

/* ============================================================
   DESTINATION CONFIRMATION
   ============================================================ */
.destination-confirm{
  position:absolute!important;z-index:45!important;left:10px!important;right:10px!important;bottom:var(--vg-safe-bottom)!important;
  width:auto!important;max-width:620px!important;margin:0 auto!important;padding:8px 15px 15px!important;
  border:1px solid var(--vg-border)!important;border-radius:28px!important;background:var(--vg-surface)!important;color:var(--vg-text)!important;
  box-shadow:var(--vg-shadow)!important;backdrop-filter:blur(28px) saturate(145%)!important;-webkit-backdrop-filter:blur(28px) saturate(145%)!important;
  transform:translateY(calc(100% + 28px))!important;opacity:0!important;pointer-events:none!important;
  transition:transform .34s cubic-bezier(.22,.84,.24,1),opacity .2s ease!important;
}
.destination-confirm.show{transform:none!important;opacity:1!important;pointer-events:auto!important}
.grab-mini{width:42px!important;height:4px!important;margin:2px auto 11px!important;background:rgba(122,129,144,.40)!important;border-radius:999px!important}
.destination-confirm-kicker{display:flex;align-items:center;gap:6px;color:var(--vg-primary);margin-bottom:5px}
.destination-confirm-kicker small{font-size:8px!important;font-weight:900!important;letter-spacing:.1em!important;color:var(--vg-primary)!important}
.destination-confirm>small{color:var(--vg-primary)!important}
.destination-confirm h3{margin:0!important;color:var(--vg-text)!important;font-size:18px!important;line-height:1.15!important;letter-spacing:-.4px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.destination-confirm p{margin:6px 0 0!important;color:var(--vg-muted)!important;font-size:10px!important;line-height:1.4!important;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden!important}
.destination-confirm-actions{display:grid!important;grid-template-columns:.8fr 1.4fr!important;gap:8px!important;margin-top:13px!important}
.destination-edit,.destination-accept{height:48px!important;border-radius:15px!important;font-size:11px!important;font-weight:850!important}
.destination-edit{border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;color:var(--vg-text)!important}
.destination-accept{border:0!important;background:var(--vg-primary)!important;color:#fff!important;box-shadow:0 10px 24px rgba(91,92,226,.26)!important}
.destination-edit:active,.destination-accept:active{transform:scale(.98)}

/* ============================================================
   ROUTE PLANNING
   ============================================================ */
#routeState{max-height:min(69dvh,620px)!important;overflow:auto!important;padding:0 1px 2px!important;scrollbar-width:none!important;color:var(--vg-text)!important}
#routeState::-webkit-scrollbar{display:none}
.route-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;padding:1px 2px 11px!important}
.route-head>div:first-child{min-width:0}
.route-head h2{margin:0!important;color:var(--vg-text)!important;font-size:19px!important;line-height:1.12!important;letter-spacing:-.55px!important}
.route-head p{margin:4px 0 0!important;color:var(--vg-muted)!important;font-size:8.5px!important;line-height:1.35!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:300px!important}
.route-time{flex:0 0 auto;text-align:right!important}
.route-time span{display:block!important;color:var(--vg-text)!important;font-size:18px!important;font-weight:900!important;letter-spacing:-.5px!important}
.route-time small{display:block!important;margin-top:2px!important;color:var(--vg-muted)!important;font-size:8px!important}
.customize-route-kicker{padding:9px 1px 7px!important;border-top:1px solid var(--vg-border)!important}
.customize-route-kicker span{display:block!important;color:var(--vg-primary)!important;font-size:8px!important;font-weight:900!important;letter-spacing:.09em!important}
.customize-route-kicker b{display:block!important;margin-top:2px!important;color:var(--vg-text)!important;font-size:11px!important}
.route-mode-hidden{display:none!important}
.travel{
  display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:7px!important;margin:0!important;padding:0!important;
  background:transparent!important;border:0!important;
}
.travel button{
  height:43px!important;border-radius:14px!important;border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;color:var(--vg-text-2)!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;font-size:9px!important;font-weight:800!important;
}
.travel button.active{background:var(--vg-primary)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 8px 20px rgba(91,92,226,.22)!important}
.travel .moto-ico{stroke:currentColor!important;fill:none!important;width:15px!important;height:15px!important}
.route-variants{display:flex!important;gap:7px!important;overflow-x:auto!important;padding:9px 1px 3px!important;scrollbar-width:none!important}
.route-variants::-webkit-scrollbar{display:none}
.route-variant{
  flex:0 0 auto!important;min-width:128px!important;padding:9px 10px!important;border-radius:14px!important;
  border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;color:var(--vg-text)!important;text-align:left!important;
}
.route-variant b{display:block!important;font-size:11px!important;color:var(--vg-text)!important}
.route-variant span{display:block!important;margin-top:2px!important;font-size:7px!important;color:var(--vg-muted)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.route-variant.active{border-color:var(--vg-primary)!important;background:var(--vg-primary-soft)!important;box-shadow:0 0 0 2px var(--vg-primary-ring)!important}

.parking-nearby{
  margin-top:9px!important;padding:10px!important;border-radius:17px!important;border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;color:var(--vg-text)!important;
}
.parking-head small{color:var(--vg-primary)!important}.parking-head b{color:var(--vg-text)!important}.parking-head>span{color:var(--vg-muted)!important}
.parking-item,.parking-row{color:var(--vg-text)!important;background:var(--vg-surface-solid)!important;border-color:var(--vg-border)!important}

.route-card{
  margin-top:9px!important;padding:11px!important;border-radius:18px!important;border:1px solid var(--vg-border)!important;
  background:var(--vg-surface-soft)!important;color:var(--vg-text)!important;box-shadow:none!important;
}
.route-card *{max-width:100%}
.route-card-top h3{color:var(--vg-text)!important;font-size:12px!important}.route-card .mins{color:var(--vg-text)!important}
.safety-level strong,.route-card-meta,.route-ai,.route-card p,.route-card span{color:var(--vg-text-2)}
.level-pill{background:var(--vg-primary-soft)!important;color:var(--vg-primary)!important;border-color:transparent!important}
.route-card-meta{display:flex!important;gap:5px!important;flex-wrap:wrap!important;margin-top:8px!important}
.route-card-meta span{padding:5px 7px!important;border-radius:999px!important;background:var(--vg-surface-solid)!important;border:1px solid var(--vg-border)!important;color:var(--vg-text-2)!important;font-size:7px!important}
.route-ai{margin-top:8px!important;padding-top:8px!important;border-top:1px solid var(--vg-border)!important;font-size:7px!important;color:var(--vg-muted)!important;white-space:normal!important;line-height:1.35!important}
.route-ai b{color:var(--vg-text-2)!important}
.spark-dot{background:var(--vg-primary)!important}

.route-insight{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important;margin-top:7px!important}
.insight{min-width:0!important;padding:8px 5px!important;border-radius:14px!important;border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;text-align:center!important}
.insight strong{display:block!important;color:var(--vg-text)!important;font-size:11px!important}.insight span{display:block!important;margin-top:2px!important;color:var(--vg-muted)!important;font-size:6.5px!important;line-height:1.2!important}

.primary.start-trip-cta{
  position:sticky!important;bottom:0!important;z-index:3!important;width:100%!important;min-height:54px!important;margin-top:10px!important;padding:6px 9px!important;
  display:grid!important;grid-template-columns:40px minmax(0,1fr) 24px!important;align-items:center!important;gap:8px!important;
  border:0!important;border-radius:17px!important;background:linear-gradient(135deg,var(--vg-primary),#7778F1)!important;color:#fff!important;
  box-shadow:0 12px 28px rgba(91,92,226,.3)!important;
}
.start-trip-icon{width:38px!important;height:38px!important;border-radius:12px!important;background:rgba(255,255,255,.15)!important;color:#fff!important;display:grid!important;place-items:center!important}
.start-trip-copy{min-width:0!important;text-align:left!important}.start-trip-copy b{display:block!important;color:#fff!important;font-size:11px!important}.start-trip-copy small{display:block!important;margin-top:2px!important;color:rgba(255,255,255,.72)!important;font-size:7.5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.start-trip-arrow{color:#fff!important;font-size:24px!important}
.start-trip-cta:active{transform:scale(.988)}

.sub-actions{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important;margin-top:7px!important}
.sub-action{min-width:0!important;height:39px!important;border-radius:13px!important;border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;color:var(--vg-text-2)!important;font-size:8px!important;font-weight:800!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important}
.disclaimer{margin:8px 3px 2px!important;color:var(--vg-muted)!important;font-size:7px!important;line-height:1.35!important}

/* ============================================================
   DRAWERS / SETTINGS / SAFETY
   ============================================================ */
.account-backdrop{z-index:76!important;background:rgba(10,12,20,.24)!important;backdrop-filter:blur(2px)!important;-webkit-backdrop-filter:blur(2px)!important}
.account-drawer,.prefs-drawer,.safety-drawer{
  z-index:78!important;border:1px solid var(--vg-border)!important;background:var(--vg-surface)!important;color:var(--vg-text)!important;
  box-shadow:var(--vg-shadow)!important;backdrop-filter:blur(30px) saturate(150%)!important;-webkit-backdrop-filter:blur(30px) saturate(150%)!important;
}
.account-drawer{
  left:10px!important;right:10px!important;bottom:var(--vg-safe-bottom)!important;top:auto!important;
  max-width:520px!important;margin:0 auto!important;padding:8px 13px 14px!important;border-radius:28px!important;
}
.drawer-grab{background:rgba(122,129,144,.40)!important}
.drawer-user b,.drawer-link,.drawer-login h3{color:var(--vg-text)!important}
.drawer-user span,.drawer-login p,.drawer-link small{color:var(--vg-muted)!important}
.drawer-profile{background:var(--vg-primary-soft)!important;color:var(--vg-primary)!important}
.drawer-divider{background:var(--vg-border)!important}
.drawer-link{border-radius:14px!important;background:transparent!important}
.drawer-link:hover,.drawer-link:active{background:var(--vg-surface-soft)!important}
.drawer-theme-switch{background:var(--vg-surface-soft)!important;border:1px solid var(--vg-border)!important}.drawer-theme-switch i{background:var(--vg-muted)!important}.drawer-theme-toggle.is-black .drawer-theme-switch{background:var(--vg-primary)!important}.drawer-theme-toggle.is-black .drawer-theme-switch i{background:#fff!important}
.drawer-logout{color:var(--vg-danger)!important}

.prefs-drawer,.safety-drawer{
  left:10px!important;right:10px!important;top:auto!important;bottom:var(--vg-safe-bottom)!important;
  max-width:560px!important;max-height:min(72dvh,620px)!important;margin:0 auto!important;border-radius:28px!important;padding:14px!important;
  transform:translateY(calc(100% + 32px))!important;opacity:0!important;pointer-events:none!important;
  transition:transform .3s cubic-bezier(.22,.84,.24,1),opacity .18s ease!important;
}
.prefs-drawer.show,.safety-drawer.show{transform:none!important;opacity:1!important;pointer-events:auto!important}
.prefs-head small,.safety-head small{color:var(--vg-primary)!important}.prefs-head h3,.safety-head h3{color:var(--vg-text)!important}
.prefs-close,.safety-close{background:var(--vg-surface-soft)!important;color:var(--vg-text)!important;border-color:var(--vg-border)!important}
.pref-row,.safety-tool{border-color:var(--vg-border)!important;background:var(--vg-surface-soft)!important;color:var(--vg-text)!important}
.pref-row b,.safety-tool b{color:var(--vg-text)!important}.pref-row span span,.safety-tool span span,.prefs-foot,.safety-foot{color:var(--vg-muted)!important}
.pref-switch{accent-color:var(--vg-primary)!important}.voice-select{background:var(--vg-surface-solid)!important;color:var(--vg-text)!important;border-color:var(--vg-border)!important}
.safety-tool i{background:var(--vg-primary-soft)!important;color:var(--vg-primary)!important}
.safety-tool.emergency i{background:rgba(233,92,103,.11)!important;color:var(--vg-danger)!important}
.support-item{background:var(--vg-surface-soft)!important;color:var(--vg-text)!important;border-color:var(--vg-border)!important}.support-item span{color:var(--vg-muted)!important}

/* ============================================================
   NAVIGATION MODE
   ============================================================ */
.body-nav .sheet,.body-nav .destination-confirm{display:none!important}
.body-nav .map-tools{display:none!important}
.body-nav .mapboxgl-ctrl-bottom-right,.body-nav .mapboxgl-ctrl-bottom-left{bottom:142px!important}

.nav-maneuver-top{
  z-index:42!important;top:var(--vg-safe-top)!important;left:10px!important;right:10px!important;
  width:auto!important;max-width:660px!important;margin:0 auto!important;min-height:72px!important;padding:10px 12px!important;
  border-radius:22px!important;border:1px solid var(--vg-border)!important;background:var(--vg-surface)!important;color:var(--vg-text)!important;
  box-shadow:var(--vg-shadow)!important;backdrop-filter:blur(24px) saturate(145%)!important;-webkit-backdrop-filter:blur(24px) saturate(145%)!important;
}
.nav-maneuver-icon{width:48px!important;height:48px!important;border-radius:15px!important;background:var(--vg-primary)!important;color:#fff!important;box-shadow:0 9px 22px rgba(91,92,226,.24)!important}
.nav-maneuver-copy small{color:var(--vg-primary)!important;font-size:7px!important}.nav-maneuver-copy b{color:var(--vg-text)!important;font-size:14px!important;line-height:1.15!important}.nav-maneuver-copy span{color:var(--vg-muted)!important;font-size:9px!important}

.nav-street-chip{
  z-index:40!important;min-height:32px!important;padding:0 11px!important;border-radius:999px!important;
  border:1px solid var(--vg-border)!important;background:var(--vg-map-control)!important;color:var(--vg-text-2)!important;
  box-shadow:var(--vg-shadow-soft)!important;backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;
  font-size:9px!important;font-weight:800!important;max-width:min(78vw,520px)!important;
}

.nav-panel.nav-minimal{
  z-index:44!important;left:10px!important;right:10px!important;bottom:var(--vg-safe-bottom)!important;
  width:auto!important;max-width:700px!important;margin:0 auto!important;padding:10px!important;
  border-radius:24px!important;border:1px solid var(--vg-border)!important;background:var(--vg-surface)!important;color:var(--vg-text)!important;
  box-shadow:var(--vg-shadow)!important;backdrop-filter:blur(28px) saturate(145%)!important;-webkit-backdrop-filter:blur(28px) saturate(145%)!important;
}
.nav-summary-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr)) 50px!important;gap:6px!important;align-items:stretch!important}
.nav-summary-item{min-width:0!important;height:48px!important;padding:7px 9px!important;border-radius:14px!important;border:1px solid var(--vg-border)!important;background:var(--vg-surface-soft)!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
.nav-summary-item small{font-size:6.5px!important;color:var(--vg-muted)!important;font-weight:900!important;letter-spacing:.08em!important}.nav-summary-item strong{margin-top:2px!important;color:var(--vg-text)!important;font-size:11px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.nav-search-btn{width:50px!important;height:48px!important;border-radius:14px!important;border:0!important;background:var(--vg-primary)!important;color:#fff!important;display:grid!important;place-items:center!important;box-shadow:0 8px 20px rgba(91,92,226,.24)!important}

.nav-control-stack{z-index:39!important;right:10px!important;bottom:calc(var(--vg-safe-bottom) + 142px)!important;gap:7px!important}
.body-nav .nav-audio-toggle{z-index:39!important;right:10px!important;bottom:calc(var(--vg-safe-bottom) + 340px)!important}
.floating-speedo{
  z-index:38!important;right:10px!important;bottom:calc(var(--vg-safe-bottom) + 142px)!important;
  background:var(--vg-map-control)!important;color:var(--vg-text)!important;border-color:var(--vg-border)!important;box-shadow:var(--vg-shadow-soft)!important;
}
.body-nav .floating-speedo{bottom:calc(var(--vg-safe-bottom) + 142px)!important}
.floating-speedo small,.floating-speedo span{color:var(--vg-muted)!important}.floating-speedo strong{color:var(--vg-text)!important}

.nav-alt-hint,.traffic-suggestion,.nav-feedback,.traffic-radar,.nav-map-mode,.nav-tracking,.nav-voice-popover,.nav-immersive-chip{
  border-color:var(--vg-border)!important;background:var(--vg-surface)!important;color:var(--vg-text)!important;box-shadow:var(--vg-shadow-soft)!important;
}
.nav-alt-copy small,.traffic-suggestion small,.nav-feedback small{color:var(--vg-primary)!important}.nav-alt-copy b,.traffic-suggestion b,.nav-feedback b{color:var(--vg-text)!important}.nav-alt-copy em,.traffic-suggestion span{color:var(--vg-muted)!important}
.nav-alt-accept,.traffic-accept{background:var(--vg-primary)!important;color:#fff!important;border-color:transparent!important}
.nav-alt-dismiss,.traffic-dismiss{background:var(--vg-surface-soft)!important;color:var(--vg-text-2)!important;border-color:var(--vg-border)!important}
.reroute{display:none!important}

/* quick feedback becomes intentionally subtle */
.nav-feedback{
  padding:6px 8px!important;border-radius:999px!important;max-width:330px!important;min-height:38px!important;
}
.nav-feedback-copy small{display:none!important}.nav-feedback-copy b{font-size:8px!important}.nav-feedback-actions button{height:28px!important;border-radius:999px!important;background:var(--vg-surface-soft)!important;color:var(--vg-text-2)!important;border:1px solid var(--vg-border)!important;font-size:7px!important}

/* loading / toast / resume */
.toast{background:var(--vg-surface-solid)!important;color:var(--vg-text)!important;border-color:var(--vg-border)!important;box-shadow:var(--vg-shadow)!important}
.route-loading-overlay{background:rgba(20,22,32,.12)!important;backdrop-filter:blur(3px)!important;-webkit-backdrop-filter:blur(3px)!important}
.route-loading-card,.resume-trip-card,.immersive-choice-card,.guest-limit-card,.token-card{background:var(--vg-surface)!important;color:var(--vg-text)!important;border-color:var(--vg-border)!important;box-shadow:var(--vg-shadow)!important}
.route-loading-card b,.resume-trip-card h3,.resume-trip-card b,.immersive-choice-card h3,.immersive-option b,.guest-limit-card h2,.token-card h2{color:var(--vg-text)!important}
.route-loading-card span,.resume-trip-card span,.immersive-choice-card p,.immersive-option span,.guest-limit-card p,.token-card p{color:var(--vg-muted)!important}
.route-loading-spinner{border-color:var(--vg-primary-soft)!important;border-top-color:var(--vg-primary)!important}

/* Mapbox chrome */
.mapboxgl-ctrl-logo{opacity:.55!important;transform:scale(.72)!important;transform-origin:left bottom!important}
.mapboxgl-ctrl-attrib{font-size:8px!important;border-radius:8px 0 0 0!important;background:var(--vg-map-control)!important;color:var(--vg-muted)!important}
.mapboxgl-popup-content{background:var(--vg-surface-solid)!important;color:var(--vg-text)!important;border:1px solid var(--vg-border)!important;border-radius:16px!important;box-shadow:var(--vg-shadow-soft)!important}
html[data-vaizu-theme="black"] .mapboxgl-popup-tip{border-top-color:var(--vg-surface-solid)!important}

/* ============================================================
   TABLET + DESKTOP: SIDE PANEL, MAP ALWAYS VISIBLE
   ============================================================ */
@media (min-width:768px){
  :root{--planner-collapsed-h:168px}
  .header.vaizu-map-topbar{left:18px!important;right:18px!important;top:max(16px,env(safe-area-inset-top))!important;grid-template-columns:48px auto 48px!important}
  .map-brand{justify-self:start!important;margin-left:2px!important;grid-column:2!important}
  .map-theme-action{grid-column:3!important;justify-self:end!important}
  .status-chip{left:auto!important;right:78px!important;top:max(17px,calc(env(safe-area-inset-top) + 1px))!important}
  .gps-quality{right:136px!important;top:max(17px,calc(env(safe-area-inset-top) + 1px))!important}
  .guest-trial-pill{right:18px!important;top:max(76px,calc(env(safe-area-inset-top) + 60px))!important}

  .sheet{
    left:18px!important;right:auto!important;top:86px!important;bottom:18px!important;
    width:min(410px,calc(100vw - 70px))!important;max-width:410px!important;max-height:none!important;margin:0!important;
    border-radius:28px!important;padding:8px 15px 15px!important;
    transform:none!important;overflow:hidden!important;
  }
  .sheet.sheet-collapsed{transform:none!important}
  .sheet.sheet-collapsed .planner-presets,.sheet.sheet-collapsed .planner-expanded{opacity:1!important;pointer-events:auto!important}
  .sheet.sheet-collapsed .planner-expand-hint{display:none!important}
  .sheet .planner-expanded{max-height:calc(100dvh - 390px)!important}
  .sheet #routeState{max-height:calc(100dvh - 125px)!important}
  .grab.planner-grab{display:none!important}
  .planner-heading{padding-top:7px!important}
  .planner-presets{grid-template-columns:1fr!important;gap:6px!important}
  .planner-preset{min-height:52px!important}
  .nearby-services{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .nearby-service{min-height:72px!important;flex-direction:row!important;text-align:left!important;justify-content:flex-start!important;padding:9px!important;display:grid!important;grid-template-columns:36px minmax(0,1fr)!important;grid-template-rows:auto auto!important;column-gap:8px!important}
  .nearby-service-icon{grid-row:1 / span 2!important}.nearby-service b,.nearby-service small{text-align:left!important}
  .floating-locate{bottom:24px!important;right:18px!important}
  .map-tools{right:18px!important;top:86px!important}

  .destination-confirm{left:18px!important;right:auto!important;bottom:18px!important;width:410px!important;max-width:410px!important;margin:0!important}
  .account-drawer{left:18px!important;right:auto!important;bottom:18px!important;width:390px!important;margin:0!important}
  .prefs-drawer,.safety-drawer{left:18px!important;right:auto!important;bottom:18px!important;width:410px!important;margin:0!important}
  .search-results.search-results-portal{max-width:390px!important}

  .body-nav .nav-maneuver-top{left:18px!important;right:auto!important;top:18px!important;width:min(460px,calc(100vw - 120px))!important;margin:0!important}
  .body-nav .nav-panel.nav-minimal{left:18px!important;right:auto!important;bottom:18px!important;width:min(510px,calc(100vw - 110px))!important;margin:0!important}
  .body-nav .nav-control-stack{right:18px!important;bottom:18px!important}
  .body-nav .nav-audio-toggle{right:18px!important;bottom:230px!important}
  .body-nav .floating-speedo{right:18px!important;bottom:178px!important}
}

@media (min-width:1180px){
  .sheet{width:430px!important;max-width:430px!important;left:24px!important;top:92px!important;bottom:24px!important}
  .map-tools{right:24px!important;top:92px!important}.floating-locate{right:24px!important;bottom:24px!important}
  .destination-confirm,.prefs-drawer,.safety-drawer{left:24px!important;width:430px!important}.account-drawer{left:24px!important;width:400px!important}
  .planner-heading-copy b{font-size:24px!important}
}

/* ============================================================
   SMALL PHONES / SHORT SCREENS
   ============================================================ */
@media (max-width:430px){
  :root{--planner-collapsed-h:168px}
  .header.vaizu-map-topbar{left:9px!important;right:9px!important;grid-template-columns:46px 1fr 46px!important;gap:8px!important}
  .map-top-action{width:46px;height:46px;border-radius:16px!important}.map-brand{height:44px;padding:0 12px 0 8px}.map-brand-name{font-size:12px}
  .sheet{left:6px!important;right:6px!important;bottom:max(6px,env(safe-area-inset-bottom))!important;padding:6px 11px 11px!important;border-radius:26px!important}
  .planner-heading-copy b{font-size:20px!important}.planner-heading-copy span{font-size:9px!important}
  .planner-weather{height:32px!important}.planner-search-row{grid-template-columns:minmax(0,1fr) 46px!important;gap:6px!important}.planner-adjust-btn{width:46px!important}
  .planner-presets{gap:6px!important}.planner-preset{grid-template-columns:30px minmax(0,1fr)!important;padding:7px!important;gap:6px!important}.planner-preset-icon{width:30px!important;height:30px!important}
  .nearby-services{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important}.nearby-service{min-height:72px!important;padding:7px 4px!important}.nearby-service-icon{width:31px!important;height:31px!important}.nearby-service small{display:none!important}
  .destination-confirm{left:6px!important;right:6px!important;bottom:max(6px,env(safe-area-inset-bottom))!important;border-radius:26px!important}
  .route-head h2{font-size:17px!important}.route-time span{font-size:16px!important}
  .sub-actions{gap:5px!important}.sub-action{font-size:7px!important}
  .nav-maneuver-top{left:7px!important;right:7px!important;min-height:66px!important;border-radius:20px!important}.nav-maneuver-icon{width:44px!important;height:44px!important}.nav-maneuver-copy b{font-size:12px!important}
  .nav-panel.nav-minimal{left:7px!important;right:7px!important;bottom:max(7px,env(safe-area-inset-bottom))!important;border-radius:22px!important;padding:8px!important}.nav-summary-row{grid-template-columns:repeat(3,minmax(0,1fr)) 46px!important;gap:5px!important}.nav-summary-item{height:45px!important;padding:6px!important}.nav-search-btn{width:46px!important;height:45px!important}
  .map-tools{right:9px!important}.floating-locate{right:9px!important}.status-chip{left:9px!important}.gps-quality{right:9px!important}
}

@media (max-width:350px){
  :root{--planner-collapsed-h:162px}
  .map-brand-name{display:none}.map-brand{padding:0 7px!important}.planner-heading-copy b{font-size:18px!important}.planner-heading-copy span{display:none!important}
  .planner-presets{grid-template-columns:1fr 1fr 1fr!important}.planner-preset{display:flex!important;flex-direction:column!important;align-items:center!important;text-align:center!important;gap:4px!important}.planner-preset small{display:none!important}
  .nearby-services{grid-template-columns:repeat(4,1fr)!important}.nearby-service b{font-size:8px!important}
  .travel button{font-size:8px!important;gap:4px!important}.route-insight{gap:4px!important}.insight span{font-size:6px!important}
}

@media (max-height:680px) and (max-width:767px){
  :root{--planner-collapsed-h:154px}
  .sheet{max-height:72dvh!important}.planner-heading{padding-bottom:8px!important}.planner-heading-copy span{display:none!important}.planner-presets{margin-top:8px!important}.planner-expanded{max-height:38dvh!important}.nearby-service{min-height:64px!important}.planner-tip{display:none!important}
  #routeState{max-height:61dvh!important}.route-card{padding:9px!important}.route-insight{display:none!important}.disclaimer{display:none!important}
}

/* accessibility / reduced motion */
@media (prefers-reduced-motion:reduce){
  .sheet,.destination-confirm,.prefs-drawer,.safety-drawer,.account-drawer,.map-top-action,.planner-expand-hint svg{transition:none!important;animation:none!important}
}
@media (pointer:coarse){
  .map-top-action,.map-btn,.floating-locate,.planner-adjust-btn,.row-btn{min-width:44px;min-height:44px}
}


/* bundled vaizu-map-v75.css */
/* ============================================================
   VAIZO V75 — PLANNER MOBILE HARDENING
   Fixes clipped "Para onde vamos?" card, safe-area margins,
   collapsed-sheet layout and keyboard/small-phone behavior.
   ============================================================ */
:root{--planner-collapsed-h:174px}

/* No theme switch anywhere in the routing UI. */
[data-vaizu-theme-toggle]{display:none!important}

/* Make every critical planner child respect its own width. */
.sheet,.sheet *{min-width:0}
.sheet{
  left:max(8px,env(safe-area-inset-left))!important;
  right:max(8px,env(safe-area-inset-right))!important;
  bottom:max(8px,env(safe-area-inset-bottom))!important;
  width:auto!important;
  max-width:620px!important;
  padding:6px 12px 12px!important;
  border-radius:28px!important;
  overflow:hidden!important;
  contain:layout paint;
}

/* Search is now immediately below the title. In collapsed mode,
   remove nonessential sections from layout instead of making them invisible. */
.sheet.sheet-collapsed .planner-presets,
.sheet.sheet-collapsed .planner-expand-hint,
.sheet.sheet-collapsed .planner-expanded{display:none!important}
.sheet.sheet-collapsed .planner-heading{padding-bottom:8px!important}
.sheet.sheet-collapsed .planner-search-row{margin-bottom:0!important}

.planner-heading{padding-left:2px!important;padding-right:2px!important;gap:8px!important}
.planner-heading-copy{overflow:hidden!important}
.planner-heading-copy b{overflow-wrap:anywhere!important}

.planner-search-row{
  width:100%!important;
  grid-template-columns:minmax(0,1fr) 48px!important;
  gap:7px!important;
  margin:0!important;
}
.search-card.planner-search-card{width:100%!important;max-width:100%!important;overflow:visible!important}
.location-row.planner-location-row{
  width:100%!important;
  grid-template-columns:42px minmax(0,1fr) 40px!important;
  padding:0 5px 0 2px!important;
}
.location-input#destinationInput{
  width:100%!important;max-width:100%!important;min-width:0!important;
  text-overflow:ellipsis!important;white-space:nowrap!important;overflow:hidden!important;
}
.location-input#destinationInput:focus{white-space:normal!important;text-overflow:clip!important}
.planner-adjust-btn{width:48px!important;min-width:48px!important;max-width:48px!important}

/* Search dropdown should never escape the viewport horizontally. */
.search-results.search-results-portal{
  width:min(520px,calc(100vw - max(16px,env(safe-area-inset-left)) - max(16px,env(safe-area-inset-right))))!important;
  max-width:calc(100vw - 16px)!important;
}

/* Expanded content scrolls inside the card and never pushes the sheet off-screen. */
.sheet:not(.sheet-collapsed) .planner-presets{margin-top:9px!important}
.planner-expanded{max-height:min(42dvh,390px)!important;padding-bottom:4px!important}

@media(max-width:767px){
  .sheet{max-height:min(82dvh,760px)!important;margin:0!important}
  .planner-heading-copy b{font-size:21px!important;line-height:1.05!important}
  .planner-heading-copy small{font-size:8px!important}
  .planner-weather{height:32px!important;min-width:56px!important}
  .planner-presets{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
  .planner-preset{min-height:56px!important;padding:7px!important;grid-template-columns:31px minmax(0,1fr)!important;gap:6px!important}
  .planner-preset-icon{width:31px!important;height:31px!important}
  .planner-preset b{font-size:9px!important}.planner-preset small{font-size:7px!important}
  .planner-expand-hint{height:33px!important;margin-top:6px!important}
  .nearby-services{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important}
  .nearby-service{min-height:70px!important;padding:6px 3px!important}
}

@media(max-width:430px){
  :root{--planner-collapsed-h:168px}
  .sheet{left:max(6px,env(safe-area-inset-left))!important;right:max(6px,env(safe-area-inset-right))!important;bottom:max(6px,env(safe-area-inset-bottom))!important;padding:5px 10px 10px!important;border-radius:25px!important}
  .grab.planner-grab{height:21px!important;padding:8px 0!important}
  .grab.planner-grab:before{width:38px!important;height:4px!important}
  .planner-heading{padding-bottom:8px!important}
  .planner-heading-copy b{font-size:19px!important;letter-spacing:-.45px!important}
  .planner-weather{height:30px!important;padding:0 8px!important}
  .planner-search-row{grid-template-columns:minmax(0,1fr) 46px!important;gap:6px!important}
  .location-row.planner-location-row{height:52px!important;min-height:52px!important;grid-template-columns:39px minmax(0,1fr) 38px!important}
  .location-input#destinationInput{height:50px!important;font-size:13px!important;padding:0 2px!important}
  .row-btn#quickRecentTop{width:36px!important;height:36px!important}
  .planner-adjust-btn{width:46px!important;min-width:46px!important;height:52px!important;border-radius:17px!important}
}

@media(max-width:350px){
  :root{--planner-collapsed-h:162px}
  .planner-heading-copy b{font-size:18px!important}
  .planner-weather{display:none!important}
  .planner-search-row{grid-template-columns:minmax(0,1fr) 44px!important}
  .planner-adjust-btn{width:44px!important;min-width:44px!important}
  .planner-presets{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .planner-preset{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;padding:6px 3px!important}
  .planner-preset small{display:none!important}
}

@media(max-height:680px) and (max-width:767px){
  :root{--planner-collapsed-h:156px}
  .sheet{max-height:76dvh!important}
  .planner-heading-copy span,.planner-tip{display:none!important}
  .planner-expanded{max-height:34dvh!important}
}

/* When the software keyboard reduces the visual viewport, keep the search card usable. */
@media(max-height:520px) and (max-width:767px){
  .sheet{max-height:92dvh!important;bottom:max(4px,env(safe-area-inset-bottom))!important}
  .planner-presets,.planner-expand-hint,.planner-expanded{display:none!important}
  .sheet:not(.sheet-collapsed){transform:none!important}
}


/* bundled vaizu-map-v76.css */
/* ============================================================
   VAIZO V76 — White / Day polish, compact navigation HUD
   ============================================================ */
:root{
  --v76-gap:7px;
  --v76-control:44px;
  --v76-attrib-lane:25px;
}
.ws-app{background:#eef1f5!important}
.map-vignette{opacity:.10!important}
.map-btn,.floating-locate,.nav-stack-btn,.nav-audio-toggle{
  width:var(--v76-control)!important;height:var(--v76-control)!important;border-radius:14px!important;
  border-color:rgba(214,218,228,.96)!important;background:rgba(255,255,255,.96)!important;
  box-shadow:0 7px 20px rgba(40,48,78,.10)!important;backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;
}
.quick-alert-trigger{color:#d45854!important}.quick-alert-trigger:hover{background:#fff7f6!important}
.route-insight{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.route-insight .insight{min-width:0!important}
.safety-evidence{grid-template-columns:repeat(3,minmax(0,1fr))!important}

/* Mapbox attribution gets its own bottom lane. */
.mapboxgl-ctrl-bottom-right,.mapboxgl-ctrl-bottom-left{bottom:max(2px,env(safe-area-inset-bottom))!important;z-index:18!important}
.mapboxgl-ctrl-attrib{font-size:8px!important;border-radius:8px 0 0 0!important;background:rgba(255,255,255,.88)!important;color:#667085!important;box-shadow:none!important}
.mapboxgl-ctrl-logo{transform:scale(.78);transform-origin:left bottom}

/* Quick alert sheet */
.quick-alert-sheet{position:absolute;inset:0;z-index:95;pointer-events:none;opacity:0;transition:opacity .16s ease}
.quick-alert-sheet.show{pointer-events:auto;opacity:1}
.quick-alert-backdrop{position:absolute;inset:0;border:0;background:rgba(18,22,35,.18);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.quick-alert-card{position:absolute;left:50%;bottom:max(34px,calc(env(safe-area-inset-bottom) + 28px));width:min(520px,calc(100vw - 20px));transform:translate(-50%,18px);padding:8px 14px 14px;border:1px solid #e0e3eb;border-radius:24px;background:#fff;color:#1f2533;box-shadow:0 20px 55px rgba(35,42,70,.18);transition:transform .22s cubic-bezier(.2,.82,.25,1)}
.quick-alert-sheet.show .quick-alert-card{transform:translate(-50%,0)}
.quick-alert-grab{width:38px;height:4px;margin:1px auto 9px;border-radius:999px;background:#d7dae3}
.quick-alert-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.quick-alert-head small{display:block;color:#665cf6;font-size:8px;font-weight:900;letter-spacing:.12em}.quick-alert-head h3{margin:3px 0 1px;font-size:17px;letter-spacing:-.4px}.quick-alert-head p{margin:0;color:#81899a;font-size:9px}.quick-alert-close{width:36px;height:36px;border:1px solid #e5e7ed;border-radius:12px;background:#f7f8fb;color:#50586a;display:grid;place-items:center}
.quick-alert-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:12px}.quick-alert-grid button{min-height:72px;padding:8px 5px;border:1px solid #e5e7ed;border-radius:15px;background:#f8f9fb;color:#343b4c;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font:inherit;cursor:pointer}.quick-alert-grid button:hover{border-color:#d7d5ff;background:#f5f4ff;color:#5650d8}.quick-alert-grid button:disabled{opacity:.48}.quick-alert-grid svg{width:18px;height:18px;color:#665cf6}.quick-alert-grid span{font-size:8.5px;font-weight:850;text-align:center;line-height:1.15}.quick-alert-status{min-height:15px;padding-top:8px;text-align:center;color:#747d8f;font-size:9px;font-weight:700}
.vaizu-alert-popup{min-width:168px;padding:2px;color:#252b39;font-family:Inter,system-ui,sans-serif}.vaizu-alert-popup small{display:block;color:#665cf6;font-size:7px;font-weight:900;letter-spacing:.10em}.vaizu-alert-popup b{display:block;margin-top:3px;font-size:12px}.vaizu-alert-popup span,.vaizu-alert-popup em{display:block;margin-top:3px;color:#7b8393;font-size:8.5px;font-style:normal}.vaizu-alert-popup button{width:100%;height:34px;margin-top:9px;border:0;border-radius:10px;background:#665cf6;color:#fff;font-size:9px;font-weight:850}.mapboxgl-popup-content{border-radius:15px!important;padding:11px!important;box-shadow:0 12px 30px rgba(35,42,65,.16)!important}

/* Navigation: one visually consistent right-hand control column. */
.body-nav .map-tools{display:flex!important;position:absolute!important;right:max(8px,env(safe-area-inset-right))!important;top:max(80px,calc(env(safe-area-inset-top) + 78px))!important;bottom:auto!important;flex-direction:column!important;gap:var(--v76-gap)!important;z-index:45!important}
.body-nav .map-tools #safetyToolsBtn,.body-nav .map-tools #focusModeBtn{display:none!important}
.body-nav .floating-locate{display:grid!important;right:max(8px,env(safe-area-inset-right))!important;left:auto!important;top:max(131px,calc(env(safe-area-inset-top) + 129px))!important;bottom:auto!important;z-index:45!important}
.body-nav .nav-control-stack{right:max(8px,env(safe-area-inset-right))!important;top:max(182px,calc(env(safe-area-inset-top) + 180px))!important;bottom:auto!important;gap:var(--v76-gap)!important;z-index:45!important}
.body-nav .nav-audio-toggle{right:max(8px,env(safe-area-inset-right))!important;top:max(386px,calc(env(safe-area-inset-top) + 384px))!important;bottom:auto!important;z-index:45!important}
.body-nav .nav-control-stack .nav-stack-btn{position:relative!important}
.body-nav .nav-panel.nav-minimal{bottom:max(var(--v76-attrib-lane),calc(env(safe-area-inset-bottom) + var(--v76-attrib-lane)))!important}
.body-nav .mapboxgl-ctrl-bottom-right,.body-nav .mapboxgl-ctrl-bottom-left{bottom:max(2px,env(safe-area-inset-bottom))!important}
.body-nav .floating-speedo{left:max(9px,env(safe-area-inset-left))!important;right:auto!important;top:auto!important;bottom:max(100px,calc(env(safe-area-inset-bottom) + 100px))!important;min-width:62px!important;width:62px!important;padding:7px 7px 6px!important;border-radius:16px!important;text-align:center!important;background:rgba(255,255,255,.97)!important}
.body-nav .floating-speedo small{display:none!important}.body-nav .floating-speedo strong{display:block!important;font-size:24px!important;line-height:1!important;letter-spacing:-1px!important}.body-nav .floating-speedo span{display:block!important;margin-top:2px!important;font-size:7px!important;font-weight:850!important}
.body-nav .nav-voice-popover{right:60px!important;left:auto!important;max-width:min(250px,calc(100vw - 80px))!important}

/* Prevent route cards and map controls from claiming excessive space. */
.route-card{border-radius:18px!important;box-shadow:none!important}
.sub-actions.preview-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}.sub-action{min-width:0!important;justify-content:center!important}
.destination-confirm,.prefs-drawer,.safety-drawer,.account-drawer{max-width:calc(100vw - 12px)!important}

@media (min-width:768px){
  .body-nav .map-tools{right:18px!important;top:92px!important}.body-nav .floating-locate{right:18px!important;top:143px!important}.body-nav .nav-control-stack{right:18px!important;top:194px!important}.body-nav .nav-audio-toggle{right:18px!important;top:398px!important}
  .body-nav .nav-panel.nav-minimal{bottom:30px!important}
  .body-nav .floating-speedo{left:18px!important;bottom:112px!important}
  .quick-alert-card{bottom:34px!important}
}
@media (min-width:1180px){
  .body-nav .map-tools{right:24px!important}.body-nav .floating-locate{right:24px!important}.body-nav .nav-control-stack{right:24px!important}.body-nav .nav-audio-toggle{right:24px!important}
  .body-nav .floating-speedo{left:24px!important}
}
@media (max-width:560px){
  :root{--v76-control:42px;--v76-gap:6px;--v76-attrib-lane:24px}
  .body-nav .map-tools{right:max(7px,env(safe-area-inset-right))!important;top:max(74px,calc(env(safe-area-inset-top) + 72px))!important}.body-nav .floating-locate{right:max(7px,env(safe-area-inset-right))!important;top:max(122px,calc(env(safe-area-inset-top) + 120px))!important}.body-nav .nav-control-stack{right:max(7px,env(safe-area-inset-right))!important;top:max(170px,calc(env(safe-area-inset-top) + 168px))!important}.body-nav .nav-audio-toggle{right:max(7px,env(safe-area-inset-right))!important;top:max(362px,calc(env(safe-area-inset-top) + 360px))!important}
  .quick-alert-card{left:max(6px,env(safe-area-inset-left));right:max(6px,env(safe-area-inset-right));width:auto;bottom:max(31px,calc(env(safe-area-inset-bottom) + 26px));transform:translateY(18px);border-radius:22px;padding:7px 10px 12px}.quick-alert-sheet.show .quick-alert-card{transform:translateY(0)}
  .quick-alert-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.quick-alert-grid button{min-height:65px;border-radius:14px}.quick-alert-grid button:last-child{grid-column:2}
  .body-nav .floating-speedo{left:max(7px,env(safe-area-inset-left))!important;bottom:max(98px,calc(env(safe-area-inset-bottom) + 98px))!important;width:58px!important;min-width:58px!important}
  .body-nav .floating-speedo strong{font-size:22px!important}
  .body-nav .nav-maneuver-top{padding-right:55px!important}
  .route-insight{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:350px){
  :root{--v76-control:40px;--v76-gap:5px}
  .body-nav .nav-control-stack{top:max(164px,calc(env(safe-area-inset-top) + 162px))!important}.body-nav .nav-audio-toggle{top:max(344px,calc(env(safe-area-inset-top) + 342px))!important}
  .quick-alert-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-alert-grid button:last-child{grid-column:auto}
  .quick-alert-head p{display:none}.body-nav .floating-speedo{width:55px!important;min-width:55px!important}
}
@media (max-height:620px) and (max-width:767px){
  :root{--v76-control:38px;--v76-gap:4px}
  .body-nav .map-tools{top:max(71px,calc(env(safe-area-inset-top) + 69px))!important}.body-nav .floating-locate{top:max(113px,calc(env(safe-area-inset-top) + 111px))!important}.body-nav .nav-control-stack{top:max(155px,calc(env(safe-area-inset-top) + 153px))!important}.body-nav .nav-audio-toggle{top:max(323px,calc(env(safe-area-inset-top) + 321px))!important}
  .body-nav .floating-speedo{bottom:max(93px,calc(env(safe-area-inset-bottom) + 93px))!important}
}
@media (orientation:landscape) and (max-height:540px){
  .body-nav .nav-control-stack{display:grid!important;grid-template-columns:repeat(2,var(--v76-control))!important;top:max(118px,calc(env(safe-area-inset-top) + 116px))!important}.body-nav .nav-audio-toggle{top:max(214px,calc(env(safe-area-inset-top) + 212px))!important}.body-nav .floating-locate{top:max(70px,calc(env(safe-area-inset-top) + 68px))!important}.body-nav .map-tools{top:max(22px,calc(env(safe-area-inset-top) + 20px))!important}.body-nav .floating-speedo{bottom:max(92px,calc(env(safe-area-inset-bottom) + 92px))!important}
}

/* V76 final geometry lock — outranks legacy V60–V74 !important selectors. */
body.body-nav .ws-app .nav-control-stack{
  position:absolute!important;display:flex!important;flex-direction:column!important;grid-template-columns:none!important;
  justify-content:flex-start!important;align-items:stretch!important;left:auto!important;right:max(8px,env(safe-area-inset-right))!important;
  top:max(182px,calc(env(safe-area-inset-top) + 180px))!important;bottom:auto!important;width:var(--v76-control)!important;height:auto!important;
  max-height:none!important;gap:var(--v76-gap)!important;z-index:45!important;
}
body.body-nav .ws-app .nav-control-stack .nav-stack-btn,
body.body-nav .ws-app .nav-audio-toggle,
body.body-nav .ws-app .floating-locate,
body.body-nav .ws-app .map-tools .map-btn{
  width:var(--v76-control)!important;height:var(--v76-control)!important;min-width:var(--v76-control)!important;min-height:var(--v76-control)!important;
}
body.body-nav .ws-app .nav-audio-toggle{
  left:auto!important;right:max(8px,env(safe-area-inset-right))!important;top:max(386px,calc(env(safe-area-inset-top) + 384px))!important;bottom:auto!important;
}
body.body-nav .ws-app .floating-locate{
  display:grid!important;left:auto!important;right:max(8px,env(safe-area-inset-right))!important;top:max(131px,calc(env(safe-area-inset-top) + 129px))!important;bottom:auto!important;
}
body.body-nav .ws-app .floating-speedo{
  left:max(9px,env(safe-area-inset-left))!important;right:auto!important;top:auto!important;bottom:max(100px,calc(env(safe-area-inset-bottom) + 100px))!important;
  width:62px!important;min-width:62px!important;height:62px!important;
}
body.body-nav .ws-app #activeNav.nav-panel.nav-minimal{
  left:max(7px,env(safe-area-inset-left))!important;right:max(7px,env(safe-area-inset-right))!important;top:auto!important;
  bottom:max(var(--v76-attrib-lane),calc(env(safe-area-inset-bottom) + var(--v76-attrib-lane)))!important;
  width:auto!important;max-width:700px!important;margin:0 auto!important;transform:translateY(calc(100% + 60px))!important;
}
body.body-nav .ws-app #activeNav.nav-panel.nav-minimal.show{transform:none!important;opacity:1!important;pointer-events:auto!important}

@media (min-width:768px){
  body.body-nav .ws-app .nav-control-stack{left:auto!important;right:18px!important;top:194px!important;bottom:auto!important;flex-direction:column!important}
  body.body-nav .ws-app .nav-audio-toggle{left:auto!important;right:18px!important;top:398px!important;bottom:auto!important}
  body.body-nav .ws-app .floating-locate{left:auto!important;right:18px!important;top:143px!important;bottom:auto!important}
  body.body-nav .ws-app .floating-speedo{left:18px!important;right:auto!important;bottom:112px!important;width:62px!important;min-width:62px!important;height:62px!important}
  body.body-nav .ws-app #activeNav.nav-panel.nav-minimal{bottom:30px!important}
}
@media (min-width:1180px){
  body.body-nav .ws-app .nav-control-stack,body.body-nav .ws-app .nav-audio-toggle,body.body-nav .ws-app .floating-locate{right:24px!important;left:auto!important}
  body.body-nav .ws-app .floating-speedo{left:24px!important;right:auto!important}
}
@media (max-width:560px){
  body.body-nav .ws-app .nav-control-stack{right:max(7px,env(safe-area-inset-right))!important;top:max(170px,calc(env(safe-area-inset-top) + 168px))!important;bottom:auto!important}
  body.body-nav .ws-app .nav-audio-toggle{right:max(7px,env(safe-area-inset-right))!important;top:max(362px,calc(env(safe-area-inset-top) + 360px))!important;bottom:auto!important}
  body.body-nav .ws-app .floating-locate{right:max(7px,env(safe-area-inset-right))!important;top:max(122px,calc(env(safe-area-inset-top) + 120px))!important;bottom:auto!important}
  body.body-nav .ws-app .floating-speedo{left:max(7px,env(safe-area-inset-left))!important;right:auto!important;bottom:max(98px,calc(env(safe-area-inset-bottom) + 98px))!important;width:58px!important;min-width:58px!important;height:58px!important}
}
@media (max-width:350px){
  body.body-nav .ws-app .nav-control-stack{top:max(164px,calc(env(safe-area-inset-top) + 162px))!important}
  body.body-nav .ws-app .nav-audio-toggle{top:max(344px,calc(env(safe-area-inset-top) + 342px))!important}
  body.body-nav .ws-app .floating-speedo{width:55px!important;min-width:55px!important;height:55px!important}
}
@media (max-height:620px) and (max-width:767px){
  body.body-nav .ws-app .nav-control-stack{top:max(155px,calc(env(safe-area-inset-top) + 153px))!important}
  body.body-nav .ws-app .nav-audio-toggle{top:max(323px,calc(env(safe-area-inset-top) + 321px))!important}
  body.body-nav .ws-app .floating-locate{top:max(113px,calc(env(safe-area-inset-top) + 111px))!important}
  body.body-nav .ws-app .floating-speedo{bottom:max(93px,calc(env(safe-area-inset-bottom) + 93px))!important}
}
@media (orientation:landscape) and (max-height:540px){
  body.body-nav .ws-app .nav-control-stack{display:flex!important;grid-template-columns:none!important;flex-direction:column!important;top:max(118px,calc(env(safe-area-inset-top) + 116px))!important;bottom:auto!important}
  body.body-nav .ws-app .nav-audio-toggle{top:max(322px,calc(env(safe-area-inset-top) + 320px))!important;bottom:auto!important}
  body.body-nav .ws-app .floating-locate{top:max(70px,calc(env(safe-area-inset-top) + 68px))!important;bottom:auto!important}
}

/* Active nav needs the same specificity as the legacy html[data-vaizu-theme] lock. */
html[data-vaizu-theme] body.body-nav .ws-app #activeNav.nav-panel.nav-minimal{
  left:max(7px,env(safe-area-inset-left))!important;right:max(7px,env(safe-area-inset-right))!important;top:auto!important;
  bottom:max(var(--v76-attrib-lane),calc(env(safe-area-inset-bottom) + var(--v76-attrib-lane)))!important;
  width:auto!important;max-width:700px!important;margin:0 auto!important;transform:translateY(calc(100% + 60px))!important;
}
html[data-vaizu-theme] body.body-nav .ws-app #activeNav.nav-panel.nav-minimal.show{transform:none!important;opacity:1!important;pointer-events:auto!important}
@media (min-width:768px){html[data-vaizu-theme] body.body-nav .ws-app #activeNav.nav-panel.nav-minimal{bottom:30px!important}}


/* VAIZO V76.1 — requested cleanup */
.segment{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.start-trip-copy small{color:#fff!important;opacity:1!important}


/* VAIZO V83 — recent destination buttons removed; keep saved places balanced. */
.planner-presets{grid-template-columns:repeat(2,minmax(0,1fr))!important}
@media(max-width:560px){.planner-presets{grid-template-columns:repeat(2,minmax(0,1fr))!important}}


/* bundled vaizu-map-v81.css */
/* ============================================================
   VAIZO V81 — destination card + faster search polish
   - no recent destination shortcut or automatic recent request
   - cleaner initial planner card
   - clearer address/place result hierarchy
   ============================================================ */

/* Hard-disable legacy recent shortcuts if an older cached template injects them. */
#quickRecent,#quickRecentTop,[data-recent-destination]{display:none!important}

/* Initial destination card */
.sheet:not(.hidden) .planner-welcome{
  position:relative;
}
.planner-heading{
  align-items:center!important;
  padding:0 2px 10px!important;
}
.planner-heading-copy small{
  width:max-content!important;
  margin:0 0 5px!important;
  padding:4px 7px!important;
  border:1px solid rgba(91,92,226,.12)!important;
  border-radius:999px!important;
  background:var(--vg-primary-soft)!important;
  color:var(--vg-primary)!important;
  font-size:7.5px!important;
  line-height:1!important;
  letter-spacing:.13em!important;
}
.planner-heading-copy b{
  font-size:23px!important;
  line-height:1.04!important;
  font-weight:880!important;
  letter-spacing:-.72px!important;
}
.planner-weather{
  height:34px!important;
  min-width:58px!important;
  border-radius:13px!important;
  background:var(--vg-surface-solid)!important;
  border-color:var(--vg-border)!important;
  box-shadow:0 4px 14px rgba(28,33,51,.05)!important;
}

.planner-search-row{
  grid-template-columns:minmax(0,1fr) 48px!important;
  gap:7px!important;
}
.search-card.planner-search-card{
  border-radius:19px!important;
  border:1px solid rgba(91,92,226,.13)!important;
  background:var(--vg-surface-solid)!important;
  box-shadow:0 9px 28px rgba(34,39,66,.09),inset 0 1px 0 rgba(255,255,255,.62)!important;
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease!important;
}
.search-card.planner-search-card:focus-within{
  transform:none!important;
  border-color:rgba(91,92,226,.40)!important;
  box-shadow:0 12px 34px rgba(34,39,66,.12),0 0 0 3px rgba(91,92,226,.09)!important;
}
.location-row.planner-location-row{
  height:56px!important;
  min-height:56px!important;
  grid-template-columns:42px minmax(0,1fr) 40px!important;
  padding:0 5px 0 3px!important;
  background:transparent!important;
  box-shadow:none!important;
}
.planner-search-icon{
  width:34px!important;
  height:34px!important;
  margin-left:1px!important;
  border-radius:12px!important;
  background:var(--vg-primary-soft)!important;
  color:var(--vg-primary)!important;
}
.location-input#destinationInput{
  height:54px!important;
  padding:0 6px!important;
  font-size:14.5px!important;
  font-weight:700!important;
  letter-spacing:-.18px!important;
}
.location-input#destinationInput::placeholder{
  color:var(--vg-muted)!important;
  opacity:.88!important;
}
#voiceSearchBtn{
  width:36px!important;
  height:36px!important;
  border:1px solid transparent!important;
  border-radius:12px!important;
  color:var(--vg-text-2)!important;
}
#voiceSearchBtn:hover,#voiceSearchBtn:active{
  background:var(--vg-surface-soft)!important;
  border-color:var(--vg-border)!important;
}
.planner-adjust-btn{
  width:48px!important;
  height:56px!important;
  border-radius:18px!important;
  background:var(--vg-surface-solid)!important;
  border-color:var(--vg-border)!important;
  color:var(--vg-text-2)!important;
  box-shadow:0 7px 22px rgba(34,39,66,.06)!important;
}
.planner-adjust-btn:hover{border-color:rgba(91,92,226,.22)!important;color:var(--vg-primary)!important}

/* Saved destinations stay visible, balanced and quieter than the main search. */
.planner-presets{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px!important;
  margin-top:9px!important;
}
.planner-preset{
  min-height:58px!important;
  padding:8px 9px!important;
  border-radius:16px!important;
  background:var(--vg-surface-soft)!important;
  border-color:var(--vg-border)!important;
  box-shadow:none!important;
}
.planner-preset-icon{
  width:33px!important;
  height:33px!important;
  border-radius:11px!important;
}
.planner-preset b{font-size:10px!important;font-weight:800!important}
.planner-preset small{font-size:7.5px!important}

/* Search dropdown */
.search-results,.search-results.search-results-portal{
  padding:7px!important;
  border-radius:20px!important;
  border-color:var(--vg-border)!important;
  background:var(--vg-surface-solid)!important;
  box-shadow:0 20px 54px rgba(28,33,51,.17)!important;
  scrollbar-width:thin;
}
.search-label{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  padding:7px 8px 6px!important;
  color:var(--vg-text-2)!important;
  text-transform:none!important;
  letter-spacing:0!important;
}
.search-label span{
  color:var(--vg-text)!important;
  font-size:10px!important;
  font-weight:850!important;
}
.search-label em{
  color:var(--vg-muted)!important;
  font-size:7.5px!important;
  font-style:normal!important;
  font-weight:720!important;
}
.search-item.rich,
.search-item.rich.no-photo,
.search-item.rich.has-photo{
  width:100%!important;
  min-height:64px!important;
  grid-template-columns:44px minmax(0,1fr) auto!important;
  gap:9px!important;
  padding:8px!important;
  margin:0!important;
  border:1px solid transparent!important;
  border-radius:15px!important;
  background:transparent!important;
  text-align:left!important;
}
.search-item.rich+.search-item.rich{margin-top:2px!important}
.search-item.rich:hover,.search-item.rich:active{
  background:var(--vg-surface-soft)!important;
  border-color:var(--vg-border)!important;
}
.search-item.rich.has-photo{grid-template-columns:52px minmax(0,1fr) auto!important}
.place-thumb{
  width:52px!important;
  height:52px!important;
  border-radius:13px!important;
  box-shadow:inset 0 0 0 1px var(--vg-border)!important;
}
.place-thumb-badge{font-size:6px!important;padding:3px 5px!important}
.result-icon{
  width:42px!important;
  height:42px!important;
  border-radius:13px!important;
  background:var(--vg-primary-soft)!important;
  color:var(--vg-primary)!important;
  border:1px solid rgba(91,92,226,.08)!important;
  display:grid!important;
  place-items:center!important;
}
.result-icon.street{background:rgba(37,99,235,.08)!important;color:#2563EB!important;border-color:rgba(37,99,235,.08)!important}
.result-icon.postcode{background:rgba(5,150,105,.08)!important;color:#059669!important;border-color:rgba(5,150,105,.08)!important}
.result-copy{min-width:0!important;padding:0!important}
.result-topline b{
  display:block!important;
  color:var(--vg-text)!important;
  font-size:11.5px!important;
  line-height:1.18!important;
  font-weight:820!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.result-address{
  display:block!important;
  margin-top:3px!important;
  color:var(--vg-text-2)!important;
  font-size:9px!important;
  line-height:1.25!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.result-copy small{
  display:block!important;
  margin-top:4px!important;
  color:var(--vg-muted)!important;
  font-size:7.5px!important;
  line-height:1.25!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.result-meta{
  align-self:center!important;
  padding:4px 6px!important;
  border:1px solid var(--vg-border)!important;
  border-radius:999px!important;
  background:var(--vg-surface-soft)!important;
  color:var(--vg-muted)!important;
  font-size:6.5px!important;
  font-weight:900!important;
  letter-spacing:.04em!important;
  white-space:nowrap!important;
}
.result-meta.precise{
  color:#07835e!important;
  border-color:rgba(5,150,105,.18)!important;
  background:rgba(5,150,105,.08)!important;
}
.search-message{
  padding:18px 12px!important;
  text-align:center!important;
  color:var(--vg-muted)!important;
}
.search-message b{display:block!important;color:var(--vg-text)!important;font-size:10px!important}
.search-message span{display:block!important;margin-top:5px!important;font-size:8px!important;line-height:1.4!important}
.search-loading{
  display:flex;align-items:center;gap:10px;padding:14px 11px;color:var(--vg-text);
}
.search-loading>span:last-child{min-width:0;display:flex;flex-direction:column;gap:3px}
.search-loading b{font-size:10px;font-weight:820}.search-loading small{color:var(--vg-muted);font-size:7.5px;line-height:1.3}
.search-loading-pin{
  width:34px;height:34px;flex:0 0 34px;border-radius:12px;background:var(--vg-primary-soft);position:relative;
}
.search-loading-pin:before{
  content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-4.5px;border-radius:50%;background:var(--vg-primary);
  box-shadow:0 0 0 0 var(--vg-primary-ring);animation:v81SearchPulse 1s ease-out infinite;
}
@keyframes v81SearchPulse{70%{box-shadow:0 0 0 9px rgba(91,92,226,0)}100%{box-shadow:0 0 0 0 rgba(91,92,226,0)}}

html[data-vaizu-theme="black"] .search-card.planner-search-card{
  box-shadow:0 12px 30px rgba(0,0,0,.24)!important,inset 0 1px 0 rgba(255,255,255,.025)!important;
}
html[data-vaizu-theme="black"] .search-results,
html[data-vaizu-theme="black"] .search-results.search-results-portal{
  box-shadow:0 22px 58px rgba(0,0,0,.42)!important;
}
html[data-vaizu-theme="black"] .result-meta.precise{color:#7DE2B8!important}

@media(max-width:560px){
  .planner-heading-copy b{font-size:21px!important}
  .planner-heading{padding-bottom:8px!important}
  .planner-search-row{grid-template-columns:minmax(0,1fr) 46px!important;gap:6px!important}
  .search-card.planner-search-card{border-radius:17px!important}
  .location-row.planner-location-row{height:53px!important;min-height:53px!important;grid-template-columns:39px minmax(0,1fr) 38px!important}
  .planner-search-icon{width:31px!important;height:31px!important;border-radius:10px!important}
  .location-input#destinationInput{height:51px!important;font-size:13.7px!important}
  #voiceSearchBtn{width:34px!important;height:34px!important}
  .planner-adjust-btn{width:46px!important;min-width:46px!important;height:53px!important;border-radius:16px!important}
  .planner-preset{min-height:55px!important;padding:7px 8px!important}
  .search-item.rich,.search-item.rich.no-photo,.search-item.rich.has-photo{min-height:60px!important;padding:7px!important;grid-template-columns:40px minmax(0,1fr) auto!important}
  .search-item.rich.has-photo{grid-template-columns:48px minmax(0,1fr) auto!important}
  .result-icon{width:39px!important;height:39px!important;border-radius:12px!important}
  .place-thumb{width:48px!important;height:48px!important;border-radius:12px!important}
  .result-meta{font-size:6px!important;padding:4px 5px!important}
}
@media(max-width:350px){
  .planner-heading-copy b{font-size:18px!important}
  .planner-weather{min-width:52px!important;padding:0 7px!important}
  .planner-search-row{grid-template-columns:minmax(0,1fr) 43px!important}
  .planner-adjust-btn{width:43px!important;min-width:43px!important}
  .result-meta{display:none!important}
  .search-item.rich,.search-item.rich.no-photo,.search-item.rich.has-photo{grid-template-columns:38px minmax(0,1fr)!important}
  .search-item.rich.has-photo{grid-template-columns:45px minmax(0,1fr)!important}
}
@media(prefers-reduced-motion:reduce){.search-loading-pin:before{animation:none!important}}


/* bundled vaizu-map-v84.css */
/* ============================================================
   VAIZO V84 — universal phone geometry + fluid motion
   Goal: preserve one visual composition from compact Android/iPhone
   screens through large phones, scaling dimensions instead of changing
   layout structure. Loaded after all legacy map CSS.
   ============================================================ */

:root{
  --v84-ease:cubic-bezier(.2,.78,.2,1);
  --v84-fast:150ms;
  --v84-normal:230ms;
}

/* Use the real VisualViewport height when JS exposes it. This avoids the
   classic 100vh jump caused by Android browser bars and iOS Safari chrome. */
.ws-app{
  height:var(--vaizu-vh,100dvh)!important;
  min-height:0!important;
}

@media (max-width:699px), (pointer:coarse) and (min-width:700px) and (max-width:1024px) and (max-height:720px){
  :root{
    --v84-edge:clamp(6px,2.15vw,10px);
    --v84-control:clamp(42px,11.7vw,48px);
    --v84-search-h:clamp(51px,14.2vw,56px);
    --v84-title:clamp(18px,5.45vw,22px);
    --v84-safe-bottom:max(6px,env(safe-area-inset-bottom));
  }

  html,body{width:100%;height:100%;max-width:100%;overflow:hidden!important;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  .ws-app{width:100%!important;max-width:none!important;margin:0!important;border:0!important;border-radius:0!important}

  /* Same planner composition on every phone width. */
  #planSheet{
    left:max(var(--v84-edge),env(safe-area-inset-left))!important;
    right:max(var(--v84-edge),env(safe-area-inset-right))!important;
    width:auto!important;
    max-width:none!important;
    padding-left:clamp(8px,2.7vw,11px)!important;
    padding-right:clamp(8px,2.7vw,11px)!important;
    padding-bottom:max(10px,calc(env(safe-area-inset-bottom) + 7px))!important;
    box-sizing:border-box!important;
  }
  .planner-heading{min-height:34px!important;padding:0 2px 8px!important;gap:8px!important}
  .planner-heading-copy{min-width:0!important}
  .planner-heading-copy small{display:inline-flex!important;font-size:clamp(6.8px,2vw,7.5px)!important}
  .planner-heading-copy b{font-size:var(--v84-title)!important;line-height:1.04!important;letter-spacing:clamp(-.72px,-.16vw,-.45px)!important;white-space:nowrap!important}
  .planner-weather{display:flex!important;min-width:clamp(52px,15vw,58px)!important;height:34px!important;padding-inline:clamp(6px,2vw,9px)!important}

  .planner-search-row{
    grid-template-columns:minmax(0,1fr) clamp(44px,12.5vw,48px)!important;
    gap:clamp(5px,1.7vw,7px)!important;
  }
  .search-card.planner-search-card{height:var(--v84-search-h)!important;min-height:var(--v84-search-h)!important;border-radius:clamp(16px,4.8vw,19px)!important;padding:0 4px!important}
  .location-row.planner-location-row{
    height:100%!important;min-height:100%!important;
    grid-template-columns:clamp(36px,10.8vw,42px) minmax(0,1fr) clamp(36px,10.3vw,40px)!important;
    gap:1px!important;padding:0 3px!important;
  }
  .planner-search-icon{width:clamp(30px,9vw,34px)!important;height:clamp(30px,9vw,34px)!important;border-radius:11px!important}
  .location-input#destinationInput{height:100%!important;min-width:0!important;padding:0 clamp(3px,1.2vw,6px)!important;font-size:clamp(12.8px,3.8vw,14.5px)!important;line-height:1.15!important}
  #voiceSearchBtn{display:grid!important;width:clamp(34px,9.7vw,36px)!important;height:clamp(34px,9.7vw,36px)!important;min-width:0!important;min-height:0!important}
  .planner-adjust-btn{width:100%!important;min-width:0!important;height:var(--v84-search-h)!important;border-radius:clamp(15px,4.6vw,18px)!important}

  /* Casa / Trabalho never change to a different visual structure on tiny phones. */
  .planner-presets{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:clamp(5px,1.8vw,7px)!important;margin-top:8px!important;overflow:visible!important}
  .planner-preset{
    display:grid!important;grid-template-columns:clamp(30px,9vw,33px) minmax(0,1fr)!important;
    align-items:center!important;text-align:left!important;gap:clamp(6px,2vw,8px)!important;
    width:100%!important;min-width:0!important;max-width:none!important;
    min-height:clamp(52px,15vw,58px)!important;height:auto!important;
    padding:clamp(7px,2.2vw,9px)!important;border-radius:clamp(14px,4.4vw,16px)!important;
  }
  .planner-preset-icon{width:clamp(30px,9vw,33px)!important;height:clamp(30px,9vw,33px)!important;border-radius:11px!important;flex:none!important}
  .planner-preset b{font-size:clamp(9px,2.8vw,10px)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .planner-preset small{display:block!important;font-size:clamp(6.8px,2.1vw,7.5px)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}

  /* Results keep the same hierarchy instead of dropping badges/metadata. */
  .search-results,.search-results.search-results-portal{border-radius:clamp(17px,5.2vw,20px)!important;max-height:min(48vh,420px)!important}
  .search-item.rich,.search-item.rich.no-photo,.search-item.rich.has-photo{
    min-height:clamp(58px,17vw,64px)!important;
    grid-template-columns:clamp(38px,11.8vw,44px) minmax(0,1fr) auto!important;
    gap:clamp(6px,2.2vw,9px)!important;padding:clamp(6px,2vw,8px)!important;
  }
  .search-item.rich.has-photo{grid-template-columns:clamp(44px,13.8vw,52px) minmax(0,1fr) auto!important}
  .result-icon{width:clamp(37px,11.5vw,42px)!important;height:clamp(37px,11.5vw,42px)!important}
  .place-thumb{width:clamp(44px,13.8vw,52px)!important;height:clamp(44px,13.8vw,52px)!important}
  .result-topline b{font-size:clamp(10.5px,3.25vw,11.5px)!important}
  .result-address{font-size:clamp(8px,2.55vw,9px)!important}
  .result-copy small{display:block!important;font-size:clamp(6.8px,2.1vw,7.5px)!important}
  .result-meta{display:inline-flex!important;max-width:clamp(42px,15vw,62px)!important;overflow:hidden!important;text-overflow:ellipsis!important;font-size:clamp(5.6px,1.9vw,6.5px)!important;padding:4px 5px!important}

  /* Route chooser remains the same two-mode / three-transport geometry. */
  .segment{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .travel{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .segment button,.travel button{min-width:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .route-head{gap:8px!important}.route-head h2{font-size:clamp(15px,4.7vw,18px)!important}.route-time span{font-size:clamp(15px,4.6vw,18px)!important}
  .route-card{border-radius:clamp(17px,5vw,20px)!important}
  .start-trip-cta{min-height:52px!important}

  /* Bottom confirmation card uses the same action proportions on every width. */
  .destination-confirm{
    left:max(var(--v84-edge),env(safe-area-inset-left))!important;
    right:max(var(--v84-edge),env(safe-area-inset-right))!important;
    bottom:var(--v84-safe-bottom)!important;
    border-radius:clamp(21px,6.3vw,25px)!important;
  }
  .destination-confirm-actions{grid-template-columns:.72fr 1.3fr!important}
  .destination-confirm-actions button{height:clamp(43px,12.8vw,46px)!important}

  /* Navigation controls: same stack and same hierarchy, only fluid dimensions. */
  .body-nav .nav-panel.nav-minimal{
    left:max(var(--v84-edge),env(safe-area-inset-left))!important;
    right:max(var(--v84-edge),env(safe-area-inset-right))!important;
    width:auto!important;
  }
  .nav-summary-row{grid-template-columns:repeat(3,minmax(0,1fr)) clamp(42px,12vw,46px)!important;gap:clamp(4px,1.5vw,6px)!important}
  .nav-summary-item,.nav-search-btn{height:clamp(50px,14.5vw,55px)!important}
  .body-nav .nav-control-stack{right:max(var(--v84-edge),env(safe-area-inset-right))!important}
  .nav-stack-btn,.body-nav .nav-audio-toggle{width:clamp(42px,12vw,44px)!important;height:clamp(42px,12vw,44px)!important;border-radius:14px!important}
  .body-nav .floating-speedo{right:max(var(--v84-edge),env(safe-area-inset-right))!important}

  /* Keep touch targets reliable without changing card proportions. */
  .planner-adjust-btn,.destination-confirm-actions button,.segment button,.travel button,.start-trip-cta,.nav-stack-btn,.nav-audio-toggle{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

  /* Lightweight mobile motion. Legacy coarse-pointer CSS removed most motion;
     restore only transform/opacity/background transitions (cheap on the GPU). */
  .sheet,.destination-confirm,.prefs-drawer,.safety-drawer,.account-drawer,.quick-alert-card{
    will-change:transform,opacity;
    transition:transform var(--v84-normal) var(--v84-ease),opacity var(--v84-fast) ease!important;
  }
  .planner-preset,.planner-adjust-btn,.row-btn,.search-item,.segment button,.travel button,.route-variant,.sub-action,.start-trip-cta,.nav-stack-btn,.nav-audio-toggle{
    transition:transform var(--v84-fast) var(--v84-ease),background-color var(--v84-fast) ease,border-color var(--v84-fast) ease,box-shadow var(--v84-fast) ease,color var(--v84-fast) ease!important;
  }
  .planner-preset:active,.planner-adjust-btn:active,.row-btn:active,.search-item:active,.segment button:active,.travel button:active,.route-variant:active,.sub-action:active,.start-trip-cta:active,.nav-stack-btn:active,.nav-audio-toggle:active{transform:scale(.975)!important}
  #routeState{animation:v84RouteReveal .22s var(--v84-ease) both}
  .search-results.show{animation:v84ResultsIn .16s var(--v84-ease) both}
  .route-loading-overlay{transition:opacity .16s ease,visibility .16s ease!important}
}

@keyframes v84RouteReveal{from{opacity:.35;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes v84ResultsIn{from{opacity:.15;transform:translateY(-4px) scale(.995)}to{opacity:1;transform:none}}

/* Short screens keep the same composition and gain scrolling instead of
   silently switching to a different layout. The on-screen keyboard is the one
   exception: search remains prioritized so it cannot be covered. */
@media (max-width:699px) and (max-height:680px) and (min-height:521px),
       (pointer:coarse) and (min-width:700px) and (max-width:1024px) and (max-height:680px) and (min-height:521px){
  #planSheet{max-height:min(82vh,520px)!important}
  #planSheet:not(.sheet-collapsed) .planner-welcome,#planSheet:not(.sheet-collapsed) #routeState{overflow-y:auto!important;overscroll-behavior:contain!important;scrollbar-width:none}
  #planSheet:not(.sheet-collapsed) .planner-welcome::-webkit-scrollbar,#planSheet:not(.sheet-collapsed) #routeState::-webkit-scrollbar{display:none}
  .planner-heading-copy small,.planner-preset small{display:block!important}
  .planner-presets{display:grid!important}
  .planner-expand-hint{display:flex!important}
}

@media (max-width:699px) and (max-height:520px),
       (pointer:coarse) and (min-width:700px) and (max-width:1024px) and (max-height:520px){
  #planSheet{max-height:92vh!important}
  /* Keyboard/landscape safety: don't mutate the search row itself. */
  .planner-search-row{display:grid!important}
}

@media (prefers-reduced-motion:reduce){
  #routeState,.search-results.show{animation:none!important}
  .sheet,.destination-confirm,.prefs-drawer,.safety-drawer,.account-drawer,.quick-alert-card,
  .planner-preset,.planner-adjust-btn,.row-btn,.search-item,.segment button,.travel button,.route-variant,.sub-action,.start-trip-cta,.nav-stack-btn,.nav-audio-toggle{transition:none!important}
}

/* ============================================================
   VAIZO V95 — FIGMA PALETTE / PRODUCT UI SYSTEM
   Final visual owner for the navigation experience.
   The legacy cascade is bundled above this section so the app
   keeps behavioral compatibility while V95 owns final geometry.
   ============================================================ */
:root{
  --vg-brand:#5B5CE2;
  --vg-brand-strong:#4E50D8;
  --vg-brand-soft:#EEEDFF;
  --vg-brand-softer:#F6F5FF;
  --vg-ink:#171821;
  --vg-copy:#707486;
  --vg-muted:#979BAA;
  --vg-line:#E5E6ED;
  --vg-line-strong:#DADCE7;
  --vg-bg:#F7F7FB;
  --vg-surface:#FFFFFF;
  --vg-surface-glass:rgba(255,255,255,.94);
  --vg-success:#16835F;
  --vg-success-soft:#EAF8F2;
  --vg-danger:#D54747;
  --vg-warning:#C77A27;
  --vg-shadow:0 24px 70px rgba(33,34,56,.12),0 4px 18px rgba(42,44,74,.06);
  --vg-shadow-soft:0 12px 32px rgba(42,44,74,.09);
  --vg-radius-xl:28px;
  --vg-radius-lg:22px;
  --vg-radius-md:16px;
  --vg-radius-sm:12px;
  --o:var(--vg-brand);
  --o2:#8587F4;
}

html,body{background:var(--vg-bg)!important;color:var(--vg-ink)!important}
body:has(.ws-app){padding:0!important;margin:0!important;background:var(--vg-bg)!important}
.ws-app{width:100vw!important;max-width:none!important;height:100dvh!important;height:100svh!important;overflow:hidden!important;background:#E9EBF2!important;color:var(--vg-ink)!important;box-shadow:none!important}
#map{inset:0!important;background:#E9EBF2!important}
.map-vignette{background:linear-gradient(180deg,rgba(255,255,255,.25),transparent 19%,transparent 77%,rgba(247,247,251,.12))!important;opacity:.72!important}
.ambient-halo{opacity:.14!important}.road-mood-hint,.status-chip,.gps-quality{display:none!important}

/* Map provider attribution remains visible/legible per provider requirements. */
.mapboxgl-ctrl-bottom-left{left:max(8px,env(safe-area-inset-left))!important;bottom:max(5px,env(safe-area-inset-bottom))!important;transform:none!important;z-index:7!important}
.mapboxgl-ctrl-logo{opacity:1!important;transform:none!important;filter:none!important}
.mapboxgl-ctrl-bottom-right{right:max(6px,env(safe-area-inset-right))!important;bottom:max(5px,env(safe-area-inset-bottom))!important;z-index:7!important}
.mapboxgl-ctrl-attrib.mapboxgl-compact{margin:0!important;border:1px solid rgba(218,220,231,.9)!important;border-radius:10px!important;background:rgba(255,255,255,.93)!important;color:#5F6573!important;box-shadow:0 6px 18px rgba(42,44,74,.07)!important;backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important}
.mapboxgl-ctrl-attrib-button{width:26px!important;height:26px!important}
.mapboxgl-popup-content{background:#fff!important;color:var(--vg-ink)!important;border:1px solid var(--vg-line)!important;border-radius:16px!important;box-shadow:0 16px 42px rgba(33,34,56,.14)!important;padding:12px 14px!important}.mapboxgl-popup-tip{border-top-color:#fff!important}

/* Top system controls: 1 account + 2 contextual controls. */
.header{position:absolute!important;z-index:54!important;top:max(14px,calc(env(safe-area-inset-top) + 10px))!important;right:max(14px,calc(env(safe-area-inset-right) + 10px))!important;left:auto!important;width:48px!important;height:48px!important}
.header-actions{width:48px!important;height:48px!important}.options-btn{width:48px!important;height:48px!important;padding:0!important;display:grid!important;place-items:center!important;border:1px solid rgba(218,220,231,.94)!important;border-radius:16px!important;background:rgba(255,255,255,.95)!important;color:#444A59!important;box-shadow:var(--vg-shadow-soft)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;transition:transform .16s ease,box-shadow .16s ease!important}.options-btn:active{transform:scale(.96)!important}
.map-tools{position:absolute!important;z-index:50!important;right:max(14px,calc(env(safe-area-inset-right) + 10px))!important;top:max(72px,calc(env(safe-area-inset-top) + 68px))!important;display:flex!important;flex-direction:column!important;gap:8px!important}.map-tools .map-btn{width:44px!important;height:44px!important;padding:0!important;display:grid!important;place-items:center!important;border:1px solid rgba(218,220,231,.94)!important;border-radius:15px!important;background:rgba(255,255,255,.94)!important;color:#555C6C!important;box-shadow:0 10px 28px rgba(42,44,74,.08)!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important}.map-tools .map-btn:active{transform:scale(.95)!important}.map-tools #focusModeBtn{display:none!important}.map-tools #quickAlertBtn{color:var(--vg-danger)!important}.map-tools #safetyToolsBtn{color:var(--vg-brand)!important}
.floating-locate{width:46px!important;height:46px!important;border:1px solid var(--vg-line)!important;border-radius:15px!important;background:rgba(255,255,255,.96)!important;color:var(--vg-brand)!important;box-shadow:var(--vg-shadow-soft)!important}

/* GPS permission: plain product language, no cockpit look. */
.permission{z-index:70!important;border:1px solid var(--vg-line)!important;border-radius:18px!important;background:rgba(255,255,255,.97)!important;color:var(--vg-ink)!important;box-shadow:var(--vg-shadow)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important}.permission-icon{background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.permission-copy span{color:var(--vg-copy)!important}.permission button{background:var(--vg-brand)!important;color:#fff!important;border-radius:12px!important}

/* ======================= PLANNING ======================= */
.sheet#planSheet{z-index:40!important;border:1px solid rgba(225,226,237,.98)!important;background:var(--vg-surface-glass)!important;color:var(--vg-ink)!important;box-shadow:var(--vg-shadow)!important;backdrop-filter:blur(24px) saturate(125%)!important;-webkit-backdrop-filter:blur(24px) saturate(125%)!important;overflow:visible!important}
.sheet#planSheet .grab{width:38px!important;height:4px!important;background:#D7D9E3!important;border-radius:99px!important}
.planner-heading{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-bottom:12px!important}.planner-heading-copy small{display:none!important}.planner-heading-copy b{display:block!important;margin:0!important;color:var(--vg-ink)!important;font-size:24px!important;line-height:1.08!important;letter-spacing:-.9px!important;font-weight:900!important}.planner-weather{height:34px!important;padding:0 10px!important;border:1px solid var(--vg-line)!important;border-radius:12px!important;background:#FAFAFC!important;color:#686D7B!important;box-shadow:none!important;font-size:10px!important;font-weight:800!important}
.planner-search-row{display:grid!important;grid-template-columns:minmax(0,1fr) 48px!important;gap:8px!important;align-items:stretch!important}.planner-search-card.search-card{position:relative!important;margin:0!important;padding:0!important;border:1px solid var(--vg-line)!important;border-radius:18px!important;background:#fff!important;box-shadow:0 5px 16px rgba(42,44,74,.045)!important;overflow:visible!important}.planner-location-row.location-row{min-height:56px!important;height:56px!important;display:grid!important;grid-template-columns:42px minmax(0,1fr) 44px!important;gap:0!important;align-items:center!important}.planner-search-icon{display:grid!important;place-items:center!important;color:var(--vg-brand)!important}.planner-search-card .location-input{height:54px!important;padding:0 4px!important;border:0!important;background:transparent!important;color:var(--vg-ink)!important;font-size:15px!important;font-weight:760!important;letter-spacing:-.15px!important}.planner-search-card .location-input::placeholder{color:#8C90A0!important;font-weight:650!important}.voice-search-btn{width:38px!important;height:38px!important;margin-right:4px!important;border:0!important;border-radius:12px!important;background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.planner-adjust-btn{width:48px!important;height:56px!important;padding:0!important;display:grid!important;place-items:center!important;border:1px solid var(--vg-line)!important;border-radius:17px!important;background:#fff!important;color:#5D6372!important;box-shadow:0 5px 16px rgba(42,44,74,.045)!important}.planner-adjust-btn span{display:none!important}.planner-adjust-btn.active{background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important;border-color:#D8D5FF!important}
.search-results{border:1px solid var(--vg-line)!important;border-radius:18px!important;background:rgba(255,255,255,.99)!important;color:var(--vg-ink)!important;box-shadow:0 22px 60px rgba(33,34,56,.16)!important;padding:6px!important}.search-item{border-radius:13px!important}.search-item:active{background:#F4F4F8!important}.result-icon{background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.result-copy b{color:var(--vg-ink)!important}.result-copy small,.result-meta,.search-label,.search-message{color:var(--vg-copy)!important}
.planner-presets{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:9px!important}.planner-preset{min-width:0!important;min-height:58px!important;padding:9px 10px!important;display:grid!important;grid-template-columns:36px minmax(0,1fr)!important;align-items:center!important;gap:9px!important;border:1px solid var(--vg-line)!important;border-radius:16px!important;background:#FAFAFC!important;color:var(--vg-ink)!important;text-align:left!important;box-shadow:none!important}.planner-preset-icon{width:36px!important;height:36px!important;border-radius:12px!important;display:grid!important;place-items:center!important;background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.planner-preset b{font-size:12px!important;color:var(--vg-ink)!important}.planner-preset small{display:block!important;margin-top:2px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;color:var(--vg-copy)!important;font-size:9px!important}.planner-expand-hint{width:100%!important;min-height:38px!important;margin-top:8px!important;padding:0 8px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;border:0!important;background:transparent!important;color:#777C8B!important;font-size:10px!important;font-weight:800!important}.planner-expand-hint:hover,.planner-expand-hint:active{color:var(--vg-brand)!important;background:transparent!important}.planner-expanded{padding-top:10px!important}.planner-section-head small{color:var(--vg-brand)!important}.planner-section-head b{color:var(--vg-ink)!important}.planner-section-head>span{color:var(--vg-muted)!important}.nearby-services{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}.nearby-service{min-height:74px!important;padding:9px 6px!important;border:1px solid var(--vg-line)!important;border-radius:15px!important;background:#FAFAFC!important;color:var(--vg-ink)!important;text-align:center!important}.nearby-service-icon{width:34px!important;height:34px!important;margin:0 auto 6px!important;border-radius:11px!important;background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.nearby-service b{font-size:9px!important}.nearby-service small{display:none!important}.planner-tip{margin-top:8px!important;padding:9px 10px!important;border:0!important;border-radius:12px!important;background:var(--vg-brand-softer)!important;color:#69658E!important;font-size:9px!important}

/* ======================= ROUTE CHOICE ======================= */
#routeState{color:var(--vg-ink)!important}.route-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px!important;margin-bottom:9px!important}.route-head h2{margin:0!important;color:var(--vg-ink)!important;font-size:20px!important;line-height:1.1!important;letter-spacing:-.65px!important}.route-head p{margin:4px 0 0!important;color:var(--vg-copy)!important;font-size:10px!important;line-height:1.35!important}.route-time{min-width:92px!important;text-align:right!important}.route-time span{display:block!important;color:var(--vg-brand)!important;font-size:27px!important;line-height:1!important;font-weight:950!important;letter-spacing:-1.1px!important}.route-time small{display:block!important;margin-top:4px!important;color:var(--vg-copy)!important;font-size:10px!important;font-weight:750!important}.customize-route-kicker{display:none!important}.segment,.travel{display:flex!important;gap:6px!important;margin:8px 0 0!important}.segment button,.travel button{height:38px!important;flex:1 1 0!important;padding:0 10px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;border:1px solid var(--vg-line)!important;border-radius:13px!important;background:#FAFAFC!important;color:#626879!important;font-size:10px!important;font-weight:850!important;box-shadow:none!important}.segment button.active,.travel button.active{border-color:#D7D4FF!important;background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.route-variants{display:grid!important;grid-auto-flow:column!important;grid-auto-columns:minmax(116px,1fr)!important;gap:7px!important;margin-top:9px!important;overflow-x:auto!important;padding-bottom:2px!important;scrollbar-width:none!important}.route-variants::-webkit-scrollbar{display:none!important}.route-variant{min-height:79px!important;padding:9px 10px!important;border:1px solid var(--vg-line)!important;border-radius:15px!important;background:#FAFAFC!important;color:var(--vg-ink)!important;text-align:left!important}.route-variant.active{border-color:#CFCBFF!important;background:var(--vg-brand-softer)!important;box-shadow:inset 0 0 0 1px rgba(91,92,226,.08)!important}.route-variant small{color:var(--vg-muted)!important}.route-variant b{color:var(--vg-ink)!important}.route-variant span{color:#656B7A!important}.route-variant em{color:var(--vg-brand)!important}
.route-card{margin-top:9px!important;padding:12px!important;border:1px solid var(--vg-line)!important;border-radius:17px!important;background:#fff!important;color:var(--vg-ink)!important;box-shadow:none!important}.route-card.fast-selected{border-color:#D7D4FF!important;background:linear-gradient(180deg,#fff,var(--vg-brand-softer))!important}.route-card-top h3{color:var(--vg-ink)!important;font-size:13px!important}.route-card .mins{color:var(--vg-brand)!important;font-size:18px!important}.level-pill{border-color:#D7D4FF!important;background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.safety-level strong{color:#666C7B!important}.route-card-meta{display:flex!important;gap:6px!important;flex-wrap:wrap!important;margin-top:8px!important}.route-card-meta span{padding:5px 7px!important;border:1px solid var(--vg-line)!important;border-radius:999px!important;background:#FAFAFC!important;color:#6C7180!important;font-size:8px!important;font-weight:750!important}.traffic-line{border-color:var(--vg-line)!important;color:#6B7080!important}.traffic-bar{background:#ECECF1!important}.traffic-bar i{background:linear-gradient(90deg,#F0C65C,#E38B42,#D95A52)!important}.smart-note,.risk-note{border:0!important;border-radius:12px!important;background:var(--vg-brand-softer)!important;color:#65618B!important}.risk-note{background:#FFF7F4!important;color:#8B5E54!important}.route-ai{margin-top:9px!important;padding:10px 11px!important;display:block!important;border:1px solid #E6E3FF!important;border-radius:13px!important;background:var(--vg-brand-softer)!important;color:#615D86!important;font-size:9px!important;line-height:1.45!important}.route-ai .spark-dot{display:none!important}.route-ai b{display:block!important;margin-bottom:2px!important;color:var(--vg-brand)!important;font-size:9px!important;text-transform:uppercase!important;letter-spacing:.08em!important}.parking-nearby{margin-top:9px!important;border:1px solid var(--vg-line)!important;border-radius:15px!important;background:#FAFAFC!important}.parking-head small{color:var(--vg-brand)!important}.parking-head b{color:var(--vg-ink)!important}.parking-head>span{color:var(--vg-muted)!important}.parking-item{border-color:var(--vg-line)!important;background:#fff!important;color:var(--vg-ink)!important}
.start-trip-cta.primary{width:100%!important;min-height:56px!important;margin-top:10px!important;padding:0 12px!important;display:grid!important;grid-template-columns:40px minmax(0,1fr) 24px!important;align-items:center!important;gap:10px!important;border:0!important;border-radius:17px!important;background:linear-gradient(135deg,#716DF2,#5B5CE2)!important;color:#fff!important;box-shadow:0 13px 28px rgba(91,87,232,.24)!important}.start-trip-icon{width:38px!important;height:38px!important;border-radius:12px!important;background:rgba(255,255,255,.15)!important}.start-trip-copy b{font-size:13px!important}.start-trip-copy small{display:none!important}.start-trip-arrow{font-size:23px!important}.preview-actions{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important;margin-top:7px!important}.preview-actions .sub-action{height:36px!important;border:1px solid var(--vg-line)!important;border-radius:12px!important;background:#FAFAFC!important;color:#696E7C!important;font-size:9px!important;font-weight:800!important}.preview-actions .sub-action:active{background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.routeState-disclaimer,#routeState>.disclaimer{margin:8px 2px 0!important;color:#999DAC!important;font-size:8px!important;line-height:1.35!important}

/* Destination confirmation */
.destination-confirm{border:1px solid var(--vg-line)!important;background:rgba(255,255,255,.97)!important;color:var(--vg-ink)!important;box-shadow:var(--vg-shadow)!important}.destination-confirm small{color:var(--vg-brand)!important}.destination-confirm p{color:var(--vg-copy)!important}.destination-edit{border-color:var(--vg-line)!important;background:#FAFAFC!important;color:#616675!important}.destination-accept{border:0!important;background:var(--vg-brand)!important;color:#fff!important}

/* ======================= ACTIVE NAVIGATION ======================= */
body.body-nav .header,body.body-nav .map-tools,body.body-nav .permission,body.body-nav #planSheet,body.body-nav .floating-locate,body.body-nav .gps-quality,body.body-nav .status-chip{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
body.body-nav .map-vignette{background:linear-gradient(180deg,rgba(247,247,251,.28),transparent 18%,transparent 74%,rgba(247,247,251,.16))!important}
.nav-maneuver-top{z-index:60!important;border:1px solid rgba(225,226,237,.98)!important;border-radius:20px!important;background:rgba(255,255,255,.97)!important;color:var(--vg-ink)!important;box-shadow:var(--vg-shadow)!important;backdrop-filter:blur(22px)!important;-webkit-backdrop-filter:blur(22px)!important}.nav-maneuver-icon{width:50px!important;height:50px!important;border-radius:15px!important;background:var(--vg-brand)!important;color:#fff!important;box-shadow:0 10px 22px rgba(91,87,232,.22)!important}.maneuver-glyph{font-size:27px!important;font-weight:900!important}.nav-maneuver-copy small{display:none!important}.nav-maneuver-copy b{color:var(--vg-ink)!important;font-size:18px!important;line-height:1.06!important;letter-spacing:-.45px!important}.nav-maneuver-copy span{margin-top:4px!important;color:var(--vg-brand)!important;font-size:13px!important;font-weight:900!important}.nav-street-chip{z-index:59!important;border:1px solid var(--vg-line)!important;border-radius:999px!important;background:rgba(255,255,255,.94)!important;color:#5D6270!important;box-shadow:0 8px 20px rgba(42,44,74,.07)!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;font-size:10px!important;font-weight:800!important}
#activeNav.nav-panel.nav-minimal{z-index:60!important;padding:10px!important;border:1px solid rgba(225,226,237,.98)!important;border-radius:20px!important;background:rgba(255,255,255,.97)!important;color:var(--vg-ink)!important;box-shadow:0 -12px 42px rgba(33,34,56,.12)!important;backdrop-filter:blur(22px)!important;-webkit-backdrop-filter:blur(22px)!important}.nav-summary-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr)) 44px!important;gap:6px!important}.nav-summary-item{min-width:0!important;height:48px!important;padding:7px 8px!important;border:0!important;border-radius:13px!important;background:#FAFAFC!important}.nav-summary-item small{color:#A0A3B0!important;font-size:7px!important;letter-spacing:.08em!important}.nav-summary-item strong{display:block!important;margin-top:2px!important;color:var(--vg-ink)!important;font-size:13px!important}.nav-summary-item:first-child strong{color:var(--vg-brand)!important}.nav-search-btn{width:44px!important;height:48px!important;border:0!important;border-radius:13px!important;background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.traffic-suggestion,.reroute{border:1px solid var(--vg-line)!important;background:#fff!important;color:var(--vg-ink)!important}.traffic-suggestion-icon{background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}.traffic-accept{background:var(--vg-brand)!important;color:#fff!important}.traffic-dismiss{background:#F6F6F9!important;color:#6F7482!important}
.nav-control-stack{z-index:61!important;display:flex!important;gap:7px!important}.nav-stack-btn,.nav-audio-toggle{width:44px!important;height:44px!important;border:1px solid var(--vg-line)!important;border-radius:14px!important;background:rgba(255,255,255,.96)!important;color:#5D6270!important;box-shadow:0 10px 28px rgba(42,44,74,.08)!important}.nav-stack-btn:active,.nav-audio-toggle:active{transform:scale(.95)!important}.nav-stack-btn.immersive-active,.nav-audio-toggle.active{background:var(--vg-brand)!important;color:#fff!important;border-color:var(--vg-brand)!important}.nav-immersive-chip,.nav-tracking{border:1px solid var(--vg-line)!important;background:rgba(255,255,255,.94)!important;color:#616675!important;box-shadow:0 8px 24px rgba(42,44,74,.08)!important}.nav-tracking{display:none!important}.floating-speedo{z-index:58!important;border:1px solid var(--vg-line)!important;border-radius:15px!important;background:rgba(255,255,255,.94)!important;color:var(--vg-ink)!important;box-shadow:0 8px 24px rgba(42,44,74,.07)!important}.floating-speedo small{color:#A0A3B0!important}.floating-speedo strong{color:var(--vg-ink)!important}.traffic-radar{border:1px solid var(--vg-line)!important;border-radius:15px!important;background:rgba(255,255,255,.96)!important;color:var(--vg-ink)!important;box-shadow:0 10px 30px rgba(42,44,74,.09)!important}.traffic-radar-copy span{color:var(--vg-copy)!important}
.nav-alt-hint{border:1px solid #D9D6FF!important;background:rgba(255,255,255,.98)!important;color:var(--vg-ink)!important;box-shadow:var(--vg-shadow)!important}.nav-alt-copy small{color:var(--vg-brand)!important}.nav-alt-copy em{color:var(--vg-copy)!important}.nav-alt-accept{background:var(--vg-brand)!important;color:#fff!important}.nav-alt-dismiss{background:#F5F5F8!important;color:#747987!important}

/* Drawers / sheets share one clean surface language. */
.account-drawer,.safety-drawer,.prefs-drawer,.quick-alert-card,.immersive-choice-card,.resume-trip-card,.guest-limit-card{border:1px solid var(--vg-line)!important;background:rgba(255,255,255,.98)!important;color:var(--vg-ink)!important;box-shadow:var(--vg-shadow)!important}.drawer-user,.drawer-link,.safety-tool,.pref-row,.quick-alert-grid button,.immersive-option{border-color:var(--vg-line)!important;background:#FAFAFC!important;color:var(--vg-ink)!important}.drawer-link:active,.safety-tool:active,.quick-alert-grid button:active,.immersive-option:active{background:var(--vg-brand-soft)!important}.drawer-link i,.safety-tool i,.quick-alert-grid i,.immersive-option-icon{color:var(--vg-brand)!important}.prefs-title small,.quick-alert-head small,.immersive-choice-head small,.resume-trip-head small,.guest-limit-card>small{color:var(--vg-brand)!important}.prefs-title p,.quick-alert-head p,.immersive-choice-head p{color:var(--vg-copy)!important}.pref-row input:checked+span,.pref-row input:checked~.switch{background:var(--vg-brand)!important}.quick-alert-sheet .quick-alert-backdrop,.account-backdrop{background:rgba(24,25,35,.22)!important;backdrop-filter:blur(2px)!important}.quick-alert-close{background:#F6F6F9!important;color:#686D7B!important}

/* Provider/configuration failure should look like a VAIZO product state. */
.token-overlay{background:rgba(247,247,251,.82)!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important}.token-card{border:1px solid var(--vg-line)!important;border-radius:24px!important;background:#fff!important;color:var(--vg-ink)!important;box-shadow:var(--vg-shadow)!important}.token-card p{color:var(--vg-copy)!important}.token-card code{display:none!important}.safety-orb{background:var(--vg-brand-soft)!important;color:var(--vg-brand)!important}

/* Desktop layout: map first, compact planner in one corner. */
@media(min-width:900px){
  body:not(.body-nav) .sheet#planSheet{left:20px!important;right:auto!important;bottom:20px!important;top:auto!important;width:404px!important;max-width:calc(100vw - 40px)!important;max-height:min(73dvh,700px)!important;padding:13px!important;border-radius:26px!important;overflow:auto!important;scrollbar-width:thin!important;scrollbar-color:#DADCE5 transparent!important;transform:none!important}
  body:not(.body-nav) .sheet#planSheet.sheet-collapsed{max-height:265px!important;overflow:hidden!important}
  body:not(.body-nav) .floating-locate{left:20px!important;right:auto!important;top:auto!important;bottom:var(--v63-recenter-bottom,300px)!important}
  .permission{left:438px!important;right:auto!important;bottom:20px!important;top:auto!important;width:390px!important;max-width:calc(100vw - 470px)!important}
  .destination-confirm{left:438px!important;right:auto!important;bottom:20px!important;top:auto!important;width:370px!important}
  .safety-drawer,.prefs-drawer{right:20px!important;left:auto!important;top:76px!important;bottom:auto!important;width:380px!important;max-height:calc(100dvh - 96px)!important;border-radius:24px!important;overflow:auto!important}
  body.body-nav .nav-maneuver-top{left:20px!important;right:auto!important;top:20px!important;width:410px!important;max-width:calc(100vw - 40px)!important;padding:11px 13px!important}
  body.body-nav .nav-street-chip{left:20px!important;right:auto!important;top:96px!important;width:410px!important;max-width:calc(100vw - 40px)!important}
  body.body-nav #activeNav.nav-panel.nav-minimal{left:20px!important;right:auto!important;bottom:20px!important;width:500px!important;max-width:calc(100vw - 40px)!important;transform:translateY(calc(100% + 70px))!important}
  body.body-nav #activeNav.nav-panel.nav-minimal.show{transform:none!important}
  body.body-nav .nav-control-stack{left:20px!important;right:auto!important;bottom:92px!important;flex-direction:row!important}
  body.body-nav .nav-audio-toggle{left:168px!important;right:auto!important;bottom:92px!important}
  body.body-nav .floating-speedo{right:20px!important;left:auto!important;bottom:20px!important}
  body.body-nav .traffic-radar{right:20px!important;left:auto!important;top:20px!important}
}

/* Mobile: one dominant bottom sheet and no button clutter. */
@media(max-width:899px){
  :root{--planner-collapsed-h:246px}
  .header{top:max(10px,calc(env(safe-area-inset-top) + 7px))!important;right:max(10px,calc(env(safe-area-inset-right) + 7px))!important;width:44px!important;height:44px!important}.header-actions,.options-btn{width:44px!important;height:44px!important}.options-btn{border-radius:14px!important}
  .map-tools{top:max(62px,calc(env(safe-area-inset-top) + 58px))!important;right:max(10px,calc(env(safe-area-inset-right) + 7px))!important;gap:7px!important}.map-tools .map-btn{width:42px!important;height:42px!important;border-radius:14px!important}
  body:not(.body-nav) .sheet#planSheet{left:7px!important;right:7px!important;bottom:max(7px,env(safe-area-inset-bottom))!important;top:auto!important;width:auto!important;max-width:none!important;max-height:min(74dvh,680px)!important;padding:10px 10px 11px!important;border-radius:24px!important;overflow:auto!important;transform:translateY(var(--planner-drag-y,0px))!important;transition:transform .22s cubic-bezier(.22,.75,.25,1),max-height .22s ease!important}
  body:not(.body-nav) .sheet#planSheet.sheet-collapsed{height:var(--planner-collapsed-h)!important;max-height:var(--planner-collapsed-h)!important;overflow:hidden!important}
  .planner-heading{margin:1px 2px 10px!important}.planner-heading-copy b{font-size:22px!important}.planner-weather{height:31px!important}.planner-search-row{grid-template-columns:minmax(0,1fr) 45px!important;gap:7px!important}.planner-search-card .location-input{font-size:14px!important}.planner-adjust-btn{width:45px!important;height:56px!important}
  .planner-presets{gap:7px!important}.planner-preset{min-height:54px!important;padding:7px 8px!important;grid-template-columns:34px minmax(0,1fr)!important}.planner-preset-icon{width:34px!important;height:34px!important}.planner-expand-hint{min-height:34px!important;margin-top:5px!important}
  .nearby-services{grid-template-columns:repeat(4,minmax(0,1fr))!important}.nearby-service{min-height:66px!important;padding:8px 4px!important}.planner-tip{display:none!important}
  .search-results.search-results-portal{left:8px!important;right:8px!important;max-height:min(45dvh,360px)!important}
  body:not(.body-nav) .floating-locate{left:10px!important;right:auto!important;bottom:calc(var(--planner-collapsed-h) + max(18px,env(safe-area-inset-bottom)))!important;width:43px!important;height:43px!important;border-radius:14px!important}
  .permission{left:8px!important;right:8px!important;top:max(8px,calc(env(safe-area-inset-top) + 6px))!important;bottom:auto!important;width:auto!important}
  .destination-confirm{left:7px!important;right:7px!important;bottom:max(7px,env(safe-area-inset-bottom))!important;width:auto!important;border-radius:23px!important}
  .safety-drawer,.prefs-drawer,.account-drawer{left:7px!important;right:7px!important;bottom:max(7px,env(safe-area-inset-bottom))!important;width:auto!important;max-width:none!important;border-radius:23px!important}
  .route-head h2{font-size:18px!important}.route-time span{font-size:24px!important}.segment button,.travel button{height:36px!important;padding:0 7px!important}.parking-nearby{display:none!important}.route-card{padding:10px!important}.start-trip-cta.primary{min-height:54px!important}.preview-actions .sub-action{height:35px!important}

  body.body-nav .nav-maneuver-top{left:8px!important;right:8px!important;top:max(8px,calc(env(safe-area-inset-top) + 6px))!important;width:auto!important;max-width:none!important;padding:10px 11px!important;border-radius:19px!important}.nav-maneuver-icon{width:48px!important;height:48px!important}.nav-maneuver-copy b{font-size:17px!important}.nav-maneuver-copy span{font-size:12px!important}
  body.body-nav .nav-street-chip{left:16px!important;right:16px!important;top:max(77px,calc(env(safe-area-inset-top) + 75px))!important;width:auto!important;max-width:none!important;min-height:30px!important}
  body.body-nav #activeNav.nav-panel.nav-minimal{left:7px!important;right:7px!important;bottom:max(7px,env(safe-area-inset-bottom))!important;width:auto!important;max-width:none!important;padding:8px!important;border-radius:19px!important;transform:translateY(calc(100% + 60px))!important}.body-nav #activeNav.nav-panel.nav-minimal.show{transform:none!important}.nav-summary-row{grid-template-columns:repeat(3,minmax(0,1fr)) 42px!important}.nav-summary-item{height:45px!important;padding:6px 7px!important}.nav-summary-item strong{font-size:12px!important}.nav-search-btn{width:42px!important;height:45px!important}
  body.body-nav .nav-control-stack{left:8px!important;right:auto!important;bottom:calc(max(7px,env(safe-area-inset-bottom)) + 64px)!important;display:flex!important;flex-direction:row!important;gap:6px!important}.nav-stack-btn{width:42px!important;height:42px!important;border-radius:13px!important}.body-nav #navImmersiveToggle{display:none!important}
  body.body-nav .nav-audio-toggle{left:104px!important;right:auto!important;bottom:calc(max(7px,env(safe-area-inset-bottom)) + 64px)!important;width:42px!important;height:42px!important;border-radius:13px!important}
  body.body-nav .floating-speedo{right:8px!important;left:auto!important;bottom:calc(max(7px,env(safe-area-inset-bottom)) + 64px)!important;min-width:65px!important;height:42px!important;padding:5px 8px!important}.floating-speedo small{font-size:6px!important}.floating-speedo strong{font-size:15px!important}
  body.body-nav .traffic-radar{left:8px!important;right:8px!important;top:max(116px,calc(env(safe-area-inset-top) + 114px))!important;width:auto!important;max-width:none!important}
  body.body-nav .nav-alt-hint.show{left:8px!important;right:8px!important;top:max(116px,calc(env(safe-area-inset-top) + 114px))!important;width:auto!important;max-width:none!important;transform:none!important}
  body.body-nav .mapboxgl-ctrl-bottom-left{bottom:max(5px,env(safe-area-inset-bottom))!important}.body-nav .mapboxgl-ctrl-bottom-right{bottom:max(5px,env(safe-area-inset-bottom))!important}
}

@media(max-width:380px){
  :root{--planner-collapsed-h:238px}
  .planner-heading-copy b{font-size:20px!important}.planner-weather{display:none!important}.planner-presets{grid-template-columns:1fr 1fr!important}.planner-preset small{font-size:8px!important}.segment button,.travel button{font-size:9px!important}.preview-actions .sub-action{font-size:8px!important}.nav-summary-item strong{font-size:11px!important}.nav-summary-item small{font-size:6px!important}
}

@media(prefers-reduced-motion:reduce){.sheet#planSheet,.options-btn,.map-btn,.nav-stack-btn,.nav-audio-toggle,.floating-locate{transition:none!important}}

/* ========================================================================== 
   VAIZO V96 — compact planner + unified navigation control rail
   Requested refinement: remove excess blank card space, keep only the thin
   dark drag handle and align navigation controls vertically under safety.
   ========================================================================== */

/* The grab itself is the only expand/collapse affordance now. */
#planSheet .planner-grab{
  height:14px!important;
  padding:4px 0 6px!important;
  margin:0 auto!important;
  cursor:ns-resize!important;
  touch-action:none!important;
}
#planSheet .planner-grab:before{
  width:32px!important;
  height:3px!important;
  background:#747987!important;
  border-radius:999px!important;
  opacity:.92!important;
}
#planSheet .grab{
  width:32px!important;
  height:3px!important;
  background:#747987!important;
  border-radius:999px!important;
}
.planner-expand-hint{display:none!important}

/* Compact initial destination card. */
body:not(.body-nav) #planSheet.sheet-collapsed{
  overflow:hidden!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading{
  margin:0 2px 7px!important;
  min-height:28px!important;
  padding:0!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading-copy b{
  font-size:19px!important;
  line-height:1.02!important;
  letter-spacing:-.55px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-weather{
  height:28px!important;
  padding:0 8px!important;
  border-radius:10px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-row{
  grid-template-columns:minmax(0,1fr) 44px!important;
  gap:7px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-card.search-card,
body:not(.body-nav) #planSheet.sheet-collapsed .planner-location-row.location-row{
  height:50px!important;
  min-height:50px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-location-row.location-row{
  grid-template-columns:36px minmax(0,1fr) 40px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-card .location-input{
  height:48px!important;
  font-size:13.5px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .voice-search-btn{
  width:36px!important;
  height:36px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-adjust-btn{
  width:44px!important;
  height:50px!important;
  min-width:44px!important;
  border-radius:14px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-adjust-btn span{font-size:7px!important}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-presets{
  gap:7px!important;
  margin-top:7px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-preset{
  min-height:45px!important;
  height:45px!important;
  padding:5px 8px!important;
  grid-template-columns:30px minmax(0,1fr)!important;
  gap:7px!important;
  border-radius:14px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-preset-icon{
  width:30px!important;
  height:30px!important;
  border-radius:10px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-preset b{font-size:10.5px!important}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-preset small{font-size:7.5px!important;margin-top:0!important}

/* Top rail is visually one system: options -> report -> safety. */
.header{
  right:max(10px,calc(env(safe-area-inset-right) + 8px))!important;
}
.map-tools{
  right:max(10px,calc(env(safe-area-inset-right) + 8px))!important;
}

/* Navigation: keep options/report/safety visible and continue the same rail
   with recenter -> immersive -> 3D -> recalculate. */
body.body-nav .header,
body.body-nav .map-tools,
body.body-nav .floating-locate{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  display:block!important;
}
body.body-nav .map-tools{
  display:flex!important;
  flex-direction:column!important;
}
body.body-nav .map-tools #quickAlertBtn,
body.body-nav .map-tools #safetyToolsBtn{display:grid!important}
body.body-nav .map-tools #focusModeBtn{display:none!important}
body.body-nav #navImmersiveToggle{display:grid!important}
body.body-nav .nav-control-stack{
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
}
body.body-nav #navImmersiveToggle{order:1!important}
body.body-nav #navCameraToggle{order:2!important}
body.body-nav #navRecalculateBtn{order:3!important}

/* Desktop rail. */
@media(min-width:900px){
  body:not(.body-nav) #planSheet{
    width:372px!important;
    padding:10px 11px 11px!important;
    border-radius:22px!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed{
    height:184px!important;
    max-height:184px!important;
  }
  body.body-nav .header{
    left:auto!important;right:18px!important;
    top:18px!important;bottom:auto!important;
  }
  body.body-nav .map-tools{
    left:auto!important;right:20px!important;
    top:72px!important;bottom:auto!important;
    gap:7px!important;
  }
  body.body-nav .floating-locate{
    left:auto!important;right:19px!important;
    top:169px!important;bottom:auto!important;
  }
  body.body-nav .nav-control-stack{
    left:auto!important;right:20px!important;
    top:222px!important;bottom:auto!important;
  }
}

/* Mobile rail + compact planner. */
@media(max-width:899px){
  :root{--planner-collapsed-h:180px!important}
  body:not(.body-nav) #planSheet{
    left:10px!important;
    right:10px!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    padding:7px 9px 9px!important;
    border-radius:20px!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed{
    height:180px!important;
    max-height:180px!important;
  }
  body:not(.body-nav) .floating-locate{
    bottom:calc(180px + max(20px,env(safe-area-inset-bottom)))!important;
  }

  /* Reserve a slim right gutter for the vertical rail while navigating. */
  body.body-nav .nav-maneuver-top{
    left:8px!important;
    right:62px!important;
    width:auto!important;
  }
  body.body-nav .nav-street-chip{
    left:16px!important;
    right:62px!important;
    width:auto!important;
  }
  body.body-nav .traffic-radar,
  body.body-nav .nav-alt-hint.show{
    left:8px!important;
    right:62px!important;
    width:auto!important;
  }

  body.body-nav .header{
    left:auto!important;
    right:max(9px,calc(env(safe-area-inset-right) + 7px))!important;
    top:max(9px,calc(env(safe-area-inset-top) + 7px))!important;
    bottom:auto!important;
    width:42px!important;
    height:42px!important;
  }
  body.body-nav .header-actions,
  body.body-nav .options-btn{
    width:42px!important;
    height:42px!important;
    border-radius:13px!important;
  }
  body.body-nav .map-tools{
    left:auto!important;
    right:max(9px,calc(env(safe-area-inset-right) + 7px))!important;
    top:max(58px,calc(env(safe-area-inset-top) + 56px))!important;
    bottom:auto!important;
    gap:6px!important;
  }
  body.body-nav .map-tools .map-btn{
    width:42px!important;
    height:42px!important;
    border-radius:13px!important;
  }
  body.body-nav .floating-locate{
    left:auto!important;
    right:max(9px,calc(env(safe-area-inset-right) + 7px))!important;
    top:max(154px,calc(env(safe-area-inset-top) + 152px))!important;
    bottom:auto!important;
    width:42px!important;
    height:42px!important;
    border-radius:13px!important;
  }
  body.body-nav .nav-control-stack{
    left:auto!important;
    right:max(9px,calc(env(safe-area-inset-right) + 7px))!important;
    top:max(202px,calc(env(safe-area-inset-top) + 200px))!important;
    bottom:auto!important;
    gap:6px!important;
  }
  body.body-nav .nav-stack-btn{
    width:42px!important;
    height:42px!important;
    border-radius:13px!important;
  }
}

@media(max-width:380px){
  :root{--planner-collapsed-h:174px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed{height:174px!important;max-height:174px!important}
  body:not(.body-nav) .floating-locate{bottom:calc(174px + max(18px,env(safe-area-inset-bottom)))!important}
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading-copy b{font-size:18px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-preset small{display:none!important}
}
/* Single visible grab: the hit area stays generous, only the pseudo-element draws. */
#planSheet .grab.planner-grab{background:transparent!important;box-shadow:none!important}

/* V96 final geometry: collapsed state only contains handle + title + search.
   Presets/nearby appear after pulling the thin handle upward. */
#planSheet .grab.planner-grab{display:block!important}
@media(min-width:900px){
  :root{--planner-collapsed-h:126px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed{height:126px!important;max-height:126px!important}
}
@media(max-width:899px){
  :root{--planner-collapsed-h:126px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed{height:126px!important;max-height:126px!important}
  body:not(.body-nav) .floating-locate{bottom:calc(126px + max(20px,env(safe-area-inset-bottom)))!important}
}
@media(max-width:380px){
  :root{--planner-collapsed-h:122px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed{height:122px!important;max-height:122px!important}
  body:not(.body-nav) .floating-locate{bottom:calc(122px + max(18px,env(safe-area-inset-bottom)))!important}
}

/* ================================================================
   VAIZO V97 — contextual 3D control + navigation control drawer
   Free map: options -> report -> support -> 3D only.
   Active navigation: top rail disappears and controls live in a
   bottom drawer beside the speedometer. Manual recalculate is gone.
   ================================================================ */

/* Recalculate remains automatic in the routing engine; no manual UI. */
#navRecalculateBtn{display:none!important}

/* --- Free map ---------------------------------------------------- */
body:not(.body-nav) .floating-locate,
body:not(.body-nav) #navImmersiveToggle,
body:not(.body-nav) #soundBtn,
body:not(.body-nav) #navDrawerToggle,
body:not(.body-nav) #navControlDrawer{
  display:none!important;
}
body:not(.body-nav) #navControlStack{
  position:absolute!important;
  z-index:50!important;
  left:auto!important;
  right:max(10px,calc(env(safe-area-inset-right) + 7px))!important;
  top:max(158px,calc(env(safe-area-inset-top) + 154px))!important;
  bottom:auto!important;
  width:42px!important;
  height:42px!important;
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
body:not(.body-nav) #navCameraToggle{
  display:grid!important;
  position:relative!important;
  inset:auto!important;
  width:42px!important;
  height:42px!important;
  padding:0!important;
  place-items:center!important;
  border-radius:13px!important;
  border:1px solid rgba(218,220,231,.94)!important;
  background:rgba(255,255,255,.95)!important;
  color:#665CF6!important;
  box-shadow:0 10px 28px rgba(42,44,74,.09)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
}
body:not(.body-nav) #navCameraToggle.active{
  background:#665CF6!important;
  color:#fff!important;
  border-color:#665CF6!important;
}

/* --- Active navigation ------------------------------------------ */
body.body-nav .header,
body.body-nav .map-tools,
body.body-nav .floating-locate{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
body.body-nav .nav-maneuver-top{
  left:8px!important;
  right:8px!important;
  width:auto!important;
  top:max(16px,calc(env(safe-area-inset-top) + 14px))!important;
}
body.body-nav .nav-street-chip{
  left:16px!important;
  right:16px!important;
  width:auto!important;
}
body.body-nav .traffic-radar,
body.body-nav .nav-alt-hint.show{
  left:8px!important;
  right:8px!important;
  width:auto!important;
}

/* Compact anchor beside the speedometer. Camera stays visible. */
body.body-nav #navControlStack{
  position:absolute!important;
  z-index:72!important;
  left:auto!important;
  right:max(82px,calc(env(safe-area-inset-right) + 80px))!important;
  top:auto!important;
  bottom:calc(max(7px,env(safe-area-inset-bottom)) + 64px)!important;
  width:44px!important;
  height:auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:6px!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
body.body-nav #navCameraToggle,
body.body-nav #navDrawerToggle,
body.body-nav #navControlDrawer .nav-drawer-btn,
body.body-nav #navControlDrawer #navImmersiveToggle,
body.body-nav #navControlDrawer #soundBtn{
  position:relative!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  margin:0!important;
  flex:0 0 auto!important;
}
body.body-nav #navCameraToggle{
  order:3!important;
  display:grid!important;
  width:44px!important;
  height:44px!important;
  padding:0!important;
  place-items:center!important;
  border-radius:14px!important;
  border:1px solid #DCD9FF!important;
  background:rgba(255,255,255,.97)!important;
  color:#665CF6!important;
  box-shadow:0 12px 30px rgba(42,44,74,.13)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
body.body-nav #navCameraToggle.active{
  background:#665CF6!important;
  color:#fff!important;
  border-color:#665CF6!important;
  box-shadow:0 12px 28px rgba(102,92,246,.25)!important;
}

/* Arrow directly above the 3D button. */
body.body-nav #navDrawerToggle{
  order:2!important;
  display:grid!important;
  width:34px!important;
  height:28px!important;
  padding:0!important;
  place-items:center!important;
  border:1px solid rgba(221,225,234,.96)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.95)!important;
  color:#6F7686!important;
  box-shadow:0 8px 22px rgba(42,44,74,.10)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),background .2s ease,color .2s ease!important;
}
body.body-nav #navControlStack.drawer-open #navDrawerToggle{
  background:#F0EFFF!important;
  color:#665CF6!important;
}
body.body-nav #navDrawerToggle:active,
body.body-nav #navCameraToggle:active{transform:scale(.94)!important}

/* The drawer rises out of the anchor instead of adding another rail. */
body.body-nav #navControlDrawer{
  order:1!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:6px!important;
  width:52px!important;
  max-height:0!important;
  padding:0!important;
  margin:0 0 -2px!important;
  overflow:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  transform:translateY(16px) scale(.94)!important;
  transform-origin:50% 100%!important;
  border:1px solid transparent!important;
  border-radius:19px!important;
  background:rgba(255,255,255,0)!important;
  box-shadow:none!important;
  transition:max-height .34s cubic-bezier(.22,.82,.24,1),opacity .22s ease,transform .34s cubic-bezier(.22,.82,.24,1),padding .28s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease!important;
}
body.body-nav #navControlStack.drawer-open #navControlDrawer{
  max-height:360px!important;
  padding:5px 4px!important;
  margin-bottom:0!important;
  opacity:1!important;
  pointer-events:auto!important;
  transform:translateY(0) scale(1)!important;
  border-color:rgba(221,225,234,.94)!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 16px 40px rgba(38,42,69,.14)!important;
  backdrop-filter:blur(20px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(20px) saturate(145%)!important;
}
body.body-nav #navControlDrawer .nav-drawer-btn,
body.body-nav #navControlDrawer #navImmersiveToggle,
body.body-nav #navControlDrawer #soundBtn{
  display:grid!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  padding:0!important;
  place-items:center!important;
  border:1px solid rgba(224,227,235,.96)!important;
  border-radius:13px!important;
  background:rgba(250,250,252,.98)!important;
  color:#61697A!important;
  box-shadow:none!important;
  opacity:0!important;
  transform:translateY(12px) scale(.92)!important;
  transition:opacity .18s ease,transform .28s cubic-bezier(.2,.8,.2,1),background .18s ease,color .18s ease!important;
}
body.body-nav #navControlStack.drawer-open #navControlDrawer .nav-drawer-btn,
body.body-nav #navControlStack.drawer-open #navControlDrawer #navImmersiveToggle,
body.body-nav #navControlStack.drawer-open #navControlDrawer #soundBtn{
  opacity:1!important;
  transform:translateY(0) scale(1)!important;
}
body.body-nav #navControlStack.drawer-open #navControlDrawer > :nth-child(1){transition-delay:.015s!important}
body.body-nav #navControlStack.drawer-open #navControlDrawer > :nth-child(2){transition-delay:.035s!important}
body.body-nav #navControlStack.drawer-open #navControlDrawer > :nth-child(3){transition-delay:.055s!important}
body.body-nav #navControlStack.drawer-open #navControlDrawer > :nth-child(4){transition-delay:.075s!important}
body.body-nav #navControlStack.drawer-open #navControlDrawer > :nth-child(5){transition-delay:.095s!important}
body.body-nav #navControlStack.drawer-open #navControlDrawer > :nth-child(6){transition-delay:.115s!important}
body.body-nav #navControlDrawer .nav-drawer-alert{color:#D86269!important}
body.body-nav #navControlDrawer .nav-drawer-support{color:#665CF6!important}
body.body-nav #navControlDrawer #navImmersiveToggle.immersive-active,
body.body-nav #navControlDrawer #soundBtn.active{
  background:#665CF6!important;
  color:#fff!important;
  border-color:#665CF6!important;
}

/* Keep speed and drawer on one visual baseline. */
body.body-nav .floating-speedo{
  right:max(8px,calc(env(safe-area-inset-right) + 6px))!important;
  left:auto!important;
  bottom:calc(max(7px,env(safe-area-inset-bottom)) + 64px)!important;
}

@media(min-width:900px){
  body:not(.body-nav) #navControlStack{
    right:20px!important;
    top:170px!important;
  }
  body.body-nav .nav-maneuver-top{top:26px!important}
  body.body-nav #navControlStack{
    right:92px!important;
    bottom:20px!important;
  }
  body.body-nav .floating-speedo{
    right:20px!important;
    bottom:20px!important;
  }
}

@media(max-width:380px){
  body:not(.body-nav) #navControlStack{
    right:max(7px,calc(env(safe-area-inset-right) + 5px))!important;
    top:max(151px,calc(env(safe-area-inset-top) + 147px))!important;
  }
  body.body-nav #navControlStack{
    right:max(76px,calc(env(safe-area-inset-right) + 74px))!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.body-nav #navControlDrawer,
  body.body-nav #navControlDrawer > *,
  body.body-nav #navDrawerToggle{transition:none!important}
}

/* ================================================================
   VAIZO V98 — navigation controls aligned with speedometer
   Active navigation: recenter -> voice -> 3D/2D. The 3D/2D control
   sits on the exact same baseline and footprint as the speedometer.
   ================================================================ */

/* No route: keep the V97 free-map behavior — only camera/3D here. */
body:not(.body-nav) #navDrawerRecenter,
body:not(.body-nav) #soundBtn,
body:not(.body-nav) #navDrawerToggle,
body:not(.body-nav) #navControlDrawer{
  display:none!important;
}

/* Active route: remove the drawer arrow and secondary drawer UI. */
body.body-nav #navDrawerToggle,
body.body-nav #navControlDrawer{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Stack is anchored immediately to the left of the speedometer. */
body.body-nav #navControlStack{
  position:absolute!important;
  z-index:72!important;
  left:auto!important;
  right:max(81px,calc(env(safe-area-inset-right) + 79px))!important;
  top:auto!important;
  bottom:calc(max(7px,env(safe-area-inset-bottom)) + 64px)!important;
  width:65px!important;
  height:auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:7px!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}

body.body-nav #navDrawerRecenter,
body.body-nav #soundBtn,
body.body-nav #navCameraToggle{
  position:relative!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  margin:0!important;
  flex:0 0 auto!important;
  place-items:center!important;
  padding:0!important;
  border:1px solid #DDE1EA!important;
  background:rgba(255,255,255,.97)!important;
  color:#61697A!important;
  box-shadow:0 10px 28px rgba(42,44,74,.11)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
}

/* Top: recenter/calibrate. */
body.body-nav #navDrawerRecenter{
  order:1!important;
  display:grid!important;
  width:44px!important;
  min-width:44px!important;
  height:44px!important;
  min-height:44px!important;
  border-radius:14px!important;
}

/* Middle: voice. */
body.body-nav #soundBtn{
  order:2!important;
  display:grid!important;
  width:44px!important;
  min-width:44px!important;
  height:44px!important;
  min-height:44px!important;
  border-radius:14px!important;
}
body.body-nav #soundBtn.active{
  background:#665CF6!important;
  color:#fff!important;
  border-color:#665CF6!important;
  box-shadow:0 10px 26px rgba(102,92,246,.22)!important;
}

/* Bottom: 3D / map. Exact mobile footprint of the speedometer. */
body.body-nav #navCameraToggle{
  order:3!important;
  display:grid!important;
  width:65px!important;
  min-width:65px!important;
  height:42px!important;
  min-height:42px!important;
  border-radius:15px!important;
  border-color:#DCD9FF!important;
  color:#665CF6!important;
}
body.body-nav #navCameraToggle.active{
  background:#665CF6!important;
  color:#fff!important;
  border-color:#665CF6!important;
  box-shadow:0 10px 26px rgba(102,92,246,.22)!important;
}
body.body-nav #navDrawerRecenter:active,
body.body-nav #soundBtn:active,
body.body-nav #navCameraToggle:active{
  transform:scale(.94)!important;
}

/* Speedometer uses the same baseline and exact dimensions as 3D/Mapa. */
body.body-nav .floating-speedo{
  right:max(8px,calc(env(safe-area-inset-right) + 6px))!important;
  left:auto!important;
  bottom:calc(max(7px,env(safe-area-inset-bottom)) + 64px)!important;
  width:65px!important;
  min-width:65px!important;
  height:42px!important;
  min-height:42px!important;
  padding:5px 8px!important;
  border-radius:15px!important;
}
body.body-nav .floating-speedo strong{font-size:15px!important}
body.body-nav .floating-speedo span{font-size:6.5px!important}

@media(min-width:900px){
  body.body-nav #navControlStack{
    right:92px!important;
    bottom:20px!important;
  }
  body.body-nav .floating-speedo{
    right:20px!important;
    bottom:20px!important;
    width:65px!important;
    min-width:65px!important;
    height:42px!important;
    min-height:42px!important;
  }
}

@media(max-width:380px){
  body.body-nav #navControlStack{
    right:max(78px,calc(env(safe-area-inset-right) + 76px))!important;
    width:62px!important;
  }
  body.body-nav #navCameraToggle,
  body.body-nav .floating-speedo{
    width:62px!important;
    min-width:62px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.body-nav #navDrawerRecenter,
  body.body-nav #soundBtn,
  body.body-nav #navCameraToggle{transition:none!important}
}

/* Voice chooser opens next to the new three-button rail. */
body.body-nav .nav-voice-popover{
  right:max(82px,calc(env(safe-area-inset-right) + 80px))!important;
  bottom:calc(max(7px,env(safe-area-inset-bottom)) + 116px)!important;
}
@media(min-width:900px){
  body.body-nav .nav-voice-popover{right:92px!important;bottom:72px!important}
}

/* ================================================================
   VAIZO V99 — speedometer / 3D mirrored edge lock
   Requested geometry only. The navigation info bar is untouched.
   - speedometer: left edge
   - 3D/Mapa: right edge
   - identical width/height footprint
   - controls sit 14px lower than V98
   ================================================================ */

body.body-nav .ws-app{
  --v99-nav-edge:max(8px, calc(env(safe-area-inset-right) + 6px));
  --v99-speed-edge:max(8px, calc(env(safe-area-inset-left) + 6px));
  --v99-bottom:calc(max(7px, env(safe-area-inset-bottom)) + 50px);
  --v99-control-w:65px;
  --v99-control-h:42px;
}

/* The two bottom controls are true mirrors: same box model, opposite edges. */
body.body-nav .ws-app .floating-speedo,
body.body-nav .ws-app #navCameraToggle{
  box-sizing:border-box!important;
  width:var(--v99-control-w)!important;
  min-width:var(--v99-control-w)!important;
  max-width:var(--v99-control-w)!important;
  height:var(--v99-control-h)!important;
  min-height:var(--v99-control-h)!important;
  max-height:var(--v99-control-h)!important;
  padding:5px 8px!important;
  border-radius:15px!important;
}

/* Speedometer hugs the left edge of the navigation summary. */
body.body-nav .ws-app .floating-speedo{
  left:var(--v99-speed-edge)!important;
  right:auto!important;
  top:auto!important;
  bottom:var(--v99-bottom)!important;
  margin:0!important;
}

/* Navigation controls hug the opposite/right edge. 3D is the bottom anchor. */
body.body-nav .ws-app #navControlStack{
  left:auto!important;
  right:var(--v99-nav-edge)!important;
  top:auto!important;
  bottom:var(--v99-bottom)!important;
  width:var(--v99-control-w)!important;
  min-width:var(--v99-control-w)!important;
  max-width:var(--v99-control-w)!important;
  margin:0!important;
  align-items:center!important;
}

body.body-nav .ws-app #navCameraToggle{
  margin:0!important;
  flex:0 0 var(--v99-control-h)!important;
}

/* Voice and recenter stay centered directly above 3D. */
body.body-nav .ws-app #soundBtn,
body.body-nav .ws-app #navDrawerRecenter{
  align-self:center!important;
}

@media(max-width:380px){
  body.body-nav .ws-app{
    --v99-nav-edge:max(7px, calc(env(safe-area-inset-right) + 5px));
    --v99-speed-edge:max(7px, calc(env(safe-area-inset-left) + 5px));
    --v99-control-w:62px;
  }
}

@media(min-width:900px){
  body.body-nav .ws-app{
    --v99-nav-edge:20px;
    --v99-speed-edge:20px;
    --v99-bottom:20px;
    --v99-control-w:65px;
    --v99-control-h:42px;
  }
}

/* ================================================================
   VAIZO V100 — lower navigation summary + balanced edge controls
   Mobile navigation only. The information bar keeps its own size,
   padding and content; only its vertical position is lowered.
   ================================================================ */
@media(max-width:899px){
  body.body-nav .ws-app{
    --v100-summary-bottom:calc(max(7px, env(safe-area-inset-bottom)) - 12px);
    --v100-dock-bottom:calc(max(7px, env(safe-area-inset-bottom)) + 31px);
    --v100-edge:max(9px, calc(env(safe-area-inset-left) + 7px));
    --v100-edge-right:max(9px, calc(env(safe-area-inset-right) + 7px));
    --v100-wide:68px;
    --v100-wide-h:44px;
    --v100-round:44px;
  }

  /* Lower only the trajectory information bar. No sizing/padding changes. */
  body.body-nav .ws-app #activeNav.nav-panel.nav-minimal{
    bottom:var(--v100-summary-bottom)!important;
  }

  /* Speedometer docks into the upper-left edge of the summary bar. */
  body.body-nav .ws-app .floating-speedo{
    left:var(--v100-edge)!important;
    right:auto!important;
    top:auto!important;
    bottom:var(--v100-dock-bottom)!important;
    box-sizing:border-box!important;
    width:var(--v100-wide)!important;
    min-width:var(--v100-wide)!important;
    max-width:var(--v100-wide)!important;
    height:var(--v100-wide-h)!important;
    min-height:var(--v100-wide-h)!important;
    max-height:var(--v100-wide-h)!important;
    margin:0!important;
    padding:5px 8px!important;
    border-radius:15px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    column-gap:3px!important;
    row-gap:0!important;
  }
  body.body-nav .ws-app .floating-speedo small{
    flex:0 0 100%!important;
    font-size:5.8px!important;
    line-height:1!important;
    letter-spacing:.07em!important;
    text-align:center!important;
  }
  body.body-nav .ws-app .floating-speedo strong{
    font-size:16px!important;
    line-height:1!important;
  }
  body.body-nav .ws-app .floating-speedo span{
    font-size:6.5px!important;
    line-height:1!important;
  }

  /* Right rail: recenter, voice, then the wider 3D/Mapa anchor. */
  body.body-nav .ws-app #navControlStack{
    position:absolute!important;
    z-index:72!important;
    left:auto!important;
    right:var(--v100-edge-right)!important;
    top:auto!important;
    bottom:var(--v100-dock-bottom)!important;
    width:var(--v100-wide)!important;
    min-width:var(--v100-wide)!important;
    max-width:var(--v100-wide)!important;
    height:auto!important;
    margin:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:7px!important;
  }

  body.body-nav .ws-app #navDrawerRecenter,
  body.body-nav .ws-app #soundBtn{
    position:relative!important;
    inset:auto!important;
    width:var(--v100-round)!important;
    min-width:var(--v100-round)!important;
    max-width:var(--v100-round)!important;
    height:var(--v100-round)!important;
    min-height:var(--v100-round)!important;
    max-height:var(--v100-round)!important;
    margin:0!important;
    padding:0!important;
    border-radius:14px!important;
    flex:0 0 var(--v100-round)!important;
  }

  body.body-nav .ws-app #navCameraToggle{
    width:var(--v100-wide)!important;
    min-width:var(--v100-wide)!important;
    max-width:var(--v100-wide)!important;
    height:var(--v100-wide-h)!important;
    min-height:var(--v100-wide-h)!important;
    max-height:var(--v100-wide-h)!important;
    margin:0!important;
    padding:0 8px!important;
    border-radius:15px!important;
    flex:0 0 var(--v100-wide-h)!important;
  }

  /* Voice popover follows the right rail instead of covering the ETA bar. */
  body.body-nav .ws-app .nav-voice-popover{
    right:calc(var(--v100-edge-right) + var(--v100-wide) + 8px)!important;
    bottom:calc(var(--v100-dock-bottom) + var(--v100-wide-h) + 7px)!important;
  }
}

@media(max-width:380px){
  body.body-nav .ws-app{
    --v100-edge:max(7px, calc(env(safe-area-inset-left) + 5px));
    --v100-edge-right:max(7px, calc(env(safe-area-inset-right) + 5px));
    --v100-wide:64px;
    --v100-wide-h:42px;
    --v100-round:42px;
  }
}

/* =====================================================================
   VAIZO V101 — DRIVER FIRST / CLEAN MAP UI
   Front-end only. Keeps all legacy IDs/hooks alive for v100 JS while
   reducing chrome, composite effects and distraction around the map.
   ===================================================================== */
:root{
  --v101-accent:#655df2;
  --v101-accent-soft:#eeedff;
  --v101-ink:#15171c;
  --v101-copy:#6d7280;
  --v101-line:rgba(22,24,29,.09);
  --v101-surface:rgba(255,255,255,.985);
  --v101-shadow:0 10px 32px rgba(18,22,33,.10),0 2px 8px rgba(18,22,33,.05);
  --v101-shadow-soft:0 6px 18px rgba(18,22,33,.08);
  --v101-radius:24px;
}

body,button,input,select,textarea{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",Inter,system-ui,sans-serif!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Keep the map itself visually dominant. Heavy atmospheric layers caused
   extra GPU composition and made road labels harder to read. */
.map-vignette,.ambient-halo,.road-mood-hint{display:none!important}
.map-mood-fade{pointer-events:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* Healthy GPS is silent. Surface only actionable states elsewhere. */
.status-chip,.gps-quality,.nav-tracking,.nav-immersive-chip{display:none!important}

/* Common materials: almost opaque instead of full-screen blur. */
#planSheet,.options-btn,.map-tools .map-btn,.floating-locate,.floating-speedo,
.nav-maneuver-top,.nav-street-chip,#activeNav,.nav-stack-btn,.nav-audio-toggle,
.nav-drawer-toggle,.nav-drawer-btn,.traffic-radar,.nav-alt-hint,.destination-confirm{
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

.header{z-index:55!important;top:max(12px,calc(env(safe-area-inset-top) + 8px))!important;right:max(12px,calc(env(safe-area-inset-right) + 10px))!important;left:auto!important;width:auto!important}
.header-actions{display:flex!important;gap:8px!important}
.options-btn{
  width:46px!important;height:46px!important;padding:0!important;border-radius:16px!important;
  border:1px solid var(--v101-line)!important;background:var(--v101-surface)!important;color:#565c69!important;
  box-shadow:var(--v101-shadow-soft)!important;display:grid!important;place-items:center!important;
  transition:transform .14s ease,background .14s ease!important;
}
.options-btn:active{transform:scale(.94)!important;background:#f6f6f8!important}

/* One calm safety entry on the free map. The detailed alert/report tools stay
   available inside their existing sheet, but no longer crowd the map. */
.map-tools{top:max(68px,calc(env(safe-area-inset-top) + 64px))!important;right:max(12px,calc(env(safe-area-inset-right) + 10px))!important;gap:0!important}
.map-tools #quickAlertBtn,.map-tools #focusModeBtn{display:none!important}
.map-tools #safetyToolsBtn{
  display:grid!important;width:46px!important;height:46px!important;border-radius:16px!important;
  background:var(--v101-surface)!important;border:1px solid var(--v101-line)!important;
  color:var(--v101-accent)!important;box-shadow:var(--v101-shadow-soft)!important;
}

/* Free-map destination planner: compact navigation search first. */
body:not(.body-nav) #planSheet{
  left:max(12px,calc(env(safe-area-inset-left) + 10px))!important;
  right:max(12px,calc(env(safe-area-inset-right) + 10px))!important;
  bottom:max(12px,calc(env(safe-area-inset-bottom) + 8px))!important;
  padding:8px 10px 10px!important;border:1px solid var(--v101-line)!important;
  border-radius:28px!important;background:var(--v101-surface)!important;
  box-shadow:var(--v101-shadow)!important;color:var(--v101-ink)!important;
  overflow:visible!important;
  transition:height .24s cubic-bezier(.22,.8,.24,1),max-height .24s cubic-bezier(.22,.8,.24,1),transform .2s ease!important;
}
body:not(.body-nav) #planSheet .grab{
  width:36px!important;height:4px!important;margin:0 auto 7px!important;border-radius:999px!important;background:#d6d7dc!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed{
  height:82px!important;max-height:82px!important;min-height:82px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading,
body:not(.body-nav) #planSheet.sheet-collapsed .planner-presets,
body:not(.body-nav) #planSheet.sheet-collapsed .planner-expanded{display:none!important}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-row{margin:0!important}

.planner-heading{margin:2px 3px 10px!important}
.planner-heading-copy small,.planner-weather{display:none!important}
.planner-heading-copy b{font-size:20px!important;letter-spacing:-.55px!important;font-weight:800!important;color:var(--v101-ink)!important}
.planner-search-row{grid-template-columns:minmax(0,1fr) 48px!important;gap:8px!important;align-items:center!important}
.planner-search-card.search-card{
  margin:0!important;padding:0!important;border:0!important;border-radius:20px!important;background:#f1f1f4!important;
  box-shadow:inset 0 0 0 1px rgba(22,24,29,.035)!important;overflow:visible!important;
}
.planner-location-row.location-row{height:54px!important;min-height:54px!important;grid-template-columns:42px minmax(0,1fr) 42px!important}
.planner-search-icon{color:#777c86!important}
.planner-search-card .location-input{
  height:54px!important;font-size:16px!important;font-weight:650!important;letter-spacing:-.18px!important;color:var(--v101-ink)!important;
}
.planner-search-card .location-input::placeholder{color:#8a8f99!important;font-weight:580!important}
.voice-search-btn{
  width:36px!important;height:36px!important;margin:0 5px 0 0!important;border:0!important;border-radius:13px!important;
  background:#fff!important;color:var(--v101-accent)!important;box-shadow:0 1px 4px rgba(0,0,0,.07)!important;
}
.planner-adjust-btn{
  width:48px!important;height:54px!important;border:0!important;border-radius:18px!important;background:#f1f1f4!important;
  color:#666c78!important;box-shadow:none!important;
}
.planner-adjust-btn:active{transform:scale(.95)!important;background:#e9e9ed!important}
.planner-presets{gap:8px!important;margin-top:9px!important}
.planner-preset{
  min-height:56px!important;padding:8px 10px!important;border:0!important;border-radius:17px!important;background:#f5f5f7!important;box-shadow:none!important;
}
.planner-preset-icon{background:#fff!important;color:var(--v101-accent)!important;box-shadow:0 1px 4px rgba(0,0,0,.05)!important}
.nearby-service{background:#f5f5f7!important;border:0!important;border-radius:17px!important}
.nearby-service-icon{background:#fff!important;color:var(--v101-accent)!important}
.planner-tip{background:#f3f2ff!important;color:#696681!important}
.search-results{
  border:1px solid var(--v101-line)!important;border-radius:20px!important;background:#fff!important;
  box-shadow:0 18px 40px rgba(18,22,33,.14)!important;overflow:hidden!important;
}

/* Recenter follows the compact sheet rather than floating high in the map. */
body:not(.body-nav) .floating-locate{
  display:grid!important;place-items:center!important;width:46px!important;height:46px!important;
  right:max(14px,calc(env(safe-area-inset-right) + 12px))!important;
  bottom:calc(82px + max(24px,env(safe-area-inset-bottom)))!important;
  border:1px solid var(--v101-line)!important;border-radius:16px!important;background:var(--v101-surface)!important;
  color:var(--v101-accent)!important;box-shadow:var(--v101-shadow-soft)!important;
  transition:transform .14s ease!important;
}
body:not(.body-nav) .floating-locate:active{transform:scale(.94)!important}

/* Route preview remains rich enough for choice, but uses one clear hierarchy. */
#routeState .route-head h2{font-size:21px!important;letter-spacing:-.55px!important;color:var(--v101-ink)!important}
#routeState .route-head p{color:var(--v101-copy)!important}
#routeState .route-time span{color:var(--v101-ink)!important;font-size:22px!important}
.customize-route-kicker{opacity:.8!important}
.segment,.travel{background:#f1f1f4!important;border:0!important;border-radius:16px!important;padding:3px!important}
.segment button,.travel button{border:0!important;box-shadow:none!important}
.segment button.active,.travel button.active{background:#fff!important;color:var(--v101-ink)!important;box-shadow:0 1px 5px rgba(0,0,0,.08)!important}
.start-trip-cta{
  min-height:58px!important;border-radius:19px!important;background:var(--v101-accent)!important;
  box-shadow:0 10px 24px rgba(101,93,242,.22)!important;
}
.start-trip-cta:active{transform:scale(.985)!important}
.preview-actions .sub-action{border:0!important;border-radius:15px!important;background:#f2f2f5!important;box-shadow:none!important;color:#5f6571!important}

/* =====================================================================
   ACTIVE NAVIGATION — one glance, one action.
   ===================================================================== */
body.body-nav .header,body.body-nav .map-tools,body.body-nav .floating-locate,
body.body-nav #navDrawerToggle,body.body-nav #navControlDrawer{display:none!important}
body.body-nav .map-vignette,body.body-nav .ambient-halo{display:none!important}

body.body-nav .nav-maneuver-top{
  top:max(12px,calc(env(safe-area-inset-top) + 8px))!important;
  left:max(12px,calc(env(safe-area-inset-left) + 10px))!important;
  right:max(12px,calc(env(safe-area-inset-right) + 10px))!important;width:auto!important;
  min-height:78px!important;padding:10px 12px!important;border:1px solid var(--v101-line)!important;
  border-radius:25px!important;background:var(--v101-surface)!important;box-shadow:var(--v101-shadow)!important;
  display:grid!important;grid-template-columns:58px minmax(0,1fr)!important;gap:12px!important;align-items:center!important;
}
body.body-nav .nav-maneuver-icon{
  width:58px!important;height:58px!important;border-radius:19px!important;background:var(--v101-accent)!important;
  box-shadow:none!important;color:#fff!important;
}
body.body-nav .maneuver-glyph{font-size:31px!important;font-weight:850!important}
body.body-nav .nav-maneuver-copy b{font-size:20px!important;line-height:1.08!important;letter-spacing:-.5px!important;font-weight:780!important;color:var(--v101-ink)!important}
body.body-nav .nav-maneuver-copy span{margin-top:4px!important;font-size:14px!important;font-weight:760!important;color:var(--v101-accent)!important}
body.body-nav .nav-street-chip{
  top:calc(max(12px,calc(env(safe-area-inset-top) + 8px)) + 86px)!important;
  left:50%!important;right:auto!important;width:auto!important;max-width:calc(100vw - 48px)!important;
  transform:translateX(-50%)!important;padding:7px 12px!important;border:0!important;border-radius:999px!important;
  background:rgba(26,28,33,.82)!important;color:#fff!important;box-shadow:0 4px 12px rgba(0,0,0,.12)!important;
  font-size:11px!important;font-weight:700!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}

/* Bottom arrival bar: visually one solid dock. */
body.body-nav #activeNav.nav-panel.nav-minimal{
  left:max(10px,calc(env(safe-area-inset-left) + 8px))!important;
  right:max(10px,calc(env(safe-area-inset-right) + 8px))!important;
  bottom:max(10px,calc(env(safe-area-inset-bottom) + 7px))!important;width:auto!important;
  min-height:78px!important;padding:8px 10px!important;border:1px solid var(--v101-line)!important;border-radius:25px!important;
  background:var(--v101-surface)!important;box-shadow:var(--v101-shadow)!important;color:var(--v101-ink)!important;
  overflow:visible!important;
}
body.body-nav #activeNav .nav-summary-row{min-height:60px!important;display:grid!important;grid-template-columns:1.05fr 1fr 1fr!important;gap:2px!important;align-items:center!important}
body.body-nav #activeNav .nav-summary-item{min-width:0!important;padding:4px 9px!important;position:relative!important;text-align:left!important}
body.body-nav #activeNav .nav-summary-item+ .nav-summary-item:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:1px;background:rgba(22,24,29,.08)}
body.body-nav #activeNav .nav-summary-item small{display:block!important;margin-bottom:4px!important;color:#91959e!important;font-size:8px!important;letter-spacing:.07em!important;font-weight:750!important}
body.body-nav #activeNav .nav-summary-item strong{display:block!important;color:var(--v101-ink)!important;font-size:18px!important;line-height:1!important;font-weight:800!important;letter-spacing:-.35px!important;white-space:nowrap!important}
body.body-nav #activeNav .nav-summary-item:first-child strong{font-size:21px!important;color:var(--v101-accent)!important}
body.body-nav #navSearchBtn{display:none!important}

/* Speedometer: numeric, obvious, no tiny technical label. */
body.body-nav .floating-speedo{
  left:max(14px,calc(env(safe-area-inset-left) + 12px))!important;right:auto!important;
  bottom:calc(max(10px,calc(env(safe-area-inset-bottom) + 7px)) + 88px)!important;
  width:68px!important;min-width:68px!important;max-width:68px!important;height:52px!important;min-height:52px!important;max-height:52px!important;
  padding:4px 8px!important;border:1px solid var(--v101-line)!important;border-radius:18px!important;
  background:var(--v101-surface)!important;box-shadow:var(--v101-shadow-soft)!important;
  display:flex!important;align-items:baseline!important;justify-content:center!important;gap:3px!important;flex-wrap:nowrap!important;
}
body.body-nav .floating-speedo small{display:none!important}
body.body-nav .floating-speedo strong{font-size:25px!important;line-height:1!important;font-weight:820!important;letter-spacing:-.7px!important;color:var(--v101-ink)!important}
body.body-nav .floating-speedo span{font-size:7px!important;line-height:1!important;color:#8b909a!important;font-weight:700!important;text-transform:uppercase!important}

/* Three controls only: locate, audio, camera. */
body.body-nav #navControlStack{
  position:absolute!important;z-index:72!important;left:auto!important;
  right:max(14px,calc(env(safe-area-inset-right) + 12px))!important;
  bottom:calc(max(10px,calc(env(safe-area-inset-bottom) + 7px)) + 88px)!important;
  width:50px!important;min-width:50px!important;max-width:50px!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;margin:0!important;
}
body.body-nav #navDrawerRecenter,body.body-nav #soundBtn,body.body-nav #navCameraToggle{
  display:grid!important;place-items:center!important;position:relative!important;inset:auto!important;margin:0!important;padding:0!important;
  width:50px!important;min-width:50px!important;max-width:50px!important;height:50px!important;min-height:50px!important;max-height:50px!important;
  border:1px solid var(--v101-line)!important;border-radius:17px!important;background:var(--v101-surface)!important;color:#5f6570!important;
  box-shadow:var(--v101-shadow-soft)!important;transition:transform .14s ease,background .14s ease,color .14s ease!important;
}
body.body-nav #soundBtn.active,body.body-nav #navCameraToggle.active,
body.body-nav #navDrawerRecenter.active{background:var(--v101-accent)!important;border-color:var(--v101-accent)!important;color:#fff!important;box-shadow:0 8px 20px rgba(101,93,242,.20)!important}
body.body-nav #navDrawerRecenter:active,body.body-nav #soundBtn:active,body.body-nav #navCameraToggle:active{transform:scale(.93)!important}

/* Alerts only interrupt the driver when actually important. */
body.body-nav .traffic-radar{display:none!important}
body.body-nav .traffic-radar.show.severe{
  display:flex!important;left:max(12px,calc(env(safe-area-inset-left) + 10px))!important;
  right:max(12px,calc(env(safe-area-inset-right) + 10px))!important;width:auto!important;
  top:calc(max(12px,calc(env(safe-area-inset-top) + 8px)) + 116px)!important;
  border:0!important;border-radius:19px!important;background:rgba(31,32,37,.92)!important;color:#fff!important;box-shadow:0 8px 26px rgba(0,0,0,.18)!important;
}
body.body-nav .traffic-radar.show.severe .traffic-radar-copy span{color:rgba(255,255,255,.72)!important}
body.body-nav .nav-alt-hint.show{
  left:max(12px,calc(env(safe-area-inset-left) + 10px))!important;right:max(12px,calc(env(safe-area-inset-right) + 10px))!important;
  width:auto!important;border:0!important;border-radius:20px!important;background:rgba(31,32,37,.94)!important;color:#fff!important;box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
}
body.body-nav .nav-alt-hint .nav-alt-copy small,body.body-nav .nav-alt-hint .nav-alt-copy em{color:rgba(255,255,255,.62)!important}
body.body-nav .nav-alt-hint .nav-alt-copy b{color:#fff!important}

/* Permission/destination cards use the same calm language. */
.permission{border-radius:20px!important;background:#fff!important;border:1px solid var(--v101-line)!important;box-shadow:var(--v101-shadow)!important}
.destination-confirm{border-radius:24px!important;background:#fff!important;border:1px solid var(--v101-line)!important;box-shadow:var(--v101-shadow)!important}
.destination-confirm .destination-accept{background:var(--v101-accent)!important;border-color:var(--v101-accent)!important}

/* Touch responsiveness without decorative motion. */
@media (hover:hover){
  .options-btn:hover,.map-tools #safetyToolsBtn:hover,.floating-locate:hover{background:#f8f8fa!important}
}
@media(prefers-reduced-motion:reduce){
  #planSheet,.options-btn,.floating-locate,.start-trip-cta,
  body.body-nav #navDrawerRecenter,body.body-nav #soundBtn,body.body-nav #navCameraToggle{transition:none!important}
}

@media(max-width:899px){
  :root{--planner-collapsed-h:82px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed{height:82px!important;max-height:82px!important}
  body:not(.body-nav) .floating-locate{bottom:calc(82px + max(24px,env(safe-area-inset-bottom)))!important}
}
@media(max-width:380px){
  body.body-nav .nav-maneuver-top{left:8px!important;right:8px!important;padding:9px 10px!important;grid-template-columns:54px minmax(0,1fr)!important;gap:9px!important}
  body.body-nav .nav-maneuver-icon{width:54px!important;height:54px!important;border-radius:17px!important}
  body.body-nav .nav-maneuver-copy b{font-size:18px!important}
  body.body-nav #activeNav.nav-panel.nav-minimal{left:7px!important;right:7px!important}
  body.body-nav #activeNav .nav-summary-item{padding-left:7px!important;padding-right:7px!important}
  body.body-nav #activeNav .nav-summary-item strong{font-size:16px!important}
  body.body-nav #activeNav .nav-summary-item:first-child strong{font-size:19px!important}
  body.body-nav .floating-speedo{left:9px!important;width:64px!important;min-width:64px!important;max-width:64px!important}
  body.body-nav #navControlStack{right:9px!important;width:48px!important;min-width:48px!important;max-width:48px!important}
  body.body-nav #navDrawerRecenter,body.body-nav #soundBtn,body.body-nav #navCameraToggle{width:48px!important;min-width:48px!important;max-width:48px!important;height:48px!important;min-height:48px!important;max-height:48px!important}
}
@media(min-width:900px){
  body:not(.body-nav) #planSheet{left:20px!important;right:auto!important;width:390px!important;bottom:20px!important}
  body:not(.body-nav) .floating-locate{left:424px!important;right:auto!important;bottom:20px!important}
  body.body-nav .nav-maneuver-top{left:50%!important;right:auto!important;width:min(520px,calc(100vw - 40px))!important;transform:translateX(-50%)!important}
  body.body-nav .nav-street-chip{top:108px!important}
  body.body-nav #activeNav.nav-panel.nav-minimal{left:50%!important;right:auto!important;width:min(520px,calc(100vw - 40px))!important;transform:translateX(-50%)!important;bottom:20px!important}
  body.body-nav .floating-speedo{left:20px!important;bottom:20px!important}
  body.body-nav #navControlStack{right:20px!important;bottom:20px!important}
}


/* ================================================================
   VAIZO V101.1 — driver polish follow-up
   - free-map top rail with options / safety / 3D
   - softer start card copy: "Pra onde você vai?"
   - active-nav neutral black dock accents
   ================================================================ */

/* Top right rail on the free map: options + safety + 3D feel like one stack. */
body:not(.body-nav) .header{
  z-index:56!important;
  top:max(12px,calc(env(safe-area-inset-top) + 8px))!important;
  right:max(12px,calc(env(safe-area-inset-right) + 10px))!important;
  width:46px!important;
  height:46px!important;
}
body:not(.body-nav) .header-actions{width:46px!important;height:46px!important;display:flex!important;gap:8px!important}
body:not(.body-nav) .map-tools{
  top:calc(max(12px,calc(env(safe-area-inset-top) + 8px)) + 54px)!important;
  right:max(12px,calc(env(safe-area-inset-right) + 10px))!important;
  gap:8px!important;
}
body:not(.body-nav) .map-tools #quickAlertBtn{display:none!important}
body:not(.body-nav) .map-tools #safetyToolsBtn,
body:not(.body-nav) .map-tools #focusModeBtn{
  display:grid!important;
  width:46px!important;height:46px!important;
  border-radius:16px!important;
  border:1px solid var(--v101-line)!important;
  background:var(--v101-surface)!important;
  color:#565c69!important;
  box-shadow:var(--v101-shadow-soft)!important;
}
body:not(.body-nav) .map-tools #safetyToolsBtn{color:#22272f!important}
body:not(.body-nav) .map-tools #focusModeBtn.active{
  background:#111317!important;
  color:#fff!important;
  border-color:#111317!important;
  box-shadow:0 10px 22px rgba(17,19,23,.16)!important;
}

/* Compact start sheet keeps the headline visible and feels joined with the search. */
@media(max-width:899px){
  :root{--planner-collapsed-h:108px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed{
    height:108px!important;max-height:108px!important;min-height:108px!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading{
    display:flex!important;
    align-items:center!important;
    margin:1px 2px 8px!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading-copy b{
    font-size:18px!important;
    font-weight:800!important;
    letter-spacing:-.45px!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-presets,
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-expanded{display:none!important}
  body:not(.body-nav) .floating-locate{
    bottom:calc(108px + max(20px,env(safe-area-inset-bottom)))!important;
  }
}
.planner-search-card .location-input::placeholder{color:#848994!important;font-weight:590!important}

/* Navigation: pull the side controls slightly higher and standardize the 3D button. */
body.body-nav #navControlStack{
  right:max(14px,calc(env(safe-area-inset-right) + 12px))!important;
  bottom:calc(max(10px,calc(env(safe-area-inset-bottom) + 7px)) + 98px)!important;
  width:46px!important;min-width:46px!important;max-width:46px!important;
  gap:10px!important;
}
body.body-nav #navDrawerRecenter,
body.body-nav #soundBtn,
body.body-nav #navCameraToggle{
  width:46px!important;min-width:46px!important;max-width:46px!important;
  height:46px!important;min-height:46px!important;max-height:46px!important;
  border-radius:16px!important;
}
body.body-nav #soundBtn.active,
body.body-nav #navCameraToggle.active,
body.body-nav #navDrawerRecenter.active{
  background:#111317!important;
  border-color:#111317!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(17,19,23,.16)!important;
}
body.body-nav .floating-speedo{
  bottom:calc(max(10px,calc(env(safe-area-inset-bottom) + 7px)) + 98px)!important;
}

/* Neutral black/white navigation language. */
body.body-nav .nav-maneuver-icon{background:#111317!important}
body.body-nav .nav-maneuver-copy span{color:#2d323a!important}
body.body-nav .nav-street-chip{
  background:#fff!important;
  color:#111317!important;
  border:1px solid rgba(17,19,23,.08)!important;
  box-shadow:0 8px 18px rgba(17,19,23,.08)!important;
}
body.body-nav #activeNav .nav-summary-item:first-child strong{color:#111317!important}

@media(max-width:380px){
  body.body-nav #navControlStack{right:9px!important;width:44px!important;min-width:44px!important;max-width:44px!important}
  body.body-nav #navDrawerRecenter,body.body-nav #soundBtn,body.body-nav #navCameraToggle{width:44px!important;min-width:44px!important;max-width:44px!important;height:44px!important;min-height:44px!important;max-height:44px!important}
}

/* ================================================================
   VAIZO V101.2 — requested driver controls polish
   Static-only follow-up.
   ================================================================ */

/* FREE MAP — exactly one clean top rail: options / safety / 3D. */
body:not(.body-nav) #navControlStack{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
body:not(.body-nav) .map-tools #focusModeBtn{
  color:var(--v101-accent)!important;
  background:#fff!important;
  border:1px solid rgba(22,24,29,.09)!important;
  box-shadow:0 7px 18px rgba(18,22,33,.08)!important;
}
body:not(.body-nav) .map-tools #focusModeBtn.active{
  background:var(--v101-accent)!important;
  color:#fff!important;
  border-color:var(--v101-accent)!important;
  box-shadow:0 9px 22px rgba(101,93,242,.23)!important;
}
body:not(.body-nav) .map-tools #safetyToolsBtn{
  color:#262b34!important;
}

/* Cleaner destination card with a little more breathing room on every phone. */
body:not(.body-nav) #planSheet{
  padding-left:clamp(10px,3vw,14px)!important;
  padding-right:clamp(10px,3vw,14px)!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading{
  padding:0 3px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-row{
  padding:0 1px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-card.search-card{
  border-radius:19px!important;
  padding:0 2px!important;
}

@media(max-width:899px){
  :root{--planner-collapsed-h:116px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed{
    height:116px!important;
    min-height:116px!important;
    max-height:116px!important;
  }
  body:not(.body-nav) .floating-locate{
    bottom:calc(116px + max(20px,env(safe-area-inset-bottom)))!important;
  }
}

/* ACTIVE NAVIGATION — three controls higher, lighter and easier to hit. */
body.body-nav #navControlStack{
  bottom:calc(max(10px,calc(env(safe-area-inset-bottom) + 7px)) + 126px)!important;
  width:46px!important;
  min-width:46px!important;
  max-width:46px!important;
  gap:9px!important;
}
body.body-nav #navDrawerRecenter,
body.body-nav #soundBtn,
body.body-nav #navCameraToggle{
  width:46px!important;
  min-width:46px!important;
  max-width:46px!important;
  height:46px!important;
  min-height:46px!important;
  max-height:46px!important;
  border-radius:16px!important;
  border:1px solid rgba(22,24,29,.09)!important;
  background:rgba(255,255,255,.98)!important;
  color:#5f6570!important;
  box-shadow:0 7px 18px rgba(18,22,33,.08)!important;
}

/* Voice uses VAIZO purple when enabled. */
body.body-nav #soundBtn.active{
  background:var(--v101-accent)!important;
  border-color:var(--v101-accent)!important;
  color:#fff!important;
  box-shadow:0 9px 22px rgba(101,93,242,.24)!important;
}

/* 3D stays visually clean; selected 3D is VAIZO purple, never black. */
body.body-nav #navCameraToggle{
  color:var(--v101-accent)!important;
}
body.body-nav #navCameraToggle.active{
  background:var(--v101-accent)!important;
  border-color:var(--v101-accent)!important;
  color:#fff!important;
  box-shadow:0 9px 22px rgba(101,93,242,.24)!important;
}

/* Recenter remains neutral so purple only communicates active product actions. */
body.body-nav #navDrawerRecenter.active{
  background:#fff!important;
  border-color:rgba(22,24,29,.09)!important;
  color:#5f6570!important;
  box-shadow:0 7px 18px rgba(18,22,33,.08)!important;
}

/* Maneuver arrow/glyph is VAIZO purple; instruction text stays black. */
body.body-nav .nav-maneuver-icon{
  background:var(--v101-accent)!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(101,93,242,.18)!important;
}
body.body-nav .maneuver-glyph{color:#fff!important}
body.body-nav .nav-maneuver-copy b{
  color:#111317!important;
}
body.body-nav .nav-maneuver-copy span{
  color:var(--v101-accent)!important;
}

/* Keep the speedometer aligned with the raised control area without crowding it. */
body.body-nav .floating-speedo{
  bottom:calc(max(10px,calc(env(safe-area-inset-bottom) + 7px)) + 126px)!important;
}

@media(max-width:380px){
  body.body-nav #navControlStack{
    bottom:calc(max(8px,calc(env(safe-area-inset-bottom) + 5px)) + 120px)!important;
    width:44px!important;min-width:44px!important;max-width:44px!important;
  }
  body.body-nav #navDrawerRecenter,
  body.body-nav #soundBtn,
  body.body-nav #navCameraToggle{
    width:44px!important;min-width:44px!important;max-width:44px!important;
    height:44px!important;min-height:44px!important;max-height:44px!important;
    border-radius:15px!important;
  }
  body.body-nav .floating-speedo{
    bottom:calc(max(8px,calc(env(safe-area-inset-bottom) + 5px)) + 120px)!important;
  }
}


/* ================================================================
   VAIZO V101.3 — thin driver rail + geometry locked above trip card
   The JS now measures the real trip-card top and anchors controls
   above it, so expanded ETA/distance content can never overlap them.
   ================================================================ */

body.body-nav #navControlStack{
  right:max(14px,calc(env(safe-area-inset-right) + 12px))!important;
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  gap:7px!important;
  align-items:center!important;
}
body.body-nav #navDrawerRecenter,
body.body-nav #soundBtn,
body.body-nav #navCameraToggle{
  box-sizing:border-box!important;
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  height:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  padding:0!important;
  border-radius:14px!important;
  border:1px solid rgba(22,24,29,.085)!important;
  background:rgba(255,255,255,.985)!important;
  color:#5d636e!important;
  box-shadow:0 5px 14px rgba(18,22,33,.075)!important;
}
body.body-nav #navDrawerRecenter svg,
body.body-nav #soundBtn svg,
body.body-nav #navCameraToggle svg{
  width:17px!important;
  height:17px!important;
  stroke-width:2.05!important;
}
body.body-nav #soundBtn.active,
body.body-nav #navCameraToggle.active{
  background:var(--v101-accent)!important;
  border-color:var(--v101-accent)!important;
  color:#fff!important;
  box-shadow:0 7px 17px rgba(101,93,242,.22)!important;
}
body.body-nav #navDrawerRecenter.active{
  background:#fff!important;
  border-color:rgba(22,24,29,.085)!important;
  color:#5d636e!important;
  box-shadow:0 5px 14px rgba(18,22,33,.075)!important;
}

/* Matching compact speedometer: same surface/radius language as the rail. */
body.body-nav .floating-speedo{
  left:max(14px,calc(env(safe-area-inset-left) + 12px))!important;
  right:auto!important;
  box-sizing:border-box!important;
  width:66px!important;
  min-width:66px!important;
  max-width:66px!important;
  height:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  padding:4px 8px!important;
  border-radius:14px!important;
  border:1px solid rgba(22,24,29,.085)!important;
  background:rgba(255,255,255,.985)!important;
  box-shadow:0 5px 14px rgba(18,22,33,.075)!important;
  display:flex!important;
  align-items:baseline!important;
  justify-content:center!important;
  gap:3px!important;
}
body.body-nav .floating-speedo small{display:none!important}
body.body-nav .floating-speedo strong{
  color:#111317!important;
  font-size:22px!important;
  line-height:1!important;
  font-weight:820!important;
  letter-spacing:-.55px!important;
}
body.body-nav .floating-speedo span{
  color:var(--v101-accent)!important;
  font-size:6.5px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.02em!important;
  text-transform:uppercase!important;
}

/* Maneuver stays VAIZO purple; text stays black. */
body.body-nav .nav-maneuver-icon{
  background:var(--v101-accent)!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(101,93,242,.18)!important;
}
body.body-nav .nav-maneuver-copy b{color:#111317!important}
body.body-nav .nav-maneuver-copy span{color:var(--v101-accent)!important}

/* Free map: only options + safety + 3D, with active 3D purple. */
body:not(.body-nav) #navControlStack{display:none!important}
body:not(.body-nav) .map-tools #quickAlertBtn{display:none!important}
body:not(.body-nav) .map-tools #safetyToolsBtn,
body:not(.body-nav) .map-tools #focusModeBtn{
  width:44px!important;
  height:44px!important;
  border-radius:15px!important;
}
body:not(.body-nav) .map-tools #focusModeBtn.active{
  background:var(--v101-accent)!important;
  border-color:var(--v101-accent)!important;
  color:#fff!important;
  box-shadow:0 7px 17px rgba(101,93,242,.22)!important;
}

/* Slightly calmer, safer padding for the initial destination card. */
body:not(.body-nav) #planSheet.sheet-collapsed{
  padding-left:clamp(12px,3.2vw,16px)!important;
  padding-right:clamp(12px,3.2vw,16px)!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading{
  padding-left:2px!important;
  padding-right:2px!important;
}
body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-card.search-card{
  border-radius:18px!important;
  padding-left:2px!important;
  padding-right:2px!important;
}

@media(max-width:380px){
  body.body-nav #navControlStack{
    right:9px!important;
    width:40px!important;min-width:40px!important;max-width:40px!important;
  }
  body.body-nav #navDrawerRecenter,
  body.body-nav #soundBtn,
  body.body-nav #navCameraToggle{
    width:40px!important;min-width:40px!important;max-width:40px!important;
    height:40px!important;min-height:40px!important;max-height:40px!important;
    border-radius:13px!important;
  }
  body.body-nav .floating-speedo{
    left:9px!important;
    width:62px!important;min-width:62px!important;max-width:62px!important;
    height:40px!important;min-height:40px!important;max-height:40px!important;
    border-radius:13px!important;
  }
  body.body-nav .floating-speedo strong{font-size:20px!important}
}


/* ================================================================
   VAIZO V105 — compact square speedometer + exact thin 3D rail
   Final lower-HUD override. Keep this block last in the stylesheet.
   ================================================================ */

/* Calibrate / voice / 3D are one exact component. No wide 3D pill. */
body.body-nav .ws-app #navControlStack{
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  gap:7px!important;
  align-items:center!important;
}
body.body-nav .ws-app #navDrawerRecenter,
body.body-nav .ws-app #soundBtn,
body.body-nav .ws-app #navCameraToggle{
  box-sizing:border-box!important;
  flex:0 0 42px!important;
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  height:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid rgba(17,19,23,.085)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.985)!important;
  color:#5d636e!important;
  box-shadow:0 5px 14px rgba(18,22,33,.075)!important;
  overflow:hidden!important;
}
body.body-nav .ws-app #navDrawerRecenter svg,
body.body-nav .ws-app #soundBtn svg,
body.body-nav .ws-app #navCameraToggle svg{
  width:17px!important;
  height:17px!important;
  stroke-width:2.05!important;
}
body.body-nav .ws-app #soundBtn.active,
body.body-nav .ws-app #navCameraToggle.active{
  background:var(--v101-accent)!important;
  border-color:var(--v101-accent)!important;
  color:#fff!important;
  box-shadow:0 7px 17px rgba(101,93,242,.22)!important;
}
body.body-nav .ws-app #navDrawerRecenter.active{
  background:#fff!important;
  border-color:rgba(17,19,23,.085)!important;
  color:#5d636e!important;
  box-shadow:0 5px 14px rgba(18,22,33,.075)!important;
}

/* Square VAIZO speedometer. Its bottom edge is aligned by JS with the 3D
   button and stays exactly 10px above the real route-info card. */
body.body-nav .ws-app .floating-speedo{
  --speed-progress:0;
  position:absolute!important;
  left:max(14px,calc(env(safe-area-inset-left) + 12px))!important;
  right:auto!important;
  box-sizing:border-box!important;
  width:54px!important;
  min-width:54px!important;
  max-width:54px!important;
  height:54px!important;
  min-height:54px!important;
  max-height:54px!important;
  padding:6px 6px 8px!important;
  border:1px solid rgba(17,19,23,.09)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.99)!important;
  box-shadow:0 6px 16px rgba(18,22,33,.08)!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:minmax(0,1fr) auto!important;
  place-items:center!important;
  gap:1px!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
body.body-nav .ws-app .floating-speedo small{display:none!important}
body.body-nav .ws-app .floating-speedo strong{
  position:relative!important;
  z-index:2!important;
  display:block!important;
  margin:0!important;
  color:#111317!important;
  font-size:24px!important;
  line-height:.92!important;
  font-weight:860!important;
  letter-spacing:-.9px!important;
  font-variant-numeric:tabular-nums!important;
  text-align:center!important;
}
body.body-nav .ws-app .floating-speedo span{
  position:relative!important;
  z-index:2!important;
  display:block!important;
  margin:0!important;
  color:#767b86!important;
  font-size:6px!important;
  line-height:1!important;
  font-weight:850!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  text-align:center!important;
  white-space:nowrap!important;
}
/* Very thin live-speed accent; GPU-friendly transform only. */
body.body-nav .ws-app .floating-speedo::before,
body.body-nav .ws-app .floating-speedo::after{
  content:"";
  position:absolute!important;
  left:7px!important;
  right:7px!important;
  bottom:4px!important;
  height:2px!important;
  border-radius:999px!important;
  pointer-events:none!important;
}
body.body-nav .ws-app .floating-speedo::before{
  z-index:0!important;
  background:#e9e9ee!important;
}
body.body-nav .ws-app .floating-speedo::after{
  z-index:1!important;
  background:var(--v101-accent)!important;
  transform:scaleX(var(--speed-progress))!important;
  transform-origin:left center!important;
  transition:transform .18s linear!important;
}
body.body-nav .ws-app .floating-speedo.moving{
  border-color:rgba(101,93,242,.20)!important;
  box-shadow:0 7px 18px rgba(101,93,242,.10)!important;
}

/* Keep the route card as the geometry anchor. */
body.body-nav #activeNav.nav-panel.nav-minimal{overflow:visible!important}

@media(max-width:380px){
  body.body-nav .ws-app #navControlStack{
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
  }
  body.body-nav .ws-app #navDrawerRecenter,
  body.body-nav .ws-app #soundBtn,
  body.body-nav .ws-app #navCameraToggle{
    flex-basis:40px!important;
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    height:40px!important;
    min-height:40px!important;
    max-height:40px!important;
    border-radius:13px!important;
  }
  body.body-nav .ws-app .floating-speedo{
    left:9px!important;
    width:50px!important;
    min-width:50px!important;
    max-width:50px!important;
    height:50px!important;
    min-height:50px!important;
    max-height:50px!important;
    border-radius:15px!important;
  }
  body.body-nav .ws-app .floating-speedo strong{font-size:22px!important}
}

@media(prefers-reduced-motion:reduce){
  body.body-nav .ws-app .floating-speedo::after{transition:none!important}
}


/* ================================================================
   VAIZO V108 — easier destination-sheet handle
   One tap reliably expands/collapses the planner on touch screens.
   ================================================================ */
body:not(.body-nav) #planSheet .planner-grab{
  position:relative!important;
  box-sizing:border-box!important;
  width:92px!important;
  height:28px!important;
  margin:-2px auto 5px!important;
  border:0!important;
  border-radius:999px!important;
  background:#f1f1f4!important;
  color:#747983!important;
  cursor:pointer!important;
  touch-action:none!important;
  -webkit-tap-highlight-color:transparent!important;
  transition:transform .14s ease,background .14s ease!important;
}
body:not(.body-nav) #planSheet .planner-grab:before{
  content:\"\"!important;
  position:absolute!important;
  left:50%!important;top:7px!important;
  width:12px!important;height:12px!important;
  border-left:1.8px solid currentColor!important;
  border-top:1.8px solid currentColor!important;
  transform:translateX(-50%) rotate(45deg)!important;
  transition:transform .18s ease!important;
}
body:not(.body-nav) #planSheet:not(.sheet-collapsed) .planner-grab:before{
  top:3px!important;
  transform:translateX(-50%) rotate(225deg)!important;
}
body:not(.body-nav) #planSheet .planner-grab:after{display:none!important}
body:not(.body-nav) #planSheet .planner-grab:active{transform:scale(.94)!important;background:#e8e8ed!important}
@media(max-width:390px){
  body:not(.body-nav) #planSheet .planner-grab{width:86px!important;height:27px!important;margin-bottom:4px!important}
}


/* VAIZO V122 — compatibility/mobile stability without visual redesign */
html,body{min-width:280px;max-width:100%;overflow-x:hidden}
.ws-app{width:100%;max-width:100vw;min-height:var(--vaizu-vh,100dvh);height:var(--vaizu-vh,100dvh);overflow:hidden}
#map{width:100%!important;height:100%!important;min-width:0!important}
.search-card,.planner-search-card,.planner-location-row,.planner-heading,.planner-heading-copy,#planSheet,#routeState,.destination-confirm{box-sizing:border-box;min-width:0;max-width:100%}
.search-results,.search-results.show,.search-results.search-results-portal{box-sizing:border-box;max-width:calc(100vw - 16px)!important;overflow-x:hidden!important}
.search-item,.search-item .result-copy{min-width:0!important;max-width:100%!important}
.search-item .result-address,.search-item small{overflow:hidden!important;text-overflow:ellipsis!important}
.location-input,input[type="search"],input[type="text"]{max-width:100%;min-width:0}
body.vaizu-search-interacting #planSheet{transition:none!important}
body.vaizu-search-interacting .planner-search-card .location-input{touch-action:manipulation}
@media(max-width:640px){
  #planSheet{left:max(7px,env(safe-area-inset-left))!important;right:max(7px,env(safe-area-inset-right))!important;bottom:max(7px,env(safe-area-inset-bottom))!important;width:auto!important}
  .planner-search-card .location-input{font-size:16px!important}
  .destination-confirm{left:max(7px,env(safe-area-inset-left))!important;right:max(7px,env(safe-area-inset-right))!important;bottom:max(7px,env(safe-area-inset-bottom))!important;width:auto!important}
  .destination-confirm-actions{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)!important}
  .destination-confirm-actions button{min-width:0!important;max-width:100%!important;white-space:normal!important}
}
@media(max-width:350px){
  #planSheet{left:max(5px,env(safe-area-inset-left))!important;right:max(5px,env(safe-area-inset-right))!important}
  .planner-heading-copy b{font-size:18px!important;white-space:normal!important}
  .destination-confirm-actions{grid-template-columns:1fr!important}
}
@media(max-height:620px) and (orientation:landscape){#planSheet{max-height:calc(var(--vaizu-vh,100dvh) - 10px)!important;overflow:auto!important}}
@media(prefers-reduced-motion:reduce){.user-marker,.user-puck-image{transition:none!important}}


/* ================================================================
   VAIZO V123.2 — phone-safe destination card + 3 transport modes
   Reference matrix: compact Android, Galaxy A-series, S-series,
   iPhone compact/base/Pro/Pro Max. Visual language is unchanged.
   ================================================================ */

/* Personalization is back to the three supported routing profiles. */
#routeState .travel{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
#routeState .travel button{min-width:0!important;white-space:nowrap!important;padding-left:7px!important;padding-right:7px!important}

/* The collapsed planner used to end at 116px while its real content could
   exceed that on Samsung Internet/Chrome after text scaling and browser UI.
   Give handle + heading + 50px search row + a real 10px bottom breathing room. */
@media(max-width:899px){
  :root{--planner-collapsed-h:146px!important}
  body:not(.body-nav) #planSheet{
    left:max(8px,env(safe-area-inset-left))!important;
    right:max(8px,env(safe-area-inset-right))!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    padding:6px 10px 10px!important;
    box-sizing:border-box!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed{
    height:auto!important;
    min-height:146px!important;
    max-height:none!important;
    overflow:hidden!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading{
    margin:0 2px 8px!important;
    padding:0 3px!important;
    min-height:28px!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-row{
    width:100%!important;
    padding:0!important;
    margin:0!important;
    box-sizing:border-box!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-card.search-card,
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-location-row.location-row{
    height:52px!important;
    min-height:52px!important;
    box-sizing:border-box!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-card.search-card{
    padding:0 3px!important;
    overflow:visible!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-search-card .location-input{
    height:50px!important;
    min-height:50px!important;
    line-height:1.2!important;
  }
  body:not(.body-nav) .floating-locate{
    bottom:calc(146px + max(20px,env(safe-area-inset-bottom)))!important;
  }
}

/* Galaxy A56 / common 400-430 CSS-pixel Android widths. Keep an explicit
   minimum 10px inner bottom padding even with display/font scaling. */
@media(min-width:400px) and (max-width:430px) and (max-width:899px){
  :root{--planner-collapsed-h:148px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed{
    height:auto!important;min-height:148px!important;max-height:none!important;
    padding-bottom:10px!important;
  }
  body:not(.body-nav) .floating-locate{bottom:calc(148px + max(20px,env(safe-area-inset-bottom)))!important}
}

/* Compact phones keep the same composition instead of shrinking the textbox. */
@media(max-width:380px) and (max-width:899px){
  :root{--planner-collapsed-h:146px!important}
  body:not(.body-nav) #planSheet.sheet-collapsed{
    height:auto!important;min-height:146px!important;max-height:none!important;
    padding-left:10px!important;padding-right:10px!important;padding-bottom:10px!important;
  }
  body:not(.body-nav) #planSheet.sheet-collapsed .planner-heading-copy b{font-size:18px!important;white-space:nowrap!important}
  body:not(.body-nav) .floating-locate{bottom:calc(146px + max(18px,env(safe-area-inset-bottom)))!important}
}

/* Short landscape / keyboard viewport: preserve search usability and avoid
   forcing the fixed collapsed height beyond the visible area. */
@media(max-height:520px) and (max-width:899px){
  body:not(.body-nav) #planSheet.sheet-collapsed{
    height:auto!important;
    min-height:min(126px,calc(var(--vaizu-vh,100dvh) - 12px))!important;
    max-height:calc(var(--vaizu-vh,100dvh) - 12px)!important;
    overflow:auto!important;
  }
}

/* V125 — global map boot recovery */
#map{position:relative}
.map-boot-recovery{position:absolute;z-index:90;left:50%;top:50%;transform:translate(-50%,-50%);width:min(360px,calc(100% - 28px));padding:18px;border-radius:22px;background:rgba(255,255,255,.96);border:1px solid rgba(210,220,235,.96);box-shadow:0 22px 60px rgba(22,34,58,.18);text-align:center;font-family:inherit;color:#172033;backdrop-filter:blur(12px)}
.map-boot-recovery b{display:block;font-size:16px}.map-boot-recovery span{display:block;margin-top:6px;color:#6f7c8e;font-size:13px;line-height:1.45}.map-boot-recovery button{margin-top:13px;min-height:42px;padding:0 16px;border:0;border-radius:14px;background:#6f5cff;color:#fff;font:800 13px/1 inherit;cursor:pointer}.map-boot-failed{background:#f7f9fc}


/* VAIZO iOS keyboard/GPS stability patch — v127
   Keeps the map/app composition stable when Chrome/Safari on iPhone opens
   the keyboard, and prevents WebKit's input auto-zoom without redesigning
   the destination card. */
html.vaizu-ios-keyboard-lock,body.vaizu-ios-keyboard-lock{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
  -webkit-overflow-scrolling:auto!important;
  touch-action:manipulation!important;
}
html.vaizu-keyboard-open .ws-app,
body.vaizu-keyboard-open .ws-app{
  height:var(--vaizu-vh,100dvh)!important;
  min-height:var(--vaizu-vh,100dvh)!important;
  max-height:var(--vaizu-vh,100dvh)!important;
  transform:translateZ(0)!important;
  will-change:transform!important;
}
html.vaizu-keyboard-open #planSheet,
body.vaizu-keyboard-open #planSheet{
  transition:none!important;
  transform:translate3d(0,0,0)!important;
  -webkit-transform:translate3d(0,0,0)!important;
}
html.vaizu-keyboard-open .planner-search-card .search-results,
body.vaizu-keyboard-open .planner-search-card .search-results{
  max-height:min(330px,42vh)!important;
  -webkit-overflow-scrolling:touch!important;
}
@supports (-webkit-touch-callout:none){
  @media(max-width:699px){
    .planner-search-card .location-input,
    .planner-search-card .location-input#destinationInput,
    .planner-search-card .location-input#originInput{
      font-size:16px!important;
      line-height:1.12!important;
      transform:translateZ(0)!important;
      -webkit-text-size-adjust:100%!important;
    }
    .planner-search-card .location-input::placeholder{font-size:16px!important;line-height:1.12!important}
    html.vaizu-keyboard-open body,
    body.vaizu-keyboard-open{position:fixed!important;inset:0!important;height:var(--vaizu-vh,100dvh)!important;min-height:var(--vaizu-vh,100dvh)!important;max-height:var(--vaizu-vh,100dvh)!important}
  }
}


/* V1240 — cleaner guest/account entry states. */
.drawer-login{padding:8px 2px 2px}.drawer-login-badge{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;border:1px solid var(--vg-line);background:var(--vg-brand-soft);color:var(--vg-brand);font-size:10px;font-weight:900;margin-bottom:12px}.drawer-login h3{margin:0 0 7px;font-size:18px;line-height:1.08;letter-spacing:-.3px}.drawer-login p{margin:0;color:var(--vg-muted);font-size:11px;line-height:1.55}.drawer-login-highlights,.guest-limit-highlights{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.drawer-login-highlights span,.guest-limit-highlights span{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:0 11px;border-radius:999px;background:#FAFAFC;border:1px solid var(--vg-line);color:var(--vg-ink);font-size:10px;font-weight:850}.drawer-login-primary{margin-top:14px!important}.drawer-login-secondary{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;margin-top:8px;border:1px solid var(--vg-line);border-radius:13px;background:#FAFAFC;color:var(--vg-ink);font-size:11px;font-weight:900;text-decoration:none}.guest-limit-card h2{line-height:1.05}.guest-limit-card p{max-width:310px}.guest-limit-highlights{margin-top:15px;margin-bottom:4px}.guest-limit-primary{background:linear-gradient(135deg,var(--vg-brand-2),var(--vg-brand))!important}.guest-limit-secondary{font-weight:900!important}