/*
 * Stacking layers.
 *
 * Only the bands that components have to agree on live here. Ordering *inside*
 * a component — a gradient behind its own text, a badge over its own avatar —
 * stays a plain 0/1/2 in that component's stylesheet, because naming a token
 * for it would imply a cross-component contract that does not exist.
 *
 * The gaps between bands are deliberate. A component that needs to sit just
 * above its band says so with calc() against the band it belongs to, which
 * keeps the relationship legible instead of encoding it as a bare 23.
 */

:root {
  /* Sticky application chrome: app bars, pinned rows, and hover cards that
     float within a scroll region but below anything modal. */
  --sigvelo-z-chrome: 20;

  /* Drag affordances — resize handles, splitters — which have to stay grabbable
     above the chrome they resize. */
  --sigvelo-z-panel: 25;

  /* Base UI popups: dialog, alert dialog, popover, menu, tooltip, preview card.
     One band for all of them, because the library already resolves their order
     among themselves by mount order. */
  --sigvelo-z-overlay: 50;

  /* Toasts outrank overlays: a toast reporting the result of a dialog action
     has to be readable while that dialog is still closing. */
  --sigvelo-z-toast: 100;

  /*
   * Overlays drawn on top of a host page this design system does not control —
   * a browser control surface injected into someone else's document. Max int is
   * not a layer, it is a concession that we cannot see the other stylesheet.
   * Nothing that renders inside our own tree may use it.
   *
   * Recorded here so the value has one documented home, but such a surface
   * cannot actually reference it: it mounts in a closed shadow root where this
   * sheet does not exist, so var() would resolve to nothing and z-index would
   * silently fall back to auto. Those stylesheets inline the number instead.
   */
  --sigvelo-z-host-overlay: 2147483647;
}