:root {
  color-scheme: dark;

  --color-bg: #0b0b0b;
  --color-bg-elevated: #111111;
  --color-bg-panel: rgba(23, 23, 23, 0.88);
  --color-bg-panel-strong: rgba(28, 28, 28, 0.96);
  --color-bg-field: rgba(8, 8, 8, 0.72);
  --color-bg-hover: rgba(255, 255, 255, 0.055);

  --color-text: #f5f2ee;
  --color-text-soft: #d8d2ca;
  --color-muted: #8f8f8f;
  --color-muted-strong: #b5afa8;

  --color-orange: #f97316;
  --color-orange-deep: #c24a07;
  --color-orange-soft: rgba(249, 115, 22, 0.16);
  --color-orange-ring: rgba(249, 115, 22, 0.34);

  --color-border: rgba(255, 255, 255, 0.09);
  --color-border-strong: rgba(255, 255, 255, 0.15);
  --color-success: #4ade80;
  --color-error: #fb7185;

  --font-sans: Inter, "SF Pro Display", "Segoe UI", Arial, sans-serif;
  --font-serif: Georgia, "Times New Roman", serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 26px;

  --shadow-soft: 0 18px 64px rgba(0, 0, 0, 0.34);
  --shadow-panel: 0 24px 90px rgba(0, 0, 0, 0.42);
  --shadow-glow: 0 0 32px rgba(249, 115, 22, 0.22);

  --duration-fast: 140ms;
  --duration-base: 220ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
}