/* Design tokens. Every colour, size and weight in the application comes from this file, so a
   sixteen agent crew looks like one product rather than sixteen weekend projects.

   Light is defined on :root. Dark redefines only the values that change, under both the system
   preference and an explicit choice, so the toggle wins in either direction. */

:root {
  color-scheme: light;

  /* Surfaces, from the page backwards to the deepest inset */
  --ground: #f6f6f4;
  --surface: #ffffff;
  --surface-sunken: #f1f1ee;
  --surface-raised: #ffffff;
  --overlay: rgba(23, 23, 21, 0.38);

  /* Ink */
  --ink: #17171a;
  --ink-soft: #55555e;
  --ink-faint: #85858f;
  --ink-inverse: #ffffff;

  /* Lines */
  --line: #e2e2dd;
  --line-strong: #cfcfc8;

  /* Accent and semantics */
  --accent: #2f4bd8;
  --accent-hover: #2439ac;
  --accent-wash: #eef1fe;
  --accent-line: #c6d0fb;

  --positive: #10714b;
  --positive-wash: #e6f4ee;
  --positive-line: #b4ddc9;

  --caution: #8a5a06;
  --caution-wash: #fdf2dd;
  --caution-line: #f0d7a4;

  --critical: #a52020;
  --critical-wash: #fdeceb;
  --critical-line: #f3c3bf;

  --neutral-wash: #f1f1ee;

  /* Priority ramp, used by ranked lists so the eye sorts before the number is read */
  --rank-1: #a52020;
  --rank-2: #b8641a;
  --rank-3: #8a7207;
  --rank-4: #4a6b3a;

  /* Type */
  --font: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --text-3xl: 1.75rem;
  --text-2xl: 1.375rem;
  --text-xl: 1.125rem;
  --text-lg: 1rem;
  --text-base: 0.9375rem;
  --text-sm: 0.8125rem;
  --text-xs: 0.75rem;

  --leading-tight: 1.2;
  --leading-snug: 1.4;
  --leading-normal: 1.6;

  --weight-regular: 400;
  --weight-medium: 520;
  --weight-semibold: 620;

  --tracking-tight: -0.014em;
  --tracking-wide: 0.06em;

  /* Space, on a four pixel grid */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;

  /* Shape */
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(23, 23, 21, 0.06), 0 1px 1px rgba(23, 23, 21, 0.04);
  --shadow: 0 2px 6px rgba(23, 23, 21, 0.07), 0 8px 24px rgba(23, 23, 21, 0.06);
  --shadow-lg: 0 12px 40px rgba(23, 23, 21, 0.14);

  /* Layout */
  --nav-width: 244px;
  --rail-width: 320px;
  --header-height: 56px;
  --measure: 68ch;

  --speed: 140ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --ground: #111113;
    --surface: #1a1a1d;
    --surface-sunken: #141416;
    --surface-raised: #212125;
    --overlay: rgba(0, 0, 0, 0.6);

    --ink: #f2f2f0;
    --ink-soft: #a9a9b2;
    --ink-faint: #77777f;
    --ink-inverse: #111113;

    --line: #2b2b30;
    --line-strong: #3c3c43;

    --accent: #8ea2ff;
    --accent-hover: #a5b5ff;
    --accent-wash: #1b1f3a;
    --accent-line: #333b63;

    --positive: #6ed3a6;
    --positive-wash: #142a22;
    --positive-line: #26503f;

    --caution: #e9bd6a;
    --caution-wash: #2b2110;
    --caution-line: #56421c;

    --critical: #f39189;
    --critical-wash: #2e1614;
    --critical-line: #5c2b26;

    --neutral-wash: #212125;

    --rank-1: #f39189;
    --rank-2: #edac74;
    --rank-3: #ddc76d;
    --rank-4: #9cc98c;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow: 0 2px 6px rgba(0, 0, 0, 0.45), 0 10px 30px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.55);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;

  --ground: #111113;
  --surface: #1a1a1d;
  --surface-sunken: #141416;
  --surface-raised: #212125;
  --overlay: rgba(0, 0, 0, 0.6);

  --ink: #f2f2f0;
  --ink-soft: #a9a9b2;
  --ink-faint: #77777f;
  --ink-inverse: #111113;

  --line: #2b2b30;
  --line-strong: #3c3c43;

  --accent: #8ea2ff;
  --accent-hover: #a5b5ff;
  --accent-wash: #1b1f3a;
  --accent-line: #333b63;

  --positive: #6ed3a6;
  --positive-wash: #142a22;
  --positive-line: #26503f;

  --caution: #e9bd6a;
  --caution-wash: #2b2110;
  --caution-line: #56421c;

  --critical: #f39189;
  --critical-wash: #2e1614;
  --critical-line: #5c2b26;

  --neutral-wash: #212125;

  --rank-1: #f39189;
  --rank-2: #edac74;
  --rank-3: #ddc76d;
  --rank-4: #9cc98c;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow: 0 2px 6px rgba(0, 0, 0, 0.45), 0 10px 30px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.55);
}
