/* Navigation layout based on Dart XtraServiceBottomNavigation: 76px rail,
   25px icons, safe area, one visible service nav. Narrow devices are first-class. */
:root{--mx-nav-safe:env(safe-area-inset-bottom,0px)}
html body #mxNavRescue[hidden]{display:none!important}
html body .mx-rescue-service-nav:not([hidden]),
html body #mxRemainingFlutterWorkspace:not([hidden]){
 position:fixed!important;bottom:calc(7px + var(--mx-nav-safe))!important;
 left:50%!important;right:auto!important;transform:translateX(-50%)!important;
 width:min(calc(100vw - 24px),760px)!important;max-width:calc(100vw - 24px)!important;
 height:76px!important;min-height:76px!important;max-height:none!important;
 display:flex!important;align-items:stretch!important;justify-content:space-evenly!important;
 box-sizing:border-box!important;overflow:hidden!important;
 background:rgba(11,18,26,.96)!important;border:1px solid rgba(255,255,255,.10)!important;
 border-radius:27px!important;padding:4px!important;
 z-index:2140!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;
 box-shadow:0 -4px 20px rgba(0,0,0,.45)!important;
}
html body #mxNavRescue .mx-rescue-tab,
html body #mxRemainingFlutterWorkspace .mx-flutter-rem-tab{
 display:flex!important;flex:1 1 0!important;min-width:0!important;max-width:none!important;
 flex-direction:column!important;align-items:center!important;justify-content:center!important;
 gap:3px!important;padding:4px 1px!important;margin:0!important;
 color:#9a9ea9!important;background:transparent!important;
 font:600 10px/1.22 system-ui,sans-serif!important;text-decoration:none!important;
 border:0!important;white-space:nowrap!important;overflow:hidden!important;
}
html body #mxNavRescue .mx-rescue-tab.active,
html body #mxRemainingFlutterWorkspace .mx-flutter-rem-tab.active{color:#ff006d!important}
html body #mxNavRescue .mx-rescue-tab svg,
html body #mxRemainingFlutterWorkspace .mx-flutter-rem-tab svg{width:25px!important;height:25px!important;flex:0 0 25px!important;display:block!important}
html body #mxNavRescue .mx-rescue-tab span,
html body #mxRemainingFlutterWorkspace .mx-flutter-rem-tab span{display:block!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important}
/* Only disable the legacy global nav when a service navigation is active. */
html body.mx-nav-recovery-active #app > nav#bottomNav,
html body.mx-nav-recovery-active #desktopNav{display:none!important;visibility:hidden!important;pointer-events:none!important}
/* Reserve room beneath content; do not cover the last ranking or card. */
html body.mx-nav-recovery-active #page,
html body.mx-nav-recovery-active #app main,
html body.mx-nav-recovery-active .page-content{padding-bottom:max(112px,calc(100px + var(--mx-nav-safe)))!important}
@media(max-width:359px){
 html body #mxNavRescue .mx-rescue-tab,
 html body #mxRemainingFlutterWorkspace .mx-flutter-rem-tab{font-size:9px!important}
 html body #mxNavRescue .mx-rescue-tab svg,
 html body #mxRemainingFlutterWorkspace .mx-flutter-rem-tab svg{width:22px!important;height:22px!important;flex-basis:22px!important}
}
@media(min-width:800px){
 html body .mx-rescue-service-nav:not([hidden]),
 html body #mxRemainingFlutterWorkspace:not([hidden]){width:min(calc(100vw - 24px),560px)!important}
}

/* Root Watch/More use the ORIGINAL 5-item global nav, not a service nav. */
html body.mx-root-nav-responsive:not(.mx-nav-recovery-active) #app > nav#bottomNav.bottom-nav {
 display:grid!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;
 position:fixed!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;
 bottom:calc(7px + var(--mx-nav-safe))!important;
 width:min(calc(100vw - 24px),560px)!important;max-width:calc(100vw - 24px)!important;
 min-height:76px!important;height:auto!important;z-index:2050!important;
 padding:5px!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:0!important;
 align-items:center!important;justify-items:stretch!important;
 border-radius:27px!important;background:rgba(11,18,26,.96)!important;box-sizing:border-box!important;
}
html body.mx-root-nav-responsive #app > nav#bottomNav.bottom-nav > a{
 display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
 gap:4px!important;min-height:58px!important;min-width:0!important;width:100%!important;
 color:#a7a9b6!important;padding:4px 1px!important;overflow:hidden!important;
}
html body.mx-root-nav-responsive #app > nav#bottomNav.bottom-nav > a .flutter-nav-icon,
html body.mx-root-nav-responsive #app > nav#bottomNav.bottom-nav > a .flutter-nav-icon svg{
 display:block!important;width:25px!important;height:25px!important;min-width:25px!important;
}
html body.mx-root-nav-responsive #app > nav#bottomNav.bottom-nav > a small{
 display:block!important;color:inherit!important;font:600 10px/1.2 system-ui,sans-serif!important;
 white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important;
}
html body.mx-root-nav-responsive #page{padding-bottom:max(112px,calc(100px + var(--mx-nav-safe)))!important}

/* 2026-11-10: PHONE ONLY — desktop visuals and positioning are unchanged.
   Prefer the original Flutter service bar; keep a rescue bar solely when the
   original is not reachable. One visible bar; never a black empty rail. */
@media (max-width:767px){
 html body.mx-nav-recovery-active #mxRemainingFlutterWorkspace:not([hidden]),
 html body.mx-nav-recovery-active #mxNavRescue:not([hidden]){
   position:fixed!important;
   bottom:max(8px,env(safe-area-inset-bottom,0px))!important;
   top:auto!important;
   left:50%!important;right:auto!important;
   transform:translate3d(-50%,0,0)!important;
   width:calc(100% - 24px)!important;
   max-width:560px!important;
   min-width:0!important;
   height:76px!important;
   min-height:76px!important;
   max-height:76px!important;
   display:flex!important;
   flex-direction:row!important;
   visibility:visible!important;opacity:1!important;
   pointer-events:auto!important;
   overflow:visible!important;
   isolation:isolate!important;
   z-index:2147483000!important;
   background:#0b121a!important;
   color:#a7a9b6!important;
   border:1px solid #273344!important;
   border-radius:27px!important;
   box-sizing:border-box!important;
 }
 html body.mx-nav-recovery-active #mxRemainingFlutterWorkspace:not([hidden]) a,
 html body.mx-nav-recovery-active #mxNavRescue:not([hidden]) a{
   display:flex!important;flex:1 1 0!important;
   align-items:center!important;justify-content:center!important;
   flex-direction:column!important;min-width:0!important;
   opacity:1!important;visibility:visible!important;
   pointer-events:auto!important;
   text-decoration:none!important;
 }
 html body.mx-nav-recovery-active #mxRemainingFlutterWorkspace:not([hidden]) svg,
 html body.mx-nav-recovery-active #mxNavRescue:not([hidden]) svg{
   display:block!important;visibility:visible!important;opacity:1!important;
   width:clamp(21px,6vw,25px)!important;height:clamp(21px,6vw,25px)!important;
 }
 html body.mx-nav-recovery-active #mxRemainingFlutterWorkspace:not([hidden]) span,
 html body.mx-nav-recovery-active #mxNavRescue:not([hidden]) span{
   display:block!important;visibility:visible!important;opacity:1!important;
   max-width:100%!important;
   font-size:clamp(9px,2.55vw,11px)!important;
   white-space:nowrap!important;text-overflow:ellipsis!important;overflow:hidden!important;
 }
 /* When the phone fallback is active, suppress the covered original bar. */
 html body.mx-mobile-rescue-on #mxRemainingFlutterWorkspace{
   visibility:hidden!important;pointer-events:none!important;opacity:0!important;
 }
 html body.mx-mobile-rescue-on #mxNavRescue:not([hidden]){
   visibility:visible!important;pointer-events:auto!important;opacity:1!important;
 }
 html body.mx-nav-recovery-active #page,
 html body.mx-nav-recovery-active #app main,
 html body.mx-nav-recovery-active .page-content{
   padding-bottom:max(116px,calc(100px + env(safe-area-inset-bottom,0px)))!important;
 }
}