/* SamiMap R71 unified navigation HUD + Nearby rail safety */
:root{--bx-r71-rail-gap:64px}

/* Full map surface: never leave a strip below the map on phone/PWA. */
@media(max-width:1023px){
 html,body{width:100%!important;height:100%!important;min-height:100%!important;margin:0!important;padding:0!important;overflow:hidden!important}
 #map.maplibregl-map,#map{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:0!important;width:auto!important;height:auto!important;min-height:0!important;margin:0!important}
 #map .maplibregl-canvas-container{width:100%!important;height:100%!important;min-height:100%!important}
}
html.bx-pwa-standalone,html.bx-pwa-standalone body{height:100dvh!important;min-height:100dvh!important}
html.bx-pwa-standalone #map.maplibregl-map,html.bx-pwa-standalone #map{top:0!important;right:0!important;bottom:0!important;left:0!important;width:auto!important;height:auto!important;min-height:0!important}

/* Nearby always stays clear of the right-side map rail. */
@media(max-width:1023px){
 #bxNearbyDrawer,#bxNearbyCard{z-index:2147483105!important}
 #bxNearbyDrawer{
   left:max(8px,env(safe-area-inset-left,0px))!important;
   right:calc(env(safe-area-inset-right,0px) + var(--bx-r71-rail-gap))!important;
   width:auto!important;
   bottom:max(8px,env(safe-area-inset-bottom,0px))!important;
   max-height:min(54dvh,calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 104px))!important;
   border-radius:20px!important;overflow:hidden!important
 }
 #bxNearbyCard{
   left:max(8px,env(safe-area-inset-left,0px))!important;
   right:calc(env(safe-area-inset-right,0px) + var(--bx-r71-rail-gap))!important;
   width:auto!important;
   bottom:max(8px,env(safe-area-inset-bottom,0px))!important
 }
 .bx-nearby-head{position:sticky!important;top:0!important;z-index:4!important;background:rgba(5,17,27,.995)!important}
 .bx-nearby-close{position:relative!important;z-index:5!important;width:42px!important;height:42px!important;min-width:42px!important;flex:0 0 42px!important;border-radius:13px!important}
 #bxNearbyResults{min-height:0!important;overflow:auto!important;-webkit-overflow-scrolling:touch!important}
}
@media(min-width:761px) and (max-width:1023px){
 #bxNearbyDrawer{right:auto!important;width:min(520px,calc(100vw - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px) - 82px))!important}
 #bxNearbyCard{right:calc(env(safe-area-inset-right,0px) + 66px)!important}
}
/* One HUD owner on every screen. */
body.bx-r38-ui.navigation-active #driveHud{
 display:block!important;padding:0!important;border:0!important;background:transparent!important;
 box-shadow:none!important;overflow:visible!important
}
body.bx-r38-ui.navigation-active #driveHud>div:not(#bxR40RoadHud){display:none!important}
body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
 display:grid!important;visibility:visible!important;pointer-events:auto!important;box-sizing:border-box!important;
 background:linear-gradient(180deg,rgba(5,20,35,.99),rgba(3,13,25,.995))!important;
 border:1px solid rgba(115,176,226,.18)!important;
 box-shadow:0 18px 44px rgba(0,0,0,.34)!important;color:#fff!important
}
.bx40-road-hud>*{box-sizing:border-box!important;min-width:0}
.bx40-road-art{display:none!important}
.bx40-speed-zone{grid-area:speed}
.bx40-remain{grid-area:remain}
.bx40-eta{grid-area:eta}
.bx40-arrival{grid-area:arrival}
.bx40-road-sign{grid-area:road}
.bx40-turn-sign{grid-area:turn}
.bx40-metric-icon{display:grid!important;place-items:center!important;flex:0 0 auto!important;color:#7abfff!important}
.bx40-metric-icon svg{width:22px!important;height:22px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.bx40-metric-copy{min-width:0!important}
.bx40-road-mini{display:grid!important;place-items:center!important;flex:0 0 auto!important;color:#74baff!important}
.bx40-road-mini svg{width:30px!important;height:34px!important}
.bx40-arrival .bx40-metric-icon{color:#f0c56f!important}
.bx40-eta .bx40-metric-icon{color:#ffc857!important}
.bx40-remain .bx40-metric-icon{color:#4eb5ff!important}
.bx40-arrival strong{color:#fff!important}
.bx40-eta strong{color:#ffc857!important}
.bx40-remain strong{color:#4eb5ff!important}

/* Desktop: single horizontal HUD, no second Arrival layer. */
@media(min-width:1280px){
 body.bx-r38-ui.navigation-active #driveHud{left:18px!important;right:88px!important;bottom:17px!important;width:auto!important;height:112px!important;min-height:112px!important;transform:none!important}
 body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
   width:100%!important;height:112px!important;border-radius:22px!important;overflow:hidden!important;
   grid-template-columns:minmax(205px,1.05fr) minmax(285px,1.55fr) 190px 145px 145px 145px!important;
   grid-template-areas:"turn road speed arrival eta remain"!important;align-items:stretch!important
 }
 .bx40-turn-sign,.bx40-road-sign{height:auto!important;margin:9px!important;border-radius:15px!important}
 .bx40-turn-sign{display:grid!important;grid-template-columns:66px minmax(0,1fr)!important;background:linear-gradient(180deg,rgba(8,48,86,.98),rgba(3,25,49,.99))!important}
 .bx40-turn-arrow{display:grid!important;place-items:center!important;background:#118cff!important;color:#fff!important}.bx40-turn-arrow svg{width:39px!important;height:39px!important}
 .bx40-turn-copy{padding:0 11px!important}.bx40-turn-copy strong{font-size:14px!important}.bx40-turn-copy small{font-size:9px!important}
 .bx40-road-sign{display:flex!important;align-items:center!important;gap:10px!important;padding:0 14px!important;background:rgba(7,27,46,.94)!important;border:1px solid rgba(95,170,230,.23)!important}
 .bx40-road-name{min-width:0!important;flex:1!important;text-align:left!important}.bx40-road-name span{font-size:9px!important;color:#8faac1!important}.bx40-road-name strong{display:block!important;margin-top:5px!important;font-size:15px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
 .bx40-road-distance{padding:7px 9px!important;border-radius:10px!important;background:rgba(17,140,255,.13)!important;border:1px solid rgba(57,157,255,.28)!important;font-size:12px!important;font-weight:850!important}
 .bx40-speed-zone{display:flex!important;align-items:center!important;justify-content:center!important;gap:11px!important;padding:10px 9px!important;border-left:1px solid rgba(255,255,255,.07)!important;border-right:1px solid rgba(255,255,255,.07)!important}
 .bx40-limit-sign{width:62px!important;height:62px!important;border-radius:50%!important;border:6px solid #ef3d42!important;background:#fff!important;display:grid!important;place-items:center!important}.bx40-limit-sign strong{color:#0a1320!important;font-size:24px!important}
 .bx40-current-speed{display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:flex-start!important}.bx40-current-speed strong{font-size:25px!important}.bx40-current-speed span{font-size:9px!important;color:#c8d7e3!important}.bx40-current-speed small{font-size:8px!important;color:#7891a8!important}
 .bx40-metric{display:grid!important;grid-template-columns:26px minmax(0,1fr)!important;column-gap:8px!important;align-items:center!important;padding:12px 10px!important;border-right:1px solid rgba(255,255,255,.07)!important;text-align:left!important}
 .bx40-metric span{font-size:9px!important;color:#879eb3!important}.bx40-metric strong{display:block!important;margin-top:4px!important;font-size:18px!important;line-height:1.05!important;white-space:nowrap!important}.bx40-metric small{display:block!important;margin-top:5px!important;font-size:7px!important;color:#6d859b!important}
}
@media(min-width:1024px) and (max-width:1279px){
 body.bx-r38-ui.navigation-active #driveHud{left:14px!important;right:78px!important;bottom:12px!important;width:auto!important;height:104px!important;min-height:104px!important;transform:none!important}
 body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
   width:100%!important;height:104px!important;border-radius:19px!important;overflow:hidden!important;
   grid-template-columns:170px minmax(220px,1fr) 150px 105px 105px 105px!important;
   grid-template-areas:"turn road speed arrival eta remain"!important
 }
 .bx40-turn-sign,.bx40-road-sign{height:auto!important;margin:7px!important;border-radius:13px!important}
 .bx40-turn-sign{display:grid!important;grid-template-columns:52px 1fr!important;background:#061f39!important}.bx40-turn-arrow{display:grid!important;place-items:center!important;background:#118cff!important}.bx40-turn-arrow svg{width:31px!important;height:31px!important}.bx40-turn-copy{padding:0 7px!important}.bx40-turn-copy strong{font-size:10px!important}.bx40-turn-copy small{font-size:7px!important}
 .bx40-road-sign{display:flex!important;align-items:center!important;gap:7px!important;padding:0 9px!important;background:rgba(7,27,46,.94)!important}.bx40-road-mini svg{width:24px!important;height:28px!important}.bx40-road-name{flex:1!important;text-align:left!important}.bx40-road-name span{font-size:7px!important}.bx40-road-name strong{display:block!important;font-size:11px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.bx40-road-distance{font-size:9px!important;padding:5px!important}
 .bx40-speed-zone{display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;border-left:1px solid rgba(255,255,255,.07)!important;border-right:1px solid rgba(255,255,255,.07)!important}.bx40-limit-sign{width:48px!important;height:48px!important;border:5px solid #ef3d42!important;background:#fff!important;border-radius:50%!important;display:grid!important;place-items:center!important}.bx40-limit-sign strong{color:#09131e!important;font-size:18px!important}.bx40-current-speed strong{font-size:18px!important}.bx40-current-speed span{font-size:7px!important}.bx40-current-speed small{display:none!important}
 .bx40-metric{display:grid!important;grid-template-columns:20px 1fr!important;gap:5px!important;align-items:center!important;padding:7px!important;border-right:1px solid rgba(255,255,255,.07)!important}.bx40-metric-icon svg{width:18px!important;height:18px!important}.bx40-metric span{font-size:7px!important}.bx40-metric strong{display:block!important;margin-top:3px!important;font-size:13px!important;white-space:nowrap!important}.bx40-metric small{display:none!important}
}

/* Phone/PWA: Google-style speed pair floats above one compact bottom HUD. */
@media(max-width:1023px){
 body.bx-r38-ui.navigation-active #driveHud{
   left:max(8px,env(safe-area-inset-left,0px))!important;
   right:max(8px,env(safe-area-inset-right,0px))!important;
   bottom:max(8px,env(safe-area-inset-bottom,0px))!important;
   width:auto!important;height:106px!important;min-height:106px!important;transform:none!important
 }
 body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
   position:relative!important;width:100%!important;height:106px!important;border-radius:19px!important;overflow:visible!important;
   grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:48px 58px!important;
   grid-template-areas:"road road road" "arrival eta remain"!important
 }
 .bx40-turn-sign{display:none!important}
 .bx40-road-sign{display:flex!important;align-items:center!important;gap:8px!important;height:48px!important;margin:0!important;padding:0 11px!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.08)!important;border-radius:19px 19px 0 0!important;background:rgba(6,25,43,.98)!important}
 .bx40-road-mini svg{width:24px!important;height:28px!important}.bx40-road-name{flex:1!important;min-width:0!important;text-align:left!important}.bx40-road-name span{font-size:7.5px!important;color:#7894ab!important}.bx40-road-name strong{display:block!important;margin-top:2px!important;font-size:12px!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.bx40-road-distance{padding:5px 7px!important;border:1px solid rgba(55,157,255,.23)!important;border-radius:9px!important;background:rgba(17,140,255,.11)!important;font-size:9px!important;font-weight:850!important}
 .bx40-metric{display:grid!important;grid-template-columns:21px minmax(0,1fr)!important;gap:5px!important;align-items:center!important;padding:7px 7px!important;border-right:1px solid rgba(255,255,255,.07)!important;text-align:left!important}.bx40-metric:last-of-type{border-right:0!important}.bx40-metric-icon svg{width:18px!important;height:18px!important}.bx40-metric span{font-size:7.5px!important;color:#8399ad!important}.bx40-metric strong{display:block!important;margin-top:2px!important;font-size:13px!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.bx40-metric small{display:none!important}
 .bx40-speed-zone{
   position:absolute!important;left:0!important;bottom:calc(100% + 9px)!important;z-index:5!important;
   display:flex!important;flex-direction:row-reverse!important;align-items:center!important;justify-content:flex-end!important;gap:7px!important;
   width:auto!important;height:58px!important;padding:0!important;border:0!important;background:transparent!important
 }
 .bx40-limit-sign{width:50px!important;height:50px!important;border:5px solid #ef3d42!important;border-radius:50%!important;background:#fff!important;display:grid!important;place-items:center!important;box-shadow:0 5px 16px rgba(0,0,0,.32)!important}.bx40-limit-sign strong{color:#09131e!important;font-size:18px!important}.bx40-limit-sign.unknown{border-color:#667787!important;background:#eef3f6!important}
 .bx40-current-speed{width:58px!important;height:58px!important;border-radius:50%!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;background:rgba(5,17,27,.98)!important;border:5px solid #35d173!important;box-shadow:0 5px 16px rgba(0,0,0,.32)!important}.bx40-current-speed strong{font-size:21px!important;line-height:.95!important}.bx40-current-speed span{margin-top:3px!important;font-size:7px!important;color:#d3e0ea!important}.bx40-current-speed small{display:none!important}
}
@media(max-width:430px){
 body.bx-r38-ui.navigation-active #driveHud{left:7px!important;right:7px!important}
 .bx40-road-sign{padding:0 9px!important}.bx40-road-mini{display:none!important}.bx40-road-name strong{font-size:11px!important}
 .bx40-metric{grid-template-columns:18px minmax(0,1fr)!important;gap:4px!important;padding:6px 5px!important}.bx40-metric-icon svg{width:16px!important;height:16px!important}.bx40-metric strong{font-size:12px!important}.bx40-metric span{font-size:7px!important}
}
@media(max-width:932px) and (orientation:landscape){
 body.bx-r38-ui.navigation-active #driveHud{
   left:max(8px,env(safe-area-inset-left,0px))!important;
   right:calc(env(safe-area-inset-right,0px) + 64px)!important;
   bottom:max(6px,env(safe-area-inset-bottom,0px))!important
 }
 .bx40-speed-zone{bottom:calc(100% + 6px)!important}
}

/* PWA uses the same responsive rules, with its safe-area variables. */
html.bx-pwa-standalone body.bx-r38-ui.navigation-active #driveHud{
 bottom:calc(var(--bx-pwa-bottom) + 8px)!important
}
@media(max-width:932px) and (orientation:landscape){
 html.bx-pwa-standalone body.bx-r38-ui.navigation-active #driveHud{
   left:calc(var(--bx-pwa-left) + 8px)!important;
   right:calc(var(--bx-pwa-right) + 64px)!important;
   bottom:calc(var(--bx-pwa-bottom) + 6px)!important
 }
 html.bx-pwa-standalone #bxNearbyDrawer{z-index:2147483105!important;left:calc(var(--bx-pwa-left) + 8px)!important;right:auto!important;width:min(520px,calc(100vw - var(--bx-pwa-left) - var(--bx-pwa-right) - 82px))!important}
 html.bx-pwa-standalone #bxNearbyCard{z-index:2147483110!important;left:calc(var(--bx-pwa-left) + 8px)!important;right:calc(var(--bx-pwa-right) + 66px)!important;width:auto!important}
}


/* R72 containment: old mobile driveHud child rules must not pad/center R40. */
body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
  padding:0!important;margin:0!important;align-items:stretch!important;align-content:stretch!important;text-align:initial!important
}
@media(max-width:1023px){
 body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
   grid-template-rows:48px minmax(0,1fr)!important
 }
 .bx40-metric{align-self:stretch!important;height:auto!important;min-height:0!important;margin:0!important}
 .bx40-road-sign{align-self:stretch!important;margin:0!important}
}


/* R73: installed PWA portrait must reserve the right map-control rail. */
@media(max-width:760px){
 html.bx-pwa-standalone #bxNearbyDrawer,
 html.bx-pwa-standalone #bxNearbyCard{
   left:calc(var(--bx-pwa-left) + 8px)!important;
   right:calc(var(--bx-pwa-right) + 64px)!important;
   width:auto!important
 }
}
@media(min-width:761px) and (max-width:1023px) and (orientation:portrait){
 html.bx-pwa-standalone #bxNearbyDrawer,
 html.bx-pwa-standalone #bxNearbyCard{
   left:calc(var(--bx-pwa-left) + 8px)!important;
   right:calc(var(--bx-pwa-right) + 66px)!important;
   width:auto!important
 }
}


/* R75: final phone/PWA HUD bottom-edge + Nearby rail collision fix */
:root{--bx-r75-nearby-side:82px}

@media(max-width:1023px){
  body.bx-r38-ui.navigation-active #driveHud{
    bottom:0!important;
    left:max(4px,env(safe-area-inset-left,0px))!important;
    right:max(4px,env(safe-area-inset-right,0px))!important;
    height:calc(106px + env(safe-area-inset-bottom,0px))!important;
    min-height:calc(106px + env(safe-area-inset-bottom,0px))!important;
    padding:0 0 env(safe-area-inset-bottom,0px)!important;
    border-radius:19px 19px 0 0!important;
    background:linear-gradient(180deg,rgba(5,20,35,.99),rgba(3,13,25,.995))!important;
    overflow:visible!important
  }
  body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
    display:grid!important;visibility:visible!important;opacity:1!important;
    height:106px!important;min-height:106px!important;
    border-radius:19px 19px 0 0!important
  }
  body.bx-r38-ui.navigation-active .bx40-metric-icon,
  body.bx-r38-ui.navigation-active .bx40-metric-icon svg,
  body.bx-r38-ui.navigation-active .bx40-road-mini,
  body.bx-r38-ui.navigation-active .bx40-road-mini svg{
    display:grid!important;visibility:visible!important;opacity:1!important
  }
  body.bx-r38-ui.navigation-active .bx40-speed-zone{
    display:flex!important;visibility:visible!important;opacity:1!important
  }
  #bxNearbyDrawer,#bxNearbyCard{
    z-index:2147483240!important;
    left:max(8px,env(safe-area-inset-left,0px))!important;
    right:calc(env(safe-area-inset-right,0px) + var(--bx-r75-nearby-side))!important;
    width:auto!important;max-width:none!important
  }
  #bxNearbyDrawer .bx-nearby-head{position:sticky!important;top:0!important;z-index:8!important}
  #bxNearbyDrawer .bx-nearby-close,#bxNearbyCard .bx-nearby-x{
    position:relative!important;z-index:10!important;pointer-events:auto!important
  }
  body:has(#bxNearbyDrawer:not([hidden])) #rightRail,
  body:has(#bxNearbyCard:not([hidden])) #rightRail{
    visibility:hidden!important;opacity:0!important;pointer-events:none!important
  }
}
@media(max-width:430px){
  body.bx-r38-ui.navigation-active #driveHud{left:0!important;right:0!important}
}
@media(max-width:932px) and (orientation:landscape){
  body.bx-r38-ui.navigation-active #driveHud{
    left:max(4px,env(safe-area-inset-left,0px))!important;
    right:max(4px,env(safe-area-inset-right,0px))!important;
    bottom:0!important;
    height:calc(106px + env(safe-area-inset-bottom,0px))!important;
    min-height:calc(106px + env(safe-area-inset-bottom,0px))!important
  }
  html.bx-pwa-standalone #bxNearbyDrawer,
  html.bx-pwa-standalone #bxNearbyCard{
    right:calc(var(--bx-pwa-right) + var(--bx-r75-nearby-side))!important
  }
}
html.bx-pwa-standalone body.bx-r38-ui.navigation-active #driveHud{
  bottom:0!important;
  background:linear-gradient(180deg,rgba(5,20,35,.99),rgba(3,13,25,.995))!important
}


/* R87 Professional lightweight navigation HUD */
@keyframes bx87-turn-pulse{0%,100%{opacity:1}50%{opacity:.46}}
@keyframes bx87-lane-pulse{0%,100%{opacity:1}50%{opacity:.50}}

body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
  background:linear-gradient(180deg,rgba(4,17,30,.985),rgba(2,10,20,.995))!important;
  border:1px solid rgba(82,151,210,.28)!important;
  box-shadow:0 16px 40px rgba(0,0,0,.32)!important
}
body.bx-r38-ui.navigation-active .bx40-turn-sign,
body.bx-r38-ui.navigation-active .bx40-road-sign{
  border:1px solid rgba(74,142,201,.24)!important;
  background:linear-gradient(180deg,rgba(7,31,54,.98),rgba(3,19,35,.99))!important
}
body.bx-r38-ui.navigation-active .bx40-turn-arrow{
  border-radius:14px!important;
  background:linear-gradient(180deg,#1594ff,#0676df)!important;
  color:#fff!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)!important;
  animation:bx87-turn-pulse 1.08s ease-in-out infinite
}
body.bx-r38-ui.navigation-active .bx40-turn-copy{min-width:0!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
body.bx-r38-ui.navigation-active #bxR40TurnDistance{font-size:23px!important;line-height:1!important;font-weight:900!important;color:#fff!important;white-space:nowrap!important}
body.bx-r38-ui.navigation-active #bxR40TurnText{display:block!important;margin-top:4px!important;font-size:14px!important;line-height:1.05!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.bx-r38-ui.navigation-active #bxR40TurnArabic{display:block!important;margin-top:4px!important;font-size:8px!important;color:#8fa9bd!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.bx-r38-ui.navigation-active .bx40-turn-road{display:none!important;margin-top:3px!important;font-size:8px!important;color:#82a0b7!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}

.bx40-lanes{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;align-items:center!important;padding:8px!important;border-radius:13px!important;background:rgba(2,12,23,.72)!important;border:1px solid rgba(81,151,210,.22)!important}
.bx40-lane{height:48px!important;display:grid!important;place-items:center!important;border-radius:9px!important;color:#627a90!important;background:rgba(255,255,255,.025)!important;border:1px solid rgba(255,255,255,.05)!important;opacity:.72}
.bx40-lane svg{width:26px!important;height:32px!important}
.bx40-lane-active{color:#fff!important;background:rgba(12,127,245,.18)!important;border-color:rgba(31,154,255,.74)!important;opacity:1!important;animation:bx87-lane-pulse 1.08s ease-in-out infinite}
.bx40-lanes[data-turn="left"] .bx40-lane-active{order:-1}
.bx40-lanes[data-turn="right"] .bx40-lane-active{order:5}
.bx40-lanes[data-turn="uturn"] .bx40-lane-active{order:-1}

/* Blink the existing on-map maneuver marker only; no new marker/layer. */
body.navigation-active .v25-maneuver-marker{animation:bx87-turn-pulse 1.08s ease-in-out infinite!important}

/* Keep all metric values clean/consistent. */
body.bx-r38-ui.navigation-active .bx40-metric-icon{color:#3faeff!important}
body.bx-r38-ui.navigation-active .bx40-arrival strong,
body.bx-r38-ui.navigation-active .bx40-eta strong,
body.bx-r38-ui.navigation-active .bx40-remain strong{color:#fff!important}
body.bx-r38-ui.navigation-active .bx40-current-speed{order:1!important}
body.bx-r38-ui.navigation-active .bx40-limit-sign{order:2!important}

@media(min-width:1280px){
 body.bx-r38-ui.navigation-active #driveHud{height:118px!important;min-height:118px!important;bottom:14px!important}
 body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
   height:118px!important;border-radius:23px!important;
   grid-template-columns:minmax(390px,1.65fr) minmax(245px,1.05fr) 180px 135px 135px 135px!important;
   grid-template-areas:"turn road speed arrival eta remain"!important
 }
 body.bx-r38-ui.navigation-active .bx40-turn-sign{
   margin:8px!important;display:grid!important;grid-template-columns:66px minmax(100px,1fr) 155px!important;gap:9px!important;padding:7px!important;align-items:center!important
 }
 body.bx-r38-ui.navigation-active .bx40-turn-arrow{height:86px!important;display:grid!important;place-items:center!important}
 body.bx-r38-ui.navigation-active .bx40-turn-arrow svg{width:44px!important;height:44px!important}
 body.bx-r38-ui.navigation-active .bx40-road-sign{margin:8px 8px 8px 0!important;border-radius:15px!important}
 body.bx-r38-ui.navigation-active .bx40-speed-zone{gap:12px!important}
}

@media(min-width:1024px) and (max-width:1279px){
 body.bx-r38-ui.navigation-active #driveHud{height:108px!important;min-height:108px!important}
 body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
   height:108px!important;
   grid-template-columns:330px minmax(190px,1fr) 145px 100px 100px 100px!important;
   grid-template-areas:"turn road speed arrival eta remain"!important
 }
 body.bx-r38-ui.navigation-active .bx40-turn-sign{margin:7px!important;display:grid!important;grid-template-columns:52px minmax(88px,1fr) 112px!important;gap:6px!important;padding:5px!important;align-items:center!important}
 body.bx-r38-ui.navigation-active .bx40-turn-arrow{height:80px!important;display:grid!important;place-items:center!important}
 body.bx-r38-ui.navigation-active .bx40-turn-arrow svg{width:34px!important;height:34px!important}
 body.bx-r38-ui.navigation-active #bxR40TurnDistance{font-size:18px!important}
 body.bx-r38-ui.navigation-active #bxR40TurnText{font-size:11px!important}
 .bx40-lanes{padding:5px!important;gap:3px!important}.bx40-lane{height:42px!important}.bx40-lane svg{width:21px!important;height:27px!important}
}

@media(max-width:1023px){
 body.bx-r38-ui.navigation-active #driveHud{
   height:calc(140px + env(safe-area-inset-bottom,0px))!important;
   min-height:calc(140px + env(safe-area-inset-bottom,0px))!important
 }
 body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
   height:140px!important;min-height:140px!important;border-radius:19px 19px 0 0!important;
   grid-template-columns:repeat(3,minmax(0,1fr))!important;
   grid-template-rows:76px 64px!important;
   grid-template-areas:"turn turn turn" "arrival eta remain"!important
 }
 body.bx-r38-ui.navigation-active .bx40-turn-sign{
   display:grid!important;grid-template-columns:54px minmax(0,1fr) 116px!important;gap:7px!important;align-items:center!important;
   height:76px!important;margin:0!important;padding:7px 9px!important;border-radius:19px 19px 0 0!important;border-width:0 0 1px!important
 }
 body.bx-r38-ui.navigation-active .bx40-turn-arrow{height:60px!important;display:grid!important;place-items:center!important}
 body.bx-r38-ui.navigation-active .bx40-turn-arrow svg{width:34px!important;height:34px!important}
 body.bx-r38-ui.navigation-active #bxR40TurnDistance{font-size:18px!important}
 body.bx-r38-ui.navigation-active #bxR40TurnText{font-size:12px!important}
 body.bx-r38-ui.navigation-active #bxR40TurnArabic{font-size:7px!important}
 body.bx-r38-ui.navigation-active .bx40-turn-road{display:block!important}
 body.bx-r38-ui.navigation-active .bx40-road-sign{display:none!important}
 body.bx-r38-ui.navigation-active .bx40-speed-zone{bottom:calc(100% + 8px)!important}
 body.bx-r38-ui.navigation-active .bx40-metric{padding:7px 8px!important}
 .bx40-lanes{padding:5px!important;gap:3px!important}.bx40-lane{height:48px!important}.bx40-lane svg{width:22px!important;height:28px!important}
}

@media(max-width:430px){
 body.bx-r38-ui.navigation-active .bx40-turn-sign{grid-template-columns:50px minmax(0,1fr) 94px!important;padding:6px!important;gap:5px!important}
 .bx40-lanes{padding:4px!important;gap:2px!important}.bx40-lane{height:44px!important}.bx40-lane svg{width:19px!important;height:25px!important}
 body.bx-r38-ui.navigation-active #bxR40TurnDistance{font-size:17px!important}
}

@media(prefers-reduced-motion:reduce){
 body.bx-r38-ui.navigation-active .bx40-turn-arrow,
 .bx40-lane-active,
 body.navigation-active .v25-maneuver-marker{animation:none!important}
}


/* R88 neon maneuver HUD — responsive, low-overhead */
@keyframes bx88-near-pulse{0%,100%{opacity:1;filter:brightness(1.08)}50%{opacity:.58;filter:brightness(1.34)}}
@keyframes bx88-imminent-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.48;transform:scale(1.035)}}

body.bx-r38-ui.navigation-active #bxR40TurnSign{
  position:relative!important;
  overflow:hidden!important;
}
body.bx-r38-ui.navigation-active #bxR40TurnSign .bx40-turn-arrow{display:none!important}
body.bx-r38-ui.navigation-active #bxR40TurnSign .bx40-turn-copy{
  min-width:0!important;
  padding:7px 8px 7px 12px!important;
}
body.bx-r38-ui.navigation-active #bxR40TurnText{
  font-size:18px!important;
  line-height:1.12!important;
  font-weight:900!important;
  letter-spacing:-.2px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.bx-r38-ui.navigation-active #bxR40TurnArabic{
  margin-top:5px!important;
  font-size:11px!important;
  line-height:1.2!important;
  font-weight:700!important;
  color:#a9bfd2!important;
}
body.bx-r38-ui.navigation-active .bx40-turn-road{
  margin-top:4px!important;
  font-size:10px!important;
  color:#7fa2bb!important;
}
body.bx-r38-ui.navigation-active #bxR40Lanes{
  position:relative!important;
  min-width:0!important;
  padding:7px!important;
  gap:5px!important;
  background:rgba(0,12,25,.78)!important;
  border:1px solid rgba(31,169,255,.25)!important;
}
body.bx-r38-ui.navigation-active .bx40-lane{
  position:relative!important;
  height:58px!important;
  min-width:0!important;
  border-radius:11px!important;
}
body.bx-r38-ui.navigation-active .bx40-lane svg{
  width:29px!important;
  height:36px!important;
}
body.bx-r38-ui.navigation-active .bx40-lane-active{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
  color:#fff!important;
  background:linear-gradient(180deg,rgba(0,174,255,.27),rgba(0,96,255,.16))!important;
  border-color:rgba(34,190,255,.95)!important;
  box-shadow:0 0 16px rgba(0,181,255,.24),inset 0 0 10px rgba(19,168,255,.12)!important;
  animation:none!important;
}
body.bx-r38-ui.navigation-active .bx88-lane-icon{
  display:grid!important;
  place-items:center!important;
  line-height:1!important;
}
body.bx-r38-ui.navigation-active .bx88-lane-distance{
  display:block!important;
  margin-top:-1px!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:900!important;
  color:#dff7ff!important;
  white-space:nowrap!important;
}
body.bx-r38-ui.navigation-active #bxR40TurnSign.bx88-near .bx40-lane-active{
  animation:bx88-near-pulse 1.05s ease-in-out infinite!important;
}
body.bx-r38-ui.navigation-active #bxR40TurnSign.bx88-imminent .bx40-lane-active,
body.bx-r38-ui.navigation-active #bxR40TurnSign.bx88-imminent .bx88-lane-distance{
  animation:bx88-imminent-pulse .68s ease-in-out infinite!important;
}
body.bx-r38-ui.navigation-active #bxR40TurnSign.bx88-distant #bxR40Lanes{
  opacity:.46!important;
}
body.bx-r38-ui.navigation-active #bxR40TurnSign.bx88-distant .bx88-lane-distance{
  display:none!important;
}

.bx88-ahead[hidden]{display:none!important}
body.bx-r38-ui.navigation-active .bx88-ahead{
  position:absolute!important;
  inset:6px!important;
  z-index:4!important;
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:11px!important;
  padding:8px 13px!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,rgba(4,31,54,.98),rgba(2,16,30,.99))!important;
  border:1px solid rgba(40,181,255,.46)!important;
  box-shadow:inset 0 0 18px rgba(0,174,255,.06)!important;
}
body.bx-r38-ui.navigation-active .bx88-ahead-icon{
  width:54px!important;
  height:54px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  color:#fff!important;
  background:linear-gradient(180deg,#17aaff,#0875e9)!important;
  box-shadow:0 0 18px rgba(0,170,255,.22)!important;
}
body.bx-r38-ui.navigation-active .bx88-ahead-icon svg{width:32px!important;height:38px!important}
body.bx-r38-ui.navigation-active .bx88-ahead-copy{min-width:0!important;display:flex!important;flex-direction:column!important}
body.bx-r38-ui.navigation-active .bx88-ahead-copy small{
  font-size:9px!important;font-weight:800!important;letter-spacing:.7px!important;color:#7fa9c5!important
}
body.bx-r38-ui.navigation-active .bx88-ahead-copy strong{
  margin-top:3px!important;font-size:16px!important;line-height:1.15!important;font-weight:900!important;color:#fff!important;
  white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important
}
body.bx-r38-ui.navigation-active #bxR88AheadDistance{
  padding:7px 10px!important;
  border-radius:999px!important;
  font-size:14px!important;
  font-weight:900!important;
  color:#8edfff!important;
  background:rgba(0,158,255,.12)!important;
  border:1px solid rgba(44,184,255,.35)!important;
  white-space:nowrap!important;
}

/* Speed and limit stay legible on both desktop and phone. */
body.bx-r38-ui.navigation-active .bx40-current-speed strong{font-size:30px!important;line-height:.95!important}
body.bx-r38-ui.navigation-active .bx40-current-speed span{font-size:11px!important;font-weight:800!important}
body.bx-r38-ui.navigation-active .bx40-current-speed small{font-size:9px!important}
body.bx-r38-ui.navigation-active .bx40-limit-sign strong{font-size:28px!important;line-height:1!important}
body.bx-r38-ui.navigation-active .bx40-metric-copy strong{font-size:18px!important;line-height:1.05!important}
body.bx-r38-ui.navigation-active .bx40-metric-copy span{font-size:9px!important}
body.bx-r38-ui.navigation-active .bx40-metric-copy small{font-size:8px!important}

/* Desktop: remove the old separate maneuver square; text + lanes share the turn cell. */
@media(min-width:1024px){
 body.bx-r38-ui.navigation-active .bx40-turn-sign{
   grid-template-columns:minmax(120px,1fr) minmax(150px,185px)!important;
   gap:8px!important;
   align-items:center!important;
   padding:6px!important;
 }
 body.bx-r38-ui.navigation-active .bx40-turn-copy{display:flex!important;flex-direction:column!important;justify-content:center!important}
}

/* Phone/PWA: larger readable type, no overlap, lane arrows keep distance attached. */
@media(max-width:1023px){
 body.bx-r38-ui.navigation-active #driveHud{
   height:calc(148px + env(safe-area-inset-bottom,0px))!important;
   min-height:calc(148px + env(safe-area-inset-bottom,0px))!important;
 }
 body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
   height:148px!important;
   min-height:148px!important;
   grid-template-rows:84px 64px!important;
 }
 body.bx-r38-ui.navigation-active .bx40-turn-sign{
   height:84px!important;
   display:grid!important;
   grid-template-columns:minmax(0,1fr) 148px!important;
   gap:6px!important;
   padding:6px 8px!important;
 }
 body.bx-r38-ui.navigation-active #bxR40TurnText{font-size:16px!important;line-height:1.12!important}
 body.bx-r38-ui.navigation-active #bxR40TurnArabic{font-size:10px!important}
 body.bx-r38-ui.navigation-active .bx40-turn-road{display:block!important;font-size:9px!important}
 body.bx-r38-ui.navigation-active #bxR40Lanes{padding:5px!important;gap:3px!important}
 body.bx-r38-ui.navigation-active .bx40-lane{height:64px!important}
 body.bx-r38-ui.navigation-active .bx40-lane svg{width:25px!important;height:31px!important}
 body.bx-r38-ui.navigation-active .bx88-lane-distance{font-size:10px!important}
 body.bx-r38-ui.navigation-active .bx40-current-speed strong{font-size:27px!important}
 body.bx-r38-ui.navigation-active .bx40-limit-sign strong{font-size:26px!important}
 body.bx-r38-ui.navigation-active .bx40-metric-copy strong{font-size:16px!important}
 body.bx-r38-ui.navigation-active .bx40-metric-copy span{font-size:9px!important}
 body.bx-r38-ui.navigation-active .bx40-metric-copy small{font-size:8px!important}
 body.bx-r38-ui.navigation-active .bx88-ahead{grid-template-columns:48px minmax(0,1fr) auto!important;gap:8px!important;padding:7px 9px!important}
 body.bx-r38-ui.navigation-active .bx88-ahead-icon{width:46px!important;height:58px!important}
 body.bx-r38-ui.navigation-active .bx88-ahead-icon svg{width:28px!important;height:34px!important}
 body.bx-r38-ui.navigation-active .bx88-ahead-copy strong{font-size:15px!important}
 body.bx-r38-ui.navigation-active #bxR88AheadDistance{font-size:12px!important;padding:6px 8px!important}
}

@media(max-width:430px){
 body.bx-r38-ui.navigation-active .bx40-turn-sign{
   grid-template-columns:minmax(0,1fr) 126px!important;
   gap:4px!important;
   padding:5px 6px!important;
 }
 body.bx-r38-ui.navigation-active #bxR40TurnText{font-size:15px!important}
 body.bx-r38-ui.navigation-active #bxR40TurnArabic{font-size:9px!important}
 body.bx-r38-ui.navigation-active #bxR40Lanes{gap:2px!important;padding:4px!important}
 body.bx-r38-ui.navigation-active .bx40-lane{height:61px!important}
 body.bx-r38-ui.navigation-active .bx40-lane svg{width:22px!important;height:28px!important}
 body.bx-r38-ui.navigation-active .bx88-ahead{grid-template-columns:43px minmax(0,1fr) auto!important}
 body.bx-r38-ui.navigation-active .bx88-ahead-icon{width:41px!important;height:54px!important}
 body.bx-r38-ui.navigation-active .bx88-ahead-copy small{font-size:8px!important}
 body.bx-r38-ui.navigation-active .bx88-ahead-copy strong{font-size:14px!important}
 body.bx-r38-ui.navigation-active #bxR88AheadDistance{font-size:11px!important;padding:5px 7px!important}
}

@media(prefers-reduced-motion:reduce){
 body.bx-r38-ui.navigation-active #bxR40TurnSign.bx88-near .bx40-lane-active,
 body.bx-r38-ui.navigation-active #bxR40TurnSign.bx88-imminent .bx40-lane-active,
 body.bx-r38-ui.navigation-active #bxR40TurnSign.bx88-imminent .bx88-lane-distance{
   animation:none!important;
 }
}


/* R90 neon visual polish — lightweight, no extra map layers */
body.bx-r38-ui.navigation-active .bx40-current-speed{
  flex:0 0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:50%!important;
  background:radial-gradient(circle at 35% 30%,rgba(22,53,78,.98),rgba(3,14,27,.99) 68%)!important;
  border:4px solid #24c7ff!important;
  box-shadow:
    0 0 0 1px rgba(113,226,255,.16) inset,
    0 0 16px rgba(0,191,255,.34),
    0 7px 20px rgba(0,0,0,.30)!important;
}
body.bx-r38-ui.navigation-active .bx40-current-speed strong{
  color:#fff!important;
  text-shadow:0 0 8px rgba(80,216,255,.45)!important;
}
body.bx-r38-ui.navigation-active .bx40-current-speed span{
  color:#cceeff!important;
}
body.bx-r38-ui.navigation-active .bx40-limit-sign{
  box-shadow:
    0 0 0 1px rgba(255,255,255,.55) inset,
    0 0 12px rgba(255,71,71,.18),
    0 7px 18px rgba(0,0,0,.28)!important;
}

/* Stronger active-lane and preview arrow glow, keeping the existing blink. */
body.bx-r38-ui.navigation-active .bx40-lane-active{
  border-color:#31d6ff!important;
  box-shadow:
    0 0 0 1px rgba(92,226,255,.14) inset,
    0 0 18px rgba(0,191,255,.34),
    0 0 30px rgba(0,128,255,.16)!important;
}
body.bx-r38-ui.navigation-active .bx40-lane-active svg,
body.bx-r38-ui.navigation-active .bx88-ahead-icon svg{
  filter:
    drop-shadow(0 0 3px rgba(255,255,255,.92))
    drop-shadow(0 0 8px rgba(0,207,255,.82))
    drop-shadow(0 0 14px rgba(0,128,255,.48))!important;
}
body.bx-r38-ui.navigation-active .bx88-ahead-icon{
  border:1px solid rgba(83,220,255,.62)!important;
  box-shadow:
    0 0 16px rgba(0,201,255,.42),
    0 0 28px rgba(0,112,255,.18),
    inset 0 0 12px rgba(255,255,255,.08)!important;
}
body.navigation-active .v25-maneuver-marker{
  filter:
    drop-shadow(0 2px 2px rgba(0,20,60,.9))
    drop-shadow(0 0 7px rgba(255,255,255,.85))
    drop-shadow(0 0 14px rgba(0,206,255,.95))
    drop-shadow(0 0 24px rgba(0,106,255,.56))!important;
}

/* Desktop sizing */
@media(min-width:1280px){
  body.bx-r38-ui.navigation-active .bx40-current-speed{
    width:76px!important;height:76px!important;min-width:76px!important
  }
  body.bx-r38-ui.navigation-active .bx40-current-speed strong{
    font-size:31px!important;line-height:.90!important
  }
  body.bx-r38-ui.navigation-active .bx40-current-speed span{
    margin-top:4px!important;font-size:10px!important;font-weight:800!important
  }
  body.bx-r38-ui.navigation-active .bx40-limit-sign{
    width:68px!important;height:68px!important;min-width:68px!important
  }
  body.bx-r38-ui.navigation-active .bx40-limit-sign strong{
    font-size:27px!important
  }
}

/* Laptop/tablet */
@media(min-width:1024px) and (max-width:1279px){
  body.bx-r38-ui.navigation-active .bx40-current-speed{
    width:62px!important;height:62px!important;min-width:62px!important;border-width:3px!important
  }
  body.bx-r38-ui.navigation-active .bx40-current-speed strong{
    font-size:24px!important;line-height:.9!important
  }
  body.bx-r38-ui.navigation-active .bx40-current-speed span{
    margin-top:3px!important;font-size:8px!important
  }
  body.bx-r38-ui.navigation-active .bx40-limit-sign{
    width:54px!important;height:54px!important;min-width:54px!important
  }
  body.bx-r38-ui.navigation-active .bx40-limit-sign strong{
    font-size:20px!important
  }
}

/* Mobile/PWA: slightly larger but still clear of the maneuver HUD. */
@media(max-width:1023px){
  body.bx-r38-ui.navigation-active .bx40-speed-zone{
    gap:9px!important;
    height:70px!important;
  }
  body.bx-r38-ui.navigation-active .bx40-current-speed{
    width:68px!important;height:68px!important;min-width:68px!important;border-width:4px!important
  }
  body.bx-r38-ui.navigation-active .bx40-current-speed strong{
    font-size:26px!important;line-height:.9!important
  }
  body.bx-r38-ui.navigation-active .bx40-current-speed span{
    margin-top:4px!important;font-size:9px!important;font-weight:800!important
  }
  body.bx-r38-ui.navigation-active .bx40-limit-sign{
    width:58px!important;height:58px!important;min-width:58px!important
  }
  body.bx-r38-ui.navigation-active .bx40-limit-sign strong{
    font-size:21px!important
  }
}
@media(max-width:430px){
  body.bx-r38-ui.navigation-active .bx40-current-speed{
    width:64px!important;height:64px!important;min-width:64px!important
  }
  body.bx-r38-ui.navigation-active .bx40-limit-sign{
    width:55px!important;height:55px!important;min-width:55px!important
  }
}

/* Keep reduced-motion users static while retaining the glow. */
@media(prefers-reduced-motion:reduce){
  body.bx-r38-ui.navigation-active .bx40-lane-active,
  body.navigation-active .v25-maneuver-marker{
    animation:none!important;
  }
}



/* === R91 PRO NAVIGATION 2026-10-08 === */
body.bx-r38-ui.navigation-active #bxR38TurnCard{
  background:linear-gradient(145deg,rgba(4,35,58,.97),rgba(3,28,47,.98))!important;
  border:1px solid rgba(50,169,255,.36)!important;
  box-shadow:0 14px 38px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.06)!important;
  backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;
}
body.bx-r38-ui.navigation-active #bxR38TurnCard .bx91-turn-icon{display:grid!important;place-items:center!important;color:#fff!important}
body.bx-r38-ui.navigation-active #bxR38TurnCard .bx91-turn-icon svg{width:48px!important;height:48px!important}
body.bx-r38-ui.navigation-active #bxR38TurnCard .bx91-turn-copy{min-width:0!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnDistance{color:#fff!important;font-weight:900!important}
body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnText{color:#fff!important;font-weight:900!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnArabic{color:#a9c5d8!important;font-weight:700!important;direction:rtl!important;text-align:left!important}
body.bx-r38-ui.navigation-active #bxR38TurnCard .bx91-turn-road{color:#4bc7ff!important;font-weight:800!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.bx-r38-ui.navigation-active #bxR38TopLanes{align-self:center!important;display:flex!important;gap:3px!important;padding:4px!important;border-radius:11px!important;background:rgba(1,15,26,.78)!important;border:1px solid rgba(255,255,255,.08)!important}
body.bx-r38-ui.navigation-active #bxR38TopLanes[hidden]{display:none!important}
body.bx-r38-ui.navigation-active .bx91-top-lane{width:28px!important;height:42px!important;border-radius:7px!important;display:grid!important;place-items:center!important;color:#8092a2!important;background:rgba(255,255,255,.035)!important}
body.bx-r38-ui.navigation-active .bx91-top-lane svg{width:20px!important;height:25px!important}
body.bx-r38-ui.navigation-active .bx91-top-lane.active{color:#fff!important;background:linear-gradient(180deg,#169ff0,#0879cf)!important;box-shadow:0 0 16px rgba(27,169,255,.45)!important}
body.bx-r38-ui.navigation-active .bx40-limit-sign.unknown strong{font-size:0!important}
body.bx-r38-ui.navigation-active .bx40-limit-sign.unknown strong::after{content:"--"!important;font-size:20px!important;color:#23313c!important;font-weight:900!important}

@media (max-width:1023px){
  body.bx-r38-ui.navigation-active #bxR38TurnCard{
    position:fixed!important;top:calc(env(safe-area-inset-top,0px) + 14px)!important;left:84px!important;right:76px!important;width:auto!important;
    min-height:118px!important;padding:14px 15px!important;border-radius:25px!important;
    display:grid!important;grid-template-columns:62px minmax(0,1fr) auto!important;column-gap:10px!important;align-items:center!important;z-index:2147483050!important
  }
  body.bx-r38-ui.navigation-active #bxR38TurnCard[hidden]{display:none!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnDistance{font-size:24px!important;line-height:1!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnText{font-size:22px!important;line-height:1.08!important;margin-top:5px!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnArabic{font-size:11px!important;margin-top:5px!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard .bx91-turn-road{font-size:11px!important;margin-top:4px!important}
  body.bx-r38-ui.navigation-active #bxR38TopLanes{max-width:132px!important;overflow:hidden!important}
  body.bx-r38-ui.navigation-active #bxR40TurnSign,body.bx-r38-ui.navigation-active #bxR88Ahead{display:none!important}

  body.bx-r38-ui.navigation-active #driveHud{
    left:8px!important;right:8px!important;bottom:calc(env(safe-area-inset-bottom,0px) + 8px)!important;width:auto!important;
    height:116px!important;min-height:116px!important;border-radius:25px!important;overflow:visible!important;
    background:linear-gradient(150deg,rgba(3,20,33,.96),rgba(3,15,26,.98))!important;
    border:1px solid rgba(62,167,235,.25)!important;box-shadow:0 14px 38px rgba(0,0,0,.34)!important
  }
  body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{
    height:100%!important;padding:0!important;display:grid!important;grid-template-columns:1fr 1fr 1fr!important;
    grid-template-rows:52px 64px!important;grid-template-areas:"road road road" "arrival eta remain"!important;gap:0!important
  }
  body.bx-r38-ui.navigation-active .bx40-road-sign{
    grid-area:road!important;display:flex!important;align-items:center!important;padding:7px 16px!important;margin:0!important;border:0!important;
    border-bottom:1px solid rgba(255,255,255,.07)!important;background:transparent!important;border-radius:0!important
  }
  body.bx-r38-ui.navigation-active .bx40-road-mini{width:30px!important;height:30px!important;color:#36baff!important;margin-right:8px!important}
  body.bx-r38-ui.navigation-active .bx40-road-name span{font-size:7px!important;color:#7894aa!important}
  body.bx-r38-ui.navigation-active .bx40-road-name strong{font-size:14px!important;color:#fff!important;margin-top:2px!important}
  body.bx-r38-ui.navigation-active .bx40-road-distance{margin-left:auto!important;color:#38c2ff!important;font-size:12px!important;font-weight:900!important}
  body.bx-r38-ui.navigation-active .bx40-metric{min-width:0!important;padding:8px 10px!important;display:grid!important;grid-template-columns:22px minmax(0,1fr)!important;column-gap:6px!important;align-items:center!important;border-right:1px solid rgba(255,255,255,.07)!important;background:transparent!important}
  body.bx-r38-ui.navigation-active .bx40-metric-icon{color:#4dbdfd!important}
  body.bx-r38-ui.navigation-active .bx40-metric-copy span{font-size:8px!important;color:#8198aa!important}
  body.bx-r38-ui.navigation-active .bx40-metric-copy strong{font-size:17px!important;color:#fff!important;margin-top:3px!important}
  body.bx-r38-ui.navigation-active .bx40-metric-copy small{display:none!important}
  body.bx-r38-ui.navigation-active .bx40-speed-zone{position:absolute!important;left:10px!important;bottom:calc(100% + 10px)!important;z-index:8!important;width:auto!important;height:66px!important;display:flex!important;flex-direction:row!important;align-items:center!important;gap:8px!important;padding:0!important;background:transparent!important;border:0!important}
  body.bx-r38-ui.navigation-active .bx40-current-speed{width:66px!important;height:66px!important;border-radius:50%!important;background:rgba(3,18,30,.96)!important;border:5px solid #2cbcf8!important;box-shadow:0 8px 24px rgba(0,0,0,.35)!important}
  body.bx-r38-ui.navigation-active .bx40-current-speed strong{font-size:24px!important}
  body.bx-r38-ui.navigation-active .bx40-current-speed span{font-size:8px!important}
  body.bx-r38-ui.navigation-active .bx40-limit-sign{width:62px!important;height:62px!important;border:6px solid #ef4147!important;background:#fff!important;box-shadow:0 8px 24px rgba(0,0,0,.35)!important}
  body.bx-r38-ui.navigation-active .bx40-limit-sign strong{font-size:24px!important}
  body.bx-r38-ui.navigation-active #rightRail{right:max(8px,env(safe-area-inset-right,0px))!important;top:34%!important;bottom:auto!important}
}

@media (max-width:480px){
  body.bx-r38-ui.navigation-active #bxR38TurnCard{left:76px!important;right:70px!important;min-height:106px!important;padding:11px 12px!important;grid-template-columns:52px minmax(0,1fr) auto!important;border-radius:22px!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard .bx91-turn-icon svg{width:42px!important;height:42px!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnDistance{font-size:21px!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnText{font-size:19px!important}
  body.bx-r38-ui.navigation-active #bxR38TopLanes{display:none!important}
  body.bx-r38-ui.navigation-active .bx40-road-mini{display:none!important}
  body.bx-r38-ui.navigation-active .bx40-road-name strong{font-size:12px!important}
  body.bx-r38-ui.navigation-active .bx40-metric-copy strong{font-size:14px!important}
}

@media (min-width:1024px){
  body.bx-r38-ui.navigation-active #driveHud{
    left:18px!important;right:92px!important;bottom:16px!important;width:auto!important;height:124px!important;min-height:124px!important;
    border-radius:26px!important;overflow:visible!important;background:linear-gradient(145deg,rgba(3,20,33,.96),rgba(3,15,26,.98))!important;
    border:1px solid rgba(62,167,235,.25)!important;box-shadow:0 18px 42px rgba(0,0,0,.34)!important
  }
  body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{display:grid!important;height:100%!important;padding:0!important;gap:0!important;grid-template-columns:minmax(310px,1.35fr) minmax(220px,.9fr) 190px 150px 150px 150px!important;grid-template-areas:"turn road speed arrival eta remain"!important}
  body.bx-r38-ui.navigation-active .bx40-turn-sign{grid-area:turn!important;margin:8px!important;padding:7px 10px!important;border-radius:18px!important;background:linear-gradient(145deg,rgba(5,40,66,.92),rgba(3,28,47,.95))!important;border:1px solid rgba(49,173,255,.24)!important;display:grid!important;grid-template-columns:minmax(110px,1fr) minmax(140px,auto)!important;gap:10px!important;align-items:center!important}
  body.bx-r38-ui.navigation-active #bxR40TurnText{font-size:18px!important;font-weight:900!important}
  body.bx-r38-ui.navigation-active #bxR40TurnArabic{font-size:10px!important;color:#9db9cc!important}
  body.bx-r38-ui.navigation-active .bx40-turn-road{display:block!important;font-size:10px!important;color:#4bc7ff!important;margin-top:4px!important}
  body.bx-r38-ui.navigation-active #bxR40Lanes{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:3px!important;padding:5px!important;border-radius:12px!important;background:rgba(1,14,24,.72)!important}
  body.bx-r38-ui.navigation-active .bx40-lane{height:70px!important;width:30px!important;border-radius:8px!important}
  body.bx-r38-ui.navigation-active .bx40-lane-active{background:linear-gradient(180deg,#159ff0,#0878ce)!important;color:#fff!important;box-shadow:0 0 16px rgba(36,170,255,.42)!important}
  body.bx-r38-ui.navigation-active .bx40-road-sign{grid-area:road!important;margin:8px 6px!important;border-radius:18px!important;background:rgba(6,29,46,.72)!important;border:1px solid rgba(255,255,255,.06)!important}
  body.bx-r38-ui.navigation-active .bx40-speed-zone{grid-area:speed!important;position:static!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;height:auto!important;padding:10px!important;border-left:1px solid rgba(255,255,255,.06)!important;border-right:1px solid rgba(255,255,255,.06)!important}
  body.bx-r38-ui.navigation-active .bx40-current-speed{width:64px!important;height:64px!important;border:5px solid #2cbcf8!important}
  body.bx-r38-ui.navigation-active .bx40-current-speed strong{font-size:25px!important}
  body.bx-r38-ui.navigation-active .bx40-limit-sign{width:62px!important;height:62px!important;border-width:6px!important}
  body.bx-r38-ui.navigation-active .bx40-limit-sign strong{font-size:25px!important}
  body.bx-r38-ui.navigation-active .bx40-metric{padding:12px!important}
  body.bx-r38-ui.navigation-active .bx40-metric-copy strong{font-size:18px!important}
  body.bx-r38-ui.navigation-active #bxR88Ahead{display:none!important}
}

@media (max-width:1023px) and (orientation:landscape){
  body.bx-r38-ui.navigation-active #bxR38TurnCard{top:8px!important;left:72px!important;right:76px!important;min-height:82px!important;padding:8px 11px!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnDistance{font-size:18px!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard #bxR38TurnText{font-size:17px!important}
  body.bx-r38-ui.navigation-active #bxR38TurnCard .bx91-turn-icon svg{width:36px!important;height:36px!important}
  body.bx-r38-ui.navigation-active #bxR38TopLanes{display:none!important}
  body.bx-r38-ui.navigation-active #driveHud{height:94px!important;min-height:94px!important}
  body.bx-r38-ui.navigation-active #driveHud>#bxR40RoadHud{grid-template-rows:40px 54px!important}
  body.bx-r38-ui.navigation-active .bx40-speed-zone{bottom:calc(100% + 5px)!important}
}


/* R91B: explicit unknown speed-limit state */
body.bx-r38-ui.navigation-active .bx40-limit-sign.unknown{position:relative!important}
body.bx-r38-ui.navigation-active .bx40-limit-sign.unknown strong{display:none!important}
body.bx-r38-ui.navigation-active .bx40-limit-sign.unknown::after{
  content:"--"!important;display:block!important;color:#23313c!important;
  font-size:20px!important;line-height:1!important;font-weight:900!important;
}
