:root {
  color-scheme: dark;
  --gb-bg: #0E0F13;
  --gb-surface: #17191F;
  --gb-surface-2: #1E2128;
  --gb-surface-hover: #23262E;
  --gb-border: #23262E;
  --gb-border-strong: #33363F;
  --gb-text: #F3F1EC;
  --gb-text-soft: #D8D6D0;
  --gb-text-dim: #A6A8B0;
  --gb-accent: var(--ui-accent, #FF6B4A);
  --vod-accent-text: #FFB59F;
  --vod-faint: #8E9099;
  --vod-coin: #F5C567;
  --vod-coin-soft: #3A2E14;
  --vod-success-soft: #1F3A2E;
  --vod-radius-md: 10px;
  --vod-radius-lg: 16px;
  --vod-radius-tag: 14px;
  --vod-radius-sheet: 20px;
  --vod-stage: #000;
  --gb-accent-soft: #2A1A14;
  --gb-on-accent: #1A0E0A;
  --gb-success: #8FE3B5;
  --gb-danger: #FF8A75;
  --gb-radius: 12px;
  --gb-radius-sm: 8px;
  --gb-pill: 999px;
  --gb-font: var(--ui-font, system-ui, sans-serif);
  --gb-gutter: 24px;
}

@media (max-width: 720px) {
  :root { --gb-gutter: 16px; }
}