:root {
  /* Mệnh Thủy (Đinh Sửu 1997): navy + cool white/grey (Kim sinh Thủy). Nordic, low chroma. */
  --color-paper: oklch(98.4% 0.003 250);
  --color-paper-3: oklch(93.6% 0.008 250);
  --color-card: oklch(99.7% 0.001 250);
  --color-panel: oklch(95% 0.004 250);
  --color-ink: oklch(21% 0.012 255);
  --color-ink-2: oklch(35% 0.012 255);
  --color-ink-3: oklch(48% 0.01 255);
  --color-rule: oklch(87% 0.008 250);
  --color-accent: oklch(30% 0.08 258);
  --color-accent-hover: oklch(25% 0.07 258);
  --color-on-accent: oklch(98.4% 0.003 250);
  --color-focus: oklch(45% 0.12 255);

  /* Deep navy surfaces (closing band) with champagne gold: metallic gold reads as Kim, which feeds Thủy */
  --color-deep: oklch(23% 0.05 258);
  --color-on-deep: oklch(96.5% 0.006 250);
  --color-on-deep-2: oklch(80% 0.03 85);
  --color-rule-deep: oklch(35% 0.045 258);
  --color-gold: oklch(80% 0.09 85);
  --color-gold-line: oklch(72% 0.085 80);
  --color-scrim: oklch(21% 0.012 255 / 0.35);
  --color-live: oklch(62% 0.17 150);
  --color-tool-excel: oklch(51% 0.13 151);
  --color-tool-python: oklch(55% 0.13 250);
  --color-tool-posit: oklch(55% 0.09 247);
  --color-tool-mixpanel: oklch(58% 0.2 292);
  --color-tool-github: oklch(24% 0.01 260);
  --color-tool-anthropic: oklch(64% 0.15 47);
  --color-tool-grok: oklch(30% 0.01 260);
  --color-tool-codex: oklch(62% 0.16 160);
  --color-tool-opencode: oklch(35% 0.03 260);
  --color-tool-copilot: oklch(60% 0.17 290);
  --color-tool-office: oklch(55% 0.17 250);
  --color-tool-adobe: oklch(56% 0.21 28);
  --color-tool-canva: oklch(62% 0.14 230);
  --color-flag-vn: oklch(54% 0.21 28);
  --color-flag-star: oklch(88% 0.18 96);
  --color-flag-uk: oklch(32% 0.18 264);
  --color-flag-uk-cross: oklch(52% 0.2 28);
  --color-flag-no: oklch(50% 0.2 28);
  --color-flag-no-cross: oklch(32% 0.16 263);
  --shadow-card: 0 1px 2px oklch(23% 0.05 258 / 0.05), 0 14px 32px -18px oklch(23% 0.05 258 / 0.22);
  --shadow-card-hover: 0 1px 2px oklch(23% 0.05 258 / 0.06), 0 20px 40px -18px oklch(23% 0.05 258 / 0.28);
  --shadow-bar: 0 -12px 32px -20px oklch(23% 0.05 258 / 0.25);

  --font-display: "Oswald", "Arial Narrow", ui-sans-serif, sans-serif;
  --font-body: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  --text-xs: 0.8125rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: clamp(2rem, 1.4rem + 2vw, 2.75rem);
  --text-4xl: clamp(2.25rem, 1.4rem + 2.8vw, 3.75rem);
  --text-display: clamp(3.5rem, 1.6rem + 7.5vw, 8rem);

  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;

  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-pill: 999px;

  --rule-hair: 1px solid var(--color-rule);

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in: cubic-bezier(0.55, 0, 1, 0.45);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 150ms;
  --dur-base: 240ms;
  --dur-slow: 600ms;

}