/* The work leads. Existing Scienshell type, colors and native controls remain. */
.world-hero { position:relative; isolation:isolate; min-height:580px; height:min(760px,calc(100svh - 130px)); overflow:hidden; background:#0b1219; }
.world-hero-art { position:absolute; inset:0; z-index:-2; }
.world-hero-art img,.world-hero-art video { width:100%; height:100%; object-fit:cover; object-position:center; }
.world-hero-art video { position:absolute; inset:0; opacity:0; }
.world-hero.has-scene .world-hero-art video { opacity:1; }
.world-hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(5,7,11,.05) 25%,rgba(5,7,11,.25) 48%,rgba(5,7,11,.92) 90%); }
.world-hero-content { position:absolute; inset:auto 54px 42px; display:flex; align-items:end; justify-content:space-between; gap:64px; }
.world-hero-intro { max-width:650px; }
.world-hero h1 { font-size:clamp(44px,5.3vw,76px); line-height:1.08; margin:0 0 22px; letter-spacing:-.03em; }
.world-hero-intro > p { font-size:16px; line-height:1.65; max-width:40ch; margin:0 0 22px; color:#e0ebf1; }
.world-map-link { display:inline-flex; align-items:center; gap:12px; min-height:44px; color:#c9e2ed; font-size:12px; }
.world-map-link:hover { color:#fff; }
.world-hero-film { width:330px; flex:none; padding-bottom:9px; }
.world-hero-film h2 { font-size:30px; margin:0 0 13px; }
.world-hero-film > p { color:#d0dfe8; font-size:13px; max-width:32ch; margin:0 0 23px; }
.world-hero-actions { display:flex; align-items:center; gap:24px; }
.world-hero-actions .button { min-width:132px; }
.world-hero-actions .text-link { min-height:48px; font-size:12px; color:#e0eef5; }
.world-hero-film .world-hero-credit { font-size:11px; color:#c0d3df; margin:20px 0 0; }
.scene-toggle { position:absolute; top:24px; right:36px; display:inline-flex; align-items:center; gap:9px; min-height:44px; padding:8px 15px; border:1px solid #637585; border-radius:999px; background:#05070be0; color:#e1eff5; font-size:11px; }
.scene-toggle:hover { background:#203342; }
.scene-toggle[hidden] { display:none; }
.story-map { margin-top:92px; }
.story-map-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:30px; }
.story-map-heading h2 { font-size:clamp(34px,3.7vw,54px); margin:0; }
.story-map-heading p { max-width:47ch; color:var(--muted); font-size:13px; margin:0; }
.story-map .map-shortcuts { max-width:1180px; margin:0 auto 22px; border:0; padding:0; }
.story-map .map-shortcut-list { display:flex; width:100%; gap:0; padding:0; }
.story-map .map-shortcut-list button { position:relative; flex:1; display:grid; justify-content:center; gap:4px; min-width:135px; min-height:70px; padding:10px 20px; text-align:left; white-space:normal; border:0; border-bottom:1px solid #405564; border-radius:0; background:none; color:#b1c6d2; }
.story-map .map-shortcut-list button::after { content:""; position:absolute; bottom:-1px; left:0; right:0; height:2px; background:var(--blue); transform:scaleX(0); transition:transform .18s ease-out; }
.story-map .map-shortcut-list button[aria-pressed="true"] { color:#edf6fa; }
.story-map .map-shortcut-list button[aria-pressed="true"]::after { transform:scaleX(1); }
.story-map .map-shortcut-list button:hover { color:#fff; background:#101b24; }
.story-map .map-shortcut-list button span { font-size:11px; }
.story-map .map-shortcut-list button strong { font-size:16px; font-weight:400; }
.story-map .map-composition { grid-template-columns:minmax(0,1fr) 340px; max-width:1380px; margin:0 auto; min-height:0; padding:0 44px 28px 0; gap:36px; }
.story-map .selected-film { padding:0; align-self:center; }
.story-map .selected-film-image { aspect-ratio:21/9; border-radius:12px; }
.story-map .selected-film-meta { font-size:10px; margin:18px 0 12px; }
.story-map .selected-film h3 { font-size:29px; margin:0; }
.story-map .selected-film-desc { margin:16px 0 23px; font-size:12px; }
.story-map .selected-actions { grid-template-columns:1fr 1fr; }
.selected-film.is-arriving h3 { animation:title-arrives .34s cubic-bezier(.16,1,.3,1); }
.episode-rail--story { gap:28px; }
.episode-rail--story .episode-card { flex-basis:min(480px,76vw); }
.episode-rail--story .cover-link { aspect-ratio:21/9; }
.episode-rail--story .card-meta { color:#abc4d2; font-size:11px; }
.episode-rail--story .episode-card .card-meta span:last-child { color:#abc4d2; }
.episode-rail--story .cover-link img,.episode-rail--story .episode-card .cover-link:hover img { transform:none; }
.motion-season-active .episode-rail--story .cover-link img,.motion-season-active .episode-rail--story .episode-card .cover-link:hover img { transform:none; }
.episode-rail--story h3 { font-size:25px; max-width:30ch; }
.episode-rail--story .text-link { min-height:44px; margin-top:12px; }
.film-journey .chapter-heading p { max-width:65ch; }
.rail-instruction { margin:8px 0 0; color:var(--muted); font-size:11px; }
.continue-worlds { border-top:1px solid var(--line); padding-top:60px; }
.continue-worlds h2 { font-size:42px; margin:0 0 20px; }
.continue-worlds > p { max-width:58ch; font-size:14px; color:var(--muted); margin:0 0 26px; }
.continue-worlds > div { display:flex; align-items:center; gap:30px; }
.continue-worlds .text-link { font-size:13px; min-height:48px; }
@media (max-width:1200px) {
  .story-map .map-shortcuts { margin-inline:40px; }
  .world-hero-content { inset-inline:40px; gap:40px; }
  .world-hero-film { width:290px; }
}
@media (max-width:1000px) {
  .story-map .map-composition { grid-template-columns:minmax(0,1fr) 290px; gap:14px; padding-right:24px; }
  .story-map .map-shortcuts { margin-inline:24px; }
  .world-hero-content { inset-inline:26px; gap:30px; }
  .world-hero-intro { max-width:460px; }
  .world-hero-intro > p { font-size:14px; }
  .world-hero-film { width:260px; }
  .world-hero-film h2 { font-size:26px; }
  .world-hero-actions { gap:16px; }
}
@media (max-width:700px) {
  .world-hero { height:auto; min-height:0; max-height:none; background:var(--bg); }
  .world-hero-art { position:relative; inset:auto; z-index:auto; aspect-ratio:1600/670; width:100%; }
  .world-hero-art img,.world-hero-art video { object-fit:contain; object-position:center; }
  .world-hero::before { display:none; }
  .world-hero-content { position:relative; inset:auto; display:block; padding:26px 20px 28px; }
  .world-hero h1 { font-size:clamp(38px,8.3vw,52px); margin-bottom:14px; max-width:16ch; }
  .world-hero-intro > p { font-size:13px; line-height:1.65; max-width:42ch; margin-bottom:7px; }
  .world-map-link { font-size:11px; min-height:44px; }
  .world-hero-film { width:100%; padding:18px 0 0; margin-top:8px; border-top:1px solid #596776; }
  .world-hero-film h2 { font-size:23px; margin-bottom:10px; }
  .world-hero-film > p:not(.world-hero-credit) { display:none; }
  .world-hero-actions { gap:26px; }
  .world-hero-actions .button { min-width:130px; }
  .world-hero-film .world-hero-credit { font-size:10px; margin-top:12px; }
  .scene-toggle { right:12px; top:12px; z-index:2; width:44px; padding:10px; justify-content:center; }
  .scene-toggle span { display:none; }
  .story-map { margin-top:62px; }
  .story-map-heading { display:block; margin-bottom:22px; }
  .story-map-heading h2 { font-size:32px; margin-bottom:18px; }
  .story-map-heading p { font-size:12px; max-width:45ch; }
  .story-map .map-shortcuts { margin:0 20px 8px; }
  .story-map .map-shortcut-list { padding-bottom:2px; }
  .story-map .map-shortcut-list button { flex:0 0 134px; padding-inline:12px; }
  .story-map .map-shortcut-list button strong { font-size:14px; }
  .story-map .map-composition { display:flex; flex-direction:column; padding:0; gap:0; }
  .story-map .selected-film { padding:0 20px 20px; }
  .story-map .selected-film h3 { font-size:28px; }
  .story-map .selected-film-meta { font-size:11px; }
  .story-map .selected-film-desc { font-size:13px; margin-bottom:20px; }
  .episode-rail--story { gap:20px; }
  .episode-rail--story .episode-card { flex-basis:82vw; }
  .episode-rail--story h3 { font-size:22px; }
  .continue-worlds { padding-top:42px; }
  .continue-worlds h2 { font-size:32px; }
  .continue-worlds > div { flex-wrap:wrap; gap:16px 24px; }
}
@media (prefers-reduced-motion:reduce) {
  .selected-film.is-arriving h3 { animation:none; }
  .story-map .map-shortcut-list button::after { transition:none; }
}
