/* base: site-kit/tabbar @ f0ecad5 (v1.2.0). Fix bugs in site-kit first, then re-vendor. */
/* site-kit tabbar 1.1.0. Phone bottom tab bar: 3 to 5 tabs, an optional raised primary
   tab in the middle, and a More tab that opens the sheet component. Shows below 860px.
   Behavior spec and numbers: README.md. Reads only --kit-* tokens (tokens/example.css).

   Changing the breakpoint: edit the one @media line below and the matching line in
   corner-stack/component.css. Media queries cannot read custom properties. */

.kit-tabbar { display: none; }

@media (max-width: 859px) {
  :root { --kit-tabbar-h: calc(var(--kit-tabbar-base, 62px) + env(safe-area-inset-bottom)); }
  body { padding-bottom: var(--kit-tabbar-h); }
  [data-kit-tabbar-replaces] { display: none !important; }   /* e.g. the header link row the bar replaces */

  .kit-tabbar {
    display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; align-items: stretch;
    position: fixed; inset: auto 0 0 0; z-index: var(--kit-z-bar, 56);
    height: var(--kit-tabbar-h); padding: 0 4px env(safe-area-inset-bottom);
    /* Frosted glass. The heavy blur keeps it readable: copy behind turns into soft
       color, never legible text. Solid fallbacks at the bottom of this file. */
    background: var(--kit-glass, rgba(12, 12, 15, .72));
    -webkit-backdrop-filter: blur(20px) saturate(160%); backdrop-filter: blur(20px) saturate(160%);
    border-top: 1px solid var(--kit-line, #26262e);   /* the one elevation cue: no shadow */
    font-family: var(--kit-font, inherit);
    transition: transform .42s var(--kit-ease, cubic-bezier(.16, 1, .3, 1)), visibility 0s linear 0s;
  }
  /* Tucked until component.js adds .is-shown. Only when JS runs: the head script sets
     html.kit-tb-js before first paint, so there is no flash and a no-JS view keeps the bar.
     A key-focused control inside keeps it up. */
  .kit-tb-js .kit-tabbar:not(.is-shown):not(:has(:focus-visible)) {
    transform: translateY(calc(100% + var(--kit-tab-rise, 34px)));
  }

  .kit-tab {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 5px;
    min-width: 0; padding: 0 0 11px; margin: 0;
    background: none; border: 0; font: inherit; cursor: pointer; text-decoration: none;
    color: var(--kit-mute, #9a9aa6); -webkit-tap-highlight-color: transparent;
    transition: color .2s ease;
  }
  .kit-tab-ic { display: block; flex: none; width: 22px; height: 22px; transition: transform .2s var(--kit-ease, cubic-bezier(.16, 1, .3, 1)); }
  .kit-tab-label { font-size: 12px; font-weight: var(--kit-weight-regular, 400); line-height: 1; letter-spacing: .01em; white-space: nowrap; }
  .kit-tab:hover, .kit-tab:active { color: var(--kit-text, #f2f2f4); }
  .kit-tab:active .kit-tab-ic { transform: scale(.88); }
  .kit-tab:focus-visible { outline: 2px solid var(--kit-accent, #4ec9dd); outline-offset: -4px; border-radius: 12px; }

  /* Current section: accent color plus a short bar along the top edge. */
  .kit-tab.is-current { color: var(--kit-accent, #4ec9dd); }
  .kit-tab.is-current::before {
    content: ""; position: absolute; top: -1px; left: 50%; width: 22px; height: 2px; margin-left: -11px;
    border-radius: 0 0 2px 2px; background: var(--kit-accent, #4ec9dd);
  }
  .kit-tab-more[aria-expanded="true"] { color: var(--kit-text, #f2f2f4); }

  /* The raised primary tab: a 50px accent disc that sticks up out of the bar. A negative
     margin lifts it, not a transform, so the bar keeps its height and the label stays on
     the same line as the others. */
  .kit-tab-disc {
    display: grid; place-items: center; flex: none;
    width: 50px; height: 50px; margin-top: -30px; margin-bottom: -2px; border-radius: 50%;
    background: var(--kit-accent, #4ec9dd); color: var(--kit-on-accent, #0b0b0e);
    box-shadow: 0 6px 16px -4px rgba(0, 0, 0, .6);
    transition: background .2s ease, transform .2s var(--kit-ease, cubic-bezier(.16, 1, .3, 1));
  }
  .kit-tab-primary .kit-tab-ic { width: 21px; height: 21px; }
  .kit-tab-primary:hover .kit-tab-disc, .kit-tab-primary:focus-visible .kit-tab-disc { background: var(--kit-accent-hover, #7ad8e7); }
  .kit-tab-primary:active .kit-tab-disc { transform: scale(.94); }
  .kit-tab-primary:active .kit-tab-ic { transform: none; }
  .kit-tab-primary.is-current::before { display: none; }
  .kit-tab-primary.is-current .kit-tab-label { color: var(--kit-accent, #4ec9dd); }
  .kit-tab-primary:not(.is-current) .kit-tab-label { color: var(--kit-text, #f2f2f4); }

  /* Typing on a phone: the keyboard pushes a fixed bar up over the form, so step aside
     while a text field has focus. */
  body:has(:is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="range"], [type="color"]), textarea, select, [contenteditable="true"]):focus) .kit-tabbar {
    transform: translateY(100%); visibility: hidden;
    transition: transform .3s var(--kit-ease, cubic-bezier(.16, 1, .3, 1)), visibility 0s linear .3s;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kit-tabbar, .kit-tab, .kit-tab-ic, .kit-tab-disc { transition: none !important; }
}
/* No blur support, or the visitor asked for less transparency: go solid. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .kit-tabbar { background: var(--kit-paper, #0e0e12); }
}
@media (prefers-reduced-transparency: reduce) {
  .kit-tabbar { background: var(--kit-paper, #0e0e12); -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media print { .kit-tabbar { display: none !important; } }