/* Property Scout — token layer. See DESIGN.md.
   Every colour, radius, duration and spacing value in this interface is defined here
   and nowhere else. A literal in another stylesheet is a bug. */

:root {
  color-scheme: dark light;

  /* ---- neutrals: dark is the composed default -------------------------- */
  --canvas: #14161a;
  --chrome: #0e1013;
  --surface: #1b1e24;
  --surface-raised: #23272f;
  --line: #2b3038;
  --line-strong: #3b424d;

  --ink: #e9ebee;
  --ink-2: #aab1bc;
  --ink-3: #8f97a2;   /* 5.07:1 on --surface-raised, the tightest background it lands on */

  /* The unfilled part of the score bar. Kept separate from --line-strong so it can
     be light enough to see against the canvas without weakening the divider hairlines. */
  --bar-track: #4a515d;

  /* ---- accent: brass. Primary action, current selection, focus. Never decoration. */
  --accent: #e0b341;
  --accent-ink: #14161a;
  --accent-quiet: #3a3218;

  /* ---- semantics ------------------------------------------------------- */
  --ok: #6cc296;          /* evidenced, complete, healthy */
  --ok-quiet: #17332a;
  --warn: #e8894f;        /* degraded, partial, stale */
  --warn-quiet: #3a2418;
  --risk: #ea6f65;        /* high risk, failed */
  --risk-quiet: #3a1e1d;
  --held: #a892dd;        /* interrupted, cancelled, paused */
  --held-quiet: #2b2440;

  --focus: #e0b341;
  --selection: #3a3218;

  /* ---- type ------------------------------------------------------------ */
  --font-sans: "IBM Plex Sans", ui-sans-serif, system-ui, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", "Consolas", monospace;

  --t-meta: 1rem;
  --t-sm: 1rem;
  --t-body: 1rem;
  --t-md: 1.5rem;
  --t-lg: 1.5rem;
  --t-xl: 2rem;
  --t-2xl: 2.5rem;

  --lh-meta: 1.45;
  --lh-sm: 1.5;
  --lh-body: 1.6;
  --lh-md: 1.45;
  --lh-lg: 1.3;
  --lh-xl: 1.25;
  --lh-2xl: 1.15;

  --w-regular: 400;
  --w-medium: 500;
  --w-semibold: 600;
  --track-tight: -0.02em;

  /* ---- space: 4-unit base ---------------------------------------------- */
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 24px;
  --s6: 32px;
  --s7: 48px;
  --s8: 64px;

  /* ---- map ------------------------------------------------------------- */
  /* The island is ground, not subject: it sits a step above the canvas and is read as shape,
     never as colour. The five-step ramp is the asking rate, cool where it is cheap and brass
     where it is dear; it stops short of --accent so the deal score stays the brightest thing
     on any page. */
  --map-land: #191c21;
  --map-coast: #333a44;
  --map-q1: #2f4756;
  --map-q2: #3f6b63;
  --map-q3: #6e7a45;
  --map-q4: #9c7c37;
  --map-q5: #b8913a;
  --map-pin: #cfd6e0;

  /* ---- shape ----------------------------------------------------------- */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-pill: 999px;

  /* ---- motion ---------------------------------------------------------- */
  --dur: 180ms;
  --dur-slow: 240ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);

  /* ---- elevation: offset and blur, never a zero-offset halo ------------- */
  --shadow-modal: none;
  --shadow-rail: 1px 0 0 0 var(--line);

  /* ---- layout ---------------------------------------------------------- */
  --rail-w: 268px;
  --measure: 68ch;
}

/* Light is composed, not inverted: cool mineral neutrals, darker brass, cooler ink.
   Applied by preference, and overridden either way by the explicit toggle. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --canvas: #f3f5f7;
    --chrome: #e8ecf0;
    --surface: #ffffff;
    --surface-raised: #f8fafc;
    --line: #d9dfe5;
    --line-strong: #b9c2cc;

    --ink: #191b1f;
    --ink-2: #545b66;
    --ink-3: #5f6771;   /* 4.65:1 on --chrome, the tightest background it lands on */
    --bar-track: #cbd3dc;

    --accent: #8a6410;
    --accent-ink: #ffffff;
    --accent-quiet: #f6ecd4;

    --ok: #1e7a52;
    --ok-quiet: #e2f2ea;
    --warn: #9a4f14;
    --warn-quiet: #fceee2;
    --risk: #a63127;
    --risk-quiet: #fbe8e6;
    --held: #5b458f;
    --held-quiet: #ece7f7;

    --focus: #8a6410;
    --selection: #f6ecd4;

    --map-land: #ffffff;
    --map-coast: #aeb8c2;
    --map-q1: #9fc0d0;
    --map-q2: #93c3ad;
    --map-q3: #c9c689;
    --map-q4: #d9bd77;
    --map-q5: #c79a41;
    --map-pin: #3a424d;

    --shadow-modal: none;
  }
}

:root[data-theme="light"] {
  --canvas: #f3f5f7;
  --chrome: #e8ecf0;
  --surface: #ffffff;
  --surface-raised: #f8fafc;
  --line: #d9dfe5;
  --line-strong: #b9c2cc;

  --ink: #191b1f;
  --ink-2: #545b66;
  --ink-3: #5f6771;
  --bar-track: #cbd3dc;

  --accent: #8a6410;
  --accent-ink: #ffffff;
  --accent-quiet: #f6ecd4;

  --ok: #1e7a52;
  --ok-quiet: #e2f2ea;
  --warn: #9a4f14;
  --warn-quiet: #fceee2;
  --risk: #a63127;
  --risk-quiet: #fbe8e6;
  --held: #5b458f;
  --held-quiet: #ece7f7;

  --focus: #8a6410;
  --selection: #f6ecd4;

  --map-land: #ffffff;
  --map-coast: #aeb8c2;
  --map-q1: #9fc0d0;
  --map-q2: #93c3ad;
  --map-q3: #c9c689;
  --map-q4: #d9bd77;
  --map-q5: #c79a41;
  --map-pin: #3a424d;

  --shadow-modal: none;
}

:root { --print-ink: #191b1f; --print-paper: #ffffff; }
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }