:root {
  /* Legacy palette mapped */
  --legacy-bg-color:#2b2b2b;
  --legacy-navbar-color:#0d141c;
  --legacy-sidebar-color:#0d141c82;
  --legacy-hover:#080b10;
  --legacy-accent:#6e8ba9;
  --legacy-accent-alt:#6a88a4;
  --legacy-text:#ffffff;
  --legacy-top-text:#737373;
  --legacy-btn-bg:#6e8ba9;
  --legacy-btn-text:#ffffff;
  --legacy-card-bg:#0d141c82;
  --legacy-profile-bg:#0d141c;
  --legacy-auth-bg:#151521;
  --legacy-auth-panel:#1f1e2e;
  --legacy-auth-link:#3699ff;
  --legacy-auth-btn:#3699ff;
  --legacy-auth-btn-hover:#1f5cae;
  /* Additional legacy variable names for full design parity */
  --span-color: var(--legacy-accent);
  --span-color-back: #0d141c;
  --navbar-color: var(--legacy-navbar-color);
  --sidebar-color: var(--legacy-sidebar-color);
  --hover: var(--legacy-hover);
  --profile-color: var(--legacy-profile-bg);
  --profile-hover-color: #232b34;
  --profile-figure-color: #3a4a5c26;
  --profile-line-color: #3a4a5c;
  --bg-color: var(--legacy-bg-color);
  --default-text-color: var(--legacy-text);
  --default-text-color-invert: #ffffff;
  --top-text-color: var(--legacy-top-text);
  --card-color: var(--legacy-card-bg);
  --button-color: #292f38;
  --bottom-line-table: #484848;
  --scrollbar-bg--color: #2d313a;
  --custom-text-color: #b1b8c2;
  /* Semantic aliases for new design */
  --color-background: var(--legacy-bg-color);
  --color-surface: var(--legacy-card-bg);
  --color-surface-alt: var(--legacy-hover);
  --color-border: var(--legacy-hover);
  --color-text-primary: var(--legacy-text);
  --color-text-secondary: var(--legacy-top-text);
  --color-accent: var(--legacy-accent);
  --color-accent-alt: var(--legacy-accent-alt);
  --color-button-bg: var(--legacy-btn-bg);
  --color-button-text: var(--legacy-btn-text);
}

html[data-theme='light'] {
  --color-background:#f6f7f9;
  --color-surface:#ffffff;
  --color-surface-alt:#eef0f4;
  --color-border:#d7dae2;
  --color-text-primary:#1b1e27;
  --color-text-secondary:#5a6270;
  --color-accent:#3666a9; /* tuned for light */
  --color-accent-alt:#6990c0;
  --color-button-bg:#3666a9;
  --color-button-text:#ffffff;
}
