/* Theme roles: preserve the existing night scene; give daylight its own neutrals. */
:root {
  --theme-text: #ffffff;
  --theme-muted: #babcd9;
  --theme-subtle: #a5a8c5;
  --theme-line: #ffffff22;
  --theme-surface: #1b1d3c;
  --theme-accent: #c895f5;
  --velaris-color-1: #0a84ff;
  --velaris-color-2: #5e5ce6;
  --velaris-color-3: #bf5af2;
  --velaris-color-4: #19163c;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #ffffff;
  --text: #232333;
  --fog: #5c5e73;
  --card: #f7f7fc;
  --muted: #5c5e73;
  --accent: #772dc5;
  --accent-hover: #61219f;
  --green: #23834b;
  --line: #dfdeea;
  --theme-text: #232333;
  --theme-muted: #5c5e73;
  --theme-subtle: #67697b;
  --theme-line: #dfdeea;
  --theme-surface: #f7f7fc;
  --theme-accent: #772dc5;
  --velaris-color-1: #e6efff;
  --velaris-color-2: #eee7ff;
  --velaris-color-3: #f5eaff;
  --velaris-color-4: #f9f8ff;
}
:root[data-theme="dark"] { color-scheme: dark; }

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--theme-line);
  border-radius: 50%;
  color: var(--theme-text);
  background: #ffffff08;
  cursor: pointer;
  touch-action: manipulation;
  transition: background-color 140ms, border-color 140ms;
}
.theme-toggle:hover { background: #ffffff12; border-color: var(--theme-accent); }
.theme-toggle:focus-visible { outline: 2px solid var(--theme-accent); outline-offset: 3px; }
.theme-toggle svg { width: 20px; height: 20px; pointer-events: none; }
.theme-icon-moon { display: none; }
[data-theme="light"] .theme-icon-sun { display: none; }
[data-theme="light"] .theme-icon-moon { display: block; }
[data-theme="light"] .theme-toggle { background: #f5f3fc; }
[data-theme="light"] .theme-toggle:hover { background: #eae2f8; }
.document-header-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.document-header-row .brand { min-width: 0; }

/* Shared navigation, text and controls. */
[data-theme="light"] .site-header { background: #ffffffe6; border-bottom-color: #e9e7f1; }
[data-theme="light"] .site-header.is-scrolled { background: #fffffff2; }
[data-theme="light"] .main-nav a { color: #4f5063; }
[data-theme="light"] .main-nav a:hover,
[data-theme="light"] .language .active,
[data-theme="light"] .language button:hover { color: var(--theme-text); }
[data-theme="light"] .language button { color: #69697e; }
[data-theme="light"] .eyebrow,
[data-theme="light"] .section-number { color: #565368; }
[data-theme="light"] .hero-description,
[data-theme="light"] .hero-note,
[data-theme="light"] .hero .motion-link,
[data-theme="light"] .portal-hint,
[data-theme="light"] .hero-bottom,
[data-theme="light"] .demo-caption { color: var(--theme-muted); }
[data-theme="light"] .portal-hint::before { background: var(--theme-accent); }
[data-theme="light"] .motion-link > span:first-child,
[data-theme="light"] .hero-bottom a { border-color: #77718c60; }
[data-theme="light"] .hero-bottom a { color: var(--theme-text); }
[data-theme="light"] .motion-link:hover { color: var(--theme-accent); }
[data-theme="light"] .motion-toggle {
  color: #4f4d63; background: #fffffff0; border-color: #d8d4e4;
  box-shadow: 0 4px 18px #28203c12;
}
[data-theme="light"] .motion-toggle:hover { background: #f2ecfb; }
[data-theme="light"] .motion-toggle[aria-pressed="true"] .motion-status-dot { background: #26734f; }
[data-theme="light"] .reading-progress span { background: var(--theme-accent); }
[data-theme="light"] :focus-visible { outline-color: var(--theme-accent); }

/* Daylight version of the same moving backdrop, with clean white edges. */
[data-theme="light"] .velaris-background {
  background: radial-gradient(ellipse at 75% 35%,#e9e0fc,transparent 65%),
    radial-gradient(ellipse at 25% 65%,#edf0fc,transparent 65%),#ffffff;
}
[data-theme="light"] .velaris-background::after {
  background: linear-gradient(90deg,#fffffff0 0%,#ffffff66 49%,#ffffff1a 80%),
    linear-gradient(180deg,#ffffff4d 0%,transparent 20%,transparent 67%,#ffffff 100%);
}
[data-theme="light"] .hero > .stars { opacity: .12; }
[data-theme="light"] .menu-toggle { border-color: #d8d1e5; }
[data-theme="light"] .menu-toggle span { background: var(--theme-text); }
[data-theme="light"] #hero-title .hero-brand-emphasis { color: #8b2bd1; }
[data-theme="light"] .hero-title-wrap[data-liquid-ready="true"] #hero-title .hero-brand-emphasis { color: transparent; }
[data-theme="light"] .hero-brand-tint { background: #982ce1; }

/* Color belongs to the same sections in both themes. */
[data-theme="light"] .feature-strip { background: #f8f6fd; border-color: #e8e4f1; color: #575169; }
[data-theme="light"] .feature-strip i { color: #8c5bc2; }
[data-theme="light"] .stage-schedule { background: radial-gradient(at 95% 20%,#e6ddfb,transparent 60%),#f1eef9; }
[data-theme="light"] .stage-journal { background: radial-gradient(at 0% 80%,#d4eadc,transparent 62%),#edf5f0; }
[data-theme="light"] .stage-materials { background: radial-gradient(at 90% 0%,#f1dfef,transparent 60%),#faf0f6; }
[data-theme="light"] .stage-copy p { color: #58586c; }
[data-theme="light"] .feature-tags span { color: #505164; border-color: #73738b40; }
[data-theme="light"] .team-details > p,
[data-theme="light"] .team-facts span { color: var(--theme-muted); }
[data-theme="light"] .start-section { background: linear-gradient(120deg,#f4f0fb,#f8f7fc); }
[data-theme="light"] .start-heading > p:last-child,
[data-theme="light"] .start-steps p { color: var(--theme-muted); }
[data-theme="light"] .step-count,
[data-theme="light"] .start-step-card .step-count { color: var(--theme-accent); }
[data-theme="light"] .spotlight-card {
  background: #ffffffb3; border-color: #dfd8ec;
  box-shadow: 0 16px 32px -16px #4c366726;
}
[data-theme="light"] .faq-list details { border-color: var(--theme-line); }
[data-theme="light"] .faq-list summary::after { color: #6b657c; }
[data-theme="light"] .closing-section {
  background: radial-gradient(ellipse at 75% 55%,#eee1fc 0%,#f5f3fc 46%,#ffffff 85%);
}
[data-theme="light"] .closing-word {
  --neon-gradient: linear-gradient(105deg,#772dc5 0%,#6853d5 20%,#9135d5 40%,#c039ac 50%,#7541cf 68%,#236ac8 100%);
}
[data-theme="light"] .footer-main p,
[data-theme="light"] .footer-links,
[data-theme="light"] .footer-bottom { color: var(--theme-muted); }
[data-theme="light"] .footer-links a:hover { color: var(--theme-accent); }
[data-theme="light"] .footer-bottom { border-color: var(--theme-line); }

/* The real app pixels and the film stay untouched. */
[data-theme="light"] .app-shot { box-shadow: 0 24px 48px #24213d22; }
[data-theme="light"] .character-scene { --scene-accent: #8f4fd2; }
[data-theme="light"] .character-scene.is-engaged .app-shot { border-color: var(--scene-accent); }
[data-theme="light"] .buddy-cue { color: #5b566b; border-color: #77718c50; }
[data-theme="light"] .buddy:hover .buddy-cue,
[data-theme="light"] .buddy:focus-visible .buddy-cue { color: #752cb9; border-color: #8f4fd2; }
[data-theme="light"] .scene-ledge {
  border-color: #9c8caf44; border-top-color: #8d74ad80;
  background: linear-gradient(180deg,#aa85d31f,#8a739812);
  box-shadow: 0 14px 24px #4533571a;
}
[data-theme="light"] .character-scene.is-engaged .scene-ledge,
[data-theme="light"] .character-scene.has-answer .scene-ledge { border-top-color: #8f4fd2; }
[data-theme="light"] .screen-viewer { background: #f8f7fc; color: var(--theme-text); border-color: #dcd8e7; }
[data-theme="light"] .screen-viewer::backdrop { background: #eeedf3e8; }
[data-theme="light"] .viewer-close { background: #eeebf5; color: var(--theme-text); border-color: #d8d1e5; }
[data-theme="light"] .teaser-heading h2 span { color: #8b2bd1; }
[data-theme="light"] .teaser-intro > p,
[data-theme="light"] .teaser-duration,
[data-theme="light"] .teaser-note { color: var(--theme-muted); }
[data-theme="light"] .teaser-chapters button { color: #676276; }
[data-theme="light"] .teaser-chapters button:hover,
[data-theme="light"] .teaser-chapters button[aria-pressed="true"] { color: #7428b9; }
[data-theme="light"] .teaser-player { box-shadow: 0 24px 60px #3e30531a; border: 1px solid #ece9f1; }

/* The supplied gloss effect follows the theme's surface and text roles. */
[data-theme="light"] .shiny-cta:is(a,button) {
  --shiny-bg: #752bc1; --shiny-edge: #8d4ed0;
  --shiny-highlight: #c894f1; --shiny-highlight-soft: #e5ceff;
  color: #ffffff;
}
[data-theme="light"] .shiny-cta.shiny-cta--secondary {
  --shiny-bg: #ffffff; --shiny-edge: #d9cfe8;
  --shiny-highlight: #ad78dd; --shiny-highlight-soft: #cba5ed;
  color: #372348;
}

/* Portal and document pages share the same theme state. */
[data-theme="light"] .portal-copy .eyebrow,
[data-theme="light"] .portal-description,
[data-theme="light"] .portal-actions .text-link,
[data-theme="light"] .portal-art-label > span:last-child,
[data-theme="light"] .portal-college,
[data-theme="light"] .portal-footer { color: var(--theme-muted); }
[data-theme="light"] .portal-status { color: #6d2aae; border-color: #c3a5e466; background: #f1e9fb; }
[data-theme="light"] .portal-art::before { background: radial-gradient(circle,#d8baff66,transparent 68%); }
[data-theme="light"] .portal-ring { border-color: #9779bd2b; }
[data-theme="light"] .portal-motion { color: var(--theme-muted); border-color: var(--theme-line); }
[data-theme="light"] .portal-motion:hover { background: #f3ecfb; }
[data-theme="light"] .portal-footer { border-color: var(--theme-line); }

@media (max-width: 640px) {
  .nav-wrap { gap: 12px; }
  .nav-actions { gap: 6px; }
  .portal-header-actions { gap: 10px; }
  .portal-about { display: none; }
  .document-header-row { gap: 12px; align-items: flex-start; }
  [data-theme="light"] .main-nav { background: #fffffff5; border-color: #e4ddec; box-shadow: 0 12px 32px #44305216; }
  [data-theme="light"] .main-nav .mobile-portal-entry { border-top-color: #e4ddec; }
}
@media (max-width: 360px) {
  .nav-wrap { gap: 8px; }
  .nav-wrap .brand { font-size: 24px; gap: 8px; }
  .nav-wrap .brand img { width: 32px; height: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .theme-toggle { transition: none; }
  [data-theme="light"] .hero-title-wrap[data-liquid-ready="true"] #hero-title { color: var(--theme-text); }
  [data-theme="light"] .hero-title-wrap[data-liquid-ready="true"] #hero-title .hero-brand-emphasis { color: #8b2bd1; }
}