/* Shared by the Next.js pages and the preserved static home page. */
html[data-theme="light"] {
  color-scheme: light;
  --background: #f5f8fc;
  --background-elevated: #eaf1f8;
  --surface-1: #ffffff;
  --surface-2: #f0f5fa;
  --surface-3: #e2edf6;
  --border-subtle: rgb(43 72 102 / 15%);
  --border-default: rgb(43 72 102 / 25%);
  --border-strong: rgb(43 72 102 / 42%);
  --text-primary: #17283d;
  --text-secondary: #354b64;
  --text-muted: #536980;
  --brand-primary: #006e91;
  --brand-primary-hover: #005b78;
  --brand-primary-soft: rgb(0 110 145 / 10%);
  --brand-secondary: #925e00;
  --brand-secondary-soft: rgb(200 141 21 / 15%);
  --success: #077451;
  --warning: #895800;
  --error: #a82442;
  --info: #245db3;
  --focus-ring: #007caa;
  --shadow-sm: 0 .5rem 1.5rem rgb(41 67 91 / 10%);
  --shadow-md: 0 1.5rem 4rem rgb(41 67 91 / 16%);
  --formula-color-0: #006c90;
  --formula-color-1: #69429b;
  --formula-color-2: #a12b64;
  --formula-color-3: #926200;
  --formula-color-4: #087257;
  --formula-color-5: #a5461d;
  --formula-color-6: #315aab;
  --formula-color-7: #813f9b;
  --formula-color-8: #53750f;
  --formula-color-9: #007480;
}

html[data-theme="light"] body {
  background: radial-gradient(circle at 12% -8%, rgb(73 171 213 / 10%), transparent 34rem),
    radial-gradient(circle at 88% 18%, rgb(245 189 82 / 8%), transparent 28rem),
    var(--background);
  color: var(--text-primary);
}
html[data-theme="light"] ::selection { background: #c4e7f1; color: #17283d; }

.mi-theme-toggle {
  display: inline-flex;
  width: 2.5rem;
  height: 2.5rem;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: .55rem;
  background: transparent;
  color: #aeb3c0;
  cursor: pointer;
  transition: color 150ms ease, background-color 150ms ease;
}
.mi-theme-toggle:hover { color: #78dbf5; background: #1a2844; }
.mi-theme-toggle svg { width: 1.25rem; height: 1.25rem; }
.mi-theme-toggle__sun { display: none; }
html[data-theme="light"] .mi-theme-toggle__moon { display: none; }
html[data-theme="light"] .mi-theme-toggle__sun { display: block; }
.mi-mobile__theme { min-width: 8rem; }

html[data-theme="light"] .mi-header {
  border-bottom-color: #cbd8e5;
  background: #fff;
  color: #17283d;
}
html[data-theme="light"] .mi-nav__link,
html[data-theme="light"] .mi-nav__search,
html[data-theme="light"] .mi-theme-toggle { color: #40566f; }
html[data-theme="light"] .mi-nav__link:hover,
html[data-theme="light"] .mi-nav__link:focus-visible,
html[data-theme="light"] .mi-nav__link--active,
html[data-theme="light"] .mi-nav__search:hover,
html[data-theme="light"] .mi-theme-toggle:hover { background: #e4f2f8; color: #075e7a; }
html[data-theme="light"] .mi-account > summary,
html[data-theme="light"] .mi-mobile__toggle { border-color: #bdcede; background: #f2f7fb; color: #2d435b; }
html[data-theme="light"] .mi-account > summary:hover,
html[data-theme="light"] .mi-account[open] > summary { background: #e4f2f8; }
html[data-theme="light"] .mi-account__panel,
html[data-theme="light"] .mi-mobile__panel { border-color: #c5d3e1; background: #fff; box-shadow: 0 1rem 2.5rem rgb(41 67 91 / 18%); }
html[data-theme="light"] .mi-account__panel a,
html[data-theme="light"] .mi-account__panel button,
html[data-theme="light"] .mi-mobile__link,
html[data-theme="light"] .mi-mobile__utility a,
html[data-theme="light"] .mi-mobile__utility button { color: #283e56; }
html[data-theme="light"] .mi-account__panel a:hover,
html[data-theme="light"] .mi-account__panel button:hover,
html[data-theme="light"] .mi-mobile__link:hover,
html[data-theme="light"] .mi-mobile__utility a:hover,
html[data-theme="light"] .mi-mobile__utility button:hover,
html[data-theme="light"] .mi-mobile__link--active { background: #e4f2f8; color: #075e7a; }
html[data-theme="light"] .mi-mobile__utility { border-top-color: #cbd8e5; }
html[data-theme="light"] .mi-header a:focus-visible,
html[data-theme="light"] .mi-header button:focus-visible,
html[data-theme="light"] .mi-header summary:focus-visible { outline-color: #007caa; }

html[data-theme="light"] .global-search { background: #f5f8fc; color: #17283d; }
html[data-theme="light"] .global-search::backdrop { background: rgb(21 41 63 / 56%); }
html[data-theme="light"] .global-search__header { border-bottom-color: #ccd9e7; }
html[data-theme="light"] .global-search__close { color: #344b64; }
html[data-theme="light"] .global-search__close:hover { border-color: #007caa; color: #006e91; }
html[data-theme="light"] .global-search__input-wrap,
html[data-theme="light"] .global-search__filter,
html[data-theme="light"] .global-search__filter-options,
html[data-theme="light"] .global-search__result { border-color: #bdcede; background: #fff; color: #17283d; }
html[data-theme="light"] .global-search__input-wrap:focus-within { border-color: #007caa; box-shadow: 0 0 0 3px rgb(0 124 170 / 17%); }
html[data-theme="light"] .global-search__input-wrap svg { stroke: #006e91; }
html[data-theme="light"] .global-search input { color: #17283d; }
html[data-theme="light"] .global-search input::placeholder { color: #60748b; }
html[data-theme="light"] .global-search__filter:hover,
html[data-theme="light"] .global-search__filter[aria-expanded=true],
html[data-theme="light"] .global-search__filter-options button:hover,
html[data-theme="light"] .global-search__filter-options button[aria-pressed=true],
html[data-theme="light"] .global-search__result:hover,
html[data-theme="light"] .global-search__result:focus-visible { border-color: #007caa; background: #eaf4f9; color: #17283d; }
html[data-theme="light"] .global-search__filter-options button { color: #17283d; }
html[data-theme="light"] .global-search__results-head,
html[data-theme="light"] .global-search__context,
html[data-theme="light"] .global-search__description,
html[data-theme="light"] .global-search__message,
html[data-theme="light"] .global-search__message p { color: #435a72; }
html[data-theme="light"] .global-search__type { color: #006e91; }
html[data-theme="light"] .global-search button:focus-visible,
html[data-theme="light"] .global-search a:focus-visible { outline-color: #007caa; }

/* The YouTube image and embedded player keep their own black canvas. */
html[data-theme="light"] .mi-videos { background: #edf5fb; }
html[data-theme="light"] .mi-videos::before { background: linear-gradient(180deg, rgb(245 248 252 / 57%), rgb(245 248 252 / 82%) 58%, rgb(245 248 252 / 91%)); }
html[data-theme="light"] .mi-channel-stats,
html[data-theme="light"] .mi-video-info { border-color: #b9ccdd; background: rgb(255 255 255 / 88%); }
html[data-theme="light"] .mi-channel-stat + .mi-channel-stat { border-left-color: #cedbe7; }
html[data-theme="light"] .mi-channel-stat dd,
html[data-theme="light"] .mi-video-info h3 { color: #17283d; }
html[data-theme="light"] .mi-channel-stat dt,
html[data-theme="light"] .mi-video-info p:not(.mi-video-label),
html[data-theme="light"] .mi-video-loading { color: #435a72; }
html[data-theme="light"] .mi-channel-stat--videos svg { color: #007caa; }
html[data-theme="light"] .mi-channel-stat--subscribers svg,
html[data-theme="light"] .mi-video-label { color: #087257; }
html[data-theme="light"] .mi-channel-stat--views svg { color: #925e00; }
html[data-theme="light"] .mi-video-stage { border-color: #b9ccdd; background: #e7f0f7; }
html[data-theme="light"] .mi-video-nav { background: #e7f0f7; color: #17283d; }
html[data-theme="light"] .mi-video-nav span { border-color: #aabdd1; background: #fff; }
html[data-theme="light"] .mi-video-nav:not(:disabled):hover span { border-color: #007caa; background: #d6edf6; }
html[data-theme="light"] .mi-video-actions { background: #e7f1f7; }
html[data-theme="light"] .mi-video-action:focus-visible,
html[data-theme="light"] .mi-video-play:focus-visible,
html[data-theme="light"] .mi-video-nav:focus-visible { outline-color: #007caa; }

html[data-theme="light"] .mi-course-section { background: #f5f8fc; }
html[data-theme="light"] .mi-course-section h2 { color: #17283d; }
html[data-theme="light"] .mi-course-section p { color: #435a72; }
html[data-theme="light"] .mi-course-card { border-color: #bccddd; background: #fff; color: #17283d; box-shadow: 0 .5rem 1.5rem rgb(41 67 91 / 7%); }
html[data-theme="light"] .mi-course-card:focus-visible,
html[data-theme="light"] .mi-course-card:hover { border-color: #007caa; background: #eaf5fa; box-shadow: 0 0 0 2px rgb(0 124 170 / 20%), 0 1rem 2rem rgb(41 67 91 / 13%); }
html[data-theme="light"] .mi-course-caption > span:not(.mi-course-track) { color: #087257; }
html[data-theme="light"] .mi-course-track { background: #d9e5ee; box-shadow: inset 0 0 0 1px #a97617; }
html[data-theme="light"] .mi-legacy-footer { border-color: #d5e1eb; background: #eaf1f8; color: #435a72; }
html[data-theme="light"] .mi-legacy-footer h2,
html[data-theme="light"] .mi-legacy-footer .mi-social-links { color: #354b64; }
html[data-theme="light"] .mi-legacy-footer .bg-gray-800 { background: #c5d3e1; }
html[data-theme="light"] .mi-legacy-footer .text-gray-500,
html[data-theme="light"] .mi-legacy-footer .text-gray-700 { color: #536980; }
html[data-theme="light"] .mi-social-link:hover,
html[data-theme="light"] .mi-social-link:focus-visible { color: #006e91; }

@media (prefers-reduced-motion: reduce) {
  .mi-theme-toggle { transition: none; }
}
