/* Clubhouse — design tokens (SPEC §7.1–7.4). Direction B "Performance".
   Custom properties, @font-face and the reduced-motion switch only. */

/* Barlow Condensed — self-hosted latin subset (OFL). Covers U+2212 minus, U+00B7 middle dot, dashes. */
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/barlow-condensed-600.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/barlow-condensed-700.woff2") format("woff2");
}
/* Barlow (body) — SLOT. Drop barlow-400/500/600/700.woff2 (latin, OFL) into fonts/, uncomment,
   and run `node scripts/precache.mjs` so the service worker caches them. Until then the body
   face falls back to the platform UI font (SF Pro on iPhone), which is metrically close.
@font-face { font-family: "Barlow"; font-weight: 400; font-display: swap; src: url("../fonts/barlow-400.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 500; font-display: swap; src: url("../fonts/barlow-500.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 600; font-display: swap; src: url("../fonts/barlow-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 700; font-display: swap; src: url("../fonts/barlow-700.woff2") format("woff2"); }
*/

:root {
  /* colour — verbatim from the mock */
  --bg: #0a0c0f;
  --surface: #14181d;
  --surface-2: #1b2027;
  --surface-3: #232a32;
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.16);
  --ink: #f5f7f9;
  --ink-2: #a7b0ba;
  --ink-3: #6e7883;
  --volt: #d4ff3f;
  --volt-dim: rgba(212, 255, 63, 0.16);
  --volt-line: rgba(212, 255, 63, 0.35);
  --on-volt: #0a0c0f;
  --amber: #ffb547;
  --amber-dim: rgba(255, 181, 71, 0.16);
  --amber-line: rgba(255, 181, 71, 0.35);
  --track: rgba(255, 255, 255, 0.11);

  /* type */
  --display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --body: "Barlow", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "Helvetica Neue", Arial, sans-serif;

  /* radii */
  --r-card: 22px;
  --r-inner: 16px;
  --r-stat: 14px;
  --r-glyph: 12px;
  --r-chip: 999px;

  /* layout + safe areas (§7.4) */
  --gutter: 16px;
  --sat: env(safe-area-inset-top, 0px);
  --sab: max(env(safe-area-inset-bottom, 0px), 34px);
  --sal: env(safe-area-inset-left, 0px);
  --sar: env(safe-area-inset-right, 0px);
  --nav-h: 56px;
  --fab-h: 50px;

  /* motion (§7.5) */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);

  color-scheme: dark;
}

/* Reduced motion — the mock's block, verbatim, plus the shadow pulse off. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001s !important;
    animation-delay: 0s !important;
    transition-duration: 0.001s !important;
    transition-delay: 0s !important;
  }
  .rise { opacity: 1; transform: none; animation: none; }
  .pop { animation: none; }
}