/* ============================================================================
 * Disambi — canonical design tokens (single source of truth)
 * Dark-Editorial direction. Loaded once via base.html, before page CSS.
 *
 * Holds the core color tokens (previously redeclared in every page stylesheet)
 * plus the editorial scale tokens (radius / type / tracking / motion / shadow)
 * that page CSS and components.css actually reference. Add a scale token here
 * when the first rule needs it — not before.
 *
 * Semantic status colors (--ok / --warn / --danger families) are the §2.1
 * muted palette, centralized here (were redeclared identically across
 * dashboard / messaging / signup).
 * ========================================================================== */

:root {
  /* ---- Foundation surfaces ---- */
  --bg-primary: #0A0A0A;
  --bg-elevated: #141414;
  --bg-subtle: #1A1A1A;

  /* ---- Borders ---- */
  --border-subtle: #262626;
  --border-hover: rgba(255, 106, 0, 0.35);

  /* ---- Text ---- */
  --text-primary: #FFFFFF;
  --text-secondary: #B8B0A4;
  --text-tertiary: #7A7368;

  /* ---- Brand / copper ---- */
  --copper: #FF6A00;
  /* Copper and the label blue as INK, i.e. carrying text.
     Both are fine on the near-black page and neither survives cream: measured
     across /, /login/, /waitlist/ and /creators/, every copper or blue text
     element in light mode failed AA — nav links, prices, "Verified" badges,
     the headline accent. Backgrounds, borders and icons keep plain --copper
     and #007BFF; only glyphs use these. Light values in luxury.css. */
  --copper-ink: var(--copper);
  --blue-ink: #3391FF;
  --copper-hover: #e05e00;
  --copper-tint: rgba(255, 106, 0, 0.10);
  --copper-border: rgba(255, 106, 0, 0.30);

  /* ---- Editorial scales (only the tokens actually referenced) ---- */

  /* Radius — editorial precision: square everything. */
  --radius: 0;

  /* Type scale */
  --type-xs: 0.75rem;
  --type-3xl: 2.25rem;
  --type-4xl: 3rem;

  /* Letter-spacing */
  --track-tight: -0.01em;  /* large display headlines */
  --track-wide: 0.12em;    /* eyebrows */
  --track-btn: 0.2em;      /* buttons */
  --track-label: 0.25em;   /* uppercase editorial labels */

  /* Line-height */
  --leading-tight: 0.9;    /* compressed hero headlines */

  /* Motion — product (fast) vs marketing (cinematic) */
  --motion-fast: 200ms;        /* product / UI feedback */
  --motion-press: 160ms;       /* touch press: how fast a press lands (see --motion-release for letting go) */
  --ease-press: cubic-bezier(0.23, 1, 0.32, 1); /* strong ease-out: moves the instant a finger lands */
  --motion-release: 600ms;     /* the press tapers off after the finger lifts */
  --ease-release: cubic-bezier(0.33, 1, 0.68, 1); /* ease-out-cubic: a visible, even fade back */
  --motion-linger: 900ms;      /* decorative marketing presses fade out slower still */
  --ease-linger: cubic-bezier(0.45, 0, 0.55, 1); /* ease-in-out: holds a beat, then fades */
  --motion-base: 300ms;
  --motion-slow: 700ms;        /* color & background reveals */
  --motion-cinematic: 1800ms;  /* marketing image reveals */
  --ease-lux: cubic-bezier(0.25, 0.46, 0.45, 0.94);

  /* Shadows — copper-tinted soft (spec matte rule; pure-black reads flat on #0A0A0A) */
  --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.20);
  --shadow-card-hover: 0 8px 24px rgba(255, 106, 0, 0.18);
  --shadow-hover: 0 8px 24px rgba(255, 106, 0, 0.25); /* consolidated from landing / how_it_works */

  /* ---- Semantic status (§2.1 muted palette) ---- */
  /* Base hex is the single source; tints/borders derive via rgb(from …). */
  --ok: #4A9B6E;
  --ok-tint: rgb(from var(--ok) r g b / 0.12);
  --warn: #C8943C;
  --warn-tint: rgb(from var(--warn) r g b / 0.12);
  --danger: #B5443A;
  --danger-tint: rgb(from var(--danger) r g b / 0.12);
  --danger-text: #D8645A;  /* AA-legible (5.5:1) for danger TEXT; matte --danger is fills/borders only */
}

/* Reduce Motion: presses still show, but release without a long fade. */
@media (prefers-reduced-motion: reduce) {
  :root { --motion-release: 160ms; --motion-linger: 160ms; }
}