/* [GOVERNANCE] Shared visual primitives only. Component-specific values belong with components. */
* { box-sizing: border-box; }
[hidden] { display: none !important; }

:root {
  color-scheme: dark;

  /* ── Palette ── */
  --color-bg-base: #1c1b1a;
  --color-bg-panel: #242322;
  --color-bg-card: #2a2927;
  --color-bg-panel-hover: #302f2d;
  --panel-hover: var(--color-bg-panel-hover);
  --color-border-base: #3e3c39;
  --color-text-base: #f0ede8;
  --color-text-muted: #9e9a94;

  /* ── Brand: violet-indigo (#6D5BF7) ── */
  --color-primary-base: #6D5BF7;
  --color-primary-hover: #5B49E0;
  --color-primary-text: #ffffff;
  --color-primary-glow: rgba(109, 91, 247, 0.18);

  --color-ghost-base: #2e2c2a;
  --color-ghost-hover: #3a3835;
  --color-danger-base: #f97066;
  --color-checker-a: #302f2d;
  --color-checker-b: #242322;
  --shadow-base: rgba(0, 0, 0, 0.45);
  --shadow-hover: 0 4px 20px rgba(0, 0, 0, 0.5);

  /* Compatibility aliases */
  --color-ink-base: var(--color-text-base);
  --color-accent-base: var(--color-primary-base);
  --color-accent-strong: #9b8dff;
  --color-accent-soft: #1e1843;

  /* ── Typography ── */
  --font-family-heading: "Galmuri11", "Galmuri9", monospace;
  /* --font-family-ui: nav, buttons, labels ≥13px → Galmuri11; body (12–14px) stays Inter */
  --font-family-ui: "Galmuri11", "Galmuri9", monospace;
  --font-family-base: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-md: 16px;
  --font-size-lg: 20px;
  --font-size-xl: 24px;
  --font-size-2xl: 32px;
  --font-size-3xl: 48px;
  --line-height-tight: 1.2;
  --line-height-base: 1.5;

  /* ── Spacing ── */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 12px;
  --spacing-lg: 16px;
  --spacing-xl: 24px;
  --spacing-2xl: 32px;
  --spacing-3xl: 48px;
  --spacing-4xl: 72px;
  --spacing-5xl: 96px;

  /* ── Shape ── */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 9999px;

  /* ── Control heights ── */
  --control-height-sm: 32px;
  --control-height-md: 36px;
  --control-height-lg: 44px;

  /* ── Layout ── */
  --breakpoint-mobile: 640px;
  --breakpoint-tablet: 860px;
  --layout-page-max: 1200px;
  --layout-inspector-width: 380px;
}