:root {
  /* — Dark theme (default — matches the product) — */
  --q-canvas: #0c0c16;
  --q-surface: #151525;
  --q-surface-alt: #1a1a2e;
  --q-surface-raised: #222238;
  --q-stroke: #2a2a42;
  --q-stroke-strong: #4a4a6a;
  --q-text: #e8e8f0;
  --q-text-secondary: #8888a8;

  /* — Accent: warm crystal amber — */
  --q-accent: #d4a853;
  --q-accent-subtle: rgba(212, 168, 83, 0.1);
  --q-accent-hover: #c49a48;
  --q-accent-text: #0c0c16;

  /* — Semantic — */
  --q-success: #3ecf8e;
  --q-info: #5ba8f5;

  /* — Typography — */
  --font-display: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-code: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;

  /* — Type scale — */
  --text-display: 4rem;
  --text-h1: 2.75rem;
  --text-h2: 1.75rem;
  --text-h3: 1.25rem;
  --text-body: 1rem;
  --text-caption: 0.8125rem;
  --text-small: 0.75rem;

  /* — Spacing — */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --space-5xl: 8rem;

  /* — Layout — */
  --max-width: 1100px;
  --nav-height: 56px;

  /* — Motion — */
  --q-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --q-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-standard: 250ms;
  --dur-entrance: 500ms;

  /* — Borders — */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
}

/* — Light theme (toggle) — */
[data-theme="light"] {
  --q-canvas: #fafafa;
  --q-surface: #ffffff;
  --q-surface-alt: #f4f4f6;
  --q-surface-raised: #ffffff;
  --q-stroke: #e0e0e6;
  --q-stroke-strong: #b0b0c0;
  --q-text: #1a1a2e;
  --q-text-secondary: #6a6a80;
  --q-accent-text: #ffffff;
}

/* — Responsive type — */
@media (max-width: 1024px) {
  :root {
    --text-display: 3rem;
    --text-h1: 2.25rem;
    --text-h2: 1.5rem;
  }
}

@media (max-width: 768px) {
  :root {
    --text-display: 2.25rem;
    --text-h1: 1.75rem;
    --text-h2: 1.25rem;
    --text-h3: 1.125rem;
  }
}