@layer reset, base, components, modules, utilities, native, platform;

:root {
  /* Raw LCH values — derived from chalkmark.pen hex tokens. Override these
     in [data-theme] or @media (prefers-color-scheme: dark) to retheme without
     touching the semantic --color-* tokens below. */
  --lch-canvas: 98% 0.003 95;            /* #FAFAF7 */
  --lch-surface: 95% 0.005 85;           /* #F4F2ED */
  --lch-surface-sunken: 93% 0.006 85;    /* #EEECE6 */
  --lch-ink: 22% 0.02 255;               /* #1F2630 */
  --lch-ink-muted: 45% 0.022 258;        /* #576173 */
  --lch-ink-subtle: 62% 0.018 260;       /* #8B94A3 */
  --lch-ink-faint: 82% 0.013 255;        /* #C4CAD3 */
  --lch-ink-inverted: 100% 0 0;          /* #FFFFFF */
  --lch-border: 90% 0.005 85;            /* #E5E4DF */
  --lch-border-strong: 83% 0.008 85;     /* #D1CFC7 */
  --lch-accent: 45% 0.18 262;            /* #2B5CD7 */
  --lch-accent-hover: 38% 0.18 263;      /* #1E47B0 */
  --lch-accent-soft: 91% 0.035 260;      /* #E4ECFA */
  --lch-chalk-accent: 74% 0.12 80;       /* #D9A441 */
  --lch-negative: 57% 0.17 26;           /* #C94545 */
  --lch-negative-soft: 94% 0.03 24;      /* #FAE6E6 */
  --lch-positive: 58% 0.13 152;          /* #2F8F5F */
  --lch-positive-soft: 94% 0.04 152;     /* #E2F4EA */
  --lch-warning: 57% 0.11 75;            /* #B8770A */
  --lch-warning-soft: 94% 0.04 80;       /* #FAF0DC */

  /* Semantic colors derive from the raw LCH layer */
  --color-canvas: oklch(var(--lch-canvas));
  --color-surface: oklch(var(--lch-surface));
  --color-surface-sunken: oklch(var(--lch-surface-sunken));
  --color-ink: oklch(var(--lch-ink));
  --color-ink-muted: oklch(var(--lch-ink-muted));
  --color-ink-subtle: oklch(var(--lch-ink-subtle));
  --color-ink-faint: oklch(var(--lch-ink-faint));
  --color-ink-inverted: oklch(var(--lch-ink-inverted));
  --color-border: oklch(var(--lch-border));
  --color-border-strong: oklch(var(--lch-border-strong));
  --color-accent: oklch(var(--lch-accent));
  --color-accent-hover: oklch(var(--lch-accent-hover));
  --color-accent-soft: oklch(var(--lch-accent-soft));
  --color-chalk-accent: oklch(var(--lch-chalk-accent));
  --color-negative: oklch(var(--lch-negative));
  --color-negative-soft: oklch(var(--lch-negative-soft));
  --color-positive: oklch(var(--lch-positive));
  --color-positive-soft: oklch(var(--lch-positive-soft));
  --color-warning: oklch(var(--lch-warning));
  --color-warning-soft: oklch(var(--lch-warning-soft));

  /* Fonts */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-serif: "Source Serif 4", "Source Serif Pro", Georgia, serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

  /* Spacing — matches chalkmark.pen space tokens */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-sm: 0 1px 2px oklch(0% 0 0 / 0.06);
  --shadow-md: 0 6px 18px oklch(0% 0 0 / 0.10);
  --shadow-lg: 0 16px 40px oklch(0% 0 0 / 0.18);

  /* Z-index scale */
  --z-launcher: 50;
  --z-modal: 60;

  /* Bottom clearance for fixed launcher (button height + offset + breathing room) */
  --launcher-clearance: calc(48px + var(--space-4) + var(--space-6));

  /* Type scale */
  --text-12: 0.75rem;
  --text-14: 0.875rem;
  --text-16: 1rem;
  --text-18: 1.125rem;
  --text-20: 1.25rem;
  --text-24: 1.5rem;
  --text-28: 1.75rem;
  --text-32: 2rem;
  --text-40: 2.5rem;
  --text-56: 3.5rem;
}