/* Active theme mapping. Values intentionally reproduce the current mixed
   light/dark visual composition; components consume roles, not theme names. */
:root,
[data-theme="light"] {
  /* Official brand */
  --color-brand: #133BA9;
  --color-brand-hover: #315BD3;
  --color-brand-active: #0E2E87;
  --color-brand-light: #4F72E8;
  --color-brand-highlight: #5278E4;
  --color-brand-soft: rgba(19, 59, 169, .14);
  --color-brand-subtle: rgba(19, 59, 169, .08);
  --color-brand-glow: rgba(19, 59, 169, .38);
  --color-brand-aura: rgba(19, 59, 169, .21);
  --color-brand-decorative-soft: rgba(36, 72, 184, .33);
  --color-brand-decorative-strong: rgba(36, 72, 184, .48);

  /* Light surfaces */
  --color-page-bg: #FBF4E7;
  --color-section-bg: #FBF4E7;
  --color-surface: #FBF4E7;
  --color-surface-elevated: #FFFFFF;
  --color-surface-subtle: #E6DFD3;
  --color-card-bg: #FBF4E7;
  --color-header-bg: rgba(251, 244, 231, .88);
  --color-nav-text: #111827;
  --color-menu-active-text: #080B11;
  --color-footer-bg: #FBF4E7;

  /* Existing dark surfaces */
  --color-surface-dark: #000000;
  --color-surface-dark-deep: #020202;
  --color-surface-dark-soft: #040913;
  --color-surface-dark-blue: #061020;
  --color-surface-dark-elevated: #07101E;
  --color-media-bg: #111111;
  --color-skip-link-text: #0E1F44;
  --color-editorial-paper: #F3EEE3;
  --color-editorial-line: #263044;
  --color-editorial-muted: #969EAD;
  --color-card-bg-dark: rgba(255, 255, 255, .06);
  --color-form-bg: rgba(0, 0, 0, .32);
  --color-overlay: rgba(0, 0, 0, .62);

  /* Content */
  --color-text: #171717;
  --color-text-secondary: #4F4B45;
  --color-text-muted: #777168;
  --color-footer-text: #4B5565;
  --color-content-muted: #394354;
  --color-card-copy: #4A5870;
  --color-card-icon: #17345E;
  --color-form-label: #27364E;
  --color-text-subtle: #8F95A0;
  --color-text-inverse: #FFFFFF;
  --color-text-inverse-secondary: #C4C8D0;
  --color-text-inverse-muted: #AEB3BD;
  --color-text-inverse-soft: #B0B6C1;
  --color-text-inverse-subtle: #7E8797;
  --color-link: #133BA9;
  --color-link-inverse: #FFFFFF;
  --color-icon: #133BA9;
  --color-icon-inverse: #FFFFFF;

  /* Borders and states */
  --color-border: rgba(19, 59, 169, .24);
  --color-nav-border: rgba(19, 59, 169, .25);
  --color-border-strong: rgba(19, 59, 169, .30);
  --color-border-neutral-strong: rgba(23, 23, 23, .72);
  --color-divider-soft: rgba(23, 23, 23, .14);
  --color-divider-medium: rgba(23, 23, 23, .16);
  --color-footer-border: rgba(19, 59, 169, .18);
  --color-link-underline: rgba(23, 23, 23, .42);
  --color-divider: rgba(23, 23, 23, .20);
  --color-border-inverse: rgba(255, 255, 255, .24);
  --color-border-inverse-soft: rgba(255, 255, 255, .11);
  --color-border-inverse-field: rgba(255, 255, 255, .14);
  --color-focus: #133BA9;
  --color-focus-emphasis: #5579E5;
  --color-focus-ring: rgba(19, 59, 169, .28);
  --color-disabled: #8F97A5;
  --color-success: #2F7D4A;
  --color-warning: #A66A00;
  --color-error: #B42318;

  /* Reusable shadow and glass roles */
  --shadow-sm: 0 8px 30px rgba(19, 59, 169, .08);
  --shadow-header: 0 12px 30px rgba(0, 0, 0, .05);
  --shadow-card: 0 22px 64px rgba(19, 59, 169, .12);
  --shadow-elevated: 0 35px 110px rgba(19, 59, 169, .10);
  --shadow-dark: 0 24px 70px rgba(0, 0, 0, .52);
  --shadow-inner-highlight: inset 0 1px 0 rgba(255, 255, 255, .11);
  --shadow-control-inset: inset 0 1px 0 rgba(255, 255, 255, .10);
  --shadow-menu-inner: inset 0 1px 0 rgba(255, 255, 255, .08);
  --shadow-inner-subtle: inset 0 -1px 0 rgba(255, 255, 255, .03);
  --shadow-brand-glow: 0 0 30px rgba(49, 91, 211, .38);
  --glass-bg-light: rgba(251, 244, 231, .88);
  --glass-bg-dark: rgba(4, 7, 13, .94);
  --glass-bg-card: rgba(255, 255, 255, .06);
  --glass-border: rgba(255, 255, 255, .20);
  --glass-highlight: rgba(255, 255, 255, .025);
  --glass-highlight-line: rgba(255, 255, 255, .07);
}

/* Establish the document canvas before page-specific styles paint. This keeps
   mobile navigations and safe-area repaint frames on the active theme surface. */
html,
body {
  background-color: var(--color-page-bg);
}