/*
  EnsouWorks — Design tokens.

  The reusable core of the Ensou visual language. Products built under the
  Ensou name consume this file and nothing below it; everything else in the
  system is composed from these values.

  Ground rules encoded here:
  - The palette is mineral sand, cool-biased. Not cream.
  - Colour carries meaning, never decoration. The gold seam is reserved for
    repair (Kintsugi) and must not be used as a generic accent.
  - The only true circle in the system is the ensō. Everything else is cut
    square, so radii stay near zero.
*/

:root {
  color-scheme: light dark;

  /* ---- Ground & ink -------------------------------------------------- */
  --c-ground: #e8e6df;
  --c-ground-sunk: #dcd9d0;
  --c-ground-raised: #f2f0eb;
  --c-grain: #cbc7bb;
  --c-line: #c9c5b8;
  --c-line-soft: #d8d5cb;

  --c-ink: #191a18;
  --c-ink-soft: #45473f;
  --c-ink-mute: #6c6e64;

  /* ---- Accent --------------------------------------------------------- */
  --c-accent: #2e6d5b;
  --c-accent-soft: #3f8570;
  --c-accent-wash: #2e6d5b14;

  /* ---- Semantic ------------------------------------------------------- */
  --c-seam: #a67c2e;          /* repair. Kintsugi only. */
  --c-seam-wash: #a67c2e1a;
  --c-focus: #2e6d5b;

  /* ---- Practice tints -------------------------------------------------
     Deliberately close together. The three practices are told apart by the
     behaviour of their artwork, not by colour. */
  --c-ikigai: #3f7a63;
  --c-kintsugi: #8a6a2f;
  --c-kaizen: #3d6b78;

  /* ---- Type ----------------------------------------------------------- */
  --f-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --f-body: "Geist", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --f-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --t-xs: 0.75rem;
  --t-sm: 0.8125rem;
  --t-base: 1.0625rem;
  --t-md: clamp(1.125rem, 0.4vw + 1.03rem, 1.3125rem);
  --t-lg: clamp(1.375rem, 1vw + 1.15rem, 1.75rem);
  --t-xl: clamp(1.75rem, 2vw + 1.3rem, 2.5rem);
  --t-2xl: clamp(2.25rem, 3.4vw + 1.4rem, 3.75rem);
  --t-3xl: clamp(2.15rem, 5vw + 1rem, 6rem);

  --lh-tight: 1.04;
  --lh-snug: 1.2;
  --lh-body: 1.62;

  --ls-tight: -0.022em;
  --ls-label: 0.1em;

  --measure: 64ch;
  --measure-tight: 52ch;

  /* ---- Space ---------------------------------------------------------- */
  --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;
  --s-9: 6rem;
  --s-10: 8rem;
  --section: clamp(4.5rem, 9vw, 9rem);

  /* ---- Form ----------------------------------------------------------- */
  --r-none: 0;
  --r-sm: 2px;
  --r-md: 3px;
  --r-circle: 50%;

  --shell: 78rem;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);

  /* ---- Motion --------------------------------------------------------- */
  --ease-sand: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --d-fast: 160ms;
  --d-base: 320ms;
  --d-slow: 700ms;
}

@media (prefers-color-scheme: dark) {
  :root {
    --c-ground: #131412;
    --c-ground-sunk: #0c0d0b;
    --c-ground-raised: #1c1e1a;
    --c-grain: #383a34;
    --c-line: #2b2d28;
    --c-line-soft: #232520;

    --c-ink: #e6e4dc;
    --c-ink-soft: #aeaca2;
    --c-ink-mute: #84867c;

    --c-accent: #74b79e;
    --c-accent-soft: #8fcbb4;
    --c-accent-wash: #74b79e1a;

    --c-seam: #c9a15a;
    --c-seam-wash: #c9a15a1f;
    --c-focus: #8fcbb4;

    --c-ikigai: #74b79e;
    --c-kintsugi: #c9a15a;
    --c-kaizen: #74a2b7;
  }
}

/* The viewer's explicit toggle must win over the OS preference in both
   directions, so each theme is restated at higher specificity. */
:root[data-theme="dark"] {
  --c-ground: #131412;
  --c-ground-sunk: #0c0d0b;
  --c-ground-raised: #1c1e1a;
  --c-grain: #383a34;
  --c-line: #2b2d28;
  --c-line-soft: #232520;

  --c-ink: #e6e4dc;
  --c-ink-soft: #aeaca2;
  --c-ink-mute: #84867c;

  --c-accent: #74b79e;
  --c-accent-soft: #8fcbb4;
  --c-accent-wash: #74b79e1a;

  --c-seam: #c9a15a;
  --c-seam-wash: #c9a15a1f;
  --c-focus: #8fcbb4;

  --c-ikigai: #74b79e;
  --c-kintsugi: #c9a15a;
  --c-kaizen: #74a2b7;
}

:root[data-theme="light"] {
  --c-ground: #e8e6df;
  --c-ground-sunk: #dcd9d0;
  --c-ground-raised: #f2f0eb;
  --c-grain: #cbc7bb;
  --c-line: #c9c5b8;
  --c-line-soft: #d8d5cb;

  --c-ink: #191a18;
  --c-ink-soft: #45473f;
  --c-ink-mute: #6c6e64;

  --c-accent: #2e6d5b;
  --c-accent-soft: #3f8570;
  --c-accent-wash: #2e6d5b14;

  --c-seam: #a67c2e;
  --c-seam-wash: #a67c2e1a;
  --c-focus: #2e6d5b;

  --c-ikigai: #3f7a63;
  --c-kintsugi: #8a6a2f;
  --c-kaizen: #3d6b78;
}