:root {
  /* 构建生成的 theme.css 是装饰色的唯一来源；业务开奖颜色独立。 */
  --brand-page: var(--theme-page);
  --brand-panel: var(--theme-panel);
  --brand-surface: var(--theme-surface);
  --brand-border: var(--theme-border);
  --brand-primary: var(--theme-primary);
  --brand-primary-highlight: color-mix(in srgb, var(--theme-primary) 70%, var(--palette-emphasis));
  --brand-primary-bright: color-mix(in srgb, var(--theme-primary) 94%, var(--palette-emphasis));
  --brand-primary-dark: color-mix(in srgb, var(--theme-primary) 85%, black);
  --brand-primary-text: var(--theme-primary-text);
  --brand-accent: var(--theme-accent);
  --brand-accent-bright: color-mix(in srgb, var(--theme-accent) 80%, var(--palette-emphasis));
  --brand-text: var(--theme-text);
  --brand-text-muted: var(--theme-muted);
  --brand-focus: var(--brand-primary-bright);

  /* 开奖状态色不随站点主题变化。 */
  --game-red: #ef4444;
  --game-warning: #f59e0b;
  --game-info: #3b82f6;

  --primary: var(--brand-primary);
  --primary-light: var(--brand-primary-bright);
  --primary-dark: var(--brand-primary-dark);
  --success: var(--brand-primary);
  --error: var(--game-red);
  --warning: var(--game-warning);
  --info: var(--game-info);

  --surface: var(--brand-surface);
  --overlay: color-mix(in srgb, var(--brand-page) 88%, transparent);

  --text-tertiary: var(--brand-text-muted);
  --text: var(--brand-text);
  --text-dim: var(--brand-text-muted);

  --alpha-5: color-mix(in srgb, var(--brand-primary) 5%, transparent);
  --alpha-10: color-mix(in srgb, var(--brand-primary) 10%, transparent);
  --alpha-20: color-mix(in srgb, var(--brand-primary) 20%, transparent);
  --alpha-30: color-mix(in srgb, var(--brand-primary) 30%, transparent);
  --alpha-40: color-mix(in srgb, var(--brand-primary) 40%, transparent);

  --border-light: color-mix(in srgb, var(--brand-border) 44%, transparent);
  --border-medium: color-mix(in srgb, var(--brand-border) 68%, transparent);

  --shadow-light: rgba(0, 0, 0, 0.18);
  --shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.24);
  --shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.42);

  --success-text: color-mix(in srgb, var(--brand-primary) 56%, var(--palette-emphasis));
  --success-border: color-mix(in srgb, var(--brand-primary) 58%, transparent);
  --error-text: var(--palette-error-text);
  --error-border: rgba(239, 68, 68, 0.58);
  --error-panel: var(--palette-error-panel);
}

@media (prefers-contrast: high) {
  :root {
    --brand-border: color-mix(in srgb, var(--theme-border) 62%, var(--theme-text));
    --brand-text-muted: color-mix(in srgb, var(--theme-muted) 45%, var(--theme-text));
    --border-light: color-mix(in srgb, var(--brand-border) 76%, transparent);
  }
}