/* Unified BAI passenger navigation — shared visual contract for Home / Explore / Ride. */
:root{--bai-nav-bg:rgba(7,24,43,.94);--bai-nav-line:rgba(255,255,255,.12);--bai-nav-muted:#91a4b6;--bai-nav-active:#fff;--bai-nav-yellow:#ffc421;--bai-nav-ink:#07182b}
.bottom,.x2-nav{position:fixed!important;z-index:50!important;left:50%!important;right:auto!important;bottom:10px!important;transform:translateX(-50%)!important;width:min(calc(100% - 24px),736px)!important;height:70px!important;border-radius:25px!important;padding:6px 8px!important;padding-bottom:6px!important;display:grid!important;grid-template-columns:repeat(5,1fr)!important;align-items:center!important;background:var(--bai-nav-bg)!important;border:1px solid var(--bai-nav-line)!important;box-shadow:0 18px 44px rgba(0,0,0,.28)!important;backdrop-filter:blur(20px) saturate(135%)!important;-webkit-backdrop-filter:blur(20px) saturate(135%)!important;overflow:visible!important}
.bottom a,.x2-nav a{min-width:0!important;height:58px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:2px!important;background:transparent!important;border:0!important;border-radius:16px!important;color:var(--bai-nav-muted)!important;text-decoration:none!important;font-size:20px!important;box-shadow:none!important}
.bottom a.active,.x2-nav a.active{color:var(--bai-nav-active)!important}
.bottom small,.x2-nav small{display:block!important;font-size:8px!important;font-weight:850!important;line-height:1!important;margin:2px 0 0!important;color:inherit!important}
.bottom .map,.x2-nav .map{background:transparent!important;color:var(--bai-nav-ink)!important}
.bottom .map span,.x2-nav .map span{width:55px!important;height:55px!important;border-radius:50%!important;display:grid!important;place-items:center!important;background:var(--bai-nav-yellow)!important;border:6px solid #eef7fb!important;color:var(--bai-nav-ink)!important;margin-top:-21px!important;box-shadow:0 8px 20px rgba(255,196,33,.28)!important;font-size:18px!important}
.bottom .map small,.x2-nav .map small{margin-top:-4px!important;color:#fff!important;font-weight:900!important}

/* Mobile nav uses equal physical gutters instead of translate-centering. */
@media(max-width:699px){.bottom,.x2-nav{left:12px!important;right:12px!important;width:auto!important;transform:none!important}}
@media(max-width:350px){.bottom,.x2-nav{left:8px!important;right:8px!important;width:auto!important}.bottom a,.x2-nav a{font-size:18px!important}.bottom small,.x2-nav small{font-size:7px!important}}

/* Shared floating passenger header contract — Home + Explore. */
body[data-page="home"] .top,.x2-top{position:fixed!important;z-index:55!important;top:calc(10px + env(safe-area-inset-top))!important;left:12px!important;right:12px!important;width:auto!important;max-width:736px!important;height:64px!important;margin:0 auto!important;padding:8px 10px!important;border-radius:24px!important;background:rgba(7,24,43,.90)!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 16px 38px rgba(0,0,0,.24)!important;backdrop-filter:blur(20px) saturate(135%)!important;-webkit-backdrop-filter:blur(20px) saturate(135%)!important;display:flex!important;align-items:center!important;justify-content:space-between!important;transform:none!important}
body[data-page="home"] .top .ico,.x2-top .round{width:44px!important;height:44px!important;min-width:44px!important;border-radius:15px!important;border:1px solid rgba(255,255,255,.11)!important;background:rgba(255,255,255,.055)!important;color:#fff!important;box-shadow:none!important;display:grid!important;place-items:center!important}
body[data-page="home"] .top>img{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:62px!important;height:34px!important;object-fit:contain!important;filter:brightness(0) invert(1)!important;margin:0!important}
body[data-page="home"] .top>div{margin-left:auto!important;display:flex!important;align-items:center!important;gap:8px!important}
.x2-top .brand{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;white-space:nowrap!important}
.x2-top .brand img{width:46px!important;height:28px!important;object-fit:contain!important;filter:brightness(0) invert(1)!important}
.x2-top .brand span{font-size:10px!important;letter-spacing:.14em!important;font-weight:900!important;color:#d9e5ee!important;text-transform:uppercase!important}
.x2-top .round:last-child{margin-left:auto!important}
@media(min-width:760px){body[data-page="home"] .top,.x2-top{left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:min(calc(100% - 24px),736px)!important}}
