/* =============================================================================
   1891 — Shared design tokens
   =============================================================================
   NAMESPACE RULE (read this first):

     - EVERY shared, cross-project token uses the `--c-*` prefix.
       `c` = "common." It's the most generic of the three prefixes already in
       use in the workspace (`--bloom`, `--psa-*`, `--c-*`), and it doesn't
       collide with any existing project's tokens.

     - EVERY project-specific token uses the `--<project>-*` prefix:
         --mowl-tree-*, --psa-*, --ftd-*, --clerc-*, --blastd-*, --1891-*

     - A project that wants to *override* a shared token does so by setting
       it inside `:root[data-project="<name>"]` in the project's own theme
       file -- never by editing this file.

   When to add a token here: only when a value will be reused across at
   least TWO projects with the SAME meaning. Otherwise keep it project-local.
   When in doubt, leave it out -- this file should grow slowly.

   Source extraction notes (for the curious):
     - palette is a generic neutral set; each project picks its own brand
       color via `--c-bloom` overrides
     - spacing scale is the 4px grid common to mowl-tree + msd-psa + FDT
     - type scale is a 1.25 (major third) modular scale
   ============================================================================= */

:root {
  /* ---- Palette: neutrals ------------------------------------------------- */
  --c-ink:        #111418;   /* primary text */
  --c-ink-soft:   #3a3f47;   /* secondary text */
  --c-fog:        #6b7280;   /* tertiary text, captions */
  --c-line:       #e4e7eb;   /* hairlines, dividers */
  --c-paper:      #ffffff;   /* default surface */
  --c-paper-warm: #faf8f4;   /* alternate surface (cards, sections) */

  /* ---- Palette: brand slots (override per project) ----------------------- */
  --c-bloom:        #8a2843; /* primary brand color (rose default) */
  --c-bloom-soft:   #c46b85; /* lighter brand for hovers, accents */
  --c-accent:       #d4a017; /* secondary accent */

  /* ---- Palette: semantic ------------------------------------------------- */
  --c-ok:    #1f7a3a;
  --c-warn:  #b87b1a;
  --c-err:   #b3261e;
  --c-info:  #1a5f9c;

  /* ---- Spacing: 4px grid ------------------------------------------------- */
  --c-space-0:  0;
  --c-space-1:  4px;
  --c-space-2:  8px;
  --c-space-3:  12px;
  --c-space-4:  16px;
  --c-space-5:  24px;
  --c-space-6:  32px;
  --c-space-7:  48px;
  --c-space-8:  64px;
  --c-space-9:  96px;

  /* ---- Type: stack + scale (1.25 modular) -------------------------------- */
  --c-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif;
  --c-font-serif: Georgia, "Iowan Old Style", "Charter", serif;
  --c-font-mono:  ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --c-text-xs:   0.75rem;    /* 12px */
  --c-text-sm:   0.875rem;   /* 14px */
  --c-text-md:   1rem;       /* 16px -- base */
  --c-text-lg:   1.25rem;    /* 20px */
  --c-text-xl:   1.5625rem;  /* 25px */
  --c-text-2xl:  1.953rem;   /* ~31px */
  --c-text-3xl:  2.441rem;   /* ~39px */
  --c-text-4xl:  3.052rem;   /* ~49px */

  --c-leading-tight:  1.2;
  --c-leading-normal: 1.5;
  --c-leading-loose:  1.7;

  /* ---- Radius + elevation ----------------------------------------------- */
  --c-radius-sm: 4px;
  --c-radius-md: 8px;
  --c-radius-lg: 16px;
  --c-radius-pill: 999px;

  --c-shadow-sm: 0 1px 2px rgba(0,0,0,0.06);
  --c-shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --c-shadow-lg: 0 12px 32px rgba(0,0,0,0.12);

  /* ---- Layout ----------------------------------------------------------- */
  --c-container-max: 1100px;
  --c-container-pad: var(--c-space-5);

  /* ---- Motion ----------------------------------------------------------- */
  --c-ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --c-ease-in:    cubic-bezier(0.4, 0, 1, 1);
  --c-duration-fast:   120ms;
  --c-duration-normal: 220ms;
  --c-duration-slow:   400ms;
}

/* ---- Dark-mode-aware overrides (opt-in via prefers-color-scheme) ---------
   Projects that want dark mode set <html data-theme="auto"> and inherit
   these. Otherwise the light palette above is used. */
@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] {
    --c-ink:        #f1f3f5;
    --c-ink-soft:   #c2c8d0;
    --c-fog:        #8b939c;
    --c-line:       #2a2f36;
    --c-paper:      #0e1014;
    --c-paper-warm: #15181d;
  }
}

/* ---- Reduced motion --------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  :root {
    --c-duration-fast:   0ms;
    --c-duration-normal: 0ms;
    --c-duration-slow:   0ms;
  }
}
