/* Unterseiten (Episodenguide, Transcripts u. a.). Baut auf site.css auf: gleiche Variablen, Schriften, Kopf und Fuß.
   Rubrikfarbe über --c (Episodenguide: var(--c-ep) = Rot). Die Serien tönen nur den dunklen Kopfbereich (--hero, --tint). */

.sp{--c:var(--c-ep)}
.sp .wrap{max-width:1180px}

/* ---- Kopfbereich: dunkel, mit großer Nummer als Wasserzeichen ---- */
.sp-hero{--hero:#17121c;--tint:var(--c-ep);position:relative;overflow:hidden;isolation:isolate;color:#fff;background:var(--hero);padding-block:60px 44px}
.sp-hero::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(70% 140% at 88% -10%,color-mix(in srgb,var(--tint) 55%,transparent),transparent 62%),
             radial-gradient(60% 110% at 0% 110%,rgba(0,0,0,.55),transparent 70%)}
.sp-hero .wrap{position:relative}
.s-buffy{--hero:#16080d;--tint:#a1122d}
.s-angel{--hero:#08101f;--tint:#2a5bd7}
.s-dollhouse{--hero:#15120e;--tint:#b8892b}
.s-bloodties{--hero:#120a1c;--tint:#6d35c9}
.sp-num{position:absolute;right:max(20px,3vw);top:50%;transform:translateY(-50%);z-index:-1;font-family:var(--f-logo);font-size:clamp(9rem,26vw,21rem);line-height:.8;
  color:transparent;-webkit-text-stroke:2px rgba(255,255,255,.13);pointer-events:none;user-select:none;white-space:nowrap}
.crumbs{display:flex;flex-wrap:wrap;gap:6px 8px;font-family:var(--f-ui);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--c)}
.crumbs [aria-hidden]{opacity:.5}
.sp-hero .crumbs{color:rgba(255,255,255,.66)}
.sp-hero .crumbs a:hover{color:#fff}
.sp-logo{display:block;width:auto;height:48px;margin:26px 0 0}
.logo-angel{filter:brightness(1.9) saturate(.9)}
.sp-k{margin:22px 0 8px;font-weight:800;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c)}
.sp-hero .sp-k{color:color-mix(in srgb,var(--c) 55%,#fff)}
.sp-logo + .sp-k{margin-top:14px}
.sp-hero h1{margin:0;max-width:18ch;font-family:var(--f-disp);font-weight:800;font-size:clamp(2.3rem,5.6vw,4.4rem);line-height:1.02;letter-spacing:-.02em;text-wrap:balance}
.sp-orig{margin:12px 0 0;font-family:var(--f-head);font-style:italic;font-size:1.35rem;color:var(--muted)}
.sp-hero .sp-orig{color:rgba(255,255,255,.72)}
.sp-lead{margin:18px 0 0;max-width:62ch;color:var(--muted)}
.sp-hero .sp-lead{color:rgba(255,255,255,.78)}

/* Eckdaten */
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin:32px 0 0;border-top:2px solid var(--c)}
.facts div{padding:14px 18px 14px 0;border-bottom:1px solid var(--line)}
.sp-hero .facts div{border-bottom-color:rgba(255,255,255,.14)}
.facts dt{font-family:var(--f-ui);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.sp-hero .facts dt{color:rgba(255,255,255,.55)}
.facts dd{margin:4px 0 0;font-weight:600}

/* ---- Reiter: Folge | Transcript | … ---- */
.ep-tabs{position:sticky;top:0;z-index:30;background:var(--paper);border-bottom:1px solid var(--line)}
.ep-tabs .wrap{display:flex;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:none}
.ep-tabs .wrap::-webkit-scrollbar{display:none}
.ep-tabs b{margin-right:14px;font-family:var(--f-ui);font-weight:600;font-size:.8rem;letter-spacing:.1em;color:var(--c)}
.ep-tabs a,.ep-tabs [aria-current]{position:relative;padding:15px 16px;white-space:nowrap;text-decoration:none;font-weight:700;font-size:.9rem;color:var(--muted)}
.ep-tabs a:hover{color:var(--ink)}
.ep-tabs [aria-current]{color:var(--ink)}
.ep-tabs [aria-current]::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:3px;background:var(--c)}

/* ---- Inhaltsbereich: Karten ---- */
.sp-cols{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:36px;padding-block:44px 8px;align-items:start}
.sp-text section,.sp-side section{background:var(--paper);border-radius:16px;box-shadow:var(--shade);border-top:3px solid var(--c);padding:26px 30px;margin:0 0 26px}
.sp-side section{padding:22px 24px}
.sp-text h2,.sp-side h2{margin:0 0 16px;font-family:var(--f-ui);font-weight:600;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--c)}
.sp-text h2 small{font-weight:400;letter-spacing:.1em;color:var(--muted)}
.sp-text p{margin:0 0 1em;max-width:68ch}
.sp-text .roh{max-width:68ch}
.sp-text a{color:var(--crim)}
.sp-text section>:last-child{margin-bottom:0}
.sp-side{position:sticky;top:70px;display:block}
.sp-side ul{list-style:none;margin:0;padding:0}
.sp-side li{padding:8px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.sp-side li:last-child{border-bottom:0}
.sp-side a{text-decoration:none}
.sp-side a:hover{color:var(--c)}
.sp-side li b{color:var(--c)}

/* Dialoge als Zitat */
#dialoge .roh{font-family:var(--f-head);font-style:italic;font-size:1.18rem;line-height:1.6;border-left:3px solid var(--c);padding-left:22px}

/* Besetzung */
.cast-list li{display:flex;flex-direction:column;gap:1px}
.cast-list b{font-weight:700}
.cast-list span{color:var(--muted);font-size:.85rem}

/* Bildergalerie (Fotos der Folge, mit Bildunterschrift) */
.galerie{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:14px 10px}
.galerie figure{margin:0}
.galerie a{display:block;overflow:hidden;border-radius:10px;box-shadow:var(--shade);background:var(--bg)}
.galerie img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;margin:0;transition:transform .35s,filter .35s}
.galerie a:hover img{transform:scale(1.07);filter:brightness(1.08)}
.galerie figcaption{padding:6px 2px 0;font-size:.78rem;line-height:1.35;color:var(--muted)}

/* Transcript */
.transcript .zeile{max-width:70ch;margin:0 0 .7em}
.transcript .wer{display:inline-block;min-width:4.6em;margin-right:.5em;font-family:var(--f-ui);font-weight:600;font-size:.82em;letter-spacing:.06em;text-transform:uppercase;color:var(--c)}
.transcript .regie{margin:1.3em 0 .9em;padding-left:16px;border-left:2px solid var(--line);color:var(--muted);font-style:italic}

/* Vor / Zurück */
.ep-nav{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-block:30px 0;padding-block:28px 0;border-top:2px solid var(--ink)}
.ep-nav a{display:block;padding:18px 22px;border-radius:14px;border:1px solid var(--line);background:var(--paper);text-decoration:none;transition:border-color .2s,transform .2s}
.ep-nav a:hover{border-color:var(--c);transform:translateY(-2px)}
.ep-nav small{display:block;font-family:var(--f-ui);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.ep-nav b{display:block;margin-top:4px;font-weight:700}
.ep-nav .nx{text-align:right;grid-column:2}
.ep-nav .pv:only-child{grid-column:1}

/* ---- Serienübersicht: große Karten ---- */
.serie-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;padding-block:44px 0}
.serie-card{--hero:#17121c;--tint:var(--c-ep);position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;gap:6px;min-height:250px;padding:28px 28px 24px;border-radius:20px;
  color:#fff;background:var(--hero);text-decoration:none;box-shadow:var(--shade);transition:transform .3s,box-shadow .3s}
.serie-card::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(90% 90% at 100% 0%,color-mix(in srgb,var(--tint) 50%,transparent),transparent 65%)}
.serie-card:hover{transform:translateY(-4px)}
.serie-card .big{position:absolute;right:.12em;bottom:-.2em;z-index:-1;font-family:var(--f-logo);font-style:normal;font-size:11rem;line-height:1;color:rgba(255,255,255,.08)}
.serie-card b{font-family:var(--f-disp);font-weight:800;font-size:1.9rem;line-height:1.05}
.serie-card span{color:rgba(255,255,255,.72);font-size:.92rem}
.serie-card em{margin-top:auto;padding-top:18px;font-style:normal;font-weight:800;color:color-mix(in srgb,var(--c-ep) 55%,#fff)}

/* Filmstreifen (Serienseite) */
.film{position:relative;overflow:hidden;background:#0d0a12}
.film img{width:100%;height:clamp(110px,15vw,220px);object-fit:cover;filter:saturate(.92) contrast(1.05)}
.film::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(13,10,18,.45),transparent 35%,rgba(13,10,18,.35))}

/* ---- Staffel mit Folgenliste ---- */
.sp .seas{padding-top:34px;margin-bottom:0}
.staffel{margin:0;padding-top:50px;scroll-margin-top:90px}
.staffel h2{display:flex;align-items:baseline;gap:16px;margin:0 0 8px;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:-.02em}
.stf-n{font-family:var(--f-logo);font-weight:400;font-size:clamp(3.8rem,8vw,6rem);line-height:.8;color:var(--c)}
.staffel h2 small{margin-left:auto;font-family:var(--f-ui);font-weight:400;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.ep-list{list-style:none;margin:16px 0 0;padding:0;border-top:2px solid var(--c)}
.ep-list a{display:grid;grid-template-columns:64px minmax(0,1.2fr) minmax(0,1fr) 130px;gap:6px 18px;align-items:baseline;padding:14px 10px;border-bottom:1px solid var(--line);border-left:3px solid transparent;text-decoration:none;transition:background .2s,padding-left .2s,border-color .2s}
.ep-list li:nth-child(odd) a{background:color-mix(in srgb,var(--ink) 2.5%,transparent)}
.ep-list a:hover{background:color-mix(in srgb,var(--c) 8%,transparent);padding-left:16px;border-left-color:var(--c)}
.ep-list .n{font-family:var(--f-ui);font-weight:600;font-size:.84rem;color:var(--c)}
.ep-list .t{font-weight:700}
.ep-list .o{color:var(--muted);font-style:italic}
.ep-list .d{font-family:var(--f-ui);font-size:.74rem;color:var(--muted);text-align:right}

@media (max-width:900px){
  .sp-cols{grid-template-columns:1fr;gap:0}
  .sp-side{position:static}
}
@media (max-width:640px){
  .sp-hero{padding-block:36px 30px}
  .sp-num{opacity:.7}
  .sp-text section,.sp-side section{padding:22px 20px;border-radius:14px}
  .ep-list a{grid-template-columns:52px minmax(0,1fr)}
  .ep-list .o,.ep-list .d{grid-column:2;text-align:left}
  .ep-nav{grid-template-columns:1fr}
  .ep-nav .nx{grid-column:1;text-align:left}
  .transcript .wer{display:block;min-width:0}
}

/* Charaktere: Rubrikfarbe lila */
.sp.ch{--c:var(--c-ch)}
.ch .sp-hero{--tint:var(--c-ch)}
.ch .serie-card em{color:color-mix(in srgb,var(--c-ch) 55%,#fff)}

/* Steckbrief- und Filmografie-Tabellen */
.daten{width:100%;border-collapse:collapse;margin:0 0 1.4em;font-size:.95rem}
.daten td{padding:7px 12px 7px 0;border-bottom:1px solid var(--line);vertical-align:top}
.daten td:first-child{color:var(--muted);white-space:nowrap}
.daten b{font-weight:600}
@media (max-width:640px){.daten,.daten tbody,.daten tr,.daten td{display:block;width:100%}.daten td{padding:2px 0;border:0}.daten tr{padding:8px 0;border-bottom:1px solid var(--line)}}

/* Sound & Musik: Rubrikfarbe türkis */
.sp.snd{--c:var(--c-snd)}
.snd .sp-hero{--tint:var(--c-snd)}
.sounds{list-style:none;margin:0;padding:0}
.sounds li{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,320px);gap:8px 22px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.sounds li:last-child{border-bottom:0}
.sounds .wer{display:block;font-family:var(--f-ui);font-weight:600;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c)}
.sounds .zitat{display:block;margin-top:2px;font-style:italic}
.sounds audio{width:100%;height:38px}
@media (max-width:640px){.sounds li{grid-template-columns:1fr}}

/* Timeline (gold), Fanfiction, Links */
.sp.tl{--c:var(--c-tl)}
.tl .sp-hero{--tint:var(--c-tl)}
.zeit{list-style:none;margin:0;padding:44px 0 0}
.zeit li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:8px 28px;padding:18px 0;border-bottom:1px solid var(--line)}
.zeit .jahr{font-family:var(--f-logo);font-weight:400;font-size:2rem;line-height:1;color:var(--c)}
.zeit p{margin:0;max-width:70ch}
.linkliste li{display:flex;flex-direction:column;gap:2px}
.linkliste a{font-weight:700}
.linkliste span{color:var(--muted);font-size:.9rem}
.sp-text h3{margin:1.6em 0 .4em;font-size:1.05rem}
.sp-text section>h3:first-of-type{margin-top:0}
@media (max-width:640px){.zeit li{grid-template-columns:1fr}}

/* Comics (gold; Text in dunklerem Gold wegen Kontrast, im Dunkelmodus das helle) */
.sp.tl,.sp.cc{--c:color-mix(in srgb,var(--c-tl) 70%,#000)}
html.dark .sp.tl,html.dark .sp.cc{--c:var(--c-tl)}
.cc .sp-hero{--tint:var(--c-cc)}
.hefte{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,140px));gap:22px 12px;justify-content:start;padding-block:44px 8px}
.heft{display:flex;flex-direction:column;gap:6px;width:140px;text-decoration:none}
.heft img{display:block;width:140px;height:auto;aspect-ratio:2/3;object-fit:cover;border-radius:5px;box-shadow:var(--shade);transition:transform .3s}
.heft:hover img{transform:translateY(-4px)}
.heft b{font-size:.92rem;line-height:1.25}
.heft small{font-family:var(--f-ui);font-size:.7rem;letter-spacing:.08em;color:var(--muted)}
.sp-side .cover{padding:0;border-top:0;overflow:hidden;background:none;box-shadow:none}
.cover img{width:100%;height:auto;border-radius:12px;box-shadow:var(--shade)}

/* Studien (violett = Leitfarbe) */
.sp.st{--c:var(--crim)}
.st .sp-hero{--tint:var(--crim)}
.studien{list-style:none;margin:0;padding:0}
.studien li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 16px;padding:12px 0;border-bottom:1px solid var(--line)}
.studien li:last-child{border-bottom:0}
.studien a{font-weight:700;text-decoration:none}
.studien a:hover{color:var(--c)}
.studien span{grid-column:1;color:var(--muted);font-size:.9rem}
.studien small{grid-column:2;grid-row:1 / span 2;align-self:center;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.1em;color:var(--muted)}

/* Downloads (grün) */
.sp.dl{--c:var(--c-dl)}
.dl .sp-hero{--tint:var(--c-dl)}
.dl .serie-card em{color:color-mix(in srgb,var(--c-dl) 55%,#fff)}
.sp .wrap>.staffel h3{margin:1.6em 0 .6em;font-family:var(--f-ui);font-weight:600;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase}
.sp .wrap>.staffel h3 small{color:var(--muted);font-weight:400}
.dl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
.dl-grid a{display:block;overflow:hidden;border-radius:6px;background:var(--paper);box-shadow:var(--shade)}
.dl-grid img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;transition:transform .25s}
.dl-grid a:hover img{transform:scale(1.08)}
.dl-list{list-style:none;margin:0;padding:0;columns:2 280px;column-gap:32px}
.dl-list li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);break-inside:avoid}
.dl-list a{font-weight:600;text-decoration:none;word-break:break-all}
.dl-list a:hover{color:var(--c)}
.dl-list small{flex:none;font-family:var(--f-ui);font-size:.68rem;color:var(--muted)}

/* Dollz (rosa) */
.sp.dz{--c:var(--c-dz)}
.dz .sp-hero{--tint:var(--c-dz)}
.dollz{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.dollz a{display:block;padding:8px;border-radius:10px;background:var(--paper);box-shadow:var(--shade);transition:transform .25s}
.dollz a:hover{transform:translateY(-3px)}
.dollz img{display:block;max-width:100%;height:auto}

/* Bilder */
.sp.bi{--c:var(--crim)}
.bi .sp-hero{--tint:var(--crim)}
.galerie-gross{grid-template-columns:repeat(auto-fill,minmax(112px,1fr));padding-top:24px}
.sp-text .dl-grid{margin-top:4px}

/* Sammelkarten */
.sp-text table.daten td{font-size:.9rem}
.sp-text img{max-width:100%}

/* Sammelkarten: Kartenbilder direkt in der Liste */
.kartengrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px 14px}
.kk{margin:0}
.kk img{display:block;width:100%;height:auto;border-radius:8px;box-shadow:var(--shade);background:var(--bg);cursor:zoom-in}
.kk figcaption{margin-top:6px;font-size:.78rem;line-height:1.3;color:var(--muted)}
.kk-leer div{display:grid;place-items:center;min-height:100px;padding:10px;text-align:center;border:1px dashed var(--line);border-radius:8px;color:var(--muted);font-size:.8rem}
.kartenliste{list-style:none;margin:0;padding:0;columns:2 260px;column-gap:36px}
.kartenliste li{display:flex;gap:12px;padding:6px 0;border-bottom:1px solid var(--line);break-inside:avoid}
.kartenliste b{flex:none;min-width:2.4em;font-family:var(--f-ui);font-weight:600;font-size:.8rem;color:var(--c)}

/* Comic-Kataloge: Cover direkt sichtbar (Comic-Cover + Photo-Cover nebeneinander) */
.kat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(288px,288px));gap:22px 14px;justify-content:start}
.kat-item{margin:0;display:flex;flex-direction:column;gap:8px;width:288px}
.kat-bilder{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:flex-start;gap:8px}
.kat-bilder img{flex:0 0 auto;display:block;width:140px;height:auto;aspect-ratio:2/3;object-fit:cover;margin:0;border-radius:5px;box-shadow:var(--shade);cursor:zoom-in;background:var(--bg)}
.kat-bilder.n1 img{width:140px}
.kat-leer{display:grid;place-items:center;width:140px;aspect-ratio:2/3;border:1px dashed var(--line);border-radius:5px;color:var(--muted);font-size:.7rem;text-align:center}
.kat-item figcaption b{display:block;font-size:.9rem;line-height:1.25}
.kat-item figcaption small{font-family:var(--f-ui);font-size:.7rem;letter-spacing:.08em;color:var(--muted)}
.hgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px}
.hg h3{margin:0 0 8px;font-family:var(--f-ui);font-weight:600;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--c)}

/* Comics: Fortsetzungs-Reihen mit Beschreibung */
.fortsetzung{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:18px;margin-top:22px}
.fz{display:flex;gap:16px;align-items:flex-start;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--paper);text-decoration:none;transition:border-color .2s,transform .2s}
.fz:hover{border-color:var(--c);transform:translateY(-2px)}
.fz img{flex:0 0 auto;display:block;width:140px;height:auto;aspect-ratio:2/3;object-fit:cover;border-radius:5px;box-shadow:var(--shade)}
.fz b{display:block;font-size:1.02rem;line-height:1.25}
.fz p{margin:6px 0 10px;color:var(--muted);font-size:.9rem;line-height:1.45}
.fz small{font-family:var(--f-ui);font-size:.7rem;letter-spacing:.08em;color:var(--c)}
@media (max-width:560px){.fortsetzung{grid-template-columns:1fr}}

/* Comics: Textkarten mit Cover und Erklärung (Info, Vorgeschichte, Interview, weiterführende Texte) */
.tzgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:18px;margin-top:20px}
.tz{display:flex;gap:16px;align-items:flex-start;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--paper);text-decoration:none;transition:border-color .2s,transform .2s}
.tz:hover{border-color:var(--c);transform:translateY(-2px)}
.tz img{flex:0 0 auto;display:block;width:110px;height:auto;aspect-ratio:2/3;object-fit:cover;border-radius:5px;box-shadow:var(--shade)}
.tz b{display:block;font-size:1.02rem;line-height:1.25}
.tz span{display:block;margin:3px 0 6px;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--c)}
.tz p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.45}
.sp-side .cover img{width:100%;max-width:260px}
@media (max-width:560px){.tzgrid{grid-template-columns:1fr}}

.tvh{margin:34px 0 4px;font-family:var(--f-ui);font-weight:600;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--c)}

/* Sammelkarten-Übersicht: Kacheln mit Kartenbildern */
.kset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin-top:14px}
.kset{display:flex;flex-direction:column;gap:4px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--paper);text-decoration:none;transition:border-color .2s,transform .2s}
.kset:hover{border-color:var(--c);transform:translateY(-2px)}
.kset-b{display:flex;gap:6px;margin-bottom:8px}
.kset-b img{flex:0 0 auto;width:112px;height:auto;aspect-ratio:5/7;object-fit:cover;border-radius:5px;box-shadow:var(--shade);background:var(--bg)}
.kset.ccg{grid-column:1/-1}
.kset b{font-size:1.02rem;line-height:1.25}
.kset span{color:var(--muted);font-size:.88rem}
.kset small{font-family:var(--f-ui);font-size:.7rem;letter-spacing:.08em;color:var(--c)}

/* ==== v2.26: Bilder in den Köpfen, Serienbereiche, Steckbrief, Lesetext ==== */
/* Hero mit Foto: Bild rechts, läuft nach links in die Heldenfarbe aus */
.sp-hero.mit-bild{min-height:clamp(340px,40vw,520px);display:flex;align-items:flex-end}
.sp-hero.mit-bild > .wrap{width:100%}
.sp-bild{position:absolute;z-index:-2;top:0;right:0;width:min(62%,980px);height:100%;object-fit:cover;object-position:center 30%;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 42%);mask-image:linear-gradient(90deg,transparent 0,#000 42%);opacity:.9;filter:saturate(.9) contrast(1.04)}
.sp-hero.mit-bild::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(0deg,var(--hero) 0,color-mix(in srgb,var(--hero) 40%,transparent) 30%,transparent 60%),linear-gradient(90deg,var(--hero) 0,color-mix(in srgb,var(--hero) 80%,transparent) 34%,transparent 70%)}
.sp-hero.mit-bild .sp-num{opacity:.35}
.sp-hero.mit-bild h1{text-shadow:0 2px 30px rgba(0,0,0,.45)}
@media (max-width:760px){.sp-bild{width:100%;-webkit-mask-image:linear-gradient(180deg,#000 0,#000 30%,transparent 95%);mask-image:linear-gradient(180deg,#000 0,#000 30%,transparent 95%);opacity:.55}
  .sp-hero.mit-bild{min-height:420px}}

/* Staffel-Blöcke mit Bild (Episodenguide) */
.staffel.mit-bild{position:relative}
.stf-bild{position:relative;height:clamp(120px,16vw,200px);margin:0 0 18px;border-radius:18px;overflow:hidden;background:#17121c}
.stf-bild img{width:100%;height:100%;object-fit:cover;object-position:center 28%;opacity:.85}
.stf-bild::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,10,20,.85),rgba(15,10,20,.15) 60%)}
.staffel.mit-bild > h2{position:relative;margin-top:calc(-1 * clamp(120px,16vw,200px) - 18px + 26px);margin-bottom:clamp(70px,10vw,130px);padding-left:24px;color:#fff;z-index:1}
.staffel.mit-bild > h2 small{color:rgba(255,255,255,.7)}
.welt-h{margin:60px 0 0;font-family:var(--f-disp);font-weight:800;font-size:1.4rem}

/* Figuren-Karten mit Porträt */
.fig-card{min-height:330px;justify-content:flex-end}
.fig-card .fc-bild{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;object-position:center 20%;transition:transform .5s}
.fig-card::before{background:linear-gradient(0deg,rgba(12,8,18,.94) 0,rgba(12,8,18,.55) 38%,transparent 70%)!important}
.fig-card:hover .fc-bild{transform:scale(1.04)}
.fig-card b{font-size:1.45rem}

/* Steckbrief in der Seitenleiste */
.steckbrief{padding:0!important;overflow:hidden}
.sb-bild{display:block;aspect-ratio:4/5;overflow:hidden;background:#17121c}
.sb-bild img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block}
.steckbrief dl{margin:0;padding:16px 20px 18px}
.steckbrief dl div{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.steckbrief dl div:last-child{border:0}
.steckbrief dt{color:var(--muted);font-family:var(--f-ui);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;padding-top:2px}
.steckbrief dd{margin:0;text-align:right;font-weight:600}
.steckbrief a{color:var(--c)}

/* Lesetext: Einleitung, Initiale, Zeilenlänge, eingestreute Fotos */
.sp-text.lesen section{font-size:1.06rem;line-height:1.75}
.sp-text.lesen p{max-width:68ch;margin:0 0 1.05em}
.sp-text.lesen .lead{font-size:1.24rem;line-height:1.6;font-weight:500;color:var(--ink)}
.sp-text.lesen .lead::first-letter{float:left;font-family:var(--f-logo);font-size:4.6em;line-height:.82;margin:.06em .1em 0 0;color:var(--c)}
.einschub{margin:6px 0 18px;width:min(46%,340px);border-radius:14px;overflow:hidden;box-shadow:var(--shade)}
.einschub.re{float:right;margin-left:26px}
.einschub.li{float:left;margin-right:26px}
.einschub img{display:block;width:100%;height:auto}
.sp-text.lesen section::after{content:"";display:table;clear:both}
@media (max-width:640px){.einschub{float:none!important;width:100%;margin:8px 0 18px!important}}

/* Galerie-Übersicht mit Vorschaubildern */
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;margin-top:14px}
.gal-k{position:relative;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:4/3;padding:12px 14px;border-radius:14px;overflow:hidden;color:#fff;background:#17121c;isolation:isolate}
.gal-k img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.gal-k::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(10,6,14,.9),transparent 65%)}
.gal-k:hover img{transform:scale(1.06)}
.gal-k b{font-weight:800;line-height:1.15}
.gal-k small{opacity:.75;font-size:.8rem}

/* Whedonverse-Timeline */
.zeit.wz li > div small{display:block;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.zeit.wz li a,.zeit.wz li .t{display:block;font-family:var(--f-disp);font-weight:800;font-size:1.15rem;color:var(--ink)}
.zeit.wz li a:hover{color:var(--c)}
.zeit.wz li p{margin:4px 0 0}
.zeit.wz .wz-angel .jahr{color:#2f6bea}
.zeit.wz .wz-comic .jahr{color:color-mix(in srgb,var(--c-cc) 75%,#000)}
.zeit.wz .wz-serie .jahr{color:#0e9f8e}

/* ==== Serienbereiche (angel/, dollhouse/, bloodties/) ==== */
body.w-angel{--crim:#2f6bea;--welt:#2f6bea;--welt-d:#06101f}
body.w-dollhouse{--crim:#1d9bb2;--welt:#1d9bb2;--welt-d:#051519}
body.w-bloodties{--crim:#b5651d;--welt:#c8782c;--welt-d:#150b05}
html.dark body.w-angel{--crim:#6b9bff}
html.dark body.w-dollhouse{--crim:#4cc3d8}
html.dark body.w-bloodties{--crim:#e39a52}
body.welt .sp-hero{--hero:var(--welt-d);--tint:var(--welt)}
body.welt .sp{--c:var(--welt)}
body.welt .serie-card{--hero:var(--welt-d);--tint:var(--welt)}
body.welt .serie-card em{color:color-mix(in srgb,var(--welt) 50%,#fff)}
.welt-bar{position:relative;z-index:5;background:var(--welt-d);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.welt-bar .wrap{display:flex;align-items:center;gap:22px;min-height:58px;overflow-x:auto;scrollbar-width:none}
.welt-bar .wrap::-webkit-scrollbar{display:none}
.welt-logo{font-family:var(--f-logo);font-size:1.9rem;line-height:1;color:#fff;text-shadow:0 0 18px color-mix(in srgb,var(--welt) 70%,transparent);white-space:nowrap}
.welt-links{display:flex;gap:4px;flex:1}
.welt-links a{padding:8px 12px;border-radius:999px;font-weight:600;font-size:.9rem;color:rgba(255,255,255,.78);white-space:nowrap}
.welt-links a:hover{color:#fff;background:rgba(255,255,255,.08)}
.welt-links a[aria-current]{color:#fff;background:var(--welt)}
.welt-zurueck{font-family:var(--f-ui);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);white-space:nowrap}
.welt-zurueck:hover{color:#fff}
.mB{margin-bottom:0}

/* Startseite einer Serie */
.welt-start{--c:var(--welt)}
.w-hero{position:relative;isolation:isolate;overflow:hidden;min-height:min(86vh,760px);display:flex;align-items:flex-end;padding:120px 0 64px;color:#fff;background:var(--welt-d)}
.w-hero-bild{position:absolute;z-index:-2;inset:0 0 0 auto;width:min(72%,1200px);height:100%;object-fit:cover;object-position:center 25%;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 40%);mask-image:linear-gradient(90deg,transparent,#000 40%)}
.w-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,var(--welt-d),transparent 55%),radial-gradient(70% 60% at 10% 90%,color-mix(in srgb,var(--welt) 35%,transparent),transparent)}
.w-hero .wrap{width:100%}
.w-kick{margin:0 0 6px;font-family:var(--f-ui);font-size:.75rem;letter-spacing:.22em;text-transform:uppercase;color:color-mix(in srgb,var(--welt) 45%,#fff)}
.w-logo{margin:0;font-family:var(--f-logo);font-weight:400;font-size:clamp(4.5rem,13vw,10rem);line-height:.9;letter-spacing:0;text-shadow:0 0 40px color-mix(in srgb,var(--welt) 70%,transparent),0 4px 30px rgba(0,0,0,.5)}
.w-unter{margin:10px 0 0;font-family:var(--f-head);font-style:italic;font-size:clamp(1.3rem,2.4vw,1.8rem)}
.w-lead{max-width:56ch;margin:16px 0 0;font-size:1.08rem;line-height:1.65;color:rgba(255,255,255,.82)}
.w-zahlen{display:flex;flex-wrap:wrap;gap:34px;margin:28px 0 0}
.w-zahlen b{display:block;font-family:var(--f-disp);font-weight:800;font-size:2.4rem;line-height:1}
.w-zahlen span{font-family:var(--f-ui);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.w-akt{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 0}
.w-btn,.w-btn2{display:inline-flex;padding:14px 22px;border-radius:999px;font-weight:800}
.w-btn{background:var(--welt);color:#fff;box-shadow:0 12px 30px -10px var(--welt)}
.w-btn2{border:1px solid rgba(255,255,255,.35);color:#fff}
.w-btn:hover,.w-btn2:hover{transform:translateY(-2px)}
.w-credit{margin:22px 0 0;font-size:.72rem;color:rgba(255,255,255,.45)}
.w-blk{padding:clamp(56px,7vw,96px) 0 0}
.w-blk.w-dunkel{margin-top:clamp(56px,7vw,96px);padding-bottom:clamp(56px,7vw,96px);background:var(--welt-d);color:#fff}
.w-h{margin:0 0 6px;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.8rem,3.6vw,2.8rem);letter-spacing:-.02em}
.w-sub{margin:0 0 22px;color:var(--muted)}
.w-dunkel .w-sub{color:rgba(255,255,255,.65)}
.w-staffeln{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-top:22px}
.w-staffel{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:flex-end;min-height:250px;padding:18px;border-radius:18px;color:#fff;background:var(--welt-d)}
.w-staffel img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.w-staffel::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(5,8,15,.95),rgba(5,8,15,.2) 70%)}
.w-staffel:hover img{transform:scale(1.05)}
.w-n{position:absolute;top:8px;right:14px;font-family:var(--f-logo);font-size:4.2rem;line-height:1;color:rgba(255,255,255,.85);text-shadow:0 0 20px var(--welt)}
.w-staffel b{font-family:var(--f-disp);font-weight:800;font-size:1.3rem}
.w-staffel p{margin:4px 0 6px;font-size:.92rem;line-height:1.35;color:rgba(255,255,255,.85)}
.w-staffel small{font-family:var(--f-ui);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.w-folgen{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.w-folge{display:block;border-radius:14px;overflow:hidden;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.w-folge img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:opacity .3s}
.w-folge:hover img{opacity:.8}
.w-folge div{padding:10px 12px 14px}
.w-folge small{display:block;font-family:var(--f-ui);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:color-mix(in srgb,var(--welt) 45%,#fff)}
.w-folge b{display:block;margin-top:4px;line-height:1.25}
.w-figuren{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin-top:22px}
.w-figur{display:block;border-radius:16px;overflow:hidden;background:var(--paper);box-shadow:var(--shade)}
.w-figur img,.w-figur i{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 20%}
.w-figur i{display:grid;place-items:center;font-family:var(--f-logo);font-style:normal;font-size:4rem;color:#fff;background:var(--welt-d)}
.w-figur b{display:block;padding:10px 12px 0;font-weight:800;line-height:1.2}
.w-figur span{display:block;padding:2px 12px 12px;font-size:.82rem;color:var(--muted)}
.w-figur:hover b{color:var(--welt)}
.w-zitat{margin-top:clamp(56px,7vw,96px);padding:clamp(50px,7vw,90px) 0;background:linear-gradient(120deg,var(--welt-d),color-mix(in srgb,var(--welt) 45%,var(--welt-d)));color:#fff;text-align:center}
.w-zitat blockquote{max-width:30ch;margin:0 auto;font-family:var(--f-head);font-style:italic;font-size:clamp(1.6rem,3.4vw,2.6rem);line-height:1.25}
.w-zitat cite{display:block;margin-top:16px;font-style:normal;font-family:var(--f-ui);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.w-kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-top:22px}
.w-kachel{display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:var(--paper);border:1px solid var(--line);transition:transform .2s,box-shadow .2s}
.w-kachel:hover{transform:translateY(-3px);box-shadow:var(--shade)}
.w-kachel img{width:100%;aspect-ratio:16/8;object-fit:cover}
.w-kachel div{padding:16px 18px 18px;border-top:3px solid var(--welt)}
.w-kachel b{display:block;font-family:var(--f-disp);font-weight:800;font-size:1.15rem}
.w-kachel p{margin:4px 0 0;color:var(--muted);font-size:.92rem;line-height:1.45}
.w-kachel small{display:block;margin-top:8px;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--welt)}
.w-text{max-width:70ch}
.w-zurueck p{margin:0;padding:22px 0;border-top:1px solid var(--line);color:var(--muted)}
.w-zurueck a{color:var(--welt);font-weight:700}
@media (max-width:760px){.w-hero-bild{width:100%;-webkit-mask-image:linear-gradient(180deg,#000 30%,transparent 92%);mask-image:linear-gradient(180deg,#000 30%,transparent 92%);opacity:.7}
  .w-hero{min-height:640px;padding-top:80px}.w-zahlen{gap:20px}.w-zahlen b{font-size:1.9rem}}
.welt-start a,.welt-bar a,.w-kachel,.w-figur,.w-folge,.w-staffel,.gal-k,.fig-card{text-decoration:none}
.fig-card{justify-content:flex-end}
.fig-card em{margin-top:6px!important;padding-top:0!important}
.fig-card b,.fig-card span{text-shadow:0 1px 12px rgba(0,0,0,.6)}
/* Cover als Kopfbild (Comics, Sammelkarten): hochkant, rechts, ohne Beschnitt des Motivs */
.cover-hero .sp-bild{width:min(40%,520px);object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 35%);mask-image:linear-gradient(90deg,transparent 0,#000 35%)}
@media (max-width:760px){.cover-hero .sp-bild{width:100%}}
/* Folgen-Texte: ruhigere Zeilenlänge, Inhalt als Einleitung mit Initiale */
.sp-text.folge section p{max-width:72ch}
.sp-text.folge #inhalt p:first-of-type{font-size:1.14rem;line-height:1.65}
.sp-text.folge #inhalt p:first-of-type::first-letter{float:left;font-family:var(--f-logo);font-size:3.9em;line-height:.85;margin:.05em .1em 0 0;color:var(--c)}
.sp-text.folge #dialoge p{position:relative;margin:0 0 12px;padding:12px 16px 12px 20px;border-left:3px solid var(--c);background:color-mix(in srgb,var(--c) 6%,transparent);border-radius:0 12px 12px 0;font-family:var(--f-head);font-style:italic;font-size:1.1rem}
@media (max-width:620px){.w-folgen{grid-template-columns:1fr 1fr}.w-figuren{grid-template-columns:1fr 1fr}.w-staffel{min-height:190px}.w-zahlen div{min-width:28%}}
.zeit.wz li a,.zeit.wz li .t{background:none!important;padding:0!important;border:0!important;text-decoration:none}

/* Charaktere-Übersicht: Figur groß, darunter der Darsteller mit eigenem Foto und Link */
.duo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px;margin-top:40px}
.duo-k{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:var(--paper);box-shadow:var(--shade);border:1px solid var(--line)}
.dk-fig{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;color:#fff;text-decoration:none;background:#17121c;isolation:isolate}
.dk-fig img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.dk-fig i{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-logo);font-style:normal;font-size:5rem;color:rgba(255,255,255,.3)}
.dk-fig::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(10,6,14,.92) 0,rgba(10,6,14,.3) 34%,transparent 55%)}
.dk-fig b{position:absolute;left:16px;right:16px;bottom:30px;font-family:var(--f-disp);font-weight:800;font-size:1.3rem;line-height:1.1;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.dk-fig small{position:absolute;left:16px;bottom:11px;font-family:var(--f-ui);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb,var(--c) 45%,#fff)}
.dk-fig:hover img{transform:scale(1.05)}
.dk-tag{position:absolute;top:12px;left:12px;padding:4px 10px;border-radius:999px;background:#2f6bea;font-size:.7rem;font-weight:800;letter-spacing:.06em}
.dk-dar{display:flex;align-items:center;gap:12px;padding:12px 14px;text-decoration:none;color:var(--ink);transition:background .2s}
.dk-dar:hover{background:color-mix(in srgb,var(--c) 8%,transparent)}
.dk-dar img{flex:none;width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:center 35%;box-shadow:0 0 0 2px var(--paper),0 0 0 4px color-mix(in srgb,var(--c) 55%,transparent)}
.dk-dar small{display:block;font-family:var(--f-ui);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.dk-dar b{display:block;font-weight:700;font-size:.95rem;line-height:1.2}
.dk-dar:hover b{color:var(--c)}
.sb-andere a{display:inline-flex;align-items:center;gap:8px}
.sb-andere img{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:center 35%}
@media (max-width:520px){.duo-grid{grid-template-columns:1fr 1fr;gap:12px}.dk-fig b{font-size:1.05rem}.dk-dar img{width:40px;height:40px}}

/* Darsteller-Seiten: Steckbrief-Kacheln und Filmografie */
.sp-text.darsteller .dar-block + .dar-block{margin-top:34px}
.sp-text.darsteller h2{margin:0 0 14px}
.dar-fakten{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin:0}
.dar-fakten div{padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--c) 7%,var(--paper));border:1px solid color-mix(in srgb,var(--c) 18%,transparent)}
.dar-fakten div.breit{grid-column:1/-1}
.dar-fakten dt{font-family:var(--f-ui);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.dar-fakten dd{margin:4px 0 0;font-weight:700;line-height:1.35}
.filmo{list-style:none;margin:0;padding:0 0 0 18px;border-left:2px solid color-mix(in srgb,var(--c) 30%,transparent)}
.filmo li{position:relative;display:grid;grid-template-columns:92px 1fr;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);line-height:1.4}
.filmo li::before{content:"";position:absolute;left:-24px;top:15px;width:10px;height:10px;border-radius:50%;background:var(--paper);border:2px solid color-mix(in srgb,var(--c) 60%,transparent)}
.filmo li b{font-family:var(--f-ui);font-size:.8rem;color:var(--c)}
.filmo li.whedon{background:color-mix(in srgb,var(--c) 9%,transparent);border-radius:10px;padding-left:10px;margin-left:-10px}
.filmo li.whedon::before{background:var(--c);border-color:var(--c);left:-14px}
.filmo li.whedon span{font-weight:700}
.lesen-mehr p{max-width:70ch}
@media (max-width:560px){.filmo li{grid-template-columns:1fr;gap:2px}}
/* Charakter-Übersicht: Porträt-Collage im Kopf breiter und weniger ausgeblendet */
.sp.ch .sp-hero.mit-bild .sp-bild[src*="figuren-collage"]{width:min(70%,1100px);object-position:center center;opacity:1;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}

/* Figurenseite: Auf einen Blick, Einstiegswörter, Zitate, Weiterlesen, Bildleiste */
.fig-blick{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 26px}
.fig-blick a{display:flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:999px;background:color-mix(in srgb,var(--c) 8%,var(--paper));border:1px solid color-mix(in srgb,var(--c) 20%,transparent);text-decoration:none;color:var(--ink)}
.fig-blick img{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:center 35%}
.fig-blick .zahl{display:grid;place-items:center;min-width:40px;height:40px;padding:0 8px;border-radius:999px;background:var(--c);color:#fff;font-weight:800;font-size:.9rem}
.fig-blick small{display:block;font-family:var(--f-ui);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fig-blick b{display:block;font-size:.9rem;line-height:1.2}
.sp-text.lesen .anf{font-weight:800;color:var(--ink);letter-spacing:.01em}
.zitat-k{clear:both;margin:30px 0;padding:26px 28px 20px;border-radius:20px;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 16%,var(--paper)),var(--paper));border:1px solid color-mix(in srgb,var(--c) 22%,transparent);position:relative}
.zitat-k::before{content:"“";position:absolute;top:-6px;left:18px;font-family:var(--f-head);font-size:6rem;line-height:1;color:color-mix(in srgb,var(--c) 45%,transparent)}
.zitat-k blockquote{margin:0;padding-left:22px;font-family:var(--f-head);font-style:italic;font-size:1.5rem;line-height:1.3;color:var(--ink)}
.zitat-k figcaption{margin:10px 0 0 22px;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}
.zitat-k figcaption a{color:var(--c);text-decoration:none}
.zitat-k audio{display:block;width:min(100%,360px);height:36px;margin:12px 0 0 22px}
.zitat-k.klein{margin:0;padding:18px 18px 14px}
.zitat-k.klein::before{font-size:4rem;left:10px}
.zitat-k.klein blockquote{font-size:1.08rem;padding-left:16px}
.zitat-k.klein figcaption,.zitat-k.klein audio{margin-left:16px}
.zitat-raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.fig-h{clear:both;margin:44px 0 16px!important;font-family:var(--f-disp);font-weight:800;font-size:1.5rem!important;letter-spacing:-.01em;text-transform:none!important;color:var(--ink)!important}
details.weiter{margin:8px 0 0}
details.weiter summary{display:inline-flex;align-items:center;gap:10px;margin:6px 0 18px;padding:12px 20px;border-radius:999px;background:var(--c);color:#fff;font-weight:800;cursor:pointer;list-style:none}
details.weiter summary::-webkit-details-marker{display:none}
details.weiter summary::after{content:"↓";transition:transform .2s}
details.weiter[open] summary::after{transform:rotate(180deg)}
details.weiter[open] summary{background:transparent;color:var(--c);border:1px solid var(--c)}
.fig-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.fig-strip a{display:block;aspect-ratio:4/3;border-radius:12px;overflow:hidden}
.fig-strip img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.fig-strip a:hover img{transform:scale(1.06)}
@media (max-width:620px){.fig-strip{grid-template-columns:1fr 1fr}.zitat-k blockquote{font-size:1.25rem}}
.sp-text .fig-h{font-family:var(--f-disp)!important;letter-spacing:-.01em!important;font-size:1.5rem!important;color:var(--ink)!important}
.zitat-k blockquote{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500}
/* Zurück zu den Charakteren, neben dem Namen */
.name-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.name-zeile h1{margin:0}
.zurueck-k{display:inline-flex;align-items:center;padding:10px 18px;border-radius:999px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;font-weight:700;font-size:.9rem;text-decoration:none;white-space:nowrap;backdrop-filter:blur(6px);transition:background .2s}
.zurueck-k:hover{background:var(--c);border-color:var(--c)}

/* Galerien: große Vorschauen im Mauerwerk-Raster (ganze Bilder, nicht beschnitten), Verweise zu Figur/Darsteller */
.galerie-wand{column-width:185px;column-gap:10px;margin-top:26px}
.galerie-wand a{display:block;margin:0 0 10px;break-inside:avoid;border-radius:14px;overflow:hidden;background:var(--paper);box-shadow:0 1px 0 var(--line),0 14px 30px -22px rgba(30,10,40,.5)}
.galerie-wand img{display:block;width:100%;height:auto;transition:transform .5s,filter .3s}
.galerie-wand a:hover img{transform:scale(1.05);filter:brightness(1.06)}
.gal-zus{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.gal-zu{display:inline-flex;align-items:center;gap:10px;padding:6px 16px 6px 6px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;text-decoration:none;backdrop-filter:blur(6px)}
.gal-zu.haupt{background:var(--c);border-color:var(--c)}
.gal-zu img{width:38px;height:38px;border-radius:50%;object-fit:cover;object-position:center 35%}
.gal-zu small{display:block;font-family:var(--f-ui);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.gal-zu b{display:block;font-size:.92rem;line-height:1.15}
@media (max-width:520px){.galerie-wand{column-width:150px;column-gap:8px}.galerie-wand a{margin-bottom:8px}}
.imdb-k{margin:30px 0 0}
.imdb-k a{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:999px;background:#f5c518;color:#111;font-weight:800;text-decoration:none}
.imdb-k a::before{content:"IMDb";padding:2px 6px;border-radius:4px;background:#111;color:#f5c518;font-size:.75rem;letter-spacing:.04em}
.imdb-k a:hover{filter:brightness(1.05);transform:translateY(-1px)}
.steckbrief a.imdb{font-weight:700}

/* Bilder-Übersicht: Staffeln groß, je Figur eine Karte mit Porträt und Galerie-Chips */
.bst-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:16px}
.bst{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:3/4;padding:14px;border-radius:16px;overflow:hidden;color:#fff;text-decoration:none;background:#17121c;scroll-margin-top:100px}
.bst img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform .5s}
.bst::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(10,6,14,.9),transparent 55%)}
.bst:hover img{transform:scale(1.06)}
.bst .n{position:absolute;top:6px;right:12px;font-family:var(--f-logo);font-size:3.2rem;line-height:1;text-shadow:0 0 18px var(--c)}
.bst b{font-weight:800}.bst small{opacity:.75;font-size:.8rem}
.bfig-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-top:20px}
.bfig{border-radius:18px;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade);scroll-margin-top:100px}
.bfig:target{outline:3px solid var(--c);outline-offset:3px}
.bfig-b{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:4/5;padding:14px 16px;color:#fff;text-decoration:none;overflow:hidden}
.bfig-b img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 30%;transition:transform .5s}
.bfig-b::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(10,6,14,.9),transparent 50%)}
.bfig-b:hover img{transform:scale(1.05)}
.bfig-b b{font-family:var(--f-disp);font-weight:800;font-size:1.2rem;line-height:1.1}
.bfig-b small{font-family:var(--f-ui);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.bfig-chips{display:flex;flex-wrap:wrap;gap:6px;padding:12px}
.bfig-chips a{display:inline-flex;align-items:baseline;gap:6px;padding:6px 10px;border-radius:999px;background:color-mix(in srgb,var(--c) 9%,var(--paper));border:1px solid color-mix(in srgb,var(--c) 22%,transparent);text-decoration:none;color:var(--ink);font-size:.82rem}
.bfig-chips a:hover{background:var(--c);color:#fff;border-color:var(--c)}
.bfig-chips small{color:var(--muted);font-size:.72rem}.bfig-chips a:hover small{color:#fff}
@media (min-width:900px){.bst-grid{grid-template-columns:repeat(7,1fr)}}
/* Trenner in der Reiterleiste: Figur · Darsteller | Bilder · Sounds */
.ep-tabs .tab-trenn{align-self:center;width:2px;height:24px;margin:0 12px;border-radius:2px;background:color-mix(in srgb,var(--c) 55%,var(--muted));opacity:.9;flex:none}
.zitat-k.nur-ton blockquote{font-family:var(--f-ui);font-style:normal;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* Folgenlisten: Titel nicht als Kachel (Kollision mit .t der Startseite) */
.ep-list .t{display:block;padding:0;border:0;border-radius:0;background:none;overflow:visible;gap:0;transition:none}
.ep-list .t:hover{transform:none;box-shadow:none;background:none}

/* Sound & Musik: Umschalter, Zitatkarten mit Sprecherbild, Song-Karten */
.snd-umschalt{display:inline-flex;gap:4px;margin-top:22px;padding:4px;border-radius:999px;background:rgba(255,255,255,.1)}
.snd-umschalt a,.snd-umschalt span{padding:9px 20px;border-radius:999px;font-weight:800;color:#fff;text-decoration:none}
.snd-umschalt span{background:var(--c)}
.snd-umschalt a:hover{background:rgba(255,255,255,.14)}
.sounds{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.sounds li{display:grid!important;grid-template-columns:52px minmax(0,1fr)!important;grid-template-rows:auto auto;gap:10px 14px!important;align-items:start!important;padding:16px!important;border:1px solid color-mix(in srgb,var(--c) 18%,transparent)!important;border-radius:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 9%,var(--paper)),var(--paper))}
.snd-av{grid-row:1;width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:center 30%;box-shadow:0 0 0 2px var(--paper),0 0 0 4px color-mix(in srgb,var(--c) 50%,transparent)}
.snd-av.leer{display:grid;place-items:center;background:color-mix(in srgb,var(--c) 22%,var(--paper));font-weight:800;color:var(--c)}
.sounds .zitat{font-family:var(--f-head);font-style:italic;font-size:1.12rem;line-height:1.35;color:var(--ink)}
.sounds .zitat.leer{font-family:var(--f-ui);font-style:normal;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.sounds audio{grid-column:1/-1;width:100%;height:36px}
.song{margin:0 0 14px;padding:18px 20px;border-radius:18px;border:1px solid color-mix(in srgb,var(--c) 18%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--c) 8%,var(--paper)),var(--paper))}
.song-kopf{display:flex;gap:14px;align-items:flex-start}
.song-nr{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--c);color:#fff;font-weight:800}
.song h3{margin:2px 0 4px;font-family:var(--f-disp);font-weight:800;font-size:1.2rem;line-height:1.2}
.song-meta{margin:0;font-family:var(--f-ui);font-size:.72rem;letter-spacing:.06em;color:var(--muted)}
.song-szene{margin:12px 0 0 54px;padding-left:12px;border-left:3px solid var(--c);font-style:italic;color:var(--ink)}
.song-text{margin:12px 0 0 54px}
.song-text summary{display:inline-block;padding:7px 14px;border-radius:999px;border:1px solid var(--c);color:var(--c);font-weight:700;font-size:.85rem;cursor:pointer;list-style:none}
.song-text summary::-webkit-details-marker{display:none}
.song-text[open] summary{background:var(--c);color:#fff}
.song-text p{margin:10px 0 0;font-family:var(--f-head);font-size:1.05rem;line-height:1.55}
@media (max-width:560px){.song-szene,.song-text{margin-left:0}.sounds{grid-template-columns:1fr}}

/* Sounds/Musik-Übersicht: Highlights und Folgenkarten */
.hl-reihe{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,1fr);gap:14px;overflow-x:auto;padding:6px 2px 16px;scroll-snap-type:x mandatory}
.hl-k{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;min-height:300px;padding:18px;border-radius:22px;color:#fff;background:#0b1a18;scroll-snap-align:start}
.hl-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 25%;opacity:.55}
.hl-k::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(4,14,13,.96) 30%,rgba(4,14,13,.2))}
.hl-st{position:absolute;top:14px;left:16px;font-family:var(--f-ui);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;padding:5px 10px;border-radius:999px;background:var(--c)}
.hl-k .ez-zitat{color:#fff}.hl-k .ez-zitat q{color:#fff;font-size:1.15rem}.hl-k .ez-zitat b{color:color-mix(in srgb,var(--c) 45%,#fff)}
.hl-f{font-weight:700;font-size:.85rem;color:color-mix(in srgb,var(--c) 40%,#fff);text-decoration:none}
.hl-song{display:flex;gap:12px;align-items:center}.hl-song b{display:block;font-size:1.15rem}.hl-song span:not(.song-nr){font-size:.85rem;opacity:.8}
.hl-song .song-nr{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--c);font-weight:800}
.ep-karten{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px;margin-top:18px}
.ep-karte{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade)}
.ek-kopf{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;min-height:170px;padding:14px 16px;color:#fff;text-decoration:none;overflow:hidden;background:#0b1a18}
.ek-kopf img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform .5s}
.ek-kopf::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(6,12,12,.92),rgba(6,12,12,.1) 75%)}
.ek-kopf:hover img{transform:scale(1.06)}
.ek-code{position:absolute;top:12px;left:14px;font-family:var(--f-ui);font-weight:600;font-size:.78rem;padding:4px 9px;border-radius:8px;background:var(--c)}
.ek-zahl{position:absolute;top:12px;right:14px;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;padding:4px 9px;border-radius:999px;background:rgba(0,0,0,.45);backdrop-filter:blur(4px)}
.ek-kopf b{font-family:var(--f-disp);font-weight:800;font-size:1.15rem;line-height:1.15}
.ek-kopf small{font-style:italic;opacity:.75;font-size:.82rem}
.ez-zitat{display:grid;grid-template-columns:38px 1fr;gap:6px 10px;align-items:start;padding:14px 16px 0;color:var(--ink)}
.ez-zitat img{width:38px;height:38px;border-radius:50%;object-fit:cover;object-position:center 30%}
.ez-zitat b{display:block;font-family:var(--f-ui);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--c)}
.ez-zitat q{display:block;font-family:var(--f-head);font-style:italic;font-size:1.02rem;line-height:1.35;quotes:"„" "“"}
.ez-zitat audio{grid-column:1/-1;width:100%;height:34px;margin-top:4px}
.ez-songs{list-style:none;counter-reset:s;margin:0;padding:14px 16px 0;display:grid;gap:8px}
.ez-songs li{counter-increment:s;display:grid;grid-template-columns:24px 1fr;column-gap:8px}
.ez-songs li::before{content:counter(s);grid-row:span 2;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:color-mix(in srgb,var(--c) 18%,var(--paper));color:var(--c);font-weight:800;font-size:.75rem}
.ez-songs b{font-size:.95rem;line-height:1.25}.ez-songs span{font-size:.78rem;color:var(--muted)}
.ez-mehr{padding:6px 16px 0 48px;color:var(--muted);font-size:.78rem}
.ek-alle{margin-top:auto;padding:12px 16px 14px;font-weight:700;font-size:.85rem;color:var(--c);text-decoration:none}
.ek-alle:hover{text-decoration:underline}
.ez-ton{display:block;font-family:var(--f-ui);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.song h3 small{font-family:var(--f-body);font-weight:500;font-size:.8rem;color:var(--muted)}
.song-notiz{margin:12px 0 0 54px;padding:10px 14px;border-radius:12px;background:color-mix(in srgb,var(--c) 8%,var(--paper));font-size:.9rem;color:var(--muted)}
.song-notiz b{color:var(--ink)}
@media (max-width:560px){.song-notiz{margin-left:0}}
/* Querverweis Sounds <-> Musik als Knopf im Kopf */
.quer-k{display:inline-flex;align-items:center;gap:14px;margin-top:22px;padding:10px 14px 10px 10px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);color:#fff;text-decoration:none;backdrop-filter:blur(6px);transition:background .2s,transform .2s}
.quer-k:hover{background:var(--c);border-color:var(--c);transform:translateY(-2px)}
.qk-i{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--c);font-size:1.2rem;font-weight:800}
.quer-k:hover .qk-i{background:rgba(255,255,255,.2)}
.quer-k small{display:block;font-family:var(--f-ui);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;opacity:.7}
.quer-k b{display:block;font-size:1rem}
.qk-p{font-size:1.3rem;font-weight:800;padding-right:6px}
/* Highlights: Raster statt waagrechter Leiste (kein Scrollen) */
.hl-reihe{grid-auto-flow:row!important;grid-auto-columns:auto!important;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));overflow:visible!important;padding:6px 0 0!important}
.hl-k{min-height:260px}
.sp.mu{--c:var(--c-mu)}
.mu .sp-hero{--tint:var(--c-mu)}
.mu .hl-k{background:#1a0820}.mu .hl-k::before{background:linear-gradient(0deg,rgba(22,6,26,.96) 30%,rgba(22,6,26,.2))}
.mu .ek-kopf{background:#1a0820}
/* Sound-Einträge: Dialog mit mehreren Sprechern, Szenenbeschreibung */
.z-dialog{display:block}
.z-zeile{display:block;margin:0 0 4px}
.z-zeile b{font-family:var(--f-ui);font-style:normal;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--c);margin-right:4px}
.z-szene{display:block;font-family:var(--f-body);font-style:normal;font-size:.95rem;color:var(--muted)}
.z-szene::before{content:"Szene · ";font-family:var(--f-ui);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--c)}
.hl-k .z-zeile b{color:color-mix(in srgb,var(--c) 45%,#fff)}
.sounds li.ist-szene .z-szene{font-size:1rem;color:var(--ink)}
.snd-av.leer{font-size:1.1rem}

/* Staffel-Banner: deutlich hervorgehoben (größer, Rubrikfarbe, klare Trennung) */
.staffel.mit-bild{padding-top:clamp(60px,7vw,96px)}
.staffel.mit-bild .stf-bild{height:clamp(170px,20vw,260px);border-radius:24px;box-shadow:0 30px 60px -30px rgba(20,10,30,.6)}
.staffel.mit-bild .stf-bild img{opacity:1;object-position:center 22%}
.staffel.mit-bild .stf-bild::after{background:linear-gradient(90deg,color-mix(in srgb,var(--c) 55%,#0c0810) 0,rgba(12,8,16,.78) 32%,rgba(12,8,16,.05) 75%)}
.staffel.mit-bild > h2{margin-top:calc(-1 * clamp(170px,20vw,260px) - 18px + 30px)!important;margin-bottom:clamp(90px,12vw,170px)!important;padding-left:30px!important;align-items:center!important;font-size:clamp(2rem,4.4vw,3.4rem)!important;text-shadow:0 3px 24px rgba(0,0,0,.55)}
.staffel.mit-bild > h2 .stf-n{font-size:1.9em!important;line-height:.8;color:#fff!important;text-shadow:0 0 30px var(--c)}
.staffel.mit-bild > h2 small{margin-left:auto;margin-right:24px;padding:6px 12px;border-radius:999px;background:var(--c);color:#fff!important;font-size:.72rem!important;letter-spacing:.14em}
.hl-reihe.drei{grid-template-columns:repeat(3,1fr)!important}@media (max-width:860px){.hl-reihe.drei{grid-template-columns:1fr!important}}
.z-vers{display:block}.z-vers span{display:block}
/* Alternative Listenansicht Sounds/Musik */
.kl-staffeln{position:sticky;top:76px;z-index:4;display:flex;gap:6px;margin:26px 0 0;padding:8px;border-radius:999px;background:var(--paper);box-shadow:var(--shade);width:max-content;max-width:100%;overflow-x:auto}
.kl-staffeln a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;font-weight:800;text-decoration:none;color:var(--c);background:color-mix(in srgb,var(--c) 10%,var(--paper))}
.kl-staffeln a:hover{background:var(--c);color:#fff}
.kl-block{padding-top:44px;scroll-margin-top:140px}
.kl-block h2{display:flex;align-items:center;gap:14px;margin:0 0 12px;font-family:var(--f-disp);font-weight:800;font-size:1.7rem}
.kl-n{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--c);color:#fff;font-family:var(--f-logo);font-weight:400;font-size:2rem}
.kl-block h2 small{margin-left:auto;font-family:var(--f-ui);font-weight:400;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.kl-liste{list-style:none;margin:0;padding:0;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--paper)}
.kl-liste li{display:grid;grid-template-columns:minmax(190px,1fr) minmax(0,2.2fr) 210px 110px;gap:14px;align-items:center;padding:12px 16px;border-top:1px solid var(--line)}
.kl-liste.mu li{grid-template-columns:minmax(190px,1fr) minmax(0,2.6fr) 110px}
.kl-liste li:first-child{border-top:0}
.kl-liste li:nth-child(even){background:color-mix(in srgb,var(--c) 4%,var(--paper))}
.kl-t{display:flex;align-items:baseline;gap:10px;text-decoration:none;color:var(--ink)}
.kl-t:hover b{color:var(--c)}
.kl-c{font-family:var(--f-ui);font-size:.78rem;font-weight:600;color:var(--c)}
.kl-t b{font-weight:700;line-height:1.25}
.kl-q{display:flex;align-items:center;gap:10px;min-width:0;font-family:var(--f-head);font-style:italic;font-size:1rem;line-height:1.3}
.kl-q img{flex:none;width:30px;height:30px;border-radius:50%;object-fit:cover;object-position:center 30%}
.kl-q > span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kl-liste audio{width:210px;height:32px}
.kl-s{display:flex;flex-wrap:wrap;gap:6px}
.kl-s span{padding:4px 10px;border-radius:999px;background:color-mix(in srgb,var(--c) 10%,var(--paper));font-size:.85rem}
.kl-s .kl-mehr{background:none;color:var(--muted)}
.kl-z{text-align:right;font-family:var(--f-ui);font-size:.72rem;letter-spacing:.06em;color:var(--c);text-decoration:none;white-space:nowrap}
@media (max-width:860px){.kl-liste li,.kl-liste.mu li{grid-template-columns:1fr;gap:8px}.kl-liste audio{width:100%}.kl-z{text-align:left}}
.ep-karte .ez-q,.hl-k .ez-q{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.ansicht{display:inline-flex;gap:4px;margin:26px 0 0;padding:4px;border-radius:999px;background:var(--paper);border:1px solid var(--line)}
.ansicht a,.ansicht span{padding:8px 18px;border-radius:999px;font-weight:700;font-size:.88rem;text-decoration:none;color:var(--ink)}
.ansicht span{background:var(--c);color:#fff}
.ansicht a:hover{background:color-mix(in srgb,var(--c) 12%,var(--paper))}
.ansicht + .kl-staffeln{margin-top:14px}

/* Staffel-Banner v2: „Staffel“ klein, große Zahl, Staffelname, Zeile mit Jahren/Folgen/Zitaten/Gegenspieler */
.staffel.mit-bild .stf-bild{height:clamp(220px,24vw,320px)}
.staffel.mit-bild .stf-bild::after{background:linear-gradient(90deg,rgba(10,6,14,.92) 0,rgba(10,6,14,.7) 38%,rgba(10,6,14,0) 78%),linear-gradient(0deg,color-mix(in srgb,var(--c) 45%,transparent),transparent 45%)}
.stf-kopf{position:relative;z-index:1;margin:calc(-1 * clamp(220px,24vw,320px) - 18px) 0 0;height:clamp(220px,24vw,320px);display:flex;flex-direction:column;justify-content:flex-end;padding:0 32px 26px;color:#fff;margin-bottom:28px}
.stf-kopf h2{display:grid!important;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:18px;align-items:end;margin:0!important;padding:0!important;font-size:inherit!important;text-shadow:0 3px 24px rgba(0,0,0,.5)}
.stf-k{grid-column:1/-1;font-family:var(--f-ui);font-size:.72rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:color-mix(in srgb,var(--c) 45%,#fff)}
.stf-kopf .stf-n{grid-row:2;font-family:var(--f-logo);font-weight:400;font-size:clamp(5rem,9vw,7.5rem)!important;line-height:.8;color:#fff;text-shadow:0 0 40px var(--c),0 4px 24px rgba(0,0,0,.5)}
.stf-t{grid-row:2;align-self:end;padding-bottom:.35em;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.6rem,3.4vw,2.6rem);line-height:1.05;letter-spacing:-.01em}
.stf-meta{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.stf-meta span{padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.12);backdrop-filter:blur(6px);font-size:.82rem;font-weight:600}
.stf-meta span:first-child{background:var(--c)}
.stf-meta .stf-g{background:rgba(0,0,0,.35)}
@media (max-width:620px){.stf-kopf{padding:0 18px 18px}.stf-meta span{font-size:.74rem}}

/* Staffel-Banner über die ganze Breite (Text bleibt bündig mit dem Inhalt) */
main.sp{overflow-x:clip}
.staffel.mit-bild .stf-bild{width:100vw;margin-left:calc(50% - 50vw);border-radius:0;height:clamp(260px,30vw,400px);box-shadow:none;border-bottom:4px solid var(--c)}
.staffel.mit-bild .stf-bild img{object-position:center 22%}
.staffel.mit-bild .stf-bild::after{background:linear-gradient(90deg,rgba(10,6,14,.94) 0,rgba(10,6,14,.72) calc(50% - 380px),rgba(10,6,14,.1) 75%),linear-gradient(0deg,color-mix(in srgb,var(--c) 50%,transparent),transparent 40%)}
.stf-kopf{margin-top:calc(-1 * clamp(260px,30vw,400px) - 22px);height:clamp(260px,30vw,400px);padding:0 0 30px}
.stf-kopf .stf-n{font-size:clamp(6rem,11vw,9rem)!important}
.stf-t{font-size:clamp(1.8rem,4vw,3.2rem)}
@media (max-width:620px){.stf-kopf{padding:0 0 18px}}

/* Kopf Sounds/Musik: hell in der Rubrikfarbe mit Grafik (bewusst anders als die dunklen Foto-Banner der Staffeln) */
.rub-hero{position:relative;overflow:hidden;padding:clamp(40px,6vw,80px) 0 clamp(44px,6vw,80px);background:radial-gradient(60% 90% at 85% 40%,color-mix(in srgb,var(--c) 30%,transparent),transparent 70%),radial-gradient(50% 70% at 0% 100%,color-mix(in srgb,var(--c) 18%,transparent),transparent 70%),linear-gradient(180deg,color-mix(in srgb,var(--c) 10%,var(--bg)),var(--bg));border-bottom:1px solid color-mix(in srgb,var(--c) 25%,transparent)}
.rh-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:center}
.rub-hero .crumbs{color:var(--muted)}
.rub-hero .sp-k{color:var(--c)}
.rub-hero h1{margin:0;font-family:var(--f-logo);font-weight:400;font-size:clamp(4.5rem,11vw,8.5rem);line-height:.85;color:var(--ink)}
.rub-hero h1::first-letter{color:var(--c)}
.rh-lead{max-width:46ch;margin:16px 0 0;font-size:1.1rem;line-height:1.6;color:var(--muted)}
.rh-zahlen{display:flex;flex-wrap:wrap;gap:26px;margin:26px 0 0}
.rh-zahlen b{display:block;font-family:var(--f-disp);font-weight:800;font-size:2.3rem;line-height:1;color:var(--c)}
.rh-zahlen span{font-family:var(--f-ui);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.rub-hero .quer-k{color:var(--ink);background:var(--paper);border-color:color-mix(in srgb,var(--c) 30%,transparent);box-shadow:var(--shade)}
.rub-hero .quer-k .qk-i{color:#fff}
.rub-hero .quer-k:hover{color:#fff}
.rh-grafik{position:relative;min-height:360px}
/* Sounds: Schallwelle + Sprecher im Kreis */
.rh-welle{position:absolute;left:0;right:0;top:50%;height:120px;transform:translateY(-50%);display:flex;align-items:center;gap:5px}
.rh-welle i{flex:1;height:var(--h);border-radius:4px;background:linear-gradient(180deg,var(--c),color-mix(in srgb,var(--c) 40%,transparent));opacity:.55;animation:rhw 2.4s ease-in-out infinite alternate}
.rh-welle i:nth-child(3n){animation-delay:-.6s}.rh-welle i:nth-child(3n+1){animation-delay:-1.2s}
@keyframes rhw{to{transform:scaleY(.45)}}
@media (prefers-reduced-motion:reduce){.rh-welle i{animation:none}}
.rh-kreis{position:absolute;inset:0}
.rh-p{position:absolute;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.rh-p img{width:var(--s,86px);height:var(--s,86px);border-radius:50%;object-fit:cover;object-position:center 30%;border:4px solid var(--paper);box-shadow:0 14px 30px -12px rgba(0,0,0,.45),0 0 0 3px color-mix(in srgb,var(--c) 55%,transparent)}
.rh-p b{font-size:.82rem;font-weight:800;color:var(--ink);background:var(--paper);padding:2px 8px;border-radius:999px}
.rh-p small{position:absolute;top:-4px;right:-6px;min-width:34px;padding:3px 7px;border-radius:999px;background:var(--c);color:#fff;font-weight:800;font-size:.72rem}
.rh-p.p0{--s:132px;left:36%;top:22%}.rh-p.p1{left:6%;top:4%}.rh-p.p2{left:72%;top:2%}.rh-p.p3{left:2%;top:58%}.rh-p.p4{left:76%;top:56%}.rh-p.p5{left:22%;top:72%;--s:70px}.rh-p.p6{left:58%;top:76%;--s:70px}
/* Musik: Schallplatte + Songtitel */
.rh-platte{position:absolute;left:50%;top:50%;width:min(340px,80%);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:repeating-radial-gradient(circle,#151018 0 2px,#221b26 2px 4px);box-shadow:0 30px 60px -20px rgba(0,0,0,.6),inset 0 0 0 6px #0c080e;animation:rhd 14s linear infinite}
.rh-platte::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 30deg,transparent 0 20%,rgba(255,255,255,.14) 25%,transparent 32% 70%,rgba(255,255,255,.1) 75%,transparent 82%)}
@keyframes rhd{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.rh-platte{animation:none}}
.rh-label{position:absolute;left:50%;top:50%;width:36%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;overflow:hidden;border:5px solid var(--c)}
.rh-label img{width:100%;height:100%;object-fit:cover}
.rh-label::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px;border-radius:50%;background:var(--bg)}
.rh-s{position:absolute;z-index:2;padding:9px 14px;border-radius:14px;background:var(--paper);box-shadow:var(--shade);font-weight:800;font-size:.9rem;border-left:4px solid var(--c);max-width:220px}
.rh-s.s0{left:0;top:8%}.rh-s.s1{right:0;top:20%}.rh-s.s2{left:2%;bottom:16%}.rh-s.s3{right:4%;bottom:4%}
html.dark .rub-hero{background:radial-gradient(60% 90% at 85% 40%,color-mix(in srgb,var(--c) 26%,transparent),transparent 70%),linear-gradient(180deg,color-mix(in srgb,var(--c) 12%,var(--bg)),var(--bg))}
@media (max-width:860px){.rh-in{grid-template-columns:1fr}.rh-grafik{min-height:320px}}

/* v2.34.1 – Kopf Sounds/Musik kräftig in der Rubrikfarbe, weiße Schrift */
.rub-hero{background:radial-gradient(70% 120% at 90% 30%,color-mix(in srgb,var(--c) 70%,#fff) 0,transparent 60%),radial-gradient(60% 90% at 0% 100%,color-mix(in srgb,var(--c) 60%,#000),transparent 70%),linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#12081a))!important;border-bottom:0;color:#fff}
html.dark .rub-hero{background:radial-gradient(70% 120% at 90% 30%,color-mix(in srgb,var(--c) 55%,transparent) 0,transparent 60%),linear-gradient(135deg,color-mix(in srgb,var(--c) 70%,#000),color-mix(in srgb,var(--c) 30%,#0a0610))!important}
.rub-hero .crumbs,.rub-hero .crumbs a{color:rgba(255,255,255,.75)}
.rub-hero .sp-k{color:#fff;opacity:.85}
.rub-hero h1{color:#fff;text-shadow:0 4px 30px rgba(0,0,0,.25)}
.rub-hero h1::first-letter{color:#fff}
.rh-lead{color:rgba(255,255,255,.88)}
.rh-zahlen b{color:#fff}.rh-zahlen span{color:rgba(255,255,255,.75)}
.rub-hero .quer-k{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.4);color:#fff;box-shadow:none}
.rub-hero .quer-k .qk-i{background:#fff;color:var(--c)}
.rub-hero .quer-k:hover{background:#fff;color:var(--c)}
.rh-welle i{background:linear-gradient(180deg,#fff,rgba(255,255,255,.25));opacity:.6}
.rh-p img{border-color:#fff;box-shadow:0 14px 30px -12px rgba(0,0,0,.5)}
.rh-p small{background:#fff;color:var(--c)}
.rh-label{display:grid;place-items:center;background:radial-gradient(circle,color-mix(in srgb,var(--c) 70%,#fff),var(--c));border-color:#fff}
.rh-label span{font-family:var(--f-logo);font-size:clamp(.8rem,1.6vw,1.1rem);line-height:1;text-align:center;color:#fff}
.rh-label::after{background:#fff}
.rh-s{border-left-color:var(--c);color:var(--ink)}

/* v2.34.1 – Staffel-Banner weicher: in Inhaltsbreite, hell getönt, Foto rechts weich ausgeblendet, dunkle Schrift */
.staffel.mit-bild .stf-bild{width:auto;margin-left:0;border-radius:24px;height:clamp(190px,20vw,250px);border:1px solid color-mix(in srgb,var(--c) 22%,transparent);border-bottom:1px solid color-mix(in srgb,var(--c) 22%,transparent);background:color-mix(in srgb,var(--c) 9%,var(--paper));box-shadow:0 20px 40px -30px rgba(30,10,40,.4)}
.staffel.mit-bild .stf-bild img{position:absolute;right:0;top:0;width:62%;height:100%;opacity:.95;-webkit-mask-image:linear-gradient(90deg,transparent,#000 45%);mask-image:linear-gradient(90deg,transparent,#000 45%)}
.staffel.mit-bild .stf-bild::after{background:linear-gradient(90deg,color-mix(in srgb,var(--c) 9%,var(--paper)) 30%,transparent 70%)!important}
.stf-kopf{margin-top:calc(-1 * clamp(190px,20vw,250px) - 22px)!important;height:clamp(190px,20vw,250px)!important;padding:0 32px 24px!important;color:var(--ink)}
.stf-kopf h2{text-shadow:none!important}
.stf-k{color:var(--c)!important}
.stf-kopf .stf-n{font-size:clamp(4.5rem,8vw,6.5rem)!important;color:var(--c)!important;text-shadow:none!important}
.stf-t{color:var(--ink);font-size:clamp(1.5rem,3vw,2.3rem)!important}
.stf-meta span{background:var(--paper);color:var(--ink);border:1px solid var(--line);backdrop-filter:none}
.stf-meta span:first-child{background:var(--c);color:#fff;border-color:var(--c)}
.stf-meta .stf-g{background:var(--paper)}
@media (max-width:620px){.staffel.mit-bild .stf-bild img{width:100%;opacity:.35;-webkit-mask-image:none;mask-image:none}.stf-kopf{padding:0 18px 18px!important}}
/* Querverweis-Knopf in der Farbe des Ziels (Sounds türkis, Musik fuchsia) */
.quer-k.c-snd{--c:var(--c-snd)}.quer-k.c-mu{--c:var(--c-mu)}
.rub-hero .quer-k.c-snd,.rub-hero .quer-k.c-mu{background:var(--c);border-color:rgba(255,255,255,.55);box-shadow:0 14px 30px -14px rgba(0,0,0,.5)}
.rub-hero .quer-k.c-snd .qk-i,.rub-hero .quer-k.c-mu .qk-i{background:#fff;color:var(--c)}
.rub-hero .quer-k.c-snd:hover,.rub-hero .quer-k.c-mu:hover{background:#fff;color:var(--c)}
.rub-hero .quer-k.c-snd:hover .qk-i,.rub-hero .quer-k.c-mu:hover .qk-i{background:var(--c);color:#fff}
/* Schnellzugriff im Kopf: Sounds und Musik in ihrer Farbe */
.mB .quick a.c-snd{color:var(--c-snd)}.mB .quick a.c-mu{color:var(--c-mu)}


/* v2.34.2 – Kopf Sounds/Musik: Foto im Hintergrund, nur farbig getönt (weniger Vollfarbe) */
.rub-hero{isolation:isolate;background:#120c16!important}
.rh-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 30%;filter:saturate(.85)}
.rub-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(14,8,18,.92) 0,rgba(14,8,18,.72) 40%,color-mix(in srgb,var(--c) 45%,transparent) 75%,color-mix(in srgb,var(--c) 30%,transparent) 100%),linear-gradient(0deg,color-mix(in srgb,var(--c) 55%,transparent),transparent 45%)}
.rh-mus .rh-bg{object-position:center 20%}
.rub-hero .sp-k{color:color-mix(in srgb,var(--c) 45%,#fff);opacity:1}
.rub-hero h1::first-letter{color:color-mix(in srgb,var(--c) 40%,#fff)}
.rh-zahlen b{color:color-mix(in srgb,var(--c) 35%,#fff)}
.rh-welle i{background:linear-gradient(180deg,color-mix(in srgb,var(--c) 40%,#fff),color-mix(in srgb,var(--c) 30%,transparent));opacity:.7}
.rh-p small{background:var(--c);color:#fff}

/* Staffel-Banner deutlich breiter als der Inhalt (bis 16 px vor den Bildschirmrand), Text bleibt bündig */
.staffel.mit-bild .stf-bild{--bw:min(calc(100vw - 32px),calc(100% + 320px));width:var(--bw);margin-left:calc((100% - var(--bw)) / 2)}
/* Musik: Platte steht still; Hintergrundbild nur links (rechts hinter der Platte ruhig, keine Person) */
.rh-platte{animation:none!important}
.rh-mus .rh-bg{width:58%;right:auto;object-position:center 20%;-webkit-mask-image:linear-gradient(90deg,#000 55%,transparent);mask-image:linear-gradient(90deg,#000 55%,transparent)}
@media (max-width:860px){.rh-mus .rh-bg{width:100%;-webkit-mask-image:linear-gradient(180deg,#000 30%,transparent 70%);mask-image:linear-gradient(180deg,#000 30%,transparent 70%)}}
/* Musik-Kopf: Bild nur als weiche Stimmung (unscharf, gedämpft), keine erkennbare Person hinter Text oder Platte */
.rh-mus .rh-bg{width:100%;-webkit-mask-image:none;mask-image:none;filter:blur(10px) saturate(.9);opacity:.55;transform:scale(1.08)}
/* Musik-Kopf: klares Bild (kein Unscharf), Platte ohne Weiß: Etikett in dunklem Fuchsia, Songtitel als dunkle Glas-Etiketten */
.rh-mus .rh-bg{filter:saturate(.9);opacity:1;transform:none;object-position:center 30%}
.rh-label{border:0;background:radial-gradient(circle,color-mix(in srgb,var(--c) 85%,#000) 0 30%,var(--c) 31% 62%,color-mix(in srgb,var(--c) 60%,#000) 63%)}
.rh-label::after{background:#0c080e;width:10px;height:10px;margin:-5px}
.rh-s{background:rgba(18,10,22,.72);color:#fff;border:1px solid color-mix(in srgb,var(--c) 55%,transparent);border-left:4px solid var(--c);backdrop-filter:blur(6px);box-shadow:0 14px 30px -14px rgba(0,0,0,.6)}

/* Menüleiste liegt auf allen Seiten im Kopfbild (wie auf der Startseite): erster Kopf rutscht unter die schwebende Leiste */
body:not(.welt) main.sp > .sp-hero:first-child,body:not(.welt) main.sp > .rub-hero:first-child{margin-top:-78px;padding-top:calc(78px + 60px)}
body:not(.welt) main.sp > .rub-hero:first-child{padding-top:calc(78px + clamp(40px,6vw,80px))}
body:not(.welt) main.sp > .sp-hero.mit-bild:first-child{min-height:calc(clamp(340px,40vw,520px) + 78px)}
@media (max-width:760px){body:not(.welt) main.sp > .sp-hero:first-child{padding-top:calc(78px + 36px)}}
/* Serienbereiche: Menü + Serienleiste liegen gemeinsam über dem Kopfbild */
body.welt .welt-bar{position:sticky;top:78px;z-index:30;margin-bottom:-58px;background:color-mix(in srgb,var(--welt-d) 70%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.1)}
body.welt main.sp > .sp-hero:first-child,body.welt main.sp > .w-hero:first-child{margin-top:-136px;padding-top:calc(136px + 56px)}
body.welt main.sp > .sp-hero.mit-bild:first-child{min-height:calc(clamp(340px,40vw,520px) + 136px)}
body.welt main.sp > .w-hero:first-child{padding-top:calc(136px + 80px)}
/* Musik-Kopf: Bild ohne Farbschleier, nur links dunkel für die Schrift */
.rh-mus::before{background:linear-gradient(90deg,rgba(10,6,14,.9) 0,rgba(10,6,14,.6) 42%,rgba(10,6,14,.15) 75%,rgba(10,6,14,.3) 100%),linear-gradient(0deg,rgba(10,6,14,.55),transparent 40%)!important}
.rh-mus .rh-bg{filter:none;object-position:center 40%}
/* Spalt oben: Leiste ist ~80 px hoch, Kopf überall 2 px weiter nach oben ziehen */
body:not(.welt) main.sp > .sp-hero:first-child,body:not(.welt) main.sp > .rub-hero:first-child{margin-top:-82px}
body.welt main.sp > .sp-hero:first-child,body.welt main.sp > .w-hero:first-child{margin-top:-140px}
/* Musik-Kopf: helles, fröhliches Bild – nur dezente Abdunklung links für die Schrift */
.rh-mus .rh-bg{object-position:30% 35%;transform:scaleX(-1)}
.rh-mus::before{background:linear-gradient(90deg,rgba(14,8,18,.82) 0,rgba(14,8,18,.5) 38%,rgba(14,8,18,0) 70%)!important}
.rh-mus .rh-bg{transform:none!important;object-position:center 30%!important;filter:none!important;opacity:1!important}
.rh-mus::before{background:linear-gradient(90deg,rgba(14,8,18,.88) 0,rgba(14,8,18,.6) 38%,rgba(14,8,18,.15) 65%,rgba(14,8,18,.3) 100%)!important}
.rh-mus .rh-bg{object-position:100% 30%!important}
.rh-platte{width:min(270px,66%)!important}
.rh-mus .rh-bg{top:82px!important;height:calc(100% - 82px)!important;object-position:100% 0!important}
.rh-mus .rh-bg{top:0!important;height:100%!important;object-position:100% 0!important;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 70px)!important;mask-image:linear-gradient(180deg,transparent 0,#000 70px)!important}
.rh-mus::before{background:linear-gradient(90deg,rgba(14,8,18,.75) 0,rgba(14,8,18,.45) 30%,rgba(14,8,18,.08) 55%,rgba(14,8,18,.08) 78%,rgba(14,8,18,.6) 100%)!important}
.rh-mus::before{background:linear-gradient(90deg,rgba(14,8,18,.75) 0,rgba(14,8,18,.45) 30%,rgba(14,8,18,.08) 55%,rgba(14,8,18,.15) 70%,rgba(14,8,18,.82) 100%)!important}
/* Songtitel über den Bildern stärker abheben: kräftige Musikfarbe, Schatten */
.rh-s{background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 60%,#2a0a33))!important;color:#fff!important;border:1px solid rgba(255,255,255,.35)!important;border-left:1px solid rgba(255,255,255,.35)!important;backdrop-filter:none!important;box-shadow:0 16px 34px -10px rgba(0,0,0,.75),0 0 0 3px rgba(0,0,0,.25)!important;font-size:.95rem;padding:10px 16px}
/* Musik-Kopf: Platte tiefer; Textblock links auf dunklem Glas, damit er sich vom Foto abhebt */
.rh-mus .rh-platte{top:62%!important}
.rh-mus .rh-s.s0{top:22%}.rh-mus .rh-s.s1{top:32%}
.rh-mus .rh-text h1,.rh-mus .rh-text .rh-lead{text-shadow:0 2px 14px rgba(0,0,0,.5)}
.rh-mus::before{background:radial-gradient(60% 75% at 18% 55%,rgba(14,8,18,.85),rgba(14,8,18,.55) 45%,transparent 75%),linear-gradient(90deg,rgba(14,8,18,.35) 0,transparent 45%,transparent 70%,rgba(14,8,18,.82) 100%)!important}
.rh-mus .rh-text h1,.rh-mus .rh-text .rh-lead,.rh-mus .rh-zahlen{text-shadow:0 2px 18px rgba(0,0,0,.85),0 0 2px rgba(0,0,0,.6)}
.rh-mus .rh-s.s0{top:4%!important;left:auto!important;right:6%!important}.rh-mus .rh-s.s1{top:26%!important;right:0!important}
.rh-mus .rh-text h1,.rh-mus .rh-text .rh-lead,.rh-mus .rh-zahlen{text-shadow:0 1px 10px rgba(0,0,0,.55)!important}
.rh-mus .rh-s.s0{top:34%!important;left:4%!important;right:auto!important}.rh-mus .rh-s.s1{top:38%!important;right:0!important}
/* Musik/Sounds-Kopf: kein dunkler Rand oben (Bild ohne Masken-Fade), im Dunkelmodus schwarz statt pink abdunkeln, Text-Schatten kräftiger */
.rh-mus .rh-bg{-webkit-mask-image:none!important;mask-image:none!important}
html.dark .rub-hero{background:#0a070c!important}
html.dark .rh-mus::before{background:radial-gradient(60% 75% at 18% 55%,rgba(0,0,0,.88),rgba(0,0,0,.6) 45%,transparent 75%),linear-gradient(90deg,rgba(0,0,0,.45) 0,transparent 45%,transparent 70%,rgba(0,0,0,.85) 100%),linear-gradient(0deg,rgba(0,0,0,.35),transparent 40%)!important}
.rh-mus .rh-text h1,.rh-mus .rh-text .rh-lead,.rh-mus .rh-zahlen,.rh-mus .sp-k,.rh-mus .crumbs{text-shadow:0 2px 6px rgba(0,0,0,.8),0 0 22px rgba(0,0,0,.7)!important}
/* Sounds-Kopf: Serienszene, scharf, ohne Farbschleier; nur hinter dem Text abgedunkelt */
.rh-snd .rh-bg{filter:none;object-position:60% 30%}
.rh-snd::before{background:radial-gradient(60% 75% at 18% 55%,rgba(6,14,13,.85),rgba(6,14,13,.55) 45%,transparent 75%),linear-gradient(90deg,rgba(6,14,13,.35) 0,transparent 45%,transparent 70%,rgba(6,14,13,.75) 100%)!important}
html.dark .rh-snd::before{background:radial-gradient(60% 75% at 18% 55%,rgba(0,0,0,.88),rgba(0,0,0,.6) 45%,transparent 75%),linear-gradient(90deg,rgba(0,0,0,.45) 0,transparent 45%,transparent 70%,rgba(0,0,0,.85) 100%)!important}
.rh-snd .rh-text h1,.rh-snd .rh-text .rh-lead,.rh-snd .rh-zahlen,.rh-snd .sp-k,.rh-snd .crumbs{text-shadow:0 2px 6px rgba(0,0,0,.8),0 0 22px rgba(0,0,0,.7)}
.rh-snd .rh-welle{opacity:.85}
.rh-snd .rh-bg{object-position:62% 40%!important}
.rh-snd .rh-bg{object-position:62% 8%!important}
.rh-snd .rh-bg{object-position:45% 30%!important}
.rh-snd .rh-bg{object-position:55% 25%!important}
.rh-snd .rh-bg{object-position:center 25%!important}



/* Sounds-Kopf v5: Foto vollständig, kleiner, mittig hinter Text/Sprechern, an allen Rändern weich ausgeblendet */
.rh-snd{background:#0a1110!important}
html.dark .rh-snd{background:#07090b!important}
.rh-snd .rh-bg{left:50%!important;right:auto!important;top:0;width:auto!important;height:100%!important;max-width:none;aspect-ratio:16/9;transform:translateX(-42%)!important;object-fit:cover;object-position:center!important;filter:none!important;opacity:1!important;
  -webkit-mask-image:radial-gradient(72% 78% at 50% 45%,#000 45%,transparent 100%)!important;mask-image:radial-gradient(72% 78% at 50% 45%,#000 45%,transparent 100%)!important}
.rh-snd::before{display:block!important;background:linear-gradient(90deg,rgba(10,17,16,.9) 0,rgba(10,17,16,.55) 34%,transparent 55%,transparent 72%,rgba(10,17,16,.55) 100%)!important}
html.dark .rh-snd::before{background:linear-gradient(90deg,rgba(0,0,0,.92) 0,rgba(0,0,0,.55) 34%,transparent 55%,transparent 72%,rgba(0,0,0,.6) 100%)!important}
@media (max-width:860px){.rh-snd .rh-bg{transform:translateX(-50%)!important;opacity:.5!important}}
/* Versuch: Foto noch kleiner, mit klarem Ausblenden nach rechts sowie oben und unten */
.rh-snd .rh-bg{height:86%!important;top:7%!important;transform:translateX(-40%)!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%,#000 70%,transparent 100%),linear-gradient(180deg,transparent 0,#000 18%,#000 80%,transparent 100%)!important;-webkit-mask-composite:source-in!important;
  mask-image:linear-gradient(90deg,transparent 0,#000 22%,#000 70%,transparent 100%),linear-gradient(180deg,transparent 0,#000 18%,#000 80%,transparent 100%)!important;mask-composite:intersect!important}
.rh-snd .rh-grafik{translate:0 70px}

/* Slayer Studien: Themen-Sprungleiste, Themenabschnitte, Studienkarten */
.st-zahlen{display:flex;gap:30px;margin-top:24px}
.st-zahlen b{display:block;font-family:var(--f-disp);font-weight:800;font-size:2.2rem;line-height:1;color:#fff}
.st-zahlen span{font-family:var(--f-ui);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.65)}
.st-themen{position:sticky;top:84px;z-index:5;display:flex;flex-wrap:wrap;gap:8px;margin:30px 0 0;padding:12px;border-radius:22px;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(10px);box-shadow:var(--shade);border:1px solid var(--line)}
.st-themen a{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:color-mix(in srgb,var(--c) 8%,var(--paper));color:var(--ink);font-weight:700;font-size:.88rem;text-decoration:none;border:1px solid color-mix(in srgb,var(--c) 18%,transparent)}
.st-themen a:hover{background:var(--c);color:#fff}
.st-themen small{font-family:var(--f-ui);font-size:.7rem;color:var(--muted)}.st-themen a:hover small{color:#fff}
.st-thema{padding-top:50px;scroll-margin-top:170px}
.st-thema h2{display:flex;align-items:center;gap:14px;margin:0 0 18px;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.5rem,3vw,2.1rem)}
.st-ic{display:grid;place-items:center;width:52px;height:52px;flex:none;border-radius:16px;background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#000));color:#fff;font-size:1.4rem;box-shadow:0 12px 24px -12px var(--c)}
.st-thema h2 small{margin-left:auto;font-family:var(--f-ui);font-weight:400;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.st-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.st-karte{position:relative;display:flex;flex-direction:column;gap:8px;padding:18px 20px 16px;border-radius:18px;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--c);text-decoration:none;color:var(--ink);transition:transform .2s,box-shadow .2s}
.st-karte:hover{transform:translateY(-3px);box-shadow:var(--shade)}
.st-karte b{font-family:var(--f-head);font-weight:600;font-size:1.2rem;line-height:1.3}
.st-au{color:var(--muted);font-size:.9rem}
.st-sp{align-self:flex-start;padding:3px 9px;border-radius:999px;background:color-mix(in srgb,var(--c) 12%,var(--paper));font-family:var(--f-ui);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--c)}
.st-fuss{display:flex;justify-content:space-between;margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);font-family:var(--f-ui);font-size:.72rem;color:var(--muted)}
.st-lesen{color:var(--c);font-weight:600}
@media (max-width:620px){.st-themen{position:static}.st-grid{grid-template-columns:1fr}}

/* Studien: Themen-Banner (wie Staffel-Banner), Listenansicht */
.st-thema.mit-bild{padding-top:clamp(50px,6vw,80px)}
.st-thema .stf-kopf .st-ic2{font-family:var(--f-body)!important;font-size:clamp(3rem,5vw,4.2rem)!important;line-height:1}
.st-thema .stf-t{font-size:clamp(1.4rem,2.8vw,2.1rem)!important}
.ansicht + .st-themen{margin-top:14px}
.st-liste{list-style:none;margin:0;padding:0;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--paper)}
.st-liste li + li{border-top:1px solid var(--line)}
.st-liste li:nth-child(even){background:color-mix(in srgb,var(--c) 4%,var(--paper))}
.st-liste a{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(0,1fr) 80px 70px;gap:14px;align-items:baseline;padding:12px 18px;text-decoration:none;color:var(--ink)}
.st-liste a:hover{background:color-mix(in srgb,var(--c) 10%,transparent)}
.st-liste b{font-family:var(--f-head);font-weight:600;font-size:1.08rem;line-height:1.3}
.st-liste a:hover b{color:var(--c)}
.sl-au{color:var(--muted);font-size:.88rem}
.sl-sp,.sl-kb{font-family:var(--f-ui);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:right}
.sl-sp{color:var(--c)}
@media (max-width:760px){.st-liste a{grid-template-columns:1fr auto;gap:4px 12px}.sl-au{grid-column:1}.sl-sp,.sl-kb{text-align:left}}
.st-svg{width:18px;height:18px;flex:none}
.st-svg.gross{width:clamp(56px,7vw,76px);height:clamp(56px,7vw,76px);padding:12px;border-radius:20px;background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#000));color:#fff;box-shadow:0 14px 30px -14px var(--c);stroke-width:1.6}
.st-themen a .st-svg{color:var(--c)}.st-themen a:hover .st-svg{color:#fff}
.st-thema .stf-kopf h2{align-items:center!important}
.st-fi{display:inline-flex;align-items:center;gap:8px}.st-fi .st-svg{width:20px;height:20px;padding:3px;border-radius:7px;background:color-mix(in srgb,var(--c) 12%,var(--paper));color:var(--c)}
/* Themen-Symbol groß rechts im freien Bereich der Karte */
.st-karte{padding-right:20px}
.st-karte .st-wm{position:absolute;right:18px;bottom:46px;width:54px;height:54px;color:color-mix(in srgb,var(--c) 30%,transparent);stroke-width:1.4;transition:color .2s,transform .2s}
.st-karte:hover .st-wm{color:var(--c);transform:scale(1.06)}
.st-karte b,.st-au{padding-right:58px}
/* Themen-Banner: Symbol groß, ohne Hintergrund, dezent im freien Bereich links */
.st-thema .stf-kopf{position:relative}
.st-thema .stf-kopf .st-ic2{position:absolute;left:-150px;top:50%;translate:0 -50%;grid-row:auto!important}
.st-thema .st-svg.gross{width:110px;height:110px;padding:0;background:none;box-shadow:none;border-radius:0;color:color-mix(in srgb,var(--c) 38%,transparent);stroke-width:1.2}
@media (max-width:1180px){.st-thema .stf-kopf .st-ic2{display:none}}

/* Vorgeschichte als Erzählseite */
.vg-hero{position:relative;isolation:isolate;overflow:hidden;margin-top:-82px;padding:calc(82px + 70px) 0 80px;color:#fff;background:#0c0710}
.vg-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 25%}
.vg-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(12,7,16,.9),rgba(12,7,16,.55) 55%,rgba(12,7,16,.25)),linear-gradient(0deg,rgba(12,7,16,.85),transparent 50%)}
.vg-hero .crumbs,.vg-hero .crumbs a{color:rgba(255,255,255,.7)}
.vg-hero .sp-k{color:color-mix(in srgb,var(--crim) 45%,#fff)}
.vg-vorspann{max-width:24ch;margin:14px 0 0;font-family:var(--f-head);font-style:italic;font-weight:500;font-size:clamp(2rem,4.6vw,3.6rem);line-height:1.12;text-shadow:0 4px 30px rgba(0,0,0,.6)}
.vg-vorspann span{display:block}
.vg-vorspann span:last-child{margin-top:.3em;font-family:var(--f-logo);font-style:normal;font-size:1.4em;color:color-mix(in srgb,var(--crim) 35%,#fff)}
.vg-wer{margin:26px 0 0;font-family:var(--f-ui);font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.vg-kapitel{display:grid;gap:clamp(40px,6vw,80px);padding-top:clamp(50px,7vw,90px)}
.vg-k{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,56px);align-items:center}
.vg-k.rechts{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
.vg-k.rechts .vg-bild{order:2}
.vg-bild{display:block;border-radius:24px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(30,10,40,.55);aspect-ratio:4/5}
.vg-bild img{width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform .6s}
.vg-bild:hover img{transform:scale(1.04)}
.vg-text{position:relative}
.vg-nr{position:absolute;top:-40px;right:0;font-family:var(--f-logo);font-size:7rem;line-height:1;color:color-mix(in srgb,var(--crim) 12%,transparent);pointer-events:none}
.vg-k1{margin:0;font-family:var(--f-ui);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--crim)}
.vg-text h2{margin:6px 0 16px;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.8rem,3.6vw,2.6rem);line-height:1.05}
.vg-text p:not(.vg-k1){font-size:1.08rem;line-height:1.75;max-width:62ch}
.vg-text .anf{font-weight:800}
.vg-weiter{margin-top:clamp(60px,8vw,100px)}
.vg-weiter h2{font-family:var(--f-disp);font-weight:800;font-size:clamp(1.6rem,3vw,2.2rem);margin:0}
.vg .w-kachel div{border-top-color:var(--crim)}
@media (max-width:760px){.vg-k,.vg-k.rechts{grid-template-columns:1fr}.vg-k.rechts .vg-bild{order:0}.vg-bild{aspect-ratio:16/10}}
/* Vorgeschichte-Kopf so hoch wie die anderen Köpfe (~600 px): Vorspann kleiner, zweispaltig breit */
.vg-hero{min-height:calc(clamp(340px,40vw,520px) + 82px);padding:calc(82px + 50px) 0 44px;display:flex;align-items:flex-end;box-sizing:border-box}
.vg-hero > .wrap{width:100%}
.vg-vorspann{max-width:34ch;font-size:clamp(1.5rem,2.8vw,2.3rem);line-height:1.15}
.vg-vorspann span{display:inline}
.vg-vorspann span:last-child{display:block;margin-top:.25em;font-size:1.5em}
.vg-wer{margin-top:16px}
.vg-hero .crumbs{margin-bottom:10px}
.vg-vorspann span:last-child{font-family:var(--f-disp)!important;font-style:normal;font-weight:800;font-size:1.45em;letter-spacing:-.01em;color:#fff;text-shadow:0 0 30px color-mix(in srgb,var(--crim) 70%,transparent),0 4px 30px rgba(0,0,0,.6)}
.vg-vorspann span:last-child{color:color-mix(in srgb,var(--crim) 35%,#fff)!important}

/* Timeline v2: Mittellinie, Karten abwechselnd links/rechts, Epochen-Banner, Figuren-Porträts */
.tl2{position:relative;list-style:none;margin:40px 0 0;padding:0}
.tl2::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:3px;margin-left:-1.5px;border-radius:3px;background:linear-gradient(180deg,var(--c),color-mix(in srgb,var(--c) 30%,transparent))}
.tl-e{position:relative;width:50%;padding:0 44px 26px 0;box-sizing:border-box}
.tl-e.re{margin-left:50%;padding:0 0 26px 44px}
.tl-e.li{margin-top:-40px}.tl-e:first-child,.tl-epoche + .tl-e{margin-top:0}
.tl-punkt{position:absolute;top:22px;right:-9px;width:18px;height:18px;border-radius:50%;background:var(--paper);border:4px solid var(--c);box-shadow:0 0 0 4px var(--bg)}
.tl-e.re .tl-punkt{right:auto;left:-9px}
.tl-karte{position:relative;padding:16px 20px 18px;border-radius:18px;background:var(--paper);border:1px solid var(--line);box-shadow:0 18px 36px -28px rgba(30,10,40,.5);transition:transform .2s}
.tl-karte:hover{transform:translateY(-2px)}
.tl-e.li .tl-karte::after,.tl-e.re .tl-karte::after{content:"";position:absolute;top:26px;width:14px;height:14px;background:var(--paper);border:1px solid var(--line);transform:rotate(45deg)}
.tl-e.li .tl-karte::after{right:-8px;border-left:0;border-bottom:0}
.tl-e.re .tl-karte::after{left:-8px;border-right:0;border-top:0}
.tl-j{display:block;font-family:var(--f-disp);font-weight:800;font-size:1.5rem;line-height:1;color:var(--c)}
.tl-karte p{margin:8px 0 0;line-height:1.6}
.tl-fig{display:flex;gap:6px;margin-top:12px}
.tl-fig img{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:center 30%;box-shadow:0 0 0 2px var(--paper),0 0 0 3px color-mix(in srgb,var(--c) 50%,transparent)}
.tl-epoche{position:relative;z-index:1;clear:both;display:grid;grid-template-columns:minmax(0,1fr);margin:30px 0 40px;border-radius:24px;overflow:hidden;min-height:180px;background:#0a0812;color:#fff;isolation:isolate}
.tl-ep-bild{position:absolute;inset:0;z-index:-2}.tl-ep-bild img{width:100%;height:100%;object-fit:cover;object-position:center 30%;opacity:.85}
.tl-epoche::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,10,20,.92) 0,rgba(8,10,20,.6) 45%,rgba(8,10,20,.15))}
.tl-ep-text{align-self:end;padding:24px 30px}
.tl-ep-k{display:block;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:color-mix(in srgb,var(--c) 45%,#fff)}
.tl-ep-text b{display:block;font-family:var(--f-logo);font-weight:400;font-size:clamp(2.6rem,5vw,3.8rem);line-height:1}
.tl-ep-text > span:last-child{color:rgba(255,255,255,.8)}
.tl-ende{margin:30px 0 0;text-align:center;color:var(--muted)}
.tl-ende a{color:var(--c);font-weight:700}
/* Whedonverse: Bild, Art, Titel */
.tl-bild{margin:-16px -20px 12px;height:150px;overflow:hidden;border-radius:18px 18px 0 0}
.tl-bild img{width:100%;height:100%;object-fit:cover;object-position:center 25%}
.tl-art{display:block;margin-top:4px;font-family:var(--f-ui);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.tl-t{display:block;margin-top:4px;font-family:var(--f-disp);font-weight:800;font-size:1.15rem}
.tl-t a{color:var(--ink);text-decoration:none}.tl-t a:hover{color:var(--c)}
.wz2 .wz-angel{--c:#2f6bea}.wz2 .wz-comic{--c:color-mix(in srgb,var(--c-cc) 75%,#000)}.wz2 .wz-serie{--c:#0e9f8e}.wz2 .wz-film{--c:var(--crim)}
@media (max-width:760px){.tl2::before{left:10px}.tl-e,.tl-e.re{width:auto;margin:0!important;padding:0 0 18px 34px}.tl-punkt,.tl-e.re .tl-punkt{left:1px;right:auto}.tl-e .tl-karte::after{display:none}}
.tl-epoche::before{background:linear-gradient(90deg,rgba(8,10,20,.88) 0,rgba(8,10,20,.45) 45%,rgba(8,10,20,0) 80%)!important}.tl-ep-bild img{opacity:1!important}
/* Timeline-Filter und Farben je Art */
.tl-filter{position:sticky;top:84px;z-index:6;display:flex;flex-wrap:wrap;gap:6px;margin:30px auto 0;padding:8px;border-radius:999px;width:max-content;max-width:100%;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(10px);box-shadow:var(--shade);border:1px solid var(--line)}
.tl-filter a,.tl-filter span{padding:9px 16px;border-radius:999px;font-weight:700;font-size:.88rem;text-decoration:none;color:var(--ink)}
.tl-filter a:hover{background:color-mix(in srgb,var(--c) 12%,var(--paper))}
.tl-filter span{background:var(--c);color:#fff}
.tla-leben{--c:#2f6bea}.tla-angel{--c:#1c46b8}.tla-buffy{--c:var(--c-ep)}.tla-film{--c:var(--crim)}.tla-serie{--c:#0e9f8e}.tla-comic-b,.tla-comic-a{--c:color-mix(in srgb,var(--c-cc) 72%,#000)}
.tla-comic-a .tl-art::after{content:" · Angel";}
@media (max-width:620px){.tl-filter{border-radius:20px;position:static}}
.tl-ep-text b{font-family:var(--f-disp)!important;font-weight:800;font-size:clamp(2rem,4vw,3rem)!important;letter-spacing:-.02em;line-height:1.05}
/* Zwischen-Überschrift in der Timeline (mittig auf der Linie) */
.tl-marke{position:relative;z-index:1;clear:both;width:min(520px,90%);margin:14px auto 40px;padding:16px 22px 18px;border-radius:20px;text-align:center;color:#fff;background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#000));box-shadow:0 20px 40px -22px var(--c)}
.tl-mj{display:block;font-family:var(--f-ui);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;opacity:.8}
.tl-marke b{display:block;margin:4px 0 4px;font-family:var(--f-disp);font-weight:800;font-size:1.35rem;line-height:1.15}
.tl-marke > span:last-child{font-size:.9rem;opacity:.9}
.tl-marke + .tl-e{margin-top:0!important}

/* Dollz: Bühne im Kopf, Knöpfe, Figurenkarten mit Regal */
.dz-hero{position:relative;isolation:isolate;overflow:hidden;margin-top:-82px;padding:calc(82px + 44px) 0 0;color:#fff;background:radial-gradient(60% 90% at 80% 20%,color-mix(in srgb,var(--c-dz) 55%,transparent),transparent 70%),linear-gradient(160deg,#2a0d1d,#120810 70%)}
.dz-hero.ang{background:radial-gradient(60% 90% at 80% 20%,rgba(47,107,234,.55),transparent 70%),linear-gradient(160deg,#0b1430,#060a16 70%)}
.dz-hero .crumbs,.dz-hero .crumbs a{color:rgba(255,255,255,.7)}
.dz-hero .sp-k{color:color-mix(in srgb,var(--c-dz) 40%,#fff)}
.dz-hero h1{margin:0;font-family:var(--f-logo);font-weight:400;font-size:clamp(3.6rem,8vw,6rem);line-height:.9}
.dz-lead{max-width:52ch;margin:12px 0 0;color:rgba(255,255,255,.85)}
.dz-umschalt{display:inline-flex;gap:4px;margin-top:20px;padding:4px;border-radius:999px;background:rgba(255,255,255,.12)}
.dz-umschalt a,.dz-umschalt span{padding:9px 18px;border-radius:999px;font-weight:800;color:#fff;text-decoration:none}
.dz-umschalt span{background:var(--c-dz)}.dz-hero.ang .dz-umschalt span{background:#2f6bea}
.dz-umschalt a:hover{background:rgba(255,255,255,.16)}
.dz-sprung{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px;max-width:900px}
.dz-sprung a{display:inline-flex;align-items:baseline;gap:6px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;font-weight:700;font-size:.85rem;text-decoration:none}
.dz-sprung a:hover{background:#fff;color:#2a0d1d}
.dz-sprung small{font-family:var(--f-ui);font-size:.66rem;opacity:.7}
.dz-buehne{display:flex;justify-content:center;align-items:flex-end;gap:clamp(4px,1vw,14px);margin-top:30px;padding:0 16px;height:200px;overflow:hidden;background:linear-gradient(0deg,rgba(255,255,255,.12) 0 14px,transparent 14px)}
.dz-buehne a{flex:none;transition:transform .2s}.dz-buehne a:hover{transform:translateY(-8px)}
.dz-buehne img{display:block;height:170px;width:auto;image-rendering:pixelated;filter:drop-shadow(0 8px 10px rgba(0,0,0,.45))}
.dz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px;margin-top:40px}
.dz-karte{border-radius:22px;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade);scroll-margin-top:100px}
.dz-karte:target{outline:3px solid var(--c);outline-offset:3px}
.dz-karte header{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line)}
.dz-pb{width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:center 30%;box-shadow:0 0 0 2px var(--paper),0 0 0 4px color-mix(in srgb,var(--c) 50%,transparent)}
.dz-pb.leer{display:grid;place-items:center;background:color-mix(in srgb,var(--c) 18%,var(--paper));color:var(--c);font-weight:800}
.dz-karte b{display:block;font-family:var(--f-disp);font-weight:800;font-size:1.15rem}
.dz-karte small{font-family:var(--f-ui);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.dz-regal{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:center;gap:10px;padding:18px 14px 0;min-height:200px;background:linear-gradient(0deg,color-mix(in srgb,var(--c) 18%,var(--paper)) 0 12px,transparent 12px),radial-gradient(80% 60% at 50% 100%,color-mix(in srgb,var(--c) 10%,transparent),transparent)}
.dz-regal a{display:block;transition:transform .2s}.dz-regal a:hover{transform:translateY(-6px) scale(1.04)}
.dz-regal img{display:block;height:160px;width:auto;image-rendering:pixelated}
@media (max-width:620px){.dz-buehne{height:140px}.dz-buehne img{height:120px}.dz-regal img{height:130px}}

/* Sammelkarten: Kacheln mit Set-Foto und schräger Grundkarte, Bilder zum Set */
.kset-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))!important;gap:16px!important}
.kset.knetz{padding:0!important;overflow:hidden}
.kset-foto{position:relative;height:150px;margin-bottom:12px;background:#120d16;overflow:hidden}
.kset-foto > img:first-child{width:100%;height:100%;object-fit:cover;object-position:center 30%;opacity:.85;transition:transform .5s}
.kset.knetz:hover .kset-foto > img:first-child{transform:scale(1.05)}
.kset-karte{position:absolute;right:12px;bottom:-14px;width:46%;border-radius:6px;transform:rotate(6deg);box-shadow:0 12px 24px -8px rgba(0,0,0,.6);border:3px solid #fff}
.kset.knetz b,.kset.knetz span,.kset.knetz small{padding-left:16px;padding-right:16px}
.kset.knetz small{padding-bottom:14px}
.knetz-bilder{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.knetz-bilder img{display:block;width:100%;border-radius:12px;box-shadow:var(--shade)}

/* Fanartikel: Kategorie-Knöpfe, Bildkacheln, Produktkarten, Notenblatt */
.fa-nav{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px}
.fa-nav a{padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);color:#fff;font-weight:700;font-size:.88rem;text-decoration:none}
.fa-nav a:hover,.fa-nav a[aria-current]{background:var(--c);border-color:var(--c)}
.fa-kats{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-top:40px}
.fa-kat{display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade);text-decoration:none;color:var(--ink);transition:transform .2s}
.fa-kat:hover{transform:translateY(-4px)}
.fa-kat-b{display:grid;grid-template-columns:repeat(3,1fr);height:180px;background:#120d16}
.fa-kat-b img{width:100%;height:100%;object-fit:cover}
.fa-kat-b img:only-child{grid-column:1/-1}
.fa-kat-b.noten{display:grid;place-items:center;background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 50%,#000));color:#fff;font-size:3rem;letter-spacing:.3em}
.fa-kat-t{padding:16px 18px 18px}
.fa-kat-t b{display:block;font-family:var(--f-disp);font-weight:800;font-size:1.35rem}
.fa-kat-t span{display:block;color:var(--muted);margin-top:2px}
.fa-kat-t small{display:block;margin-top:10px;font-family:var(--f-ui);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--c)}
.fa-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(440px,1fr));gap:18px;margin-top:40px}
.fa-prod{display:grid;grid-template-columns:200px minmax(0,1fr);border-radius:22px;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade)}
.fa-bild{display:grid;place-items:center;padding:12px;background:radial-gradient(circle,color-mix(in srgb,var(--c) 10%,#fff),#f3f0f6)}
html.dark .fa-bild{background:radial-gradient(circle,#2a2232,#17131c)}
.fa-bild img{max-width:100%;max-height:220px;object-fit:contain;transition:transform .3s}
.fa-prod:hover .fa-bild img{transform:scale(1.04)}
.fa-info{padding:18px 20px}
.fa-info h2{margin:0 0 8px;font-family:var(--f-disp);font-weight:800;font-size:1.25rem;line-height:1.2}
.fa-info p{margin:0 0 12px;color:var(--ink);line-height:1.55;font-size:.95rem}
.fa-info dl{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.fa-info dl div{padding:6px 10px;border-radius:10px;background:color-mix(in srgb,var(--c) 8%,var(--paper));border:1px solid color-mix(in srgb,var(--c) 16%,transparent)}
.fa-info dt{font-family:var(--f-ui);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fa-info dd{margin:0;font-weight:700;font-size:.88rem}
.fa-noten{max-width:760px;margin:40px auto 0;padding:28px 32px;border-radius:22px;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade);line-height:1.6}
.fa-n{white-space:pre-wrap;margin:10px 0;padding:16px 18px;border-radius:14px;background:repeating-linear-gradient(transparent 0 22px,color-mix(in srgb,var(--c) 20%,transparent) 22px 23px),color-mix(in srgb,var(--c) 5%,var(--paper));font-family:var(--f-ui);font-size:.95rem;line-height:23px}
.fa-t{font-family:var(--f-ui);font-size:.82rem;color:var(--muted)}
@media (max-width:620px){.fa-grid{grid-template-columns:1fr}.fa-prod{grid-template-columns:1fr}.fa-bild img{max-height:240px}}

/* Transcripts: Sprecherspalte mit Porträt, Text daneben, Regie über die ganze Breite */
.sp-text.transcript section{font-size:1.02rem}
.tsz{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;align-items:start;padding:10px 0;border-top:1px solid var(--line)}
.tsz.weiter{border-top:0;padding-top:0}
.tsz-wer{display:flex;align-items:center;gap:10px;position:sticky;top:150px}
.tsz-wer img,.tsz-i{flex:none;width:36px;height:36px;border-radius:50%;object-fit:cover;object-position:center 30%;box-shadow:0 0 0 2px var(--paper),0 0 0 3px color-mix(in srgb,var(--c) 40%,transparent)}
.tsz-i{display:grid;place-items:center;background:color-mix(in srgb,var(--c) 14%,var(--paper));color:var(--c);font-weight:800;font-size:.85rem}
.tsz-wer b{font-family:var(--f-ui);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--c);line-height:1.2}
.tsz p{margin:0;line-height:1.65;max-width:68ch}
.tsz .z-r{color:var(--muted)}
.sp-text.transcript .regie{margin:14px 0;padding:10px 16px;border-left:3px solid color-mix(in srgb,var(--c) 40%,transparent);background:color-mix(in srgb,var(--c) 5%,transparent);border-radius:0 12px 12px 0;font-style:italic;color:var(--muted)}
@media (max-width:620px){.tsz{grid-template-columns:1fr;gap:4px}.tsz-wer{position:static}}

/* Downloads: Mauerwerk wie Galerie, Download-Knopf je Bild, Gruppen-Sprungknöpfe */
.dl-sprung{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px;max-width:980px}
.dl-sprung a{display:inline-flex;align-items:baseline;gap:6px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#fff;font-weight:700;font-size:.82rem;text-decoration:none}
.dl-sprung a:hover{background:var(--c);border-color:var(--c)}
.dl-sprung small{font-family:var(--f-ui);font-size:.64rem;opacity:.7}
.dl-gr{scroll-margin-top:100px;margin:34px 0 12px;font-family:var(--f-disp);font-weight:800;font-size:1.3rem}
.dl-gr small{font-family:var(--f-ui);font-weight:400;font-size:.7rem;color:var(--muted);margin-left:6px}
.dl-wand{column-width:200px;column-gap:10px}
.dl-wand.klein{column-width:90px}
.dlw{position:relative;margin:0 0 10px;break-inside:avoid;border-radius:12px;overflow:hidden;background:var(--paper);box-shadow:0 1px 0 var(--line),0 12px 26px -22px rgba(30,10,40,.5)}
.dlw img{display:block;width:100%;height:auto;transition:transform .4s}
.dlw:hover img{transform:scale(1.04)}
.dlw-dl{position:absolute;right:8px;bottom:8px;display:inline-flex;gap:6px;align-items:center;padding:6px 10px;border-radius:999px;background:rgba(10,6,14,.75);color:#fff;font-weight:800;font-size:.8rem;text-decoration:none;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s;backdrop-filter:blur(4px)}
.dlw-dl span{font-family:var(--f-ui);font-weight:400;font-size:.66rem}
.dlw:hover .dlw-dl,.dlw-dl:focus{opacity:1;transform:none}
.dlw-dl:hover{background:var(--c)}
@media (hover:none){.dlw-dl{opacity:1;transform:none}}
.fa-kat-b{overflow:hidden;grid-template-rows:100%}.fa-kat-b img{min-height:0}
.dlw img[src*="winampskins"]{image-rendering:pixelated}
.dl-wand.breit{column-width:300px}
.dlw img[src*="/themes/"][src$=".jpg"]{image-rendering:auto}
.dl-list audio{height:32px;width:220px;margin:0 10px}
.dl-list li{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* Kleine Bilder (Buttons, Icons, Cursor) nicht strecken */
.dlw img[src*="/buttons/"],.dlw img[src*="/themes/"]{width:auto;max-width:100%;margin:0 auto;image-rendering:auto}
.dlw:has(img[src*="/buttons/"]),.dlw:has(img[src*="/themes/"][src$=".jpg"]){display:flex;justify-content:center;align-items:center;padding:10px;background:color-mix(in srgb,var(--c) 6%,var(--paper))}
.dlw img[src*="/fonts/"]{background:#fff}
/* Fanartikel-Kopf: Produkte als Fächer statt gestrecktem Foto */
.fa-hero{min-height:0;padding-bottom:40px}
.fa-hero-b{position:absolute;right:max(16px,calc(50% - 600px));top:96px;bottom:24px;display:flex;align-items:center;gap:0;z-index:0}
.fa-hero-b img{height:min(240px,80%);width:auto;max-width:220px;object-fit:contain;border-radius:12px;background:#fff;padding:8px;box-shadow:0 20px 40px -14px rgba(0,0,0,.7);margin-left:-30px}
.fa-hero-b img:nth-child(1){transform:rotate(-7deg)}.fa-hero-b img:nth-child(2){z-index:1;transform:translateY(-10px)}.fa-hero-b img:nth-child(3){transform:rotate(7deg)}
.fa-hero .wrap{position:relative;z-index:1}
.fa-hero .sp-lead,.fa-hero h1{max-width:560px}
@media (max-width:900px){.fa-hero-b{display:none}}
/* Dollz: Kopf kompakter, Karten nicht strecken (kein leerer Bereich mit Strich) */
.dz-hero{padding-top:calc(82px + 28px)}
.dz-hero h1{font-size:clamp(2.8rem,6vw,4.4rem)}
.dz-buehne{height:120px;margin-top:20px}
.dz-buehne img{height:100px}
.dz-grid{align-items:start}
.dz-regal{min-height:0;padding-bottom:14px;background:radial-gradient(80% 60% at 50% 100%,color-mix(in srgb,var(--c) 10%,transparent),transparent)}
.dz-regal img{height:150px}
/* Sammelkarten-Vorschau: Bilder nicht verzerren (quer und hoch gemischt) */
.kset-b img{object-fit:contain!important;background:#120d16}
/* Icons: klein in Originalgröße, dicht gruppiert (wie vorher) */
.dl-wand.icons{column-width:auto;columns:auto;display:flex;flex-wrap:wrap;gap:8px}
.dl-wand.icons .dlw{margin:0;width:auto;padding:6px;border-radius:10px;background:color-mix(in srgb,var(--c) 6%,var(--paper))}
.dl-wand.icons .dlw img{width:auto;height:auto;max-width:96px;max-height:96px;image-rendering:auto}
.dl-wand.icons .dlw-dl{display:none}

/* Sammelkartenspiel: Karten als Fächer auf hellem Grund (keine schwarzen Balken) */
.kset.ccg{padding:0!important;overflow:hidden}
.kset.ccg .kset-b{position:relative;display:flex!important;justify-content:center;align-items:flex-end;height:190px;margin:0 0 12px;padding:16px 10px 0;background:radial-gradient(70% 90% at 50% 100%,color-mix(in srgb,var(--c) 28%,var(--paper)),color-mix(in srgb,var(--c) 8%,var(--paper)))!important;gap:0;overflow:hidden}
.kset.ccg .kset-b img{width:28%!important;height:auto!important;aspect-ratio:250/349;object-fit:cover!important;background:none!important;border-radius:7px;border:2px solid #fff;box-shadow:0 12px 22px -8px rgba(20,10,30,.55);margin:0 -4%;transition:transform .3s}
.kset.ccg .kset-b img:nth-child(1){transform:rotate(-12deg) translateY(18px)}
.kset.ccg .kset-b img:nth-child(2){transform:rotate(-4deg) translateY(4px);z-index:1}
.kset.ccg .kset-b img:nth-child(3){transform:rotate(4deg) translateY(4px);z-index:2}
.kset.ccg .kset-b img:nth-child(4){transform:rotate(12deg) translateY(18px);z-index:1}
.kset.ccg:hover .kset-b img:nth-child(1){transform:rotate(-16deg) translateY(10px)}
.kset.ccg:hover .kset-b img:nth-child(4){transform:rotate(16deg) translateY(10px)}
.kset.ccg b,.kset.ccg span,.kset.ccg small{padding-left:16px;padding-right:16px}
.kset.ccg small{padding-bottom:14px}
html.dark .kset.ccg .kset-b{background:radial-gradient(70% 90% at 50% 100%,color-mix(in srgb,var(--c) 30%,#1a1520),#15111a)!important}
.kset.ccg{grid-column:auto!important;flex-direction:column!important}
.kset.ccg .kset-b img{width:30%!important;max-width:110px}

/* Theme-Pakete */
.th-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(520px,1fr));gap:18px;margin-top:18px}
.th-paket{display:grid;grid-template-columns:200px minmax(0,1fr);border-radius:22px;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade)}
.th-bild{display:block;background:#120d16}.th-bild img{width:100%;height:100%;object-fit:cover}
.th-info{padding:18px 20px}
.th-k{font-family:var(--f-ui);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c)}
.th-info h3{margin:4px 0 6px;font-family:var(--f-disp);font-weight:800;font-size:1.3rem}
.th-info p{margin:0 0 12px;color:var(--muted);font-size:.92rem}
.th-dl{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--c);color:#fff;font-weight:800;text-decoration:none}
.th-dl span{font-family:var(--f-ui);font-weight:400;font-size:.72rem;opacity:.85}
.th-cur{display:flex;flex-wrap:wrap;gap:4px;margin-top:14px}
.th-cur img{width:32px;height:32px;padding:3px;border-radius:7px;background:color-mix(in srgb,var(--c) 7%,var(--paper));border:1px solid var(--line);image-rendering:pixelated}
.th-snd{margin-top:12px}
.th-snd summary{cursor:pointer;font-weight:700;color:var(--c)}
.th-snd ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}
.th-snd li{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.85rem}
.th-snd audio{height:30px;width:200px}
@media (max-width:620px){.th-grid{grid-template-columns:1fr}.th-paket{grid-template-columns:1fr}.th-bild{height:160px}}
.th-info h3{font-family:var(--f-disp)!important;letter-spacing:-.01em!important;text-transform:none!important;font-size:1.3rem!important;color:var(--ink)!important}
.th-cur a{display:block;border-radius:7px}.th-cur a:hover img{border-color:var(--c);background:color-mix(in srgb,var(--c) 18%,var(--paper))}
.th-1{display:grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:color-mix(in srgb,var(--c) 12%,var(--paper));color:var(--c);font-weight:800;text-decoration:none}
.th-1:hover{background:var(--c);color:#fff}
.th-alle li{display:flex;justify-content:space-between;gap:10px;padding:3px 0;border-bottom:1px solid var(--line);font-size:.84rem}
.th-alle a{color:var(--ink);text-decoration:none;word-break:break-all}.th-alle a:hover{color:var(--c)}
.th-alle small{font-family:var(--f-ui);font-size:.68rem;color:var(--muted);white-space:nowrap}
.th-cur{max-width:100%;overflow:hidden}
.th-cur a.bg img{width:56px;height:32px;object-fit:cover;padding:0;image-rendering:auto}
.th-paket{min-width:0}.th-info{min-width:0}
/* Theme-Pakete groß: ein Paket je Zeile, Vorschauen sichtbar groß, Sounds in Spalten */
.th-grid{grid-template-columns:1fr!important}
.th-paket{grid-template-columns:300px minmax(0,1fr)}
.th-bild img{min-height:100%}
.th-cur{gap:8px}
.th-cur img{width:56px!important;height:56px!important;padding:6px!important;border-radius:12px!important;image-rendering:pixelated}
.th-cur a.bg img{width:140px!important;height:90px!important;padding:0!important;object-fit:cover;image-rendering:auto}
.th-snd ul{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));column-gap:20px}
.th-snd li span{flex:1;min-width:0}
@media (max-width:760px){.th-paket{grid-template-columns:1fr}.th-bild{height:200px}.th-cur img{width:44px!important;height:44px!important}}
.sp-bild[src*="banner-collage"]{object-fit:cover;object-position:center;width:min(70%,1100px)!important}
.sp-hero.mit-bild:has(.sp-bild[src*="banner-collage"])::after{background:linear-gradient(90deg,var(--hero) 0,color-mix(in srgb,var(--hero) 70%,transparent) 30%,transparent 60%)!important}.sp-bild[src*="banner-collage"]{opacity:1!important;filter:none!important}
/* Banner & Buttons: ganzer Banner rechts im Kopf, nicht beschnitten */
.sp-bild[src*="/kopf-"]{width:min(66%,1000px)!important;height:auto!important;top:50%!important;transform:translateY(-38%);object-fit:contain;border-radius:18px;opacity:1!important;filter:none!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18%)!important;mask-image:linear-gradient(90deg,transparent 0,#000 18%)!important;right:max(16px,calc(50% - 640px))!important}
.sp-hero.mit-bild:has(.sp-bild[src*="/kopf-"])::after{background:linear-gradient(90deg,var(--hero) 0,color-mix(in srgb,var(--hero) 60%,transparent) 32%,transparent 55%)!important}
.fa-kat-b img[src*="/kopf-"]{object-fit:cover;object-position:right center}
.sp-bild[src*="kopf-skins"]{image-rendering:pixelated}.fa-kat-b img[src*="/kopf-"]{object-fit:cover;object-position:right center}
/* Dollz-Kopf so hoch wie alle anderen Bildköpfe; Figuren-Knöpfe in einer Zeile */
body:not(.welt) main.sp > .dz-hero:first-child{margin-top:-82px;height:calc(clamp(340px,40vw,520px) + 78px)}
body.welt main.sp > .dz-hero:first-child{margin-top:-140px;height:calc(clamp(340px,40vw,520px) + 136px);padding-top:calc(140px + 24px)}
.dz-hero{display:flex;flex-direction:column;justify-content:flex-end}
.dz-hero > .wrap{width:100%}
.dz-umschalt{margin-top:16px}
.dz-sprung{flex-wrap:nowrap;max-width:none;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;mask-image:linear-gradient(90deg,#000 92%,transparent)}
.dz-sprung::-webkit-scrollbar{display:none}
.dz-sprung a{flex:none}
@media (max-width:1100px){.dz-buehne{height:96px;margin-top:16px}.dz-buehne img{height:80px}.dz-lead{font-size:.95rem}}
@media (max-width:620px){.dz-hero h1{font-size:2.6rem}.dz-lead{display:none}.dz-buehne{height:84px;margin-top:12px}.dz-buehne img{height:70px}}
/* Fanartikel-Übersicht: Collage auf Schwarz, mittig und ganz im Bild */
.fa-kopf{--hero:#000;background:#000}
.fa-kopf .sp-bild{inset:auto!important;left:50%!important;right:auto!important;top:calc(50% + 39px)!important;transform:translate(-50%,-50%)!important;width:min(100%,1440px)!important;height:auto!important;max-height:calc(100% - 78px);object-fit:contain!important;opacity:1!important;filter:none!important;-webkit-mask-image:none!important;mask-image:none!important}
.fa-kopf::after{background:linear-gradient(90deg,#000 0,rgba(0,0,0,.7) 28%,transparent 46%)!important}
.fa-kopf::before{display:none!important}
.fa-kopf .sp-lead{max-width:36ch}
.fa-kat-b img.frei{object-fit:contain;padding:10px 14px}
.fa-kopf::after{background:linear-gradient(90deg,rgba(0,0,0,.62) 0,rgba(0,0,0,.4) 30%,transparent 48%)!important}
.fa-kopf .wrap{text-shadow:0 2px 14px rgba(0,0,0,.75)}
/* Fanartikel-Kopf: Bild füllt die volle Höhe, rechts bündig; links läuft es ins Schwarz aus (keine Balken auf breiten Bildschirmen) */
.fa-kopf .sp-bild{left:auto!important;right:0!important;top:80px!important;bottom:0!important;transform:none!important;width:auto!important;max-width:none!important;height:calc(100% - 80px)!important;max-height:none!important;object-fit:contain!important}
.fa-kopf .sp-bild{top:0!important;height:100%!important}
/* Serienbereiche ohne eigene Leiste: Köpfe wie überall (Menü 78 px) */
body.welt main.sp > .sp-hero:first-child,body.welt main.sp > .w-hero:first-child{margin-top:-82px;padding-top:calc(78px + 60px)}
body.welt main.sp > .sp-hero.mit-bild:first-child{min-height:calc(clamp(340px,40vw,520px) + 78px)}
body.welt main.sp > .w-hero:first-child{padding-top:calc(78px + 80px)}
body.welt main.sp > .dz-hero:first-child{margin-top:-82px;height:calc(clamp(340px,40vw,520px) + 78px);padding-top:calc(82px + 28px)}
@media (max-width:760px){body.welt main.sp > .sp-hero:first-child{padding-top:calc(78px + 36px)}}
/* Angel-Start: rechts im Kopf der Weg zurück zu Buffy (analog zum Angel-Link auf der Buffy-Startseite) */
.w-hero .wrap{position:relative}
.tobuffy{position:absolute;right:max(16px,env(safe-area-inset-right,0px));bottom:0;display:block;text-align:right;text-decoration:none;color:#fff}
.tobuffy small{display:block;font-family:var(--f-ui);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:#c3a6ff}
.tobuffy b{display:block;margin-top:6px;font-family:var(--f-logo);font-weight:400;font-size:clamp(3.4rem,7vw,5.6rem);line-height:.85;text-shadow:0 0 2px #fff,0 0 16px rgba(109,53,201,.85),0 0 46px rgba(109,53,201,.55);transition:text-shadow .3s}
.tobuffy span{display:inline-block;margin-top:14px;padding:10px 18px;border-radius:999px;border:1px solid rgba(195,166,255,.6);font-weight:800;font-size:.88rem;color:#eadfff;transition:background .25s}
.tobuffy:hover span{background:rgb(109,53,201);border-color:rgb(109,53,201);color:#fff}
@media (max-width:860px){.tobuffy{position:static;text-align:left;margin-top:28px}}
/* Comics: Kopf mit einer Reihe echter Cover (gerade, nebeneinander, nach links ausgeblendet) */
.cv-kopf{--hero:#120c08}
.cv-reihe{position:absolute;z-index:-1;top:78px;bottom:0;right:max(0px,calc(50% - 720px));display:flex;gap:10px;align-items:center;padding:24px 16px 24px 0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.cv-reihe img{height:min(78%,400px);width:auto;aspect-ratio:2/3;object-fit:cover;border-radius:6px;box-shadow:0 18px 36px -14px rgba(0,0,0,.8)}
.cv-kopf::after{background:linear-gradient(90deg,var(--hero) 0,color-mix(in srgb,var(--hero) 80%,transparent) 34%,transparent 60%)!important}
@media (max-width:760px){.cv-reihe{opacity:.35}}
/* Comics: Reihen ab 2009 als Liste */
.wz-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.wz{display:flex;gap:14px;padding:16px 18px;border-radius:16px;background:var(--paper);border:1px solid var(--line)}
.wz-j{flex:none;align-self:flex-start;font-family:var(--f-ui);font-size:.72rem;font-weight:600;padding:5px 9px;border-radius:8px;background:color-mix(in srgb,var(--c) 14%,transparent);color:var(--c);white-space:nowrap}
.wz b{display:block;font-weight:800}
.wz small{display:block;margin-top:2px;font-size:.8rem;color:var(--muted)}
.wz p{margin:6px 0 0;font-size:.9rem}
.cv-kopf .sp-lead{max-width:40ch}.cv-reihe{right:max(-40px,calc(50% - 760px))}
.cv-reihe{right:max(24px,calc(50% - 696px))!important}.cv-reihe img{height:min(74%,380px)}
/* Geschichte der Seite: Zeitleiste der alten Designs */
.gs-liste{position:relative;display:grid;gap:56px;margin-top:56px;padding-left:120px}
.gs-liste::before{content:"";position:absolute;left:52px;top:8px;bottom:8px;width:2px;background:linear-gradient(var(--c),color-mix(in srgb,var(--c) 20%,transparent))}
.gs{--c:rgb(var(--pl-rgb,109,53,201))}
.gs-e{position:relative}
.gs-j{position:absolute;left:-120px;top:0;width:106px;text-align:center;font-family:var(--f-disp);font-weight:800;font-size:1.5rem;padding:6px 0;border-radius:999px;background:var(--c);color:#fff}
.gs-in h2{margin:0;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.5rem,2.6vw,2.1rem)}
.gs-in p{margin:8px 0 0;max-width:70ch;color:var(--muted)}
.gs-bilder{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}
.gs-b{display:block;border-radius:12px;overflow:hidden;background:#000;box-shadow:var(--shade)}
.gs-b:first-child{grid-column:1/-1}
.gs-b img{display:block;width:100%;height:auto}
@media (max-width:700px){.gs-liste{padding-left:0}.gs-liste::before{display:none}.gs-j{position:static;display:inline-block;width:auto;padding:4px 16px;margin-bottom:10px}.gs-bilder{grid-template-columns:1fr}}
.gs-bilder{max-width:1000px}.gs-b:first-child{max-width:1000px}.gs-b:first-child img{max-width:100%;width:auto;margin:0 auto}
/* Episodenguide: Gesichterstreifen aus der alten Kopfleiste */
.kl06{margin:36px auto 0;max-width:816px;text-align:center}
.kl06 img{display:block;width:100%;height:auto;border-radius:10px;box-shadow:0 14px 30px -16px rgba(20,10,40,.6)}
.kl06 figcaption{margin-top:8px;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
/* Dollz-Kopf: Foto der Figuren dahinter, rechts, nach links und unten ausgeblendet */
.dz-bg{position:absolute;z-index:-1;top:0;right:0;height:100%;width:min(70%,1100px);object-fit:cover;object-position:center 20%;opacity:.6;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40%),linear-gradient(0deg,transparent 0,#000 45%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 40%),linear-gradient(0deg,transparent 0,#000 45%);mask-composite:intersect}
.dz-hero .wrap{position:relative;z-index:1}
.dz-buehne{position:relative;z-index:1}
/* Dollz-Kopf: 2–3 Porträts rechts, weich ineinander und nach links/unten ausgeblendet */
.dz-bg{display:none}
.dz-bgs{position:absolute;z-index:-1;top:0;right:0;bottom:0;display:flex;width:min(62%,980px);opacity:.55;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 35%),linear-gradient(0deg,transparent 0,#000 50%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 35%),linear-gradient(0deg,transparent 0,#000 50%);mask-composite:intersect}
.dz-bgs img{flex:1;min-width:0;height:100%;object-fit:cover;object-position:center 18%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%,#000 78%,transparent);mask-image:linear-gradient(90deg,transparent 0,#000 22%,#000 78%,transparent);margin-left:-8%}
.dz-bgs img:first-child{margin-left:0}
/* Dollz-Kopf: Dollz stehen auf den Figuren-Knöpfen (ab Angelus), keine eigene Reihe mehr */
.dz-sprung{padding-top:96px;margin-top:4px!important}
.dz-sprung a{position:relative}
.dz-auf{position:absolute;left:50%;bottom:calc(100% - 4px);transform:translateX(-50%);height:96px;width:auto;image-rendering:pixelated;filter:drop-shadow(0 5px 5px rgba(0,0,0,.55));pointer-events:none;transition:transform .2s}
.dz-sprung a:hover .dz-auf{transform:translateX(-50%) translateY(-4px)}
.dz-hero{padding-bottom:28px}
.dz-sprung{-webkit-mask-image:none!important;mask-image:none!important}
/* Dollz-Kopf: Knopfzeile bis zum rechten Rand, kein Spalt unter dem Umschalter (Dollz ragen nach oben in den freien Bereich) */
.dz-sprung{width:calc(100vw - max(32px,50vw - 568px) - 32px);max-width:none!important;margin-top:-78px!important}
.dz-sprung{gap:5px!important}.dz-sprung a{padding:6px 10px!important;font-size:.8rem!important}
/* Knöpfe brechen in eine zweite Reihe um (Dollz stehen nur auf der ersten) */
.dz-sprung{flex-wrap:wrap!important;overflow:visible!important;row-gap:8px!important}
.dz-br{flex-basis:100%;height:0}
/* Serienlogo links neben Überschrift und Untertitel */
.sp-titel{display:flex;align-items:center;gap:clamp(14px,2vw,26px);margin-top:10px}
.sp-titel .sp-logo{flex:none;height:clamp(64px,8vw,118px);width:auto;margin:0;filter:drop-shadow(0 8px 22px rgba(0,0,0,.6))}
.sp-titel > div{min-width:0}
.sp-titel h1,.sp-titel .name-zeile{margin-top:0}

/* Episodenguide-Übersicht: Kopf mit Staffel-Kacheln, darunter nur die gewählte Staffel (Karten oder Liste) */
.eg-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.eg-chips span{padding:7px 13px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);font-size:.82rem;color:#fff;backdrop-filter:blur(4px)}
.eg-chips b{font-family:var(--f-disp);font-size:1rem;margin-right:4px}
.st-reihe{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin-top:22px;max-width:1136px}
.st-reihe.n5{grid-template-columns:repeat(5,minmax(0,1fr));max-width:820px}.st-reihe.n2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:420px}
.st-k{position:relative;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:4/3.1;padding:10px 11px;border-radius:14px;overflow:hidden;isolation:isolate;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.22);box-shadow:0 14px 28px -14px rgba(0,0,0,.85);transition:transform .25s,border-color .25s}
.st-k img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 25%;filter:saturate(.75) brightness(.75);transition:transform .5s,filter .3s}
.st-k::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,color-mix(in srgb,var(--crim) 55%,#0b0710) 0,rgba(11,7,16,.55) 45%,transparent 75%)}
.st-l{position:absolute;top:8px;left:9px;padding:3px 9px;border-radius:999px;background:rgba(11,7,16,.6);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.25);font-family:var(--f-ui);font-size:.62rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.st-t b{display:block;font-family:var(--f-disp);font-weight:800;font-size:.86rem;line-height:1.15;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.st-t small{display:block;margin-top:3px;font-size:.66rem;opacity:.85}
.st-k:hover{transform:translateY(-4px);border-color:#fff}.st-k:hover img{transform:scale(1.07);filter:none}
main:not(:has(.st-p:target)) .st-k[href="#staffel-1"],main:has(#staffel-1:target) .st-k[href="#staffel-1"],main:has(#staffel-2:target) .st-k[href="#staffel-2"],main:has(#staffel-3:target) .st-k[href="#staffel-3"],main:has(#staffel-4:target) .st-k[href="#staffel-4"],main:has(#staffel-5:target) .st-k[href="#staffel-5"],main:has(#staffel-6:target) .st-k[href="#staffel-6"],main:has(#staffel-7:target) .st-k[href="#staffel-7"],main:has(#staffel-8:target) .st-k[href="#staffel-8"],main:has(#staffel-9:target) .st-k[href="#staffel-9"],main:has(#staffel-10:target) .st-k[href="#staffel-10"]{border:2px solid #fff;transform:translateY(-4px)}
.st-ps{position:relative;margin-top:34px}
.st-p{display:none;scroll-margin-top:96px}
.st-p:target,.st-ps:not(:has(.st-p:target)) .st-p:first-of-type{display:block}
.st-kz{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 16px;margin-bottom:20px;padding-right:220px}
.st-kz h2{margin:0;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.6rem,3vw,2.3rem)}
.st-kz h2 span{color:var(--crim)}.st-kz p{margin:0;color:var(--muted)}
.st-ans{position:absolute;right:0;top:4px;display:flex;padding:3px;border-radius:999px;background:color-mix(in srgb,var(--ink) 7%,transparent)}
.st-ans input{position:absolute;opacity:0;pointer-events:none}
.st-ans label{padding:7px 16px;border-radius:999px;font-weight:700;font-size:.85rem;cursor:pointer;color:var(--ink)}
.st-ans input:checked + label{background:var(--crim);color:#fff}
.st-ans input:focus-visible + label{outline:2px solid var(--crim);outline-offset:2px}
.fk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.fk-k{position:relative;display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade);text-decoration:none;color:var(--ink);transition:transform .2s}
.fk-k:hover{transform:translateY(-4px)}
.fk-b{display:block;aspect-ratio:16/9;overflow:hidden;background:#000}.fk-b img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s}.fk-k:hover .fk-b img{transform:scale(1.05)}
.fk-c{position:absolute;left:10px;top:10px;font-family:var(--f-ui);font-size:.72rem;font-weight:600;padding:4px 9px;border-radius:8px;background:var(--crim);color:#fff}
.fk-x{display:block;padding:13px 15px 4px}.fk-x b{display:block;font-weight:800;font-size:1rem;line-height:1.25}.fk-x small{display:block;color:var(--muted);font-style:italic;font-size:.8rem}
.fk-i{display:block;margin-top:8px;font-size:.84rem;line-height:1.45;color:var(--muted)}
.fk-d{display:block;padding:6px 15px 13px;font-family:var(--f-ui);font-size:.66rem;letter-spacing:.08em;color:var(--muted)}
/* Listenansicht */
.st-ps:has(#st-ans-l:checked) .fk-grid{grid-template-columns:1fr;gap:0;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--paper)}
.st-ps:has(#st-ans-l:checked) .fk-k{flex-direction:row;align-items:center;gap:14px;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;padding:8px 14px}
.st-ps:has(#st-ans-l:checked) .fk-k:hover{transform:none;background:color-mix(in srgb,var(--crim) 6%,var(--paper))}
.st-ps:has(#st-ans-l:checked) .fk-b{width:96px;flex:none;border-radius:8px}
.st-ps:has(#st-ans-l:checked) .fk-c{position:static;flex:none}
.st-ps:has(#st-ans-l:checked) .fk-x{flex:1;padding:0;display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.st-ps:has(#st-ans-l:checked) .fk-i{display:none}
.st-ps:has(#st-ans-l:checked) .fk-d{padding:0;flex:none}
@media (max-width:1000px){.st-reihe,.st-reihe.n5{display:flex;overflow-x:auto;scrollbar-width:none}.st-k{flex:0 0 150px}}
@media (max-width:700px){.st-kz{padding-right:0}.st-ans{position:static;margin-bottom:14px;width:max-content}.st-ps:has(#st-ans-l:checked) .fk-b{display:none}}
.st-k{aspect-ratio:4/3.5}.st-t b{font-size:.82rem}
/* Folgenseite: vorherige/nächste Folge im Kopf */
.fk2{position:absolute;z-index:3;right:max(16px,calc(50% - 704px));top:calc(50% + 39px);transform:translateY(-50%);display:grid;gap:8px}
.fn-b{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center;column-gap:12px;width:250px;padding:11px 16px;border-radius:16px;background:rgba(10,6,14,.5);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.22);color:#fff;text-decoration:none;transition:background .2s}
.fn-b span{grid-row:1/3;font-size:2rem;line-height:1;color:var(--crim)}
.fn-b small{font-family:var(--f-ui);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.fn-b b{font-size:.9rem;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fn-b:hover{background:var(--crim)}.fn-b:hover span{color:#fff}
.sp-hero:has(.fk2) .wrap{padding-right:280px}
@media (max-width:1100px){.fk2{position:static;transform:none;display:flex;flex-wrap:wrap;margin:20px max(16px,env(safe-area-inset-left,0px)) 0}.sp-hero:has(.fk2) .wrap{padding-right:max(16px,env(safe-area-inset-right,0px))}.fn-b{width:auto;min-width:200px;flex:1}}
/* Folgenseite: Text ruhig und lesbar statt grauer Kästen */
.sp-text.folge > section{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0 0 46px!important}
.sp-text.folge > section > h2{margin:0 0 14px;font-family:var(--f-ui);font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--crim)}
.sp-text.folge #inhalt p{margin:0;font-family:var(--f-disp);font-weight:600;font-size:1.28rem;line-height:1.55;max-width:62ch;color:var(--ink)}
.sp-text.folge #inhalt p::first-letter{all:unset}
.sp-text.folge #review p{margin:0 0 1.1em;max-width:68ch;font-size:1.04rem;line-height:1.8}
.sp-text.folge #review p:first-child::first-letter{float:left;font-family:var(--f-logo);font-size:3.6rem;line-height:.8;margin:6px 10px 0 0;color:var(--crim)}
.dz-b{display:grid;gap:12px;padding:18px 20px;margin-bottom:14px;border-radius:18px;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade)}
.dz-b .dz{display:flex;gap:12px;align-items:flex-start}
.dz-b .dz img,.dz-i{flex:none;width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:center 20%}
.dz-i{display:grid;place-items:center;background:var(--crim);color:#fff;font-weight:800}
.dz-b .dz b{display:block;font-size:.8rem;color:var(--crim)}.dz-b .dz b i{font-weight:400;color:var(--muted)}
.dz-b .dz q{display:block;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:1.16rem;line-height:1.38;quotes:none;color:var(--ink)}
.dz-n{margin:0 0 0 52px;font-size:.85rem;color:var(--muted);font-style:italic}
.fl-info{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.fl-info li,.fl-info1{margin:0;padding:12px 16px;border-radius:12px;background:color-mix(in srgb,var(--crim) 8%,var(--paper));border-left:3px solid var(--crim)}
/* untere Navigation mit Szenenbild */
.ep-nav a{display:flex;align-items:center;gap:14px}
.ep-nav a.nx{justify-content:flex-end;text-align:right}
.ep-nav a img{flex:none;width:120px;aspect-ratio:16/9;object-fit:cover;border-radius:10px}
.ep-nav a > span{min-width:0}
@media (max-width:600px){.ep-nav a img{display:none}}
.sp-text.folge #inhalt p:first-of-type::first-letter{float:none;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;color:inherit}
.sp-text.folge #review p:first-of-type::first-letter{float:left;font-family:var(--f-logo);font-size:3.6rem;line-height:.8;margin:6px 10px 0 0;color:var(--crim)}
.fn-b{display:flex;align-items:center;gap:12px}
.fn-b em{display:block;min-width:0;font-style:normal}.fn-b em small,.fn-b em b{display:block}
.sp-hero:has(.fk2) h1{font-size:clamp(2rem,3.6vw,3.3rem)}
/* Staffelauswahl unter dem Kopf, mit mehr Raum */
.wrap > .st-reihe{margin-top:44px;gap:14px;max-width:none}
.wrap > .st-reihe .st-k{aspect-ratio:3/4;padding:14px;border-radius:18px;border-color:var(--line);box-shadow:var(--shade)}
.wrap > .st-reihe .st-l{top:12px;left:12px;font-size:.68rem;padding:4px 11px}
.wrap > .st-reihe .st-t b{font-size:1rem}.wrap > .st-reihe .st-t small{font-size:.74rem}
.wrap > .st-reihe.n5{grid-template-columns:repeat(5,minmax(0,1fr));max-width:none}.wrap > .st-reihe.n2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:560px}
main:not(:has(.st-p:target)) .wrap > .st-reihe .st-k[href="#staffel-1"]{border:3px solid var(--crim)}
main:has(#staffel-1:target) .wrap > .st-reihe .st-k[href="#staffel-1"],main:has(#staffel-2:target) .wrap > .st-reihe .st-k[href="#staffel-2"],main:has(#staffel-3:target) .wrap > .st-reihe .st-k[href="#staffel-3"],main:has(#staffel-4:target) .wrap > .st-reihe .st-k[href="#staffel-4"],main:has(#staffel-5:target) .wrap > .st-reihe .st-k[href="#staffel-5"],main:has(#staffel-6:target) .wrap > .st-reihe .st-k[href="#staffel-6"],main:has(#staffel-7:target) .wrap > .st-reihe .st-k[href="#staffel-7"],main:has(#staffel-8:target) .wrap > .st-reihe .st-k[href="#staffel-8"],main:has(#staffel-9:target) .wrap > .st-reihe .st-k[href="#staffel-9"],main:has(#staffel-10:target) .wrap > .st-reihe .st-k[href="#staffel-10"]{border:3px solid var(--crim);transform:translateY(-4px)}

/* Folgenseite: neuer Aufbau (Kurzinhalt-Karte, Szenen, Inhalt mit Bild, Musik-Knopf, Besetzung, Staffelliste) */
.fn-alle{display:block;text-align:center;padding:9px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.3);color:#fff;text-decoration:none;font-weight:700;font-size:.85rem;background:rgba(10,6,14,.35)}
.fn-alle:hover{background:#fff;color:#111}
.fl2{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:48px;margin-top:40px}
.fl2 h2{margin:0 0 14px;font-family:var(--f-ui);font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--crim)}
.fl2-main > section{margin-bottom:48px}
.ku{display:grid;grid-template-columns:260px 1fr;gap:24px;align-items:center;padding:16px;border-radius:24px;background:linear-gradient(135deg,color-mix(in srgb,var(--crim) 14%,var(--paper)),var(--paper));border:1px solid color-mix(in srgb,var(--crim) 25%,var(--line));box-shadow:var(--shade)}
.ku img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:16px}
.ku p{margin:0;font-family:var(--f-disp);font-weight:600;font-size:1.18rem;line-height:1.5}
.sz-r{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.sz-r img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:12px;box-shadow:var(--shade)}
.sz-r img:first-child{grid-column:span 2;grid-row:span 2;height:100%}
.sp-text.folge .ih p{margin:0 0 1.1em;max-width:68ch;font-size:1.04rem;line-height:1.8}
.sp-text.folge .ih p:first-of-type::first-letter{float:left;font-family:var(--f-logo);font-size:3.6rem;line-height:.8;margin:6px 10px 0 0;color:var(--crim)}
.in-b{float:right;width:42%;margin:6px 0 16px 24px}.in-b img{width:100%;border-radius:14px;box-shadow:var(--shade);transform:rotate(1.5deg)}
.ih::after{content:"";display:block;clear:both}
.mu-k{display:flex;align-items:center;gap:18px;padding:18px 22px;border-radius:22px;text-decoration:none;color:#fff;background:linear-gradient(120deg,var(--c-mu),color-mix(in srgb,var(--c-mu) 50%,#1a0f22));box-shadow:0 18px 36px -18px var(--c-mu);transition:transform .2s}
.mu-k:hover{transform:translateY(-3px)}
.mu-p{flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#111;font-size:1.6rem;box-shadow:inset 0 0 0 6px #333,inset 0 0 0 22px #111,inset 0 0 0 24px var(--c-mu)}
.mu-k small{display:block;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;opacity:.85}.mu-k b{display:block;font-size:1.15rem}.mu-k em{display:block;font-style:normal;font-size:.85rem;opacity:.85}
.mu-g{margin-left:auto;font-size:1.8rem}
.gw ul,.gw .fl-info{margin:0}
.fl2-side section{margin-bottom:34px}
.bs{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.bs li{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:10px;font-size:.86rem;line-height:1.3;color:var(--muted)}
.bs li:hover{background:color-mix(in srgb,var(--crim) 6%,transparent)}
.bs b{font-weight:600;color:var(--ink)}
.bs img,.bs-i{flex:none;width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:center 20%}
.bs-i{display:grid;place-items:center;background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--muted);font-weight:700;font-size:.8rem}
.sl{list-style:none;margin:0;padding:6px;display:grid;gap:2px;border-radius:18px;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade)}
.sl a{display:flex;align-items:center;gap:10px;padding:5px;border-radius:12px;text-decoration:none;color:var(--ink);font-size:.84rem;line-height:1.25}
.sl a:hover{background:color-mix(in srgb,var(--crim) 7%,transparent)}
.sl img{flex:none;width:56px;aspect-ratio:16/10;object-fit:cover;border-radius:7px}
.sl i{display:block;font-style:normal;font-family:var(--f-ui);font-size:.64rem;letter-spacing:.08em;color:var(--crim)}
.sl li.akt a{background:var(--crim);color:#fff}.sl li.akt i{color:#fff}
@media (max-width:900px){.fl2{grid-template-columns:1fr}.ku{grid-template-columns:1fr}.in-b{float:none;width:100%;margin:0 0 16px}}

.fl2-main > section{background:none!important;border:0!important;box-shadow:none!important;padding:0!important}
.fl2-main > section.ku{padding:16px!important;background:linear-gradient(135deg,color-mix(in srgb,var(--crim) 14%,var(--paper)),var(--paper))!important;border:1px solid color-mix(in srgb,var(--crim) 25%,var(--line))!important;box-shadow:var(--shade)!important}
.ku #inhalt,.ku > div > p{margin:0}
.sp-text.folge .ku p{font-family:var(--f-disp);font-weight:600;font-size:1.15rem;line-height:1.5;max-width:none}
/* Logo-Variante A: groß, halbtransparent und abgedunkelt links hinter dem Titel */
.sp-hero:has(.fk2) .sp-titel{position:relative;isolation:isolate}
.sp-hero:has(.fk2) .sp-titel > div{position:relative;z-index:1}
.sp-hero:has(.fk2) .sp-titel .sp-logo{position:absolute;left:-150px;top:50%;transform:translateY(-55%);height:300px!important;width:auto;opacity:.22;z-index:0;filter:brightness(.55) saturate(.8)!important}
.fn-alle{display:block;text-align:center;padding:9px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.3);color:#fff;text-decoration:none;font-weight:700;font-size:.85rem;background:rgba(10,6,14,.35)}
.fn-alle:hover{background:#fff;color:#111}
/* Staffelwahl ohne Springen (Radio statt Anker) */
.st-r{position:absolute;opacity:0;pointer-events:none}
label.st-k{cursor:pointer}
.st-wahl .st-p{display:none!important}
.st-wahl:has(#st-1:checked) #staffel-1{display:block!important}
.st-wahl:has(#st-1:checked) label[for="st-1"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-1:checked) label[for="st-1"] img{filter:none}
.st-wahl:has(#st-2:checked) #staffel-2{display:block!important}
.st-wahl:has(#st-2:checked) label[for="st-2"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-2:checked) label[for="st-2"] img{filter:none}
.st-wahl:has(#st-3:checked) #staffel-3{display:block!important}
.st-wahl:has(#st-3:checked) label[for="st-3"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-3:checked) label[for="st-3"] img{filter:none}
.st-wahl:has(#st-4:checked) #staffel-4{display:block!important}
.st-wahl:has(#st-4:checked) label[for="st-4"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-4:checked) label[for="st-4"] img{filter:none}
.st-wahl:has(#st-5:checked) #staffel-5{display:block!important}
.st-wahl:has(#st-5:checked) label[for="st-5"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-5:checked) label[for="st-5"] img{filter:none}
.st-wahl:has(#st-6:checked) #staffel-6{display:block!important}
.st-wahl:has(#st-6:checked) label[for="st-6"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-6:checked) label[for="st-6"] img{filter:none}
.st-wahl:has(#st-7:checked) #staffel-7{display:block!important}
.st-wahl:has(#st-7:checked) label[for="st-7"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-7:checked) label[for="st-7"] img{filter:none}
.st-wahl:has(#st-8:checked) #staffel-8{display:block!important}
.st-wahl:has(#st-8:checked) label[for="st-8"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-8:checked) label[for="st-8"] img{filter:none}
.st-wahl:has(#st-9:checked) #staffel-9{display:block!important}
.st-wahl:has(#st-9:checked) label[for="st-9"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-9:checked) label[for="st-9"] img{filter:none}
.st-wahl:has(#st-10:checked) #staffel-10{display:block!important}
.st-wahl:has(#st-10:checked) label[for="st-10"]{border:3px solid var(--crim);transform:translateY(-4px)}
.st-wahl:has(#st-10:checked) label[for="st-10"] img{filter:none}
.sp-text .mu-k,.sp-text .mu-k b,.sp-text .mu-k small,.sp-text .mu-k em,.sp-text .mu-k span{color:#fff!important;text-decoration:none!important}.sp-text .mu-k em{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:520px}.mu-k > span:nth-child(2){min-width:0}
/* Logo-Variante A auch in der Episodenguide-Übersicht */
.eg-kopf .sp-titel{position:relative;isolation:isolate}
.eg-kopf .sp-titel > div{position:relative;z-index:1}
.eg-kopf .sp-titel .sp-logo{position:absolute;left:-150px;top:50%;transform:translateY(-55%);height:300px!important;width:auto;opacity:.22;z-index:0;filter:brightness(.55) saturate(.8)!important}
.sp-hero .sp-titel .sp-logo.logo-angel{opacity:.38!important;filter:none!important}
/* Szenenbilder im Inhalt */
.ih .in-b{width:40%;margin:6px 0 18px 26px;float:right}
.ih .in-b.li{float:left;margin:6px 26px 18px 0}
.ih .in-b img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:14px;box-shadow:0 18px 34px -18px rgba(20,10,40,.7);transform:rotate(1.2deg)}
.ih .in-b.li img{transform:rotate(-1.2deg)}
.ih .in-r{clear:both;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;padding-top:8px}
.ih .in-r img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:12px;box-shadow:var(--shade)}
.sp-text.folge .ih p{max-width:none}
@media (max-width:700px){.ih .in-b,.ih .in-b.li{float:none;width:100%;margin:0 0 16px}}
/* Szenenbilder gerade, nie nebeneinander */
.ih .in-b{clear:both}
.ih .in-b img,.ih .in-b.li img{transform:none}
/* Kurzinhalt-Karte: Bild links eingebettet, Text fließt drumherum (keine eigene Spalte) */
.fl2-main > section.ku{display:block!important}
.ku > img{float:left;width:min(42%,280px);aspect-ratio:16/10;object-fit:cover;margin:4px 22px 8px 0;border-radius:14px}
.ku > div{display:block}
.ku::after{content:"";display:block;clear:both}
.sp-text.folge .ku p{font-size:1.08rem;line-height:1.6}
@media (max-width:600px){.ku > img{float:none;width:100%;margin:0 0 14px}}

/* Comic-Übersicht: Zeitstrahl, Kapitel, Bände (aus der Vorschau übernommen) */
.zst{margin-top:50px}
.zleg{display:flex;flex-wrap:wrap;gap:14px;margin:14px 0 18px;font-size:.82rem}
.zleg span::before{content:"";display:inline-block;width:22px;height:10px;border-radius:4px;margin-right:6px;vertical-align:middle}
.zleg .tv::before,.zb.tv{background:#3a2f47}.zleg .ka::before,.zb.ka{background:var(--crim)}.zleg .zw::before,.zb.zw{background:#c9a227}.zleg .zk::before,.zb.zk{background:#1d9bb2}.zleg .neu::before,.zb.neu{background:#8f8a96}
.zs2{--lh:58px;position:relative;padding:28px 0 10px 120px;border-radius:20px;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade);overflow:hidden}
.zj{position:relative;height:20px;margin-right:16px}
.zj span{position:absolute;transform:translateX(-50%);font-family:var(--f-ui);font-size:.68rem;color:var(--muted)}
.zls{position:relative;margin-right:16px;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(7.69% - 1px),var(--line) calc(7.69% - 1px),var(--line) 7.69%)}
.zl{position:relative;height:var(--lh);border-bottom:1px dashed var(--line)}
.zl-n{position:absolute;left:-110px;top:50%;transform:translateY(-50%);width:100px;font-weight:800;font-size:.82rem}
.zl-t{position:relative;height:100%}
.zb{position:absolute;top:8px;bottom:8px;display:flex;flex-direction:column;justify-content:center;padding:0 10px;border-radius:10px;color:#fff;text-decoration:none;overflow:hidden;white-space:nowrap;box-shadow:0 6px 14px -8px rgba(0,0,0,.5);transition:transform .2s}
a.zb:hover{transform:translateY(-2px);filter:brightness(1.1)}
.zb b{font-size:.78rem;overflow:hidden;text-overflow:ellipsis}.zb small{font-size:.66rem;opacity:.85;overflow:hidden;text-overflow:ellipsis}
.zco{position:absolute;z-index:0;top:0;bottom:0;right:0;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--crim) 7%,transparent) 0 8px,transparent 8px 16px);border-left:2px solid color-mix(in srgb,var(--crim) 30%,transparent);pointer-events:none}
.zco em{position:absolute;right:8px;bottom:6px;font-style:normal;font-family:var(--f-ui);font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--crim);opacity:.8}
.zl{z-index:1}
.zk2{position:absolute;z-index:4;transform:translate(-50%,-50%);display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--paper);border:2px solid var(--crim);font-style:normal;color:var(--crim);box-shadow:0 4px 10px -4px rgba(0,0,0,.4)}
.zp{position:absolute;z-index:2;height:var(--lh);border-top:2px dashed var(--crim);border-right:2px dashed var(--crim);border-radius:0 14px 0 0;pointer-events:none}
.zp::after{content:"";position:absolute;right:-7px;bottom:-2px;border:6px solid transparent;border-top:9px solid var(--crim)}
.zv{position:absolute;z-index:3;width:0;border-left:2px dashed var(--crim);pointer-events:none}
.zv{border-left-width:3px!important}.zv::after{content:"";position:absolute;left:-9px;bottom:-4px;border:8px solid transparent;border-top:12px solid var(--crim);border-bottom:0}
.zv.auf::after{bottom:auto;top:-4px;border-top:0;border-bottom:12px solid var(--crim)}
.zv em{position:absolute;top:50%;transform:translateY(-50%);font-style:normal;font-family:var(--f-ui);font-size:.64rem;font-weight:600;color:var(--crim);white-space:nowrap;background:var(--paper);padding:2px 5px;border-radius:5px;border:1px solid color-mix(in srgb,var(--crim) 35%,transparent)}
.zv.r em{left:8px}.zv.l em{right:8px}
.zp em{position:absolute;left:28%;top:-20px;transform:translateX(-50%);font-style:normal;font-family:var(--f-ui);font-size:.64rem;color:var(--crim);white-space:nowrap;background:var(--paper);padding:0 4px}
.kp-um{display:flex;gap:4px;padding:4px;border-radius:999px;background:color-mix(in srgb,var(--ink) 7%,transparent);width:max-content;margin:50px 0 10px}
.kp-um input{position:absolute;opacity:0}.kp-um label{padding:8px 18px;border-radius:999px;font-weight:700;cursor:pointer}.kp-um input:checked+label{background:var(--crim);color:#fff}
main:has(#ks-b:checked) .kp:not([data-s~="buffy"]),main:has(#ks-n:checked) .kp:not([data-s~="angel"]),main:has(#ks-f:checked) .kp:not([data-s~="fray"]){display:none}
.kp{display:grid;grid-template-columns:300px minmax(0,1fr);gap:36px;padding:34px 0;border-top:1px solid var(--line);scroll-margin-top:100px}
.kp-j{display:inline-block;padding:4px 10px;border-radius:8px;background:var(--crim);color:#fff;font-family:var(--f-ui);font-size:.72rem;font-weight:600}
.kp h3{margin:10px 0 8px;font-family:var(--f-disp);font-weight:800;font-size:1.6rem}.kp p{margin:0;color:var(--muted)}
.rg-b{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:12px;padding:4px 4px 14px}
.cv{display:block;min-width:0}.cv img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:4px;box-shadow:0 10px 18px -10px rgba(0,0,0,.6);transition:transform .25s}.cv:hover img{transform:translateY(-6px)}
.cv.sband{position:relative}.cv.sband img{outline:3px solid var(--crim);outline-offset:2px}.cv.sband i{position:absolute;left:50%;bottom:-8px;transform:translateX(-50%);padding:2px 8px;border-radius:999px;background:var(--crim);color:#fff;font-style:normal;font-family:var(--f-ui);font-size:.6rem;font-weight:600;letter-spacing:.06em;white-space:nowrap}
.cv.alle{display:grid;place-items:center;aspect-ratio:2/3;border-radius:6px;border:2px dashed color-mix(in srgb,var(--crim) 45%,var(--line));color:var(--crim);text-decoration:none;font-weight:800;font-size:.9rem;text-align:center;transition:background .2s}
.cv.alle b{display:block;font-size:1.8rem;line-height:1}.cv.alle:hover{background:color-mix(in srgb,var(--crim) 8%,transparent)}
.bds{display:grid;gap:14px}
.bd{display:grid;grid-template-columns:150px minmax(0,1fr);gap:18px;align-items:start;padding:14px;border-radius:18px;background:var(--paper);border:1px solid var(--line)}
.bd-k b{display:block;margin-top:8px;font-weight:800}.bd-k small{color:var(--muted);font-size:.8rem}
.bd-c{display:block}.bd-c img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:6px;box-shadow:0 12px 22px -12px rgba(0,0,0,.7)}
.bd-c.leer{display:grid;place-items:center;aspect-ratio:2/3;border-radius:6px;border:2px dashed var(--line);color:var(--muted);font-size:.8rem}
.bd-h{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px}
.bd-h .cv small{display:block;margin-top:4px;text-align:center;font-family:var(--f-ui);font-size:.7rem;color:var(--muted)}
.alle-l{display:inline-block;margin-top:12px;font-weight:800;color:var(--crim);text-decoration:none}
.kp-l .eg-btn{display:flex;width:100%;margin-top:18px}.kp-l .eg-btn + .eg-btn{margin-top:10px}
.kp-l{position:sticky;top:100px;align-self:start}
.eg-btn{display:inline-flex;align-items:center;gap:14px;margin-top:16px;padding:12px 20px 12px 12px;border-radius:999px;background:var(--crim);color:#fff;text-decoration:none;box-shadow:0 12px 26px -12px var(--crim);transition:transform .2s}
.eg-btn:hover{transform:translateY(-2px)}
.eg-i{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.2);font-size:1.3rem;font-weight:800}
.eg-btn b{display:block;font-size:1.05rem}.eg-btn small{display:block;font-size:.78rem;opacity:.85}.eg-p{font-size:1.4rem;margin-left:6px}
.rg-t{margin:26px 0 10px;font-family:var(--f-disp);font-weight:800;font-size:1.2rem}.rg-t:first-child{margin-top:0}
.kt-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}.kt-g img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:3px;box-shadow:0 6px 10px -6px rgba(0,0,0,.6);transition:transform .2s}.kt-g a:hover img{transform:scale(1.08)}
.rg-t small{font-family:var(--f-ui);font-size:.72rem;color:var(--muted);font-weight:400}
.eg-btn.klein{padding:8px 16px;margin-top:10px;box-shadow:none}
.wks{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.wk{display:flex;gap:14px;align-items:center;padding:10px;border-radius:14px;background:var(--paper);border:1px solid var(--line)}.wk img{flex:none;width:84px;aspect-ratio:2/3;object-fit:cover;border-radius:4px;box-shadow:0 8px 14px -8px rgba(0,0,0,.6)}.wk b{display:block}.wk small{color:var(--muted)}
.hinw{margin-top:12px!important;font-weight:700;color:var(--crim)!important}
.wo{margin:60px 0 90px}.wo-r{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.wo-r a{display:flex;gap:14px;align-items:center;padding:12px;border-radius:18px;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade);text-decoration:none;color:var(--ink)}
.wo-r img{width:70px;aspect-ratio:2/3;object-fit:cover;border-radius:4px}.wo-r b{display:block}

.kp-x{margin-top:6px}.kp-x .tz{min-height:0}
/* Comic-Episodenguide und Heftseiten (wie TV-Guide) */
.cg2 .fk-b{aspect-ratio:16/10}.cg2 .fk-b img{object-position:center 18%}
.cg-reihe .st-k img{object-position:top}
.hx3 .ku-cv{float:left;width:min(30%,170px)!important;aspect-ratio:2/3!important;object-position:top;margin:2px 22px 8px 0}
.hx2-z{margin:0 0 6px;padding:16px 20px;border-left:4px solid var(--crim);background:color-mix(in srgb,var(--crim) 7%,var(--paper));border-radius:0 14px 14px 0;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:1.4rem;line-height:1.3}
.ih .in-b.seite{width:34%}.ih .in-b.seite img{aspect-ratio:auto}
.pg-r{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.pg-r img,.vc-r img{display:block;width:100%;border-radius:6px;box-shadow:0 14px 24px -14px rgba(0,0,0,.7)}
.vc-r{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;max-width:620px}
.bd-mini{display:flex;gap:10px;align-items:center;padding:8px;border-radius:12px;background:var(--paper);border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.bd-mini img{width:44px;aspect-ratio:2/3;object-fit:cover;border-radius:4px}.bd-mini small{display:block;font-size:.68rem;color:var(--muted)}.bd-mini b{font-size:.85rem}
.fl2-side .sl img{width:34px;aspect-ratio:2/3}
.fl2-side .sl span > span{display:block}
.fl2-side .sl > li > span{display:flex;align-items:center;gap:10px;padding:5px;font-size:.84rem;color:var(--muted)}
.ep-nav .hc-mini{width:60px;aspect-ratio:2/3;object-fit:cover;border-radius:5px}
/* Comic-Kataloge (Dark Horse, Carlsen, IDW): Karten, zwei Cover leicht versetzt */
.kk2-info{margin:40px 0 0;max-width:80ch;color:var(--muted);font-size:1rem;line-height:1.7}
.kk2-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:26px 20px;margin:30px 0 80px}
.kk2{margin:0}
.kk2-b{position:relative;aspect-ratio:2/3.2}
.kk2-b img{position:absolute;left:0;top:0;width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:6px;box-shadow:0 14px 24px -14px rgba(0,0,0,.7);transition:transform .3s,z-index 0s .15s}
.kk2.zwei .kk2-b img{width:82%}
.kk2.zwei .kk2-b img:nth-child(2){left:auto;right:0;top:auto;bottom:0;transform:rotate(4deg)}
.kk2.zwei .kk2-b img:first-child{z-index:1;transform:rotate(-3deg)}
.kk2.zwei:hover .kk2-b img:first-child{transform:translateX(-6%) rotate(-6deg)}
.kk2.zwei:hover .kk2-b img:nth-child(2){transform:translateX(6%) rotate(7deg);z-index:2}
.kk2 figcaption{margin-top:12px}.kk2 b{display:block;font-weight:800}.kk2 small{display:block;color:var(--muted);font-size:.8rem}
.kk2 i{display:inline-block;margin-top:4px;font-style:normal;font-family:var(--f-ui);font-size:.62rem;letter-spacing:.06em;color:var(--crim)}
.kk2.zwei .kk2-b img:first-child,.kk2.zwei .kk2-b img:nth-child(2){transform:none}
.kk2.zwei:hover .kk2-b img:first-child{transform:translateX(-4%)}.kk2.zwei:hover .kk2-b img:nth-child(2){transform:translateX(4%)}
.fk-nz{font-style:italic;opacity:.75}
div.fk-k{opacity:.8}
.sl .nz{display:block;font-style:normal;font-size:.68rem;color:var(--muted)}
.bd-h .cv.nz img{filter:grayscale(.5) opacity(.75)}
.t-szene{margin:30px 0 10px;padding:6px 12px;border-left:3px solid var(--crim);font-family:var(--f-ui);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--crim);background:color-mix(in srgb,var(--crim) 6%,transparent)}
/* Screencaps einer Folge: Galerie in voller Breite */
.sc-g > section{margin-top:40px}
.sc-g > section > h2{margin:0 0 14px;font-family:var(--f-ui);font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--crim)}
.sc-g .dl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.sc-g .dl-grid a{display:block;border-radius:10px;overflow:hidden;box-shadow:var(--shade)}
.sc-g .dl-grid img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform .3s}
.sc-g .dl-grid a:hover img{transform:scale(1.05)}
/* Einleitung über dem Guide (Dollhouse, Blood Ties) */
.eg-ein{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:10px 48px;margin:44px 0 0;padding:0 0 30px;border-bottom:1px solid var(--line,rgba(127,127,127,.25))}
.eg-ein h2{grid-column:1/-1;margin:0 0 4px;font-size:1.5rem;color:var(--serie,inherit)}
.eg-ein-t p{margin:0 0 .9em;line-height:1.7;max-width:72ch}
.eg-ein-f{list-style:none;margin:0;padding:0;align-self:start;border-left:3px solid var(--serie,currentColor)}
.eg-ein-f li{padding:8px 0 8px 16px;font-weight:600}.eg-ein-f li+li{border-top:1px solid var(--line,rgba(127,127,127,.2))}
@media (max-width:760px){.eg-ein{grid-template-columns:1fr}}
.eg-bes{margin:40px 0 0}.eg-bes h2{font-size:1.1rem;margin:0 0 12px;color:var(--serie,inherit)}
.eg-bes ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.eg-bes li{padding:6px 14px;border:1px solid var(--line,rgba(127,127,127,.3));border-radius:999px;font-size:.9rem}
.quelle-k{clear:both;margin-top:18px!important;font-size:.78rem;color:var(--muted)}
/* Videos: Webplayer – Vorschaubild mit Play-Knopf, Klick setzt den Player ein (MP4-Kopien unter download.buffy.de/_web/video) */
.dl-vid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin:0 0 28px}
.vid{margin:0;display:flex;flex-direction:column;border-radius:12px;overflow:hidden;background:var(--paper);box-shadow:0 1px 0 var(--line),0 12px 26px -22px rgba(30,10,40,.5)}
.vid-p,.vid video{position:relative;display:block;width:100%;aspect-ratio:4/3;margin:0;padding:0;border:0;background:#0b0710;overflow:hidden}
.vid-p{cursor:pointer}
.vid video{object-fit:contain}
.vid-p img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.vid-p:hover img{transform:scale(1.04)}
.vid-i{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:rgba(10,6,14,.7);box-shadow:0 0 0 2px rgba(255,255,255,.8);backdrop-filter:blur(4px);transition:background .2s}
.vid-i::after{content:"";position:absolute;left:22px;top:17px;border-style:solid;border-width:11px 0 11px 17px;border-color:transparent transparent transparent #fff}
.vid-p:hover .vid-i,.vid-p:focus-visible .vid-i{background:var(--c)}
.vid figcaption{flex:1;display:flex;flex-direction:column;gap:8px;padding:10px 12px 12px}
.vid b{font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.vid figcaption a{margin-top:auto;font-weight:800;font-size:.8rem;text-decoration:none;color:var(--c)}
.vid figcaption a:hover{text-decoration:underline}
.vid figcaption small{margin-left:4px;font-family:var(--f-ui);font-weight:400;font-size:.66rem;color:var(--muted)}
/* Bildschirmschoner mit Vorschau: zweiter Knopf (ZIP) als Umriss */
.th-dl.zw{margin-left:8px;background:transparent;color:var(--c);box-shadow:inset 0 0 0 1.5px var(--c)}
.th-dl.zw:hover{background:var(--c);color:#fff}
.vid figcaption a.vid-f{font-weight:600;color:var(--ink)}
.vid figcaption a.vid-f + a{margin-top:0}
/* Sprungleiste im Kopf höchstens drei Reihen (Wallpapers hat 77 Gruppen), Rest scrollt – Kopf bleibt gleich hoch wie überall */
.dl-sprung{max-height:128px;overflow-y:auto;overscroll-behavior:contain;padding-right:6px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.35) transparent}
