/* tabbar.css — fixed glassy bottom tab bar, extracted from the gen-2 PWA shell (share/release). */

.tabbar {
  position: fixed; bottom: 0; left: 0; right: 0;
  height: calc(var(--tabbar-h) + env(safe-area-inset-bottom));
  padding-bottom: env(safe-area-inset-bottom);
  display: flex;
  background: rgba(10, 10, 10, .86);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid var(--hairline);
  z-index: 5;
  max-width: 540px; margin: 0 auto;
}

/* icon-over-label tab; faint until active, then Agentic Orange */
.tab {
  flex: 1; background: none; border: none; color: var(--faint);
  font-family: var(--mono); font-size: 11px; font-weight: 600; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
}
.tab svg { width: 22px; height: 22px; }
.tab-label { font-size: 11px; }
.tab.is-active { color: var(--orange); }
.tab.is-active svg { color: var(--orange); }