/* FlexTrust Kinetic design tokens (docs/DESIGN.md; architecture inherited
   from the FlexYield handover, docs/bridge/design). Two user-switchable
   seams: dark (default, emerald) and light (deep teal, body.ft-light).
   Every color in the app must route through these tokens; alpha variants
   are derived with color-mix — never hardcoded rgba twins. This file
   loads last (Propshaft alphabetical order), so it owns the cascade. */

body {
  /* dark seam */
  --bg: #0B0E1A;
  --surface: #111827;
  --band: rgba(17, 24, 39, 0.55);
  --nav-bg: rgba(11, 14, 26, 0.72);
  --input-bg: rgba(11, 14, 26, 0.7);
  --ink: #F1F5F9;
  --ink2: #94A3B8;
  --ink3: #64748B;
  --line: #FFFFFF;
  --accent: #10D9A0;
  --accent-hov: #3BE3B4;
  --on-accent: #0B0E1A;
  --ok: #4ADE80;
  --warn: #FBBF24;
  --err: #F87171;
  --shadow-c: rgba(0, 0, 0, 0.5);
  --code-bg: rgba(0, 0, 0, 0.45);
  --code-ink: rgba(241, 245, 249, 0.9);

  color-scheme: dark;
}

/* The landing page sits on a deeper black in the dark seam. */
body.landing { --bg: #060812; }

/* Light seam keys off html[data-seam] (single pre-paint source of truth;
   seam-bug fix 2026-08-21 — the head script sets it before first paint,
   seam_controller writes the same attribute). body.ft-light kept as an
   alias during the transition so nothing regresses if it reappears. */
html[data-seam="light"] body,
body.ft-light {
  --bg: #F6F5FB;
  --surface: #FFFFFF;
  /* Was #ECECF1 — a cool neutral that read grubby against the
     lavender --bg (handoff 2 §3, approved 2026-08-22). */
  --band: oklch(0.945 0.012 300);
  --nav-bg: rgba(255, 255, 255, 0.8);
  --input-bg: #FFFFFF;
  --ink: #191B1F;
  --ink2: #6E7076;
  --ink3: #9A9CA3;
  --line: #191B1F;
  --accent: #0F766E;
  --accent-hov: #14957F;
  --on-accent: #FFFFFF;
  --ok: #15803D;
  --warn: #D97706;
  --err: #DC2626;
  --shadow-c: rgba(25, 27, 31, 0.15);
  /* code blocks intentionally stay dark in the light seam */
  --code-bg: #0F1D1B;
  --code-ink: rgba(255, 255, 255, 0.88);

  color-scheme: light;
}

/* Landing, light seam (SETTLED 2026-08-21, DECISIONS.md): was #FFFFFF,
   which read clinical against the emerald/teal accents. Faint lavender
   at the same lightness — a cast, not a colour; ties to the #F6F5FB
   violet on the other light-seam pages. --surface stays #FFFFFF. */
html[data-seam="light"] body.landing,
body.ft-light.landing {
  --bg: oklch(0.982 0.009 300);
  --band: oklch(0.952 0.012 300);
}

/* Derived tints shared across components (color-mix, no rgba twins). */
body {
  --line-4: color-mix(in srgb, var(--line) 4%, transparent);
  --line-8: color-mix(in srgb, var(--line) 8%, transparent);
  --line-10: color-mix(in srgb, var(--line) 10%, transparent);
  --line-18: color-mix(in srgb, var(--line) 18%, transparent);
  --accent-08: color-mix(in srgb, var(--accent) 8%, transparent);
  --accent-14: color-mix(in srgb, var(--accent) 14%, transparent);
  --accent-35: color-mix(in srgb, var(--accent) 35%, transparent);

  --font-display: "Cabinet Grotesk", ui-sans-serif, "Helvetica Neue", sans-serif;
  --font-body: "Satoshi", ui-sans-serif, "Helvetica Neue", sans-serif;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
}