:root {
  /* VariKo application roles: use these in product UI when the context matters. */
  --vk-app-surface-center: #F6F1E9;
  --vk-app-surface-panel: var(--vk-surface-side-panel);
  --vk-app-accent-main: var(--vk-branch-main-bg);
  --vk-app-accent-main-text: var(--vk-branch-main-text);
  --vk-app-review-status-done-bg: #2563eb;
  --vk-app-tsumego-failed-attempt-bg: var(--vk-analysis-gametree-tsumego-error-branch, #96031a);
  --vk-accent-fill: var(--vk-app-accent-main);

  /* Component aliases kept stable for existing CSS. */
  --vk-text-strong: var(--vk-text-primary);
  --vk-brand-text: var(--vk-text-brand);
  --vk-border-soft: var(--vk-border-default);
  --vk-success-bg: var(--vk-state-success-bg);
  --vk-success-bg-hover: var(--vk-state-success-bg-hover);
  --vk-success-text: var(--vk-state-success-text);
  --vk-action-delete-text: var(--vk-state-danger-text);
  --vk-progress-track: var(--vk-progress-track-bg);
  --vk-progress-viewed: var(--vk-progress-success-bg);
  --vk-progress-review-draft: var(--vk-progress-draft-bg);
  --vk-progress-review-complete: var(--vk-app-review-status-done-bg);
  --vk-favorite-active-color: var(--vk-accent-brand);
}