/* =========================================================
   Nondominium Design System — Design Tokens
   ---------------------------------------------------------
   Extraction source: source scan of ../nondominium/ui/src
   (frequency-ranked literal colors), confirmed against
   uno.config.ts (presetUno → Tailwind default palette).
   Confidence: HIGH for the gray canvas and the blue primary
   (blue-600/700 is the dominant action color, 16+16 hits);
   MEDIUM for the domain families, which are read off the
   badge variants in registry/ rather than the app.

   RGB triplets throughout, so every token composes with an
   alpha channel:  rgb(var(--ndo-primary-500) / 0.4)
   ========================================================= */

:root {
  color-scheme: light;


  /* =========================================================
     BRAND
     ---------------------------------------------------------
     Sampled from nondominium_logo.png. These are the only
     values in this file that are a brand decision rather than
     a Tailwind default: the app itself has no brand layer, so
     they dress the design system's own chrome and nothing
     inside the /app replica.

     The mark is three linked nodes in teal, violet and blue
     over a near-black navy wordmark. Teal is the largest area,
     so it leads.
     ========================================================= */
  --ndo-brand-teal-100:  212 246 245;
  --ndo-brand-teal-300:   95 214 210;
  --ndo-brand-teal-500:   20 184 184;   /* #14b8b8 — the mark's dominant hue */
  --ndo-brand-teal-700:   14 138 138;

  --ndo-brand-violet-100: 231 222 251;
  --ndo-brand-violet-300: 155 123 234;
  --ndo-brand-violet-500: 112  72 216;  /* #7048d8 */
  --ndo-brand-violet-700:  82  50 171;

  --ndo-brand-blue-100:   214 227 249;
  --ndo-brand-blue-300:   109 154 228;
  --ndo-brand-blue-500:    47 107 204;  /* #2f6bcc */
  --ndo-brand-blue-700:    35  80 155;

  /* The wordmark's navy. The design-system rail and footer use it. */
  --ndo-brand-ink:         11  26  56;  /* #0b1a38 */
  --ndo-brand-ink-soft:    22  39  76;

  /* The mark reads left-to-right teal → violet; the gradient repeats that. */
  --ndo-brand-gradient: linear-gradient(
    135deg,
    rgb(var(--ndo-brand-teal-500)),
    rgb(var(--ndo-brand-blue-500)) 55%,
    rgb(var(--ndo-brand-violet-500))
  );

  /* =========================================================
     APP PRIMARY — the action color
     Nondominium has no logo-derived brand hue. The app's
     dominant action color is Tailwind blue; it is promoted
     here to the primary scale so components stop reaching
     for `blue-*` directly.
     ========================================================= */
  --ndo-primary-50:  239 246 255;
  --ndo-primary-100: 219 234 254;
  --ndo-primary-200: 191 219 254;
  --ndo-primary-300: 147 197 253;
  --ndo-primary-400:  96 165 250;
  --ndo-primary-500:  59 130 246;
  --ndo-primary-600:  37  99 235;
  --ndo-primary-700:  29  78 216;
  --ndo-primary-800:  30  64 175;
  --ndo-primary-900:  30  58 138;

  /* =========================================================
     BASE GRAY SCALE — the canvas
     ========================================================= */
  --ndo-gray-50:  249 250 251;
  --ndo-gray-100: 243 244 246;
  --ndo-gray-200: 229 231 235;
  --ndo-gray-300: 209 213 219;
  --ndo-gray-400: 156 163 175;
  --ndo-gray-500: 107 114 128;
  --ndo-gray-600:  75  85  99;
  --ndo-gray-700:  55  65  81;
  --ndo-gray-800:  31  41  55;
  --ndo-gray-900:  17  24  39;
  --ndo-gray-950:   9  12  20;

  /* =========================================================
     LIFECYCLE STAGE COLORS
     One family per stage of the NDO lifecycle. The ordering
     runs cool (early) → warm (late) → red (terminal), so a
     stage badge reads as maturity without reading the label.
     ========================================================= */
  /* Slate — Ideation (uses the gray scale) */
  /* Indigo — Specification, Development */
  --ndo-indigo-50:  238 242 255;
  --ndo-indigo-100: 224 231 255;
  --ndo-indigo-300: 165 180 252;
  --ndo-indigo-700:  67  56 202;

  /* Amber — Prototype */
  --ndo-amber-50:  255 251 235;
  --ndo-amber-100: 254 243 199;
  --ndo-amber-300: 252 211  77;
  --ndo-amber-600: 217 119   6;
  --ndo-amber-700: 180  83   9;
  --ndo-amber-800: 146  64  14;

  /* Green — Stable */
  --ndo-green-50:  240 253 244;
  --ndo-green-100: 220 252 231;
  --ndo-green-300: 134 239 172;
  --ndo-green-600:  22 163  74;
  --ndo-green-700:  21 128  61;

  /* Teal — Distributed */
  --ndo-teal-50:  240 253 250;
  --ndo-teal-100: 204 251 241;
  --ndo-teal-700:  15 118 110;

  /* Emerald — Active */
  --ndo-emerald-50:  236 253 245;
  --ndo-emerald-100: 209 250 229;
  --ndo-emerald-600:   5 150 105;
  --ndo-emerald-700:   4 120  87;

  /* Yellow — Hibernating */
  --ndo-yellow-50:  254 252 232;
  --ndo-yellow-100: 254 249 195;
  --ndo-yellow-300: 253 224  71;
  --ndo-yellow-700: 161  98   7;

  /* Orange — Deprecated */
  --ndo-orange-50:  255 247 237;
  --ndo-orange-100: 255 237 213;
  --ndo-orange-300: 253 186 116;
  --ndo-orange-600: 234  88  12;
  --ndo-orange-700: 194  65  12;

  /* Red — EndOfLife, destructive */
  --ndo-red-50:  254 242 242;
  --ndo-red-100: 254 226 226;
  --ndo-red-200: 254 202 202;
  --ndo-red-300: 252 165 165;
  --ndo-red-600: 220  38  38;
  --ndo-red-700: 185  28  28;

  /* =========================================================
     RESOURCE NATURE COLORS
     ========================================================= */
  /* Blue — Physical (shares the primary scale's hue family) */
  --ndo-blue-50:  239 246 255;
  --ndo-blue-100: 219 234 254;
  --ndo-blue-300: 147 197 253;
  --ndo-blue-600:  37  99 235;
  --ndo-blue-700:  29  78 216;
  --ndo-blue-800:  30  64 175;

  /* Purple — Digital */
  --ndo-purple-50:  245 243 255;
  --ndo-purple-100: 237 233 254;
  --ndo-purple-300: 216 180 254;
  --ndo-purple-700: 109  40 217;

  /* Sky — Service */
  --ndo-sky-50:  240 249 255;
  --ndo-sky-100: 224 242 254;
  --ndo-sky-700:   3 105 161;

  /* Teal — Hybrid (shares the Distributed family) */
  /* Indigo — Information (shares the Specification family) */

  /* =========================================================
     PROPERTY REGIME COLORS
     ========================================================= */
  /* Emerald — Nondominium (the regime the project is named for) */
  /* Cyan — Commons */
  --ndo-cyan-50:  236 254 255;
  --ndo-cyan-100: 207 250 254;
  --ndo-cyan-300: 103 232 249;
  --ndo-cyan-700:  14 116 144;

  /* Violet — Collective */
  --ndo-violet-50:  245 243 255;
  --ndo-violet-100: 237 233 254;
  --ndo-violet-300: 196 181 253;
  --ndo-violet-700: 109  40 217;

  /* Rose — CommonPool */
  --ndo-rose-50:  255 241 242;
  --ndo-rose-100: 255 228 230;
  --ndo-rose-300: 253 164 175;
  --ndo-rose-700: 190  18  60;

  /* Sky — Public, the seventh regime. Added 2026-09-08 with #132: the app's own
     NdoBrowser paints Public with sky, and the registry had no such family. */
  --ndo-sky-300: 125 211 252;

  /* The 300 shades below existed only as references until 2026-09-08. Five of the
     six regime filter chips named a `-300` border colour that tokens.css never
     defined, so `rgb(var(--ndo-cyan-300))` resolved to an invalid value, the whole
     border-color declaration was dropped, and the chips fell back to the base
     `1px solid transparent`. Only `regime-private-filter` had a visible border,
     because gray-300 happened to exist. Nothing caught it: the fidelity check
     compares class tokens in markup and never resolves a custom property, and a
     missing border looks like a design choice rather than a defect. */
  --ndo-emerald-300: 110 231 183;
  --ndo-teal-300:    94 234 212;

  /* Gray — Private, Pool (fall back to the canvas scale) */

  /* =========================================================
     SEMANTIC INTENT
     Aliases, so a component asks for meaning rather than hue.
     ========================================================= */
  --ndo-intent-info:    var(--ndo-primary-600);
  --ndo-intent-success: var(--ndo-emerald-600);
  --ndo-intent-warning: var(--ndo-amber-600);
  --ndo-intent-danger:  var(--ndo-red-600);

  /* =========================================================
     SEMANTIC SURFACE
     ========================================================= */
  --ndo-color-bg-app:         rgb(var(--ndo-gray-100));
  --ndo-color-surface:        rgb(var(--ndo-gray-50));
  --ndo-color-card-bg:        255 255 255;
  --ndo-color-border:         rgb(var(--ndo-gray-200));
  --ndo-color-border-subtle:  rgb(var(--ndo-gray-100));
  --ndo-color-border-strong:  rgb(var(--ndo-gray-300));
  --ndo-color-text-primary:   rgb(var(--ndo-gray-900));
  --ndo-color-text-secondary: rgb(var(--ndo-gray-600));
  --ndo-color-text-muted:     rgb(var(--ndo-gray-500));
  --ndo-color-text-mono:      rgb(var(--ndo-gray-400));
  --ndo-color-text-inverse:   255 255 255;
  --ndo-color-link:           rgb(var(--ndo-primary-600));
  --ndo-color-overlay:        rgb(var(--ndo-gray-900) / 0.45);

  /* Focus ring — one definition, every interactive element */
  --ndo-focus-ring: 0 0 0 3px rgb(var(--ndo-primary-500) / 0.45);

  /* =========================================================
     TYPOGRAPHY
     ========================================================= */
  --ndo-font-sans: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --ndo-font-mono: ui-monospace, 'JetBrains Mono', SFMono-Regular, Menlo, Consolas, monospace;

  --ndo-text-xs:   0.75rem;   /* 12px */
  --ndo-text-sm:   0.875rem;  /* 14px */
  --ndo-text-base: 1rem;      /* 16px */
  --ndo-text-lg:   1.125rem;  /* 18px */
  --ndo-text-xl:   1.25rem;   /* 20px */
  --ndo-text-2xl:  1.5rem;    /* 24px */
  --ndo-text-3xl:  1.875rem;  /* 30px */

  --ndo-lh-xs:   1rem;
  --ndo-lh-sm:   1.25rem;
  --ndo-lh-base: 1.5rem;
  --ndo-lh-lg:   1.75rem;
  --ndo-lh-xl:   1.75rem;
  --ndo-lh-2xl:  2rem;
  --ndo-lh-3xl:  2.25rem;

  --ndo-weight-normal:   400;
  --ndo-weight-medium:   500;
  --ndo-weight-semibold: 600;
  --ndo-weight-bold:     700;

  /* =========================================================
     SPACING
     ========================================================= */
  --ndo-spacing-0-5: 0.125rem;  /* 2px  */
  --ndo-spacing-1:   0.25rem;   /* 4px  */
  --ndo-spacing-1-5: 0.375rem;  /* 6px  */
  --ndo-spacing-2:   0.5rem;    /* 8px  */
  --ndo-spacing-3:   0.75rem;   /* 12px */
  --ndo-spacing-4:   1rem;      /* 16px */
  --ndo-spacing-5:   1.25rem;   /* 20px */
  --ndo-spacing-6:   1.5rem;    /* 24px */
  --ndo-spacing-8:   2rem;      /* 32px */
  --ndo-spacing-12:  3rem;      /* 48px */

  /* =========================================================
     RADII
     Nondominium is a rectangular system: 8px is the base for
     cards and controls, pill is reserved for badges and dots.
     ========================================================= */
  --ndo-radius-sm:   0.25rem;   /* 4px  */
  --ndo-radius-md:   0.375rem;  /* 6px  */
  --ndo-radius-lg:   0.5rem;    /* 8px — the base */
  --ndo-radius-xl:   0.75rem;   /* 12px */
  --ndo-radius-pill: 9999px;

  /* =========================================================
     ELEVATION
     ========================================================= */
  --ndo-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.05);
  --ndo-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.07), 0 2px 4px -2px rgb(0 0 0 / 0.05);
  --ndo-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.04);
  --ndo-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.10), 0 8px 10px -6px rgb(0 0 0 / 0.04);

  /* =========================================================
     MOTION
     ========================================================= */
  --ndo-duration-fast: 100ms;
  --ndo-duration-base: 150ms;
  --ndo-easing: cubic-bezier(0.4, 0, 0.2, 1);
  --ndo-transition-shadow: box-shadow var(--ndo-duration-base) var(--ndo-easing);
  --ndo-transition-colors: background-color var(--ndo-duration-base) var(--ndo-easing),
                           color var(--ndo-duration-base) var(--ndo-easing),
                           border-color var(--ndo-duration-base) var(--ndo-easing);

  /* =========================================================
     LAYOUT
     ========================================================= */
  --ndo-sidebar-width: 240px;
  --ndo-content-max:   1200px;
}

/* =========================================================
   DARK MODE
   Opt-in via [data-theme="dark"] on <html>. Only the semantic
   layer flips; the numbered scales are absolute and never
   redefined, so a component that reached for --ndo-gray-900
   keeps meaning "the darkest gray" in both themes.
   ========================================================= */
[data-theme='dark'] {
  color-scheme: dark;

  --ndo-color-bg-app:         rgb(var(--ndo-gray-950));
  --ndo-color-surface:        rgb(var(--ndo-gray-900));
  --ndo-color-card-bg:        31 41 55;
  --ndo-color-border:         rgb(var(--ndo-gray-700));
  --ndo-color-border-subtle:  rgb(var(--ndo-gray-800));
  --ndo-color-border-strong:  rgb(var(--ndo-gray-600));
  --ndo-color-text-primary:   rgb(var(--ndo-gray-50));
  --ndo-color-text-secondary: rgb(var(--ndo-gray-300));
  --ndo-color-text-muted:     rgb(var(--ndo-gray-400));
  --ndo-color-text-mono:      rgb(var(--ndo-gray-500));
  --ndo-color-text-inverse:   17 24 39;
  --ndo-color-link:           rgb(var(--ndo-primary-400));
  --ndo-color-overlay:        rgb(0 0 0 / 0.6);
}

/* =========================================================
   NO GLOBAL BASE
   ---------------------------------------------------------
   This file declares tokens and nothing else. It used to set
   `body { font-family; background; color }`, which quietly
   changed how the prototype rendered compared with the app —
   the app sets neither, and inherits UnoCSS's Tailwind reset.
   A token file that also has opinions about the body cannot
   be dropped into a page without changing it, which defeats
   the point of shipping it alongside the custom elements.

   Consumers that want the design-system chrome import
   src/lib/styles/app.css as well.
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}