/* Floating glass navigation: always reachable, below dialogs and ceremonies. */
body{padding-bottom:calc(116px + env(safe-area-inset-bottom,0px));padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
html{scroll-padding-bottom:calc(108px + env(safe-area-inset-bottom,0px))}
header{padding-top:calc(14px + env(safe-area-inset-top,0px))}
.tabs.bottom-nav{
  /* Pull the glass rim into the phone's empty edge band; controls stay inset. */
  position:fixed;left:50%;bottom:max(6px,calc(env(safe-area-inset-bottom,0px) - 16px));transform:translateX(-50%);z-index:44;
  width:min(536px,calc(100% - 24px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)));
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px;margin:0;padding:6px;
  border:1px solid rgba(255,255,255,.2);border-radius:36px;background:rgba(28,24,38,.31);
  -webkit-backdrop-filter:blur(3px) saturate(155%);backdrop-filter:blur(3px) saturate(155%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 12px 32px #0006;
}
.tabs.bottom-nav button{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:58px;
  padding:7px 1px;border:1px solid transparent;border-radius:28px;background:transparent;box-shadow:none;
  color:#c7c2d2;font-size:11px;font-weight:600;line-height:1.25;letter-spacing:0;text-indent:0;text-transform:none;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;
  transition:transform 140ms cubic-bezier(.23,1,.32,1);
}
.tabs.bottom-nav button.active{
  background:linear-gradient(160deg,rgba(255,255,255,.13),rgba(255,255,255,.03)),var(--rank-soft);
  border-color:rgba(255,255,255,.15);color:#fff;box-shadow:inset 0 1px 0 #ffffff12;
}
.tabs.bottom-nav button.active::after{display:none}
.tabs.bottom-nav button:focus-visible{outline:2px solid var(--text);outline-offset:2px}
.tabs.bottom-nav button:active{transform:scale(.95)}
.nav-icon{display:block;width:23px;height:23px;background:var(--nav-icon) center/contain no-repeat;filter:invert(1);opacity:.8}
.active .nav-icon{opacity:1}
#tabStatus{--nav-icon:url('../assets/navigation/status.svg')}
#tabCalendar{--nav-icon:url('../assets/navigation/calendar.svg')}
#tabProgress{--nav-icon:url('../assets/navigation/progress.svg')}
#tabLoot{--nav-icon:url('../assets/navigation/loot.svg')}
#tabBadges{--nav-icon:url('../assets/navigation/badges.svg')}
#tabWall{--nav-icon:url('../assets/navigation/mind.svg')}
.bottom-nav .tab-pip{top:1px;right:8px;max-width:calc(100% - 8px);height:17px;line-height:17px;font-size:9px;letter-spacing:0;box-shadow:0 0 0 2px #25202e}
@media(max-width:380px){.tabs.bottom-nav{width:calc(100% - 16px);padding:5px;gap:0}.tabs.bottom-nav button{font-size:9px;min-height:56px}.bottom-nav .tab-pip{right:2px}}
@media(hover:hover) and (pointer:fine){.tabs.bottom-nav button:not(.active):hover{background:#ffffff0d;color:#fff}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.tabs.bottom-nav{background:#211c2c}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.tabs.bottom-nav{background:#211c2c;-webkit-backdrop-filter:none;backdrop-filter:none;border-color:#aaa3b8}.tabs.bottom-nav button{color:#ede9e0}}
@media(prefers-reduced-motion:reduce){.tabs.bottom-nav button{transition:none}.tabs.bottom-nav button:active{transform:none}}