/* ui/tokens.css — shared shell design tokens: studio, editor, login, tenant chrome, tour.
   One source of truth for type, color, radius, elevation and motion on every non-widget
   surface. Widget bodies (deck/walbi.css) keep their measured app.walbi.com fidelity
   values; the Billy product has its own contract in tenant/billy.css (--b-* namespace). */
:root {
  color-scheme: dark;

  /* type — one family, 7 sizes, 4 weights */
  --font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fs-micro: 10px;                            /* uppercase micro-labels, tags */
  --fs-caption: 11px;                          /* captions, badges, hints */
  --fs-small: 12px;                            /* secondary rows, chips */
  --fs-ui: 13px;                               /* controls, copy inside cards */
  --fs-body: 14px;                             /* base UI text */
  --fs-title: 17px;                            /* sheet/section titles */
  --fs-display: clamp(25px, 12px + 2vw, 28px); /* brand marks, launch domain */
  --w-reg: 400; --w-semi: 600; --w-bold: 700; --w-black: 800;
  --ls-caps: .08em;                            /* tracking for uppercase micro-labels */

  /* color — layered dark surfaces, one accent, trading-stable status hues */
  --bg: #0b0c10;          /* page + input wells */
  --bg-raised: #0d0f14;   /* bars, rails */
  --bg-card: #0f1117;     /* cards, sheets, popovers */
  --bg-control: #11141b;  /* buttons, inputs on raised surfaces */
  --bg-hover: #191e27;    /* hover fill on flat controls */
  --line: #16181f;        /* page hairlines */
  --line-card: #20222b;   /* card borders */
  --line-control: #262a33;/* control borders */
  --line-strong: #39414f; /* hovered control borders */
  --txt-bright: #f3f5fa;
  --txt: #e9eaee;
  --txt-soft: #aeb6c5;
  --txt-dim: #8a8f9a;
  --txt-faint: #6c7280;
  --accent: #5b8cff;      /* studio default; tenant brands override at runtime */
  --accent-hover: #6f9bff;
  --accent-text: #9fc2ff; /* readable accent for links and info text */
  --accent-tint: #cfe0ff; /* text on accent-tinted controls */
  --ok: #86e29a;
  --err: #ff9aa6;
  --warn: #eab85d;
  --host: #ffd166;        /* co-trading room host highlight */
  --overlay: rgba(4, 5, 8, .7);

  /* radius — 5 surface radii + pill */
  --r-xs: 6px;   /* chips, swatches, tags */
  --r-sm: 8px;   /* inner controls, icon buttons */
  --r-md: 10px;  /* buttons, inputs, tabs */
  --r-lg: 14px;  /* cards, popovers, tiles */
  --r-xl: 20px;  /* sheets, modals */
  --r-pill: 999px;

  /* elevation */
  --shadow-pin: 0 1px 5px rgba(0, 0, 0, .45);     /* cursor pins, tags */
  --shadow-lift: 0 10px 24px rgba(0, 0, 0, .4);   /* hover lift */
  --shadow-float: 0 16px 46px rgba(0, 0, 0, .45); /* floating cards, toasts */
  --shadow-pop: 0 20px 52px rgba(0, 0, 0, .55);   /* popovers, modals */

  /* motion */
  --t-fast: .12s;
  --t-med: .2s;
  --ease-pop: cubic-bezier(.16, 1, .3, 1);

  /* layout */
  --bar-h: 68px; /* top bar / toolbar height */
}
@media (max-width: 820px) { :root { --bar-h: 60px; } }

/* the hidden attribute always wins — author display rules must not resurrect hidden elements */
[hidden] { display: none !important; }

/* touch: no 300ms double-tap delay on controls, no default grey tap flash */
html { -webkit-tap-highlight-color: transparent; }
a, button, select, label { touch-action: manipulation; }
