/* Option B: Filled glow */
html body[data-mode]:not(#_r):not(#_p) .tabbar a.tab:not(.post-tab){position:relative;transition:transform 200ms ease,box-shadow 200ms ease,background 200ms ease,color 200ms ease,opacity 200ms ease!important}
html body[data-mode]:not(#_r):not(#_p) .tabbar a.tab.active:not(.post-tab){transform:translateY(-3px) scale(1.04)!important;background:rgba(192,199,209,.12)!important;color:#fff!important;box-shadow:0 0 0 1px rgba(192,199,209,.4),0 0 20px rgba(192,199,209,.4),0 8px 18px rgba(0,0,0,.4)!important}
html body[data-mode]:not(#_r):not(#_p) .tabbar a.tab.active:not(.post-tab) span,html body[data-mode]:not(#_r):not(#_p) .tabbar a.tab.active:not(.post-tab) svg{color:#fff!important}
html body[data-mode]:not(#_r):not(#_p) .tabbar a.tab.active:not(.post-tab)::after{content:"";position:absolute;left:50%;bottom:-8px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:rgba(229,233,239,.8);box-shadow:0 0 8px rgba(192,199,209,.6)}

/* Floating tab bar */
html, body[data-mode] { background-color: #0B0B0B !important; }
html body[data-mode]:not(#_r):not(#_p) .tabbar {
  left: 12px !important; right: 12px !important; width: auto !important;
  bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
  padding: 12px 10px 8px !important;
  min-height: 64px !important;
  border-radius: 22px !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  background: rgba(14,14,16,0.82) !important;
  backdrop-filter: blur(18px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.3) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,0.55), 0 0 22px rgba(192,199,209,0.22) !important;
}
/* dark fill under the floating bar down to the screen edge */
html body[data-mode]:not(#_r):not(#_p) .tabbar::after {
  top: auto !important; bottom: calc(-11px - env(safe-area-inset-bottom, 0px)) !important;
  left: -13px !important; right: -13px !important;
  height: calc(11px + env(safe-area-inset-bottom, 0px)) !important;
  background: #0B0B0B !important; box-shadow: none !important; z-index: -1 !important;
}
/* keep content clear of the floating bar */
html body[data-mode]:not(#_r):not(#_p) .screen { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important; }

/* Map panel ends above the floating bar; dark area around the bar */
html body[data-mode]:not(#_r):not(#_p) .map-home .bottom-sheet {
  bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
  border-radius: 22px 22px 18px 18px !important;
}
html body[data-mode]:not(#_r):not(#_p) .map-home::after {
  content: ""; position: fixed; left: 0; right: 0; bottom: 0;
  height: calc(84px + env(safe-area-inset-bottom, 0px));
  background: #0B0B0B; z-index: 800; pointer-events: none;
}