:root,
[data-theme='pearl'] {
  --bg-canvas: #f4f0e8;
  --bg-ambient: radial-gradient(circle at 14% 8%, rgba(196, 158, 88, 0.14), transparent 44%),
    radial-gradient(circle at 88% 12%, rgba(28, 36, 48, 0.06), transparent 42%);
  --surface-card: #fffdf9;
  --surface-elevated: #faf6ee;
  --surface-floating: rgba(255, 253, 248, 0.92);
  --surface-muted: #efe9dd;
  --ink-primary: #181715;
  --ink-secondary: #4e4a43;
  --ink-muted: #6e685e;
  --border-subtle: rgba(24, 23, 21, 0.11);
  --border-strong: rgba(140, 106, 46, 0.36);
  --gold-accent: #8a6626;
  --gold-bright: #b68d43;
  --gold-soft: rgba(182, 141, 67, 0.14);
  --ink-on-gold: #fffdf9;
  --status-ok-bg: #e7f4ec;
  --status-ok-ink: #155d36;
  --status-warn-bg: #fbf1dc;
  --status-warn-ink: #7c520b;
  --status-err-bg: #fbe8e6;
  --status-err-ink: #8e241b;
  --status-neutral-bg: #ece7dc;
  --status-neutral-ink: #46423b;
  --shadow-float: 0 14px 36px rgba(24, 21, 16, 0.08);
  --shadow-card: 0 4px 18px rgba(24, 21, 16, 0.045);
}

[data-theme='obsidian'] {
  --bg-canvas: #111317;
  --bg-ambient: radial-gradient(circle at 15% 8%, rgba(212, 175, 106, 0.12), transparent 45%),
    radial-gradient(circle at 86% 14%, rgba(65, 84, 112, 0.12), transparent 44%);
  --surface-card: #191c22;
  --surface-elevated: #20242c;
  --surface-floating: rgba(24, 27, 34, 0.94);
  --surface-muted: #262b35;
  --ink-primary: #f5f1e8;
  --ink-secondary: #cbc4b6;
  --ink-muted: #9e978a;
  --border-subtle: rgba(245, 241, 232, 0.12);
  --border-strong: rgba(212, 175, 106, 0.42);
  --gold-accent: #d4af6a;
  --gold-bright: #c59c52;
  --gold-soft: rgba(212, 175, 106, 0.15);
  --ink-on-gold: #151412;
  --status-ok-bg: rgba(34, 139, 84, 0.2);
  --status-ok-ink: #8be0b0;
  --status-warn-bg: rgba(212, 160, 56, 0.2);
  --status-warn-ink: #f4cf82;
  --status-err-bg: rgba(214, 72, 60, 0.22);
  --status-err-ink: #ffaba3;
  --status-neutral-bg: rgba(245, 241, 232, 0.1);
  --status-neutral-ink: #d5cfc3;
  --shadow-float: 0 18px 42px rgba(0, 0, 0, 0.44);
  --shadow-card: 0 6px 20px rgba(0, 0, 0, 0.26);
}

:root {
  --font-sans: 'Noto Sans Thai', 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-display: 'Cormorant Garamond', 'Noto Sans Thai', Georgia, serif;
  --radius-xl: 22px;
  --radius-lg: 16px;
  --radius-md: 12px;
  --radius-pill: 999px;
  --touch-min: 44px;
  --max-stage: 1380px;
}