/* Theme controls stay in the page flow on every screen. */
html { color-scheme: dark; }
.hero-preferences { display: flex; justify-content: flex-end; align-items: center; min-height: 44px; margin-bottom: 16px; }
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; padding: 6px 8px; border: 1px solid transparent; border-radius: 12px; background: transparent; color: var(--muted); font: 600 .875rem/1.5 Manrope, Arial, sans-serif; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color .3s, color .3s, border-color .3s; }
.theme-toggle:hover { color: #F9F9F9; background-color: #33333355; }
.theme-toggle:focus-visible { outline: 2px solid var(--sand); outline-offset: 3px; }
.theme-track { position: relative; display: block; flex: 0 0 56px; width: 56px; height: 30px; border: 1px solid #646464; border-radius: 99px; background: #333333; transition: background-color .35s, border-color .35s; }
.theme-thumb { position: absolute; top: 2px; left: 2px; width: 24px; height: 24px; border-radius: 50%; background: #F9F9F9; color: #100C08; box-shadow: 0 1px 4px #00000033; transform: translateX(0); transition: transform .35s var(--ease-soft), background-color .35s; }
.theme-thumb svg { position: absolute; inset: 4px; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; transition: opacity .3s, transform .35s; }
.theme-sun { opacity: 0; transform: rotate(-45deg); }
.theme-moon { opacity: 1; }
.theme-toggle[aria-checked="true"] .theme-track { background: #FF9408; border-color: #CA3F16; }
.theme-toggle[aria-checked="true"] .theme-thumb { transform: translateX(26px); background: #F3F4F5; }
.theme-toggle[aria-checked="true"] .theme-sun { opacity: 1; transform: rotate(0); }
.theme-toggle[aria-checked="true"] .theme-moon { opacity: 0; transform: rotate(45deg); }

/* The supplied light palette, with the original artwork left in its own colors. */
html[data-theme="light"] {
  color-scheme: light;
  background-color: #F3F4F5;
  --bg: #F3F4F5;
  --text: #100C08;
  --muted: #95122C;
  --orange: #CA3F16;
  --flame: #CA3F16;
  --red: #95122C;
  --surface: #DBE0E1;
  --sand: #95122C;
  --border: #DBE0E1;
  --brand-gradient: linear-gradient(135deg, #FF9408, #CA3F16 55%, #95122C);
}
html[data-theme="light"] body {
  background-color: #F3F4F5;
  color: #100C08;
  background-image: radial-gradient(ellipse at 55% 4%, #FF940814, transparent 32%), linear-gradient(#DBE0E180 1px, transparent 1px), linear-gradient(90deg, #DBE0E180 1px, transparent 1px);
}
body { transition: background-color .35s, color .35s; }
html[data-theme="light"] .page-lights { opacity: .32; }
html[data-theme="light"] .glow-warm i { background: radial-gradient(ellipse at 50% 50%, #FF940859, transparent 62%); }
html[data-theme="light"] .glow-red i { background: radial-gradient(ellipse at 50% 50%, #95122C26, transparent 62%); }
html[data-theme="light"] .cursor-light { background: radial-gradient(420px circle at var(--cursor-x, 65%) var(--cursor-y, 35%), #FF940826, transparent 72%); }
html[data-theme="light"] .theme-toggle { color: #95122C; }
html[data-theme="light"] .theme-toggle:hover { background-color: #DBE0E180; color: #100C08; }
html[data-theme="light"] .hero-version,
html[data-theme="light"] .online,
html[data-theme="light"] .play-hint { color: #95122C; }
html[data-theme="light"] .hero-description,
html[data-theme="light"] .hero-intro,
html[data-theme="light"] .world-copy p { color: #100C08; }
html[data-theme="light"] .hero-title .brand-word { color: #CA3F16; text-shadow: 0 0 12px #FF940833; }
html[data-theme="light"] .hero-title .brand-word > span { animation-name: light-letter-shimmer; }
html[data-theme="light"] .hero-title:hover .brand-word > span { animation-name: light-word-hover; }
html[data-theme="light"] .brand-sign:hover .brand-word { filter: drop-shadow(0 0 12px #FF940826); }
@keyframes light-letter-shimmer {
  0%, 32%, 100% { color: #CA3F16; text-shadow: 0 0 12px #FF940833; }
  44%, 55% { color: #95122C; text-shadow: 0 0 16px #FF94084D; }
  72% { color: #100C08; text-shadow: 0 0 10px #CA3F1626; }
}
@keyframes light-word-hover {
  0%, 100% { color: #95122C; text-shadow: 0 0 14px #FF94084D; }
  35% { color: #CA3F16; text-shadow: 0 0 18px #FF940859; }
  65% { color: #100C08; text-shadow: 0 0 12px #CA3F1633; }
}
html[data-theme="light"] .play-button,
html[data-theme="light"] .orange-button {
  background-color: #FF9408;
  background-image: linear-gradient(115deg, #FF9408 15%, #FF9408 38%, #F3F4F5 50%, #FF9408 62%, #CA3F16 110%);
  color: #100C08;
  border-color: #CA3F16;
  box-shadow: inset 0 1px 0 #F3F4F5CC, 0 8px 26px #CA3F1626;
}
html[data-theme="light"] .play-button:hover,
html[data-theme="light"] .play-button:focus-visible,
html[data-theme="light"] .orange-button:hover,
html[data-theme="light"] .orange-button:focus-visible { box-shadow: inset 0 1px 0 #F3F4F5CC, 0 10px 32px #CA3F1640; }
html[data-theme="light"] .render-card:before {
  border-color: #DBE0E1;
  background: radial-gradient(ellipse at 65% 110%, #FF940833, transparent 62%), linear-gradient(135deg, #F3F4F5, #DBE0E1);
}
html[data-theme="light"] .render-card:after { background: radial-gradient(ellipse at 50% 65%, #FF940826, transparent 72%); }
html[data-theme="light"] .render-card:hover:before,
html[data-theme="light"] .render-card:focus-visible:before { border-color: #CA3F16; box-shadow: 0 10px 24px #100C0814; }
html[data-theme="light"] .render-card .render-label,
html[data-theme="light"] .artifact-carousel--hero .render-label { color: #100C08; background: none; text-shadow: none; }
html[data-theme="light"] .hero-bottom,
html[data-theme="light"] .feature-grid article,
html[data-theme="light"] footer { border-color: #DBE0E1; }
html[data-theme="light"] .server-address { color: #100C08; background: #F3F4F5B3; border-color: #DBE0E1; }
html[data-theme="light"] .server-address small,
html[data-theme="light"] .next-section,
html[data-theme="light"] .motion-toggle { color: #95122C; }
html[data-theme="light"] .server-address:hover,
html[data-theme="light"] .motion-toggle:hover { border-color: #CA3F16; background-color: #FF940814; }
html[data-theme="light"] .motion-toggle { border-color: #DBE0E1; }
html[data-theme="light"] .motion-indicator { background: #CA3F16; box-shadow: 0 0 8px #FF940840; }
html[data-theme="light"] .motion-toggle[aria-pressed="false"] .motion-indicator { background: #95122C; box-shadow: none; }
html[data-theme="light"] .section-rail,
html[data-theme="light"] .section-rail span:last-child,
html[data-theme="light"] .feature-heading p,
html[data-theme="light"] .world-summary { color: #95122C; }
html[data-theme="light"] .root-line,
html[data-theme="light"] .branch-line,
html[data-theme="light"] .world-lines i,
html[data-theme="light"] .world-lines i:after { border-color: #95122C40; }
html[data-theme="light"] .world-tile:before {
  border-color: #CA3F16;
  background: radial-gradient(ellipse at 72% 123%, #FF940840, transparent 62%), linear-gradient(135deg, #F3F4F5, #DBE0E1);
  box-shadow: inset 0 1px 0 #F3F4F5, 0 10px 25px #100C0814;
}
html[data-theme="light"] .world-tile:after { background: radial-gradient(ellipse at 60% 85%, #FF940833, transparent 72%); }
html[data-theme="light"] .world-tile:hover:before,
html[data-theme="light"] .world-tile:focus-visible:before { border-color: #FF9408; box-shadow: inset 0 1px 0 #F3F4F5, 0 10px 25px #CA3F1626; }
html[data-theme="light"] .world-tile .world-label,
html[data-theme="light"] .world-tile:hover .world-label,
html[data-theme="light"] .world-tile:focus-visible .world-label { color: #100C08; background: #F3F4F5; box-shadow: inset 0 0 0 1px #DBE0E1; }
html[data-theme="light"] .world-tile .world-cta { color: #95122C; }
html[data-theme="light"] .panorama,
html[data-theme="light"] .feature-image,
html[data-theme="light"] .feature-image.tall,
html[data-theme="light"] .feature-stack .feature-image { background: #DBE0E1; border-color: #DBE0E1; }
html[data-theme="light"] .panorama:hover,
html[data-theme="light"] .feature-image:hover { border-color: #CA3F16; }
html[data-theme="light"] .panorama span { color: #100C08; background: #F3F4F5E6; border-color: #DBE0E1; }
html[data-theme="light"] .artifact-carousel { border-color: #DBE0E1; background: radial-gradient(ellipse at 50% 100%, #FF940826, transparent 62%), #F3F4F580; }
html[data-theme="light"] .carousel-stage:before { background: radial-gradient(ellipse, #FF940826, transparent 68%); border-color: #CA3F1626; }
html[data-theme="light"] .carousel-slide svg { filter: drop-shadow(0 8px 9px #100C0826); }
html[data-theme="light"] .carousel-slide:hover svg,
html[data-theme="light"] .carousel-slide:focus-visible svg { filter: drop-shadow(0 5px 11px #CA3F1640); }
html[data-theme="light"] .carousel-arrow,
html[data-theme="light"] .carousel-pause,
html[data-theme="light"] .item-switches button { color: #95122C; background: #F3F4F5; border-color: #DBE0E1; }
html[data-theme="light"] .carousel-arrow:hover,
html[data-theme="light"] .carousel-pause:hover,
html[data-theme="light"] .item-switches button:hover { border-color: #CA3F16; background: #FF94081A; }
html[data-theme="light"] .carousel-count,
html[data-theme="light"] .item-switches span { color: #95122C; }
html[data-theme="light"] .gallery-card > .gallery-photo { border-color: #DBE0E1; background: #DBE0E1; }
html[data-theme="light"] .gallery-card:hover .gallery-photo,
html[data-theme="light"] .gallery-card:focus-visible .gallery-photo { border-color: #CA3F16; }
html[data-theme="light"] .gallery-caption strong { color: #100C08; }
html[data-theme="light"] .gallery-caption small,
html[data-theme="light"] .gallery-card svg { color: #95122C; }
html[data-theme="light"] .gallery-card:hover .gallery-caption strong { color: #95122C; }
html[data-theme="light"] .footer-top > button,
html[data-theme="light"] .footer-top strong { color: #100C08; }
html[data-theme="light"] .footer-top nav a,
html[data-theme="light"] .footer-top nav button,
html[data-theme="light"] .footer-main > p { color: #95122C; }
html[data-theme="light"] .side-logo img,
html[data-theme="light"] .footer-logo img { background: #100C08; padding: 3px; }
html[data-theme="light"] .sidebar { background: #F3F4F5; border-color: #DBE0E1; box-shadow: 0 8px 30px #100C0814; }
html[data-theme="light"] .nav-item { color: #95122C; }
html[data-theme="light"] .nav-item:hover,
html[data-theme="light"] .nav-item:focus-visible { color: #100C08; }
html[data-theme="light"] .nav-item.active { color: #CA3F16; background: linear-gradient(90deg, #FF94081A, transparent); }
html[data-theme="light"] .nav-item.active svg { filter: drop-shadow(0 0 5px #FF940826); }
html[data-theme="light"] dialog { color: #100C08; background: linear-gradient(145deg, #F3F4F5, #DBE0E1); border-color: #DBE0E1; box-shadow: 0 25px 100px #100C0826; }
html[data-theme="light"] dialog::backdrop { background: #100C0859; }
html[data-theme="light"] .dialog-close { color: #100C08; background: #DBE0E1; }
html[data-theme="light"] .dialog-kicker,
html[data-theme="light"] .dialog-lead,
html[data-theme="light"] li p,
html[data-theme="light"] .world-dialog-note { color: #95122C; }
html[data-theme="light"] .copy-field { background: #F3F4F5; border-color: #DBE0E1; }
html[data-theme="light"] .server-ip { color: #100C08; }
html[data-theme="light"] .copy-field-action { color: #100C08; background: #DBE0E1; border-color: #DBE0E1; }
html[data-theme="light"] [data-copy].is-copied { border-color: #95122C; }
html[data-theme="light"] .team-grid button { border-color: #DBE0E1; }
html[data-theme="light"] .team-grid button:hover,
html[data-theme="light"] .team-grid button:focus-visible { border-color: #CA3F16; }
html[data-theme="light"] .item-dialog-stage { border-color: #DBE0E1; background-image: radial-gradient(ellipse at 50% 60%, #FF940833, transparent 65%), linear-gradient(#DBE0E1 1px, transparent 1px), linear-gradient(90deg, #DBE0E1 1px, transparent 1px); }
html[data-theme="light"] .lightbox-frame { background: #DBE0E1; }
html[data-theme="light"] .image-status,
html[data-theme="light"] .image-dialog > p { color: #95122C; }
html[data-theme="light"] .image-status.is-loading:before { border-color: #DBE0E1; border-top-color: #CA3F16; }
html[data-theme="light"] .image-fallback { color: #95122C; background: #F3F4F5; }
html[data-theme="light"] .quiet-button { color: #100C08; border-color: #DBE0E1; background: #F3F4F5; }
html[data-theme="light"] .quiet-button:hover { background: #FF94081A; border-color: #CA3F16; }
html[data-theme="light"] #toast { background: #100C08; color: #F3F4F5; box-shadow: 0 10px 40px #100C0826; }
html[data-theme="light"] :focus-visible { outline-color: #95122C; }
html[data-theme="light"][data-motion="reduced"] .brand-word > span { color: #CA3F16; }
html[data-motion="reduced"] .theme-toggle,
html[data-motion="reduced"] .theme-track,
html[data-motion="reduced"] .theme-thumb,
html[data-motion="reduced"] .theme-thumb svg,
html[data-motion="reduced"] body { transition: none; }
@media (prefers-reduced-motion: reduce) {
  html:not([data-motion="full"]) .theme-toggle,
  html:not([data-motion="full"]) .theme-track,
  html:not([data-motion="full"]) .theme-thumb,
  html:not([data-motion="full"]) .theme-thumb svg,
  html:not([data-motion="full"]) body { transition: none; }
  html[data-theme="light"]:not([data-motion="full"]) .brand-word > span { color: #CA3F16; }
}
@media (max-width: 639px) {
  .hero-preferences { margin-bottom: 20px; }
}
