:root {
  /* Restrained Neutral Dark Palette */
  --bg-app: #121316;
  --bg-header: #16171b;
  --bg-surface: #1a1b20;
  --bg-surface-elevated: #202227;
  --bg-editor: #131417;
  --bg-preview-wrapper: #1c1d22;
  --bg-hover: #212329;
  --bg-active: #282a32;

  /* Borders & Dividers */
  --border-subtle: #22242a;
  --border-default: #292c34;
  --border-strong: #353842;
  --border-focus: #d97736;

  /* Typography Colors */
  --text-primary: #e6e8ed;
  --text-secondary: #888d98;
  --text-muted: #525761;
  --text-inverse: #121316;

  /* Custom Warm Terracotta Accent */
  --accent-run: #d97736;
  --accent-run-hover: #c56729;
  --accent-run-active: #b15920;
  --accent-run-text: #ffffff;

  --accent-action: #d97736;
  --accent-action-hover: #c56729;

  --accent-danger: #cf4e4e;
  --accent-danger-hover: #b93f3f;

  /* Fonts */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "SF Mono", "JetBrains Mono", "Fira Code", Consolas, Menlo, monospace;

  /* Compact Sizing & Crisp Radii */
  --header-height: 48px;
  --tab-height: 36px;
  --radius-xs: 2px;
  --radius-sm: 3px;
  --radius-md: 4px;
  --radius-lg: 6px;

  /* Z-Index Hierarchy */
  --z-base: 1;
  --z-header: 10;
  --z-resizer: 15;
  --z-modal: 50;
  --z-toast: 60;
}