@import url("./magnificent.css?v=7");

/* Version 5: artwork, chapter navigation, and the human story. */
.portal-grid .portal-feature { grid-column: span 2; background: linear-gradient(135deg,#071321,#123747); color: var(--cloud); }
.portal-grid .portal-feature:hover { background: linear-gradient(135deg,#0b2130,#185064); }
.portal-grid .portal-feature span { color: var(--signal); }
.portal-grid .portal-feature p { max-width: 62ch; color: var(--mist); }
[data-episode-movement][hidden], [data-season-controls][hidden] { display: none !important; }
.season-controls { width: min(var(--max), 100%); margin: 0 auto 2rem; }
.season-filters { display: flex; flex-wrap: wrap; gap: .55rem; }
.season-filters button { min-height: 48px; padding: .75rem 1rem; border: 1px solid var(--line); border-radius: 0; background: transparent; color: var(--cloud); font: 700 .875rem/1.4 var(--sans); cursor: pointer; }
.season-filters button:hover { border-color: var(--signal); }
.season-filters button[aria-pressed="true"] { background: var(--signal); border-color: var(--signal); color: var(--night); }
.season-status { max-width: 72ch; min-height: 3.3em; margin: 1rem 0 0; color: var(--mist); font-size: 1rem; }
.season-note { width: min(var(--max), 100%); margin: 0 auto 1.5rem; color: var(--mist); font-size: .875rem; }
.episode .episode-body { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding: 0 0 2rem; gap: clamp(1.25rem, 3vw, 3rem); align-items: center; }
.episode-art { margin: 0; align-self: start; background: var(--ink); }
.episode-art img { display: block; width: 100%; height: auto; aspect-ratio: 1672 / 941; object-fit: contain; }
.episode-art figcaption { padding: .55rem .8rem; color: var(--mist); font-size: .875rem; }
.episode .episode-reading { padding: 1rem 1rem 1rem 0; }
.episode .episode-reading > strong { display: block; margin-top: 1rem; }
.episode-reading .episode-guide-link { display: inline-flex; align-items: center; min-height: 48px; margin-top: 1.2rem; color: var(--signal); text-decoration: underline; text-underline-offset: .25em; }
.episode-number { color: var(--mist); }
.family-section .section-head { align-items: start; }
.family-section .family-stage { aspect-ratio: auto; overflow: visible; }
.family-section .family-stage img { display: block; height: auto; aspect-ratio: 1672 / 941; object-fit: contain; }
.family-section .family-stage::after { display: none; }
.family-section .family-caption { position: static; padding: 1rem 1.5rem; background: var(--ink); }
.family-section .family-profiles { margin-top: 1.5rem; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; }
.family-section .profile-card { grid-column: span 2; min-width: 0; padding: clamp(1.3rem, 2.5vw, 2.2rem); border-top: 3px solid var(--signal); }
.profile-card[id] { scroll-margin-top: 6rem; }
.family-section .profile-card:nth-last-child(-n+2) { grid-column: span 3; border-top-color: var(--ember-bright); }
.family-section .profile-card > p:first-of-type { margin: 1rem 0 .5rem; }
.family-section .profile-card h3 { font-size: clamp(2rem, 3vw, 2.8rem); line-height: 1.1; }
.family-section .profile-card h3 + p { font-size: 1rem; }
.profile-card .character-question { margin: 1.5rem 0 0; padding: 1.2rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.character-question span { display: block; margin-bottom: .6rem; color: var(--signal); font-size: .875rem; font-weight: 700; }
.character-question p { margin: 0; font-family: var(--display); font-size: 1.5rem; line-height: 1.4; }
.family-section .profile-card details { border-color: var(--line); }
.family-section .profile-card summary { color: var(--signal); min-height: 48px; line-height: 1.5; }
.family-section .profile-card details p { color: var(--cloud); font-size: 1rem; }
.family-section .profile-card small { color: var(--mist); }
.character-chapter { margin-top: 1rem; display: inline-flex; min-height: 48px; align-items: center; color: var(--signal); text-underline-offset: .25em; }
.story-lens { margin: 2.5rem 0; padding: clamp(1.3rem, 3vw, 2.5rem); background: #e4eef3; border-left: 3px solid #a43a23; color: #071321; }
.story-lens .lens-label { margin: 0 0 .75rem; color: #526873; font: 700 .875rem/1.5 var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.story-lens h2 { margin: 0 0 1rem; font: 500 clamp(1.8rem, 3vw, 2.5rem)/1.15 var(--display); }
.story-lens > p { font-size: 1rem; }
.story-lens blockquote { margin: 1.5rem 0; padding-top: 1.5rem; border-top: 1px solid #a4b9c5; font: 500 1.4rem/1.5 var(--display); }
.story-lens blockquote span { display: block; margin-bottom: .5rem; color: #526873; font: 700 .875rem/1.5 var(--sans); }
.story-lens a { display: inline-flex; min-height: 44px; align-items: center; font-weight: 700; text-underline-offset: .25em; }
.story-lens a:focus-visible { outline-color: #173c5d; }
.season-catalog { padding: clamp(2rem, 5vw, 5rem) clamp(1.1rem, 6vw, 6.5rem); background: var(--night); }
.season-catalog .episode-index-grid { padding: 0; background: transparent; gap: 2rem; max-width: var(--max); margin: auto; }
.season-catalog .episode-index-card { min-height: 0; grid-template-rows: auto 1fr; border-bottom: 1px solid var(--line); }
.season-catalog .episode-index-card img { height: auto; aspect-ratio: 1672 / 941; object-fit: contain; filter: none; }
.season-catalog .episode-index-card:hover img { transform: none; }
.season-catalog .episode-index-card > span { color: var(--night); background: var(--signal); }
.season-catalog .episode-index-card > div { padding: 1.5rem 0; }
.season-catalog .episode-index-card h2 { line-height: 1.15; }
.episode-index-hero.season-cover { min-height: 0; padding-bottom: 3rem; gap: clamp(2rem, 5vw, 5rem); }
.episode-index-hero.season-cover h1 { font-size: clamp(3.5rem, 8vw, 8rem); line-height: .95; }
.season-cover .season-cover-note { color: var(--signal); font-size: .875rem; }
.season-cover > img { max-height: 58svh; }
@media (max-width: 980px) {
  .family-section .family-profiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .family-section .profile-card, .family-section .profile-card:nth-last-child(-n+2) { grid-column: auto; }
  .family-section .profile-card:last-child { grid-column: 1 / -1; }
}
@media (max-width: 680px) {
  .portal-grid .portal-feature { grid-column: auto; }
  .episode .episode-body { grid-template-columns: minmax(0, 1fr); }
  .episode .episode-reading { padding: 0 .25rem; }
  .family-section .family-profiles { grid-template-columns: minmax(0, 1fr); }
  .family-section .profile-card:last-child { grid-column: auto; }
  .season-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .season-filters button:first-child { grid-column: 1 / -1; }
  .season-catalog .episode-index-grid { gap: 1.5rem; }
}
@media print { .season-controls { display: none; } [data-episode-movement][hidden] { display: block !important; } }
