/* Axorum Design System · colors_and_type.css
   Paper-and-ink neutrals · one deep ledger green · four state colors.
   Two type families: Inter Tight (display), Inter (UI/body), JetBrains Mono (data).
*/

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Inter+Tight:wght@500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap");

:root {
  /* ── Fonts ──────────────────────────────────────────────── */
  --font-display: "Inter Tight", "Inter", "Helvetica Neue", sans-serif;
  --font-ui:      "Inter", "Helvetica Neue", system-ui, sans-serif;
  --font-mono:    "JetBrains Mono", "SF Mono", Menlo, monospace;

  /* ── Neutrals (light mode · paper & ink) ────────────────── */
  --paper:       oklch(0.99 0.002 85);
  --surface:     oklch(0.975 0.003 85);
  --surface2:    oklch(0.955 0.003 85);
  --rule:        oklch(0.86 0.005 80);
  --ruleStrong:  oklch(0.65 0.006 80);
  --muted:       oklch(0.48 0.006 75);
  --inkSoft:     oklch(0.30 0.006 75);
  --ink:         oklch(0.14 0.005 75);

  /* ── Accent · deep ledger green ─────────────────────────── */
  --accent:      oklch(0.36 0.065 150);
  --accentSoft:  oklch(0.93 0.022 150);

  /* ── State vocabulary (maps to the journal) ─────────────── */
  --posted:      oklch(0.40 0.065 150);
  --pending:     oklch(0.52 0.07 75);
  --reversed:    oklch(0.48 0.06 25);
  --locked:      oklch(0.35 0.01 260);

  /* ── Spacing · 4px base ─────────────────────────────────── */
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* ── Radii · square by default ──────────────────────────── */
  --radius-0: 0;
  --radius-1: 2px;
  --radius-full: 999px;

  /* ── Motion tokens ──────────────────────────────────────── */
  --motion-inline:     1200ms;
  --motion-productive:  700ms;
  --motion-data:       1800ms;
  --motion-expressive: 1600ms;

  --ease-standard: cubic-bezier(0.2, 0, 0.2, 1);
  --ease-entrance: cubic-bezier(0, 0, 0.2, 1);
  --ease-exit:     cubic-bezier(0.4, 0, 1, 1);
  --ease-inscribe: cubic-bezier(0.45, 0, 0.55, 1);

  /* ── Page background (warm paper) ───────────────────────── */
  --bg:          #f4f2ed;

  /* ── Elevation · borders over shadows ───────────────────── */
  --shadow-overlay: 0 8px 40px rgba(0, 0, 0, 0.14);
  --shadow-popover: 0 6px 28px rgba(0, 0, 0, 0.10);
}

:root[data-theme="dark"],
.dark-scope {
  --paper:       oklch(0.13 0.005 80);
  --surface:     oklch(0.16 0.005 80);
  --surface2:    oklch(0.20 0.005 80);
  --rule:        oklch(0.25 0.006 80);
  --ruleStrong:  oklch(0.38 0.006 80);
  --muted:       oklch(0.58 0.006 75);
  --inkSoft:     oklch(0.80 0.005 80);
  --ink:         oklch(0.97 0.003 85);
  --accent:      oklch(0.75 0.10 150);
  --accentSoft:  oklch(0.26 0.045 150);
  --posted:      oklch(0.75 0.10 150);
  --pending:     oklch(0.75 0.10 75);
  --reversed:    oklch(0.70 0.08 25);
  --locked:      oklch(0.60 0.01 260);
  --bg:          oklch(0.10 0.005 80);
}

.ax-h0 { font-family: var(--font-display); font-size: 48px; font-weight: 600; letter-spacing: -0.035em; line-height: 1.05; }
.ax-h1 { font-family: var(--font-display); font-size: 36px; font-weight: 600; letter-spacing: -0.028em; line-height: 1.05; }
.ax-h2 { font-family: var(--font-display); font-size: 26px; font-weight: 600; letter-spacing: -0.025em; line-height: 1.1; }
.ax-h3 { font-family: var(--font-display); font-size: 17px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.2; }
.ax-body { font-family: var(--font-ui); font-size: 15px; font-weight: 400; line-height: 1.6; color: var(--inkSoft); }
.ax-body-sm { font-family: var(--font-ui); font-size: 13px; font-weight: 400; line-height: 1.55; }
.ax-mono { font-family: var(--font-mono); font-size: 12.5px; font-weight: 500; font-variant-numeric: tabular-nums; }
.ax-label { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.ax-kicker { font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }

.ax-page { margin: 0; padding: 0; background: var(--bg); color: var(--ink); font-family: var(--font-ui); -webkit-font-smoothing: antialiased; font-feature-settings: "ss01", "cv11"; }
