/* Variante M "Galerie" (hell): Ausstellungsplakat statt Website. Kühles Papierweiß, Tinte, ein Karmesin.
   Inszenierung: Bild IN der Riesen-Fraktur, Text-Karten überlagern Bilder, Zeilen kippen beim Hover ins Schwarz, versetzter Figuren-Fries. */
:root{--bg:#f4f3f1;--paper:#fbfaf8;--ink:#141015;--muted:#6f6670;--crim:#a1122d;--line:rgba(20,16,21,.12);--shade:0 30px 60px -30px rgba(40,10,25,.35);
  --f-logo:"UnifrakturMaguntia","Pirata One",Georgia,serif;--f-head:"Cormorant Garamond",Georgia,"Times New Roman",serif;--f-body:"Manrope","Segoe UI",system-ui,sans-serif;--f-ui:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --rail:250px;color-scheme:light}
html.dark{--bg:#121014;--paper:#1a171c;--ink:#efe9e1;--muted:#a39aa3;--crim:#d2324f;--line:rgba(239,233,225,.12);--shade:0 30px 60px -30px rgba(0,0,0,.8);color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;overflow-x:clip}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
a:focus-visible,summary:focus-visible{outline:2px solid var(--crim);outline-offset:3px}

/* Seitenleiste */
.rail{position:fixed;inset:0 auto 0 0;width:var(--rail);z-index:20;display:flex;flex-direction:column;gap:26px;padding:28px 24px max(22px,env(safe-area-inset-bottom,0px)) max(24px,env(safe-area-inset-left,0px));
  background:var(--paper);border-right:1px solid var(--line);overflow-y:auto;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.logo{text-decoration:none;font-family:var(--f-logo);font-size:2.5rem;line-height:1}
.logo em{font-style:normal;color:var(--crim)}
.logo small{display:block;margin-top:8px;font-family:var(--f-ui);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.series{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:4px;padding:4px;border:1px solid var(--line);border-radius:999px;width:max-content}
.series a{padding:6px 12px;border-radius:999px;text-decoration:none;font-size:.8rem;font-weight:600;color:var(--muted)}
.series a:hover{color:var(--ink)}
.series a[aria-current]{background:var(--ink);color:var(--paper)}
.lbl{font-family:var(--f-ui);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin:0 0 6px}
.nav ul{list-style:none;margin:0;padding:0}
.nav a{display:flex;align-items:center;gap:10px;padding:6px 0;text-decoration:none;font-size:.95rem;font-weight:500;transition:color .2s,gap .25s}
.nav a::before{content:"";width:0;height:1px;background:var(--crim);transition:width .25s}
.nav a:hover{color:var(--crim)}
.nav a:hover::before{width:16px}
.rail-foot{margin-top:auto;display:grid;gap:14px}
.toggles{display:flex;gap:6px}
.tg{padding:6px 12px;border:1px solid var(--line);border-radius:999px;text-decoration:none;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tg:hover{color:var(--ink);border-color:var(--ink)}
.to-light{display:none}html.dark .to-dark{display:none}html.dark .to-light{display:inline-block}
.count{display:flex;gap:16px;font-family:var(--f-ui);font-size:.7rem;color:var(--muted)}
.count b{display:block;font-family:var(--f-body);font-size:1.05rem;color:var(--ink);font-variant-numeric:tabular-nums}
.count div:first-child b{color:var(--crim)}
.mtop{display:none}

.main{margin-left:var(--rail);min-width:0}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(32px,env(safe-area-inset-left,0px));padding-right:max(32px,env(safe-area-inset-right,0px))}

/* Hero: Bild in der Schrift */
.hero{position:relative;padding-block:70px 40px;overflow:hidden}
.hero-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;font-family:var(--f-ui);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.hero-top b{color:var(--crim);font-weight:600}
.word{display:block;margin:10px 0 0 -.04em;font-family:var(--f-logo);font-weight:400;font-size:clamp(7rem,24vw,22rem);line-height:.8;
  background:url(../img/d/hero-buffy.jpg) 46% 32%/cover no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-stroke:1px color-mix(in srgb,var(--ink) 35%,transparent);filter:contrast(1.15) saturate(1.05)}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){.word{color:var(--ink)}}
.hero-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 260px;gap:36px;align-items:end;margin-top:26px;padding-top:26px;border-top:2px solid var(--ink)}
.sub{margin:0;font-family:var(--f-head);font-style:italic;font-weight:500;font-size:clamp(2rem,3.4vw,2.9rem);line-height:1}
.sub em{font-style:italic;color:var(--crim)}
.hero-row p{margin:0;color:var(--muted);max-width:44ch}
.cta{display:grid;gap:8px}
.btn{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;text-decoration:none;font-weight:700;font-size:.92rem;border:1.5px solid var(--ink);transition:background .25s,color .25s}
.btn::after{content:"→";transition:transform .25s}
.btn:hover::after{transform:translateX(4px)}
.btn.primary{background:var(--ink);color:var(--paper)}
.btn.primary:hover{background:var(--crim);border-color:var(--crim)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}

/* Abschnittsköpfe */
.sec{padding-block:90px 10px}
.sh{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:20px;margin-bottom:36px}
.sh h2{margin:0;font-family:var(--f-head);font-weight:500;font-size:clamp(2.6rem,5vw,4.2rem);line-height:.9}
.sh h2 em{color:var(--crim)}
.sh .rule{height:2px;background:var(--ink);margin-bottom:10px}
.sh p{margin:0 0 6px;font-family:var(--f-ui);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* Aufmacher mit überlagernden Karten */
.feature{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}
.plate{position:relative;display:block;text-decoration:none}
.plate .im{overflow:hidden;background:#000}
.plate img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.plate:hover img{transform:scale(1.04)}
.card{position:relative;background:var(--paper);padding:26px 28px;box-shadow:var(--shade);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.plate:hover .card{transform:translateY(-6px)}
.card .tag{font-family:var(--f-ui);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--crim)}
.card h3{margin:8px 0 8px;font-family:var(--f-head);font-weight:500;font-size:clamp(1.9rem,3vw,2.6rem);line-height:1}
.card p{margin:0;color:var(--muted);font-size:.95rem}
.p1{grid-column:1/9}
.p1 .im{height:560px}.p1 img{object-position:50% 18%}
.p1 .card{width:min(440px,80%);margin:-150px 0 0 auto;margin-right:-40px}
.p2{grid-column:9/13;align-self:start;margin-top:60px}
.p2 .im{height:300px}.p2 img{object-position:50% 25%}
.p2 .card{margin:-50px 18px 0 -40px;padding:22px 22px}
.p3{grid-column:5/13;margin-top:40px}
.p3 .im{height:260px}.p3 img{object-position:50% 35%}
.p3 .card{width:min(420px,80%);margin:-80px 0 0 30px}

/* Bereiche: kippen ins Schwarz */
.rows{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.row{position:relative;display:grid;grid-template-columns:70px minmax(0,1fr) minmax(0,1fr) 140px;align-items:center;gap:24px;padding:24px 18px;border-bottom:1px solid var(--line);text-decoration:none;overflow:hidden;isolation:isolate;transition:color .35s}
.row::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);transform:scaleY(0);transform-origin:bottom;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.row:hover{color:var(--paper)}
.row:hover::before{transform:scaleY(1)}
.row .no{font-family:var(--f-ui);font-size:.75rem;color:var(--muted);transition:color .35s}
.row b{font-family:var(--f-head);font-weight:500;font-size:clamp(1.9rem,3.2vw,2.8rem);line-height:1}
.row span{font-size:.92rem;color:var(--muted);transition:color .35s}
.row:hover span,.row:hover .no{color:color-mix(in srgb,var(--paper) 70%,transparent)}
.row .pv{justify-self:end;width:130px;height:80px;object-fit:cover;transform:translateX(30px);opacity:0;transition:opacity .35s,transform .5s cubic-bezier(.2,.7,.2,1)}
.row:hover .pv{opacity:1;transform:none}
.row.dollz .pv{object-fit:contain;image-rendering:pixelated;background:#000}

/* Figuren-Fries, versetzt */
.frieze{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:14px;padding-bottom:40px}
.fig{display:block;text-decoration:none}
.fig:nth-child(even){transform:translateY(40px)}
.fig .p{aspect-ratio:3/4;overflow:hidden;background:#000}
.fig img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .5s,transform .8s cubic-bezier(.2,.7,.2,1)}
.fig:hover img{filter:none;transform:scale(1.06)}
.fig b{display:block;margin-top:10px;font-family:var(--f-head);font-weight:500;font-size:1.2rem;line-height:1.05}
.fig span{display:block;font-size:.74rem;color:var(--muted)}
.fig:hover b{color:var(--crim)}
.more{display:inline-flex;gap:10px;margin-top:40px;font-weight:700;text-decoration:none;border-bottom:2px solid var(--crim);padding-bottom:3px}

/* Schwarzes Band */
.band{margin-top:100px;background:var(--ink);color:var(--paper)}
.band .wrap{display:grid;grid-template-columns:auto minmax(0,1fr);gap:40px;align-items:center;padding-block:80px}
.band .init{font-family:var(--f-logo);font-size:clamp(9rem,16vw,14rem);line-height:.7;color:var(--crim)}
.band p{margin:0;max-width:24ch;font-family:var(--f-head);font-style:italic;font-weight:500;font-size:clamp(2rem,3.8vw,3.2rem);line-height:1.1}
.band small{display:block;margin-top:18px;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:color-mix(in srgb,var(--paper) 60%,transparent)}

.foot{padding-block:40px 50px}
.foot-in{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 40px}
.net{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:0;padding:0;font-family:var(--f-ui);font-size:.8rem}
.net a{text-decoration:none;color:var(--muted)}.net a:hover{color:var(--crim)}
.foot small{font-family:var(--f-ui);font-size:.72rem;color:var(--muted)}.foot small a{text-decoration:none}

@media (prefers-reduced-motion:no-preference){
  .word{animation:pan 30s ease-in-out infinite alternate}
  @keyframes pan{from{background-position:40% 30%}to{background-position:60% 34%}}
  .sub,.hero-row p,.cta{animation:rise 1s cubic-bezier(.2,.7,.2,1) both}.hero-row p{animation-delay:.1s}.cta{animation-delay:.2s}
  @keyframes rise{from{opacity:.001;transform:translateY(14px)}to{opacity:1;transform:none}}
}

@media (max-width:1180px){.frieze{grid-template-columns:repeat(4,minmax(0,1fr))}.fig:nth-child(even){transform:none}.fig:nth-child(4n+2),.fig:nth-child(4n+4){transform:translateY(30px)}
  .hero-row{grid-template-columns:minmax(0,1fr) 240px}.hero-row p{grid-column:1}.hero-row .sub{grid-column:1/-1}}
@media (max-width:980px){
  .rail{display:none}.main{margin-left:0}
  .mtop{display:flex;position:sticky;top:0;z-index:30;align-items:center;justify-content:space-between;padding:12px max(20px,env(safe-area-inset-right,0px)) 12px max(20px,env(safe-area-inset-left,0px));padding-top:max(12px,env(safe-area-inset-top,0px));background:color-mix(in srgb,var(--paper) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
  .mtop .logo{font-size:2rem}
  .mtop details{position:relative}
  .mtop summary{list-style:none;cursor:pointer;padding:8px 14px;border:1.5px solid var(--ink);font-family:var(--f-ui);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
  .mtop summary::-webkit-details-marker{display:none}
  .mtop .sheet{position:absolute;right:0;top:calc(100% + 10px);width:min(86vw,320px);display:grid;gap:14px;padding:18px 20px;background:var(--paper);box-shadow:var(--shade)}
  .feature{grid-template-columns:1fr;gap:40px}.p1,.p2,.p3{grid-column:auto;margin-top:0}
  .p1 .im{height:420px}.p1 .card,.p2 .card,.p3 .card{width:auto;margin:-60px 16px 0}
  .row{grid-template-columns:44px minmax(0,1fr) 24px}.row span,.row .pv{display:none}
  .row::after{content:"→";justify-self:end}
}
@media (max-width:560px){.wrap{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
  .hero-row{grid-template-columns:1fr}.frieze{grid-template-columns:repeat(2,minmax(0,1fr))}.fig:nth-child(n){transform:none}.fig:nth-child(even){transform:translateY(24px)}
  .band .wrap{grid-template-columns:1fr;gap:10px}.sh{grid-template-columns:1fr}.sh .rule{display:none}}

/* Menütafel nach dem alten Imagemap-Menü */
.plate-menu{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);border-radius:4px;overflow:hidden;isolation:isolate;background:#120a1c;color:#f1e9f5;box-shadow:0 24px 50px -24px rgba(40,10,40,.55)}
.plate-menu .art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.55;filter:saturate(1.3)}
.plate-menu::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(160deg,rgba(18,10,28,.35),rgba(18,10,28,.88) 70%)}
.plate-menu .orn{position:absolute;width:22px;height:22px;border-color:#c9a46a;border-style:solid;pointer-events:none;z-index:2}
.orn.tl{top:6px;left:6px;border-width:2px 0 0 2px}.orn.tr{top:6px;right:6px;border-width:2px 2px 0 0}
.orn.bl{bottom:6px;left:6px;border-width:0 0 2px 2px}.orn.br{bottom:6px;right:6px;border-width:0 2px 2px 0}
.vl{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:20px 0;text-decoration:none;border-right:1px solid rgba(201,164,106,.35);background:rgba(0,0,0,.25);transition:background .3s}
.vl i{font-style:normal;font-family:var(--f-logo);font-size:1.45rem;line-height:1;color:#9fb8ff;transition:color .3s,text-shadow .3s}
.vl:hover{background:rgba(61,110,255,.25)}
.vl:hover i{color:#fff;text-shadow:0 0 12px #6f95ff}
.plate-menu ul{list-style:none;margin:0;padding:22px 16px 22px 14px}
.plate-menu li a{display:flex;align-items:center;gap:8px;padding:4px 0;text-decoration:none;font-size:.9rem;font-weight:600;color:#efe6f4;transition:color .2s,padding .2s}
.plate-menu li:nth-child(3n+2) a{color:#c9b6ff}.plate-menu li:nth-child(3n) a{color:#ffb4c4}
.plate-menu li a::before{content:"";width:0;height:2px;background:#c9a46a;transition:width .2s}
.plate-menu li a:hover{color:#fff;padding-left:2px}
.plate-menu li a:hover::before{width:12px}
.plate-menu li a[aria-current]{color:#fff}
.plate-menu li a[aria-current]::before{width:12px;background:var(--crim)}

/* Jubiläum */
.jubi{display:inline-flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;border:1.5px solid var(--ink);border-radius:999px;font-family:var(--f-ui);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.jubi b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--crim);color:#fff;font-family:var(--f-head);font-size:1.15rem;letter-spacing:0;font-weight:600}
.anniv{position:relative;margin-top:100px;padding-block:90px;background:var(--paper);border-block:1px solid var(--line);overflow:hidden;isolation:isolate}
.anniv .big{position:absolute;right:-.06em;top:50%;transform:translateY(-50%);z-index:-1;font-family:var(--f-head);font-weight:500;font-size:clamp(14rem,34vw,30rem);line-height:.8;color:transparent;-webkit-text-stroke:1.5px color-mix(in srgb,var(--crim) 45%,transparent)}
.anniv h2{margin:0;font-family:var(--f-head);font-weight:500;font-size:clamp(2.8rem,5.5vw,4.6rem);line-height:.95;max-width:12ch}
.anniv h2 em{color:var(--crim)}
.anniv p{margin:18px 0 0;max-width:46ch;color:var(--muted)}
.anniv ul{list-style:none;margin:34px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:34px}
.anniv li b{display:block;font-family:var(--f-head);font-weight:600;font-size:2.6rem;line-height:1;font-variant-numeric:tabular-nums}
.anniv li span{font-family:var(--f-ui);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

/* ===== Variante N "Sunnydale Pop": hell, jede Rubrik mit eigener Farbe, Inhalte vorne ===== */
:root{--c-bi:#f06a2a;--bg:#f6f4f8;--paper:#ffffff;--ink:#17121c;--muted:#6b6372;--crim:#e0244d;--line:rgba(23,18,28,.10);--shade:0 24px 50px -28px rgba(40,20,60,.35);
  --c-ep:#e0244d;--c-ch:#7b3fe4;--c-snd:#0e9f8e;--c-tl:#f2a516;--c-tr:#2f6bea;--c-dz:#e8457f;--c-cc:#f4c21b;--c-dl:#1f9d55;--c-st:#17121c;
  --f-logo:"UnifrakturMaguntia","Pirata One",Georgia,serif;--f-disp:"Outfit","Segoe UI",system-ui,sans-serif;--f-body:"Outfit","Segoe UI",system-ui,sans-serif;--f-ui:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --rail:250px;color-scheme:light}
html.dark{--bg:#100d14;--paper:#19151e;--ink:#f1ecf5;--muted:#a49cab;--line:rgba(241,236,245,.11);--shade:0 24px 50px -28px rgba(0,0,0,.8);color-scheme:dark}
body{font-family:var(--f-body)}
.wrap{max-width:1200px}

/* Hero: links Titel, rechts Folge der Woche */
.pop-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:center;padding-block:56px 30px}
.pop-hero h1{margin:16px 0 0;font-family:var(--f-logo);font-weight:400;font-size:clamp(5.5rem,13vw,10.5rem);line-height:.82;color:var(--ink)}
.pop-hero h1 span{display:block;margin-top:14px;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.05;letter-spacing:-.01em}
.pop-hero h1 span em{font-style:normal;color:var(--crim)}
.pop-hero .lead{margin:20px 0 0;max-width:46ch;color:var(--muted);font-size:1.05rem}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.pills a{padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:700;font-size:.9rem;color:#fff;transition:transform .2s,box-shadow .2s}
.pills a:hover{transform:translateY(-2px)}
.pills a:nth-child(1){background:var(--c-ep);box-shadow:0 10px 24px -12px var(--c-ep)}
.pills a:nth-child(2){background:var(--c-ch);box-shadow:0 10px 24px -12px var(--c-ch)}
.pills a:nth-child(3){background:var(--c-snd);box-shadow:0 10px 24px -12px var(--c-snd)}
.pills a:nth-child(4){background:var(--c-tl);box-shadow:0 10px 24px -12px var(--c-tl);color:#2a1a00}

.fotw{position:relative;display:block;border-radius:28px;overflow:hidden;text-decoration:none;color:#fff;background:var(--c-ep);box-shadow:0 40px 80px -40px rgba(224,36,77,.7);isolation:isolate}
.fotw img{width:100%;height:440px;object-fit:cover;object-position:50% 20%;mix-blend-mode:luminosity;opacity:.9;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.fotw:hover img{transform:scale(1.04)}
.fotw::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(110,0,30,.95) 10%,rgba(224,36,77,.25) 60%,transparent)}
.fotw .in{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:26px 28px}
.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:#fff;color:var(--c-ep);font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.fotw .no{display:block;margin-top:16px;font-family:var(--f-ui);font-size:.85rem;opacity:.85}
.fotw h2{margin:4px 0 8px;font-family:var(--f-disp);font-weight:800;font-size:clamp(2rem,3.6vw,3rem);line-height:1}
.fotw p{margin:0;max-width:44ch;opacity:.9}
.fotw .go{position:absolute;top:22px;right:22px;z-index:1;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--c-ep);font-size:1.3rem;font-weight:800;transition:transform .3s}
.fotw:hover .go{transform:rotate(-45deg)}

/* Laufband mit Neuigkeiten */
.ticker{display:flex;align-items:center;gap:0;margin-top:30px;border-radius:999px;background:var(--ink);color:var(--paper);overflow:hidden}
.ticker b{flex:0 0 auto;padding:12px 18px;background:var(--crim);color:#fff;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase}
.ticker .tk{overflow:hidden;flex:1}
.ticker .tk-in{display:flex;gap:40px;width:max-content;padding-left:20px;font-size:.92rem;white-space:nowrap}
.ticker .tk-in span::before{content:"✦";margin-right:12px;color:var(--c-tl)}
@media (prefers-reduced-motion:no-preference){.ticker .tk-in{animation:tk 40s linear infinite}@keyframes tk{to{transform:translateX(-50%)}}}

/* Bunte Inhalts-Kacheln */
.sh2{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px;margin:80px 0 26px}
.sh2 h2{margin:0;font-family:var(--f-disp);font-weight:800;font-size:clamp(2.2rem,4.4vw,3.4rem);line-height:1;letter-spacing:-.02em}
.sh2 p{margin:0;color:var(--muted)}
.mosaic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(220px,auto);gap:16px}
.t{--c:var(--c-ep);position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:16px;padding:22px;border-radius:24px;text-decoration:none;overflow:hidden;isolation:isolate;
  background:color-mix(in srgb,var(--c) 12%,var(--paper));border:1px solid color-mix(in srgb,var(--c) 22%,transparent);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,background .35s}
.t:hover{transform:translateY(-6px);box-shadow:0 30px 50px -28px var(--c);background:color-mix(in srgb,var(--c) 18%,var(--paper))}
.t .tt{display:flex;align-items:center;justify-content:space-between;gap:10px}
.t h3{margin:0;font-family:var(--f-disp);font-weight:800;font-size:1.5rem;line-height:1;letter-spacing:-.01em;color:color-mix(in srgb,var(--c) 75%,var(--ink))}
.t .ar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--c);color:#fff;font-weight:800;transition:transform .3s}
.t:hover .ar{transform:rotate(-45deg)}
.t p{margin:0;font-size:.88rem;color:var(--muted)}
.t.ep{--c:var(--c-ep);grid-column:span 2;grid-row:span 2}
.t.ch{--c:var(--c-ch);grid-column:span 2}
.t.snd{--c:var(--c-snd)}.t.tl{--c:var(--c-tl)}.t.tr{--c:var(--c-tr)}.t.dz{--c:var(--c-dz)}.t.cc{--c:var(--c-cc)}.t.dl{--c:var(--c-dl)}
.t.st{--c:var(--c-st);grid-column:1/-1;min-height:220px;color:#fff;background:#17121c;border-color:#17121c}
.t.st h3{color:#fff}.t.st p{color:rgba(255,255,255,.7)}.t.st .ar{background:#fff;color:#17121c}
.t.st img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;opacity:.45;transition:opacity .4s,transform 1s}
.t.st:hover img{opacity:.6;transform:scale(1.04)}

/* Vorschauen in den Kacheln */
.eplist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.eplist li{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--paper);box-shadow:0 1px 0 var(--line)}
.eplist i{font-style:normal;font-family:var(--f-ui);font-weight:600;color:var(--c-ep)}
.eplist b{font-weight:700;font-size:.95rem}
.eplist small{font-size:.72rem;color:var(--muted)}
.faces{display:flex}
.faces img{width:58px;height:58px;border-radius:50%;object-fit:cover;border:3px solid var(--paper);margin-left:-12px;transition:transform .25s}
.faces img:first-child{margin-left:0}
.t.ch:hover .faces img{transform:translateY(-4px)}
.t.ch:hover .faces img:nth-child(even){transform:translateY(2px)}
.wave{display:flex;align-items:center;gap:3px;height:56px}
.wave i{flex:1;border-radius:3px;background:var(--c-snd);height:35%;opacity:.85}
.wave i:nth-child(3n){height:80%}.wave i:nth-child(4n+1){height:55%}.wave i:nth-child(5n){height:100%}.wave i:nth-child(7n+2){height:65%}
@media (prefers-reduced-motion:no-preference){.t.snd:hover .wave i{animation:w .6s ease-in-out infinite alternate}.wave i:nth-child(odd){animation-delay:.2s}@keyframes w{to{transform:scaleY(.4)}}}
.bars{display:grid;gap:8px}
.bars div{display:grid;grid-template-columns:44px 1fr;align-items:center;gap:8px;font-size:.72rem;color:var(--muted)}
.bars span{position:relative;height:10px;border-radius:5px;background:color-mix(in srgb,var(--c-tl) 20%,transparent)}
.bars span::after{content:"";position:absolute;top:0;bottom:0;border-radius:5px;background:var(--c-tl)}
.bars .b::after{left:0;width:85.7%}.bars .a::after{left:28.6%;width:71.4%;background:#3d7bff}
.script{display:grid;gap:6px;padding:12px;border-radius:10px;background:var(--paper);box-shadow:var(--shade)}
.script span{height:6px;border-radius:3px;background:color-mix(in srgb,var(--ink) 15%,transparent)}
.script .h{background:var(--c-tr);width:40%}
.dolls{display:flex;align-items:flex-end;justify-content:center;gap:10px;height:110px}
.dolls img{height:100%;width:auto;image-rendering:pixelated}
.cards{position:relative;height:110px}
.cards span{position:absolute;left:50%;top:0;width:70px;height:100px;border-radius:8px;overflow:hidden;border:3px solid #fff;box-shadow:var(--shade);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.cards img{width:100%;height:100%;object-fit:cover}
.cards span:nth-child(1){transform:translateX(-95%)}.cards span:nth-child(2){transform:translateX(-50%);z-index:1}.cards span:nth-child(3){transform:translateX(-5%)}
.t.cc:hover .cards span:nth-child(1){transform:translateX(-115%)}.t.cc:hover .cards span:nth-child(3){transform:translateX(15%)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips span{padding:4px 10px;border-radius:999px;font-size:.74rem;font-weight:600;background:var(--paper);color:color-mix(in srgb,var(--c-dl) 70%,var(--ink))}

/* Heute vor ... */
.onthisday{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:30px;align-items:center;margin-top:80px;padding:34px 38px;border-radius:28px;
  background:linear-gradient(120deg,var(--c-ch),var(--c-ep) 60%,var(--c-tl));color:#fff;box-shadow:0 40px 80px -40px rgba(123,63,228,.7)}
.onthisday .date{font-family:var(--f-disp);font-weight:800;font-size:clamp(3rem,6vw,5rem);line-height:.85;text-align:center}
.onthisday .date small{display:block;font-size:.9rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;opacity:.85;margin-top:6px}
.onthisday b{display:block;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;opacity:.85}
.onthisday p{margin:6px 0 0;font-family:var(--f-disp);font-weight:700;font-size:clamp(1.3rem,2.2vw,1.8rem);line-height:1.2}
.onthisday a{padding:12px 20px;border-radius:999px;background:#fff;color:var(--c-ch);font-weight:800;text-decoration:none;white-space:nowrap}

/* Figuren bunt */
.frieze2{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:12px}
.fg{--c:var(--c-ep);display:block;text-decoration:none;border-radius:20px;overflow:hidden;background:var(--paper);box-shadow:0 1px 0 var(--line);transition:transform .3s,box-shadow .3s}
.fg:nth-child(8n+2){--c:var(--c-ch)}.fg:nth-child(8n+3){--c:var(--c-snd)}.fg:nth-child(8n+4){--c:var(--c-tl)}.fg:nth-child(8n+5){--c:var(--c-tr)}.fg:nth-child(8n+6){--c:var(--c-dz)}.fg:nth-child(8n+7){--c:var(--c-cc)}.fg:nth-child(8n+8){--c:var(--c-dl)}
.fg .p{aspect-ratio:1;overflow:hidden;background:var(--c)}
.fg img{width:100%;height:100%;object-fit:cover;mix-blend-mode:luminosity;transition:mix-blend-mode .3s,transform .6s}
.fg:hover{transform:translateY(-6px);box-shadow:0 24px 40px -24px var(--c)}
.fg:hover img{mix-blend-mode:normal;transform:scale(1.06)}
.fg b{display:block;padding:10px 12px 0;font-weight:800;font-size:.95rem;line-height:1.15}
.fg span{display:block;padding:2px 12px 12px;font-size:.72rem;color:var(--muted)}

/* 30 Jahre bunt */
.jubel{margin-top:80px;padding:60px 0;background:var(--ink);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.jubel .n30{position:absolute;right:2%;top:50%;transform:translateY(-50%);z-index:-1;font-family:var(--f-disp);font-weight:800;font-size:clamp(9rem,22vw,19rem);line-height:.8;letter-spacing:-.04em;
  background:linear-gradient(120deg,var(--c-ep),var(--c-ch),var(--c-snd),var(--c-tl));-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.9}
.jubel h2{margin:0;font-family:var(--f-disp);font-weight:800;font-size:clamp(2.4rem,5vw,4rem);line-height:.95;max-width:13ch}
.jubel p{margin:16px 0 0;max-width:44ch;color:rgba(255,255,255,.75)}
.jubel ul{list-style:none;margin:30px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:30px}
.jubel li b{display:block;font-family:var(--f-disp);font-weight:800;font-size:2.6rem;line-height:1}
.jubel li span{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6)}

@media (max-width:1180px){.mosaic{grid-template-columns:repeat(2,minmax(0,1fr))}.frieze2{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:860px){.pop-hero{grid-template-columns:1fr}.fotw img{height:340px}.onthisday{grid-template-columns:1fr;text-align:left}.onthisday .date{text-align:left}}
@media (max-width:560px){.mosaic{grid-template-columns:1fr}.t.ep,.t.ch,.t.st{grid-column:auto;grid-row:auto}.frieze2{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ===== Menü-Alternativen für N (ersetzen die Tafel) ===== */
.rail,.mtop{display:none!important}
.main{margin-left:0!important}
.ico{display:inline-grid;place-items:center;flex:0 0 auto;width:28px;height:28px;border-radius:9px;background:var(--c);color:#fff}
.ico svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.c-ep{--c:var(--c-ep)}.c-ch{--c:var(--c-ch)}.c-snd{--c:var(--c-snd)}.c-tl{--c:var(--c-tl)}.c-tr{--c:var(--c-tr)}.c-dz{--c:var(--c-dz)}.c-cc{--c:var(--c-cc)}.c-dl{--c:var(--c-dl)}.c-bi{--c:var(--c-bi,#f06a2a)}.c-st{--c:var(--c-st)}.c-xx{--c:#8a8290}
.wordmark{text-decoration:none;font-family:var(--f-logo);font-size:2.1rem;line-height:1;color:var(--ink)}
.wordmark em{font-style:normal;color:var(--crim)}
.segm{display:flex;padding:3px;border-radius:999px;background:color-mix(in srgb,var(--ink) 6%,transparent)}
.segm a{padding:6px 12px;border-radius:999px;text-decoration:none;font-size:.8rem;font-weight:700;color:var(--muted)}
.segm a[aria-current]{background:var(--paper);color:var(--ink);box-shadow:0 2px 8px -2px rgba(0,0,0,.15)}
.mini{display:flex;gap:6px}
.mini a{padding:7px 12px;border-radius:999px;border:1px solid var(--line);text-decoration:none;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.mini a:hover{color:var(--ink);border-color:var(--ink)}
.to-light{display:none}html.dark .to-dark{display:none}html.dark .to-light{display:inline-block}

/* --- A: Farbleiste oben --- */
.mA{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--paper) 88%,transparent);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);border-bottom:1px solid var(--line)}
.mA .row1{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:12px max(32px,env(safe-area-inset-right,0px)) 0 max(32px,env(safe-area-inset-left,0px))}
.mA .row1 .sp{flex:1}
.mA nav ul{max-width:1200px;margin:0 auto;list-style:none;display:flex;gap:4px;padding:10px max(32px,env(safe-area-inset-right,0px)) 0 max(32px,env(safe-area-inset-left,0px));overflow-x:auto;scrollbar-width:none}
.mA nav ul::-webkit-scrollbar{display:none}
.mA nav a{position:relative;display:flex;align-items:center;gap:8px;padding:8px 12px 14px;text-decoration:none;font-weight:700;font-size:.9rem;white-space:nowrap;color:var(--ink)}
.mA nav a .ico{width:24px;height:24px;border-radius:8px}
.mA nav a .ico svg{width:13px;height:13px}
.mA nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:4px;border-radius:4px 4px 0 0;background:var(--c);transform:scaleY(0);transform-origin:bottom;transition:transform .25s}
.mA nav a:hover::after,.mA nav a[aria-current]::after{transform:scaleY(1)}
.mA nav a:hover{color:color-mix(in srgb,var(--c) 70%,var(--ink))}

/* --- B: Mega-Menü --- */
.mB{position:sticky;top:0;z-index:40;padding:14px max(32px,env(safe-area-inset-right,0px)) 14px max(32px,env(safe-area-inset-left,0px))}
.mB .bar{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:8px 8px 8px 22px;border-radius:999px;background:color-mix(in srgb,var(--paper) 90%,transparent);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 10px 30px -18px rgba(40,20,60,.4);border:1px solid var(--line)}
.mB .quick{display:flex;gap:4px;margin-right:auto;margin-left:8px}
.mB .quick a{padding:8px 12px;border-radius:999px;text-decoration:none;font-weight:700;font-size:.88rem;color:var(--ink)}
.mB .quick a:hover{background:color-mix(in srgb,var(--c) 14%,transparent);color:color-mix(in srgb,var(--c) 75%,var(--ink))}
.mB details{position:static}
.mB summary{list-style:none;display:flex;align-items:center;gap:10px;padding:10px 18px;border-radius:999px;cursor:pointer;font-weight:800;font-size:.9rem;color:#fff;
  background:linear-gradient(90deg,var(--c-ep),var(--c-ch));box-shadow:0 10px 22px -10px var(--c-ch)}
.mB summary::-webkit-details-marker{display:none}
.mB summary .hb{display:grid;gap:3px}.mB summary .hb i{display:block;width:14px;height:2px;border-radius:2px;background:#fff;transition:transform .25s,opacity .2s}
.mB details[open] summary .hb i:nth-child(1){transform:translateY(5px) rotate(45deg)}.mB details[open] summary .hb i:nth-child(2){opacity:0}.mB details[open] summary .hb i:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.mega{position:absolute;left:max(32px,env(safe-area-inset-left,0px));right:max(32px,env(safe-area-inset-right,0px));top:calc(100% - 4px);max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) minmax(0,1.3fr);gap:10px;padding:16px;border-radius:28px;background:var(--paper);border:1px solid var(--line);box-shadow:0 40px 80px -30px rgba(40,20,60,.45)}
.mega a.it{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:18px;text-decoration:none;background:color-mix(in srgb,var(--c) 10%,var(--paper));transition:background .2s,transform .2s}
.mega a.it:hover{background:color-mix(in srgb,var(--c) 20%,var(--paper));transform:translateY(-2px)}
.mega a.it b{font-weight:800;font-size:1.02rem;color:color-mix(in srgb,var(--c) 70%,var(--ink))}
.mega a.it span{font-size:.78rem;color:var(--muted);line-height:1.35}
.mega .side{grid-column:5;grid-row:1/4;display:flex;flex-direction:column;gap:10px}
.mega .feat{position:relative;flex:1;border-radius:18px;overflow:hidden;text-decoration:none;color:#fff;background:var(--c-ep);min-height:200px}
.mega .feat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:luminosity;opacity:.85}
.mega .feat::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(110,0,30,.95),transparent 70%)}
.mega .feat div{position:absolute;left:16px;right:16px;bottom:14px;z-index:1}
.mega .feat small{font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.mega .feat b{display:block;font-size:1.2rem;font-weight:800;line-height:1.1;margin-top:4px}
.mega .series2{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
.mega .series2 a{padding:10px;border-radius:12px;text-align:center;text-decoration:none;font-weight:800;font-size:.85rem;background:color-mix(in srgb,var(--ink) 6%,transparent)}
.mega .series2 a[aria-current]{background:var(--ink);color:var(--paper)}

/* --- C: Dock unten --- */
.mC{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1200px;margin:0 auto;padding:16px max(32px,env(safe-area-inset-right,0px)) 10px max(32px,env(safe-area-inset-left,0px))}
.mC .right{display:flex;align-items:center;gap:10px}
.dock{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:50;display:flex;align-items:flex-end;gap:6px;padding:8px;border-radius:26px;
  background:color-mix(in srgb,var(--paper) 82%,transparent);-webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5);border:1px solid var(--line);box-shadow:0 24px 50px -20px rgba(40,20,60,.45);max-width:calc(100vw - 24px);overflow-x:auto;scrollbar-width:none}
.dock::-webkit-scrollbar{display:none}
.dock a{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;min-width:64px;padding:6px 4px 4px;border-radius:18px;text-decoration:none;font-size:.68rem;font-weight:700;color:var(--muted);transition:transform .25s cubic-bezier(.2,.7,.2,1),color .2s}
.dock a .ico{width:42px;height:42px;border-radius:14px;box-shadow:0 8px 16px -8px var(--c);transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.dock a .ico svg{width:20px;height:20px}
.dock a:hover{color:var(--ink)}
.dock a:hover .ico{transform:translateY(-8px) scale(1.12)}
.dock a[aria-current]::after{content:"";position:absolute;bottom:-3px;width:5px;height:5px;border-radius:50%;background:var(--ink)}
.dock .sep{width:1px;align-self:stretch;margin:6px 2px;background:var(--line)}
body.has-dock{padding-bottom:110px}

@media (max-width:860px){.mB .quick{display:none}.mega{grid-template-columns:1fr 1fr}.mega .side{grid-column:1/-1;grid-row:auto}.mA .row1 .segm{display:none}}
@media (max-width:560px){.mC .segm,.mA .mini{display:none}.dock a{min-width:56px}.dock a .ico{width:38px;height:38px}}
.mega a.it span.ico{color:#fff;font-size:inherit;line-height:1}
/* B ruhiger: neutral, Farbe nur beim Hover */
.mB summary{background:var(--ink);box-shadow:0 10px 22px -12px rgba(0,0,0,.5)}
.mB summary:hover{background:color-mix(in srgb,var(--ink) 85%,var(--crim))}
.mB .quick a:hover{background:color-mix(in srgb,var(--ink) 6%,transparent);color:var(--ink)}
.mega a.it{background:color-mix(in srgb,var(--ink) 3.5%,var(--paper));border:1px solid transparent}
.mega a.it .ico{background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--ink);transition:background .25s,color .25s}
.mega a.it span.ico{color:var(--ink)}
.mega a.it b{color:var(--ink);transition:color .2s}
.mega a.it:hover{background:var(--paper);border-color:color-mix(in srgb,var(--c) 35%,transparent);box-shadow:0 14px 30px -20px var(--c)}
.mega a.it:hover .ico,.mega a.it:hover span.ico{background:var(--c);color:#fff}
.mega a.it:hover b{color:color-mix(in srgb,var(--c) 75%,var(--ink))}
.mega .feat{background:#2a1520}
.mega .feat::after{background:linear-gradient(to top,rgba(20,10,16,.92),transparent 70%)}
/* B kompakter */
.mega{left:auto;right:max(32px,calc((100vw - 1200px)/2 + 32px));width:min(820px,calc(100vw - 64px));grid-template-columns:repeat(3,minmax(0,1fr)) 210px;gap:6px;padding:10px;border-radius:22px}
.mega a.it{flex-direction:row;align-items:center;gap:10px;padding:9px 10px;border-radius:12px}
.mega a.it .ico{width:26px;height:26px;border-radius:8px}
.mega a.it .ico svg{width:14px;height:14px}
.mega a.it b{font-size:.88rem;line-height:1.15}
.mega a.it span:not(.ico){display:none}
.mega .side{grid-column:4;grid-row:1/5;gap:6px}
.mega .series2 a{padding:7px 4px;border-radius:10px;font-size:.76rem}
.mega .feat{min-height:0;border-radius:12px}
.mega .feat b{font-size:.95rem}
.mega .feat small{font-size:.6rem}
@media (max-width:860px){.mega{right:16px;left:16px;width:auto;grid-template-columns:1fr 1fr}.mega .side{grid-column:1/-1;grid-row:auto}.mega .feat{min-height:120px}}
.mB summary{padding:8px 14px;font-size:.82rem;gap:8px}.mB .bar{padding:6px 6px 6px 20px}.mB .quick a{padding:7px 11px;font-size:.84rem}
/* Dunkel-Modus: feste dunkle Flächen statt invertierter Tinte */
:root{--solid:#17121c}
html.dark{--solid:#271f30}
.ticker{background:var(--solid)!important;color:#fff!important}
.jubel{background:var(--solid)!important;color:#fff!important}
.mB summary{background:var(--solid)!important;color:#fff!important}
html.dark .mB summary{background:var(--crim)!important}
html.dark .mega .series2 a[aria-current]{background:var(--crim);color:#fff}
html.dark .segm a[aria-current]{background:#2c2434;color:#fff}

/* ===== N2: Abschnitte statt ein Block, eigener Angel-Bereich ===== */
.blk{max-width:1200px;margin:96px auto 0;padding:0 max(32px,env(safe-area-inset-right,0px)) 0 max(32px,env(safe-area-inset-left,0px))}
.bh{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px;margin-bottom:28px}
.bh .k{display:flex;align-items:center;gap:10px;font-weight:800;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c)}
.bh .k .ico{width:26px;height:26px;border-radius:8px}.bh .k .ico svg{width:14px;height:14px}
.bh h2{margin:8px 0 0;font-family:var(--f-disp);font-weight:800;font-size:clamp(2.2rem,4.4vw,3.4rem);line-height:1;letter-spacing:-.02em}
.bh p{margin:0;max-width:44ch;color:var(--muted)}
.lnk{display:inline-flex;align-items:center;gap:8px;font-weight:800;text-decoration:none;color:var(--c);white-space:nowrap}
.lnk::after{content:"→";transition:transform .25s}.lnk:hover::after{transform:translateX(4px)}

/* Episodenguide: Staffelwahl + Liste + Zahl */
.eg{--c:var(--c-ep);display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px}
.eg .card{padding:24px;border-radius:24px;background:var(--paper);box-shadow:0 1px 0 var(--line),0 30px 60px -40px rgba(224,36,77,.4)}
.seas{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.seas a{padding:7px 13px;border-radius:999px;text-decoration:none;font-weight:700;font-size:.82rem;background:color-mix(in srgb,var(--c) 10%,transparent);color:color-mix(in srgb,var(--c) 75%,var(--ink))}
.seas a[aria-current]{background:var(--c);color:#fff}
.eg .eplist li{background:color-mix(in srgb,var(--c) 5%,var(--paper))}
.eg .stat{display:flex;flex-direction:column;justify-content:space-between;padding:26px;border-radius:24px;color:#fff;background:linear-gradient(150deg,var(--c-ep),#8e0f2c);overflow:hidden;position:relative}
.eg .stat b{display:block;font-family:var(--f-disp);font-weight:800;font-size:clamp(4rem,8vw,6.5rem);line-height:.85}
.eg .stat span{font-size:.95rem;opacity:.9}
.eg .stat .row2{display:flex;gap:26px;margin-top:20px}
.eg .stat .row2 b{font-size:2.2rem}
.eg .stat a{align-self:flex-start;margin-top:22px;padding:11px 18px;border-radius:999px;background:#fff;color:var(--c-ep);font-weight:800;text-decoration:none}

/* Figuren */
.figs{--c:var(--c-ch)}

/* Hören & Lesen */
.duo2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.duo2 a{--c:var(--c-snd);display:grid;grid-template-columns:minmax(0,1fr);gap:18px;padding:26px;border-radius:24px;text-decoration:none;background:color-mix(in srgb,var(--c) 10%,var(--paper));border:1px solid color-mix(in srgb,var(--c) 20%,transparent);transition:transform .3s,box-shadow .3s}
.duo2 a:hover{transform:translateY(-4px);box-shadow:0 30px 50px -30px var(--c)}
.duo2 a.tr2{--c:var(--c-tr)}
.duo2 h3{margin:0;font-family:var(--f-disp);font-weight:800;font-size:1.9rem;line-height:1;color:color-mix(in srgb,var(--c) 70%,var(--ink))}
.duo2 p{margin:0;color:var(--muted)}
.player{display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px;align-items:center;padding:14px;border-radius:16px;background:var(--paper)}
.player .pl{width:52px;height:52px;border-radius:50%;background:var(--c-snd);position:relative;box-shadow:0 8px 18px -8px var(--c-snd)}
.player .pl::after{content:"";position:absolute;left:21px;top:16px;border-left:14px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent}
.player small{display:block;font-size:.75rem;color:var(--muted)}
.player b{display:block;font-weight:800}
.page2{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center}
.page2 .script{height:150px;align-content:start}
.page2 ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.page2 li{padding:5px 10px;border-radius:999px;background:var(--paper);font-family:var(--f-ui);font-size:.74rem;color:color-mix(in srgb,var(--c) 70%,var(--ink))}

/* Angel-Bereich */
.angelb{margin-top:110px;position:relative;overflow:hidden;isolation:isolate;background:#060b1d;color:#fff}
.angelb > img{position:absolute;right:0;top:0;width:min(62%,900px);height:100%;object-fit:cover;object-position:20% 15%;z-index:-2;opacity:.85;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 40%);mask-image:linear-gradient(90deg,transparent,#000 40%)}
.angelb::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 70% at 0 100%,rgba(61,123,255,.45),transparent 70%),linear-gradient(to top,rgba(6,11,29,.9),transparent 50%)}
.angelb .in{max-width:1200px;margin:0 auto;padding:90px max(32px,env(safe-area-inset-right,0px)) 70px max(32px,env(safe-area-inset-left,0px))}
.angelb .k{font-family:var(--f-ui);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#9cc0ff}
.angelb h2{margin:10px 0 0;font-family:var(--f-logo);font-weight:400;font-size:clamp(5rem,12vw,9.5rem);line-height:.82;text-shadow:0 0 2px #fff,0 0 18px rgba(61,123,255,.8),0 0 50px rgba(61,123,255,.5)}
.angelb .sub{margin:14px 0 0;font-family:var(--f-disp);font-weight:700;font-size:clamp(1.3rem,2.4vw,1.9rem);color:#cfe0ff}
.angelb p{margin:14px 0 0;max-width:46ch;color:rgba(255,255,255,.78)}
.angelb .eps{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px;max-width:620px}
.angelb .eps a{padding:8px 14px;border-radius:999px;text-decoration:none;font-weight:700;font-size:.85rem;color:#e6efff;background:rgba(61,123,255,.16);border:1px solid rgba(120,160,255,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .2s}
.angelb .eps a:hover{background:#3d7bff;border-color:#3d7bff}
.angelb .eps a i{font-style:normal;font-family:var(--f-ui);font-size:.72rem;opacity:.75;margin-right:6px}
.angelb .stats{display:flex;gap:34px;margin-top:30px}
.angelb .stats b{display:block;font-family:var(--f-disp);font-weight:800;font-size:2.4rem;line-height:1}
.angelb .stats span{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:#9cc0ff}
.angelb .go2{display:inline-flex;margin-top:30px;padding:13px 22px;border-radius:999px;background:#3d7bff;color:#fff;font-weight:800;text-decoration:none;box-shadow:0 10px 30px -10px #3d7bff}
.angelb .go2:hover{background:#5a92ff}

/* Mehr entdecken: 4 kleine */
.quad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.quad .t{min-height:230px}

/* Studien-Banner */
.stud{position:relative;display:flex;align-items:flex-end;min-height:300px;padding:34px;border-radius:28px;overflow:hidden;isolation:isolate;text-decoration:none;color:#fff;background:#17121c}
.stud img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.6;transition:transform 1s}
.stud::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(23,18,28,.92),rgba(23,18,28,.3))}
.stud:hover img{transform:scale(1.04)}
.stud small{font-weight:800;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:#c9b6ff}
.stud b{display:block;margin:8px 0;font-family:var(--f-disp);font-weight:800;font-size:clamp(2.2rem,4vw,3.2rem);line-height:1}
.stud span{display:block;max-width:46ch;color:rgba(255,255,255,.8)}

@media (max-width:1000px){.eg,.duo2{grid-template-columns:1fr}.quad{grid-template-columns:repeat(2,minmax(0,1fr))}.angelb > img{width:100%;opacity:.4;-webkit-mask-image:none;mask-image:none}}
@media (max-width:560px){.quad{grid-template-columns:1fr}.blk{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}.page2{grid-template-columns:1fr}}

/* ===== N3: ausgebaute Abschnitte nach Angel ===== */
/* Timeline als Zeitstrahl */
.tlw{--c:var(--c-tl);padding:28px;border-radius:24px;background:var(--paper);box-shadow:0 1px 0 var(--line),0 30px 60px -40px rgba(242,165,22,.5)}
.tl-years{display:grid;grid-template-columns:90px repeat(8,minmax(0,1fr));font-family:var(--f-ui);font-size:.74rem;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:10px}
.tl-years span{border-left:1px dashed var(--line);padding-left:6px}
.tl-lane{display:grid;grid-template-columns:90px repeat(16,minmax(0,1fr));align-items:center;gap:0;margin-top:14px}
.tl-lane > b{font-family:var(--f-disp);font-weight:800;font-size:1.05rem}
.tl-lane a{height:38px;margin:0 2px;border-radius:10px;display:grid;place-items:center;text-decoration:none;font-weight:800;font-size:.78rem;color:#fff;transition:transform .2s,filter .2s}
.tl-lane a:hover{transform:translateY(-3px);filter:brightness(1.1)}
.lane-b a{background:linear-gradient(90deg,var(--c-ep),#ff5a7d)}
.lane-a a{background:linear-gradient(90deg,#2f5fe0,#5a8dff)}
.lane-x a{background:linear-gradient(90deg,var(--c-tl),#ffcf5a);color:#3a2400}
.tl-note{display:flex;flex-wrap:wrap;gap:18px;margin-top:18px;font-size:.85rem;color:var(--muted)}
.tl-note i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:middle}

/* Comics: gefächert + Liste */
.cmx{--c:var(--c-cc);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:22px}
.stage{position:relative;min-height:330px;border-radius:24px;background:radial-gradient(70% 70% at 50% 100%,color-mix(in srgb,var(--c) 45%,transparent),transparent 70%),color-mix(in srgb,var(--c) 12%,var(--paper));overflow:hidden}
.stage span{position:absolute;left:50%;top:50%;width:140px;height:196px;border-radius:12px;overflow:hidden;border:5px solid #fff;box-shadow:0 24px 40px -18px rgba(0,0,0,.5);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.stage img{width:100%;height:100%;object-fit:cover}
.stage span:nth-child(1){transform:translate(-120%,-48%)}.stage span:nth-child(2){transform:translate(-50%,-55%);z-index:2;border-color:var(--c)}.stage span:nth-child(3){transform:translate(20%,-48%)}
.cmx:hover .stage span:nth-child(1){transform:translate(-140%,-46%)}.cmx:hover .stage span:nth-child(3){transform:translate(40%,-46%)}
.clist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.clist a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 18px;border-radius:16px;text-decoration:none;background:var(--paper);box-shadow:0 1px 0 var(--line);transition:transform .2s,box-shadow .2s}
.clist a:hover{transform:translateX(4px);box-shadow:0 14px 30px -20px var(--c)}
.clist .y{font-family:var(--f-ui);font-weight:600;font-size:.8rem;padding:5px 9px;border-radius:8px;background:color-mix(in srgb,var(--c) 22%,transparent);color:color-mix(in srgb,var(--c) 40%,var(--ink))}
.clist b{display:block;font-weight:800}
.clist small{font-size:.78rem;color:var(--muted)}
.clist .ar{color:color-mix(in srgb,var(--c) 60%,var(--ink));font-weight:800}

/* Dollz + Downloads */
.dd{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:22px}
.dollshelf{--c:var(--c-dz);position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:26px;border-radius:24px;text-decoration:none;overflow:hidden;
  background:linear-gradient(180deg,color-mix(in srgb,var(--c) 14%,var(--paper)),color-mix(in srgb,var(--c) 28%,var(--paper)))}
.dollshelf h3{margin:0;font-family:var(--f-disp);font-weight:800;font-size:1.9rem;color:color-mix(in srgb,var(--c) 70%,var(--ink))}
.dollshelf p{margin:6px 0 0;color:var(--muted)}
.shelf{display:flex;align-items:flex-end;justify-content:center;gap:26px;height:200px;margin-top:20px;border-bottom:8px solid color-mix(in srgb,var(--c) 45%,transparent);padding-bottom:2px}
.shelf img{height:175px;width:auto;image-rendering:pixelated;transition:transform .3s}
.dollshelf:hover .shelf img:nth-child(odd){transform:translateY(-8px)}
.dlgrid{--c:var(--c-dl);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-content:start}
.dlgrid .hd3{grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px}
.dlgrid h3{margin:0;font-family:var(--f-disp);font-weight:800;font-size:1.9rem;color:color-mix(in srgb,var(--c) 70%,var(--ink))}
.dlgrid a.it{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:16px;text-decoration:none;background:color-mix(in srgb,var(--c) 9%,var(--paper));border:1px solid color-mix(in srgb,var(--c) 18%,transparent);transition:transform .2s,background .2s}
.dlgrid a.it:hover{transform:translateY(-3px);background:color-mix(in srgb,var(--c) 16%,var(--paper))}
.dlgrid a.it .ico{--c:var(--c-dl)}
.dlgrid a.it b{font-weight:800;font-size:.95rem}

/* Slayer Studien redaktionell */
.st2{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);border-radius:28px;overflow:hidden;background:#17121c;color:#fff}
.st2 .pic{position:relative;min-height:380px}
.st2 .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.st2 .pic::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 50%,#17121c)}
.st2 .tx{padding:40px 40px 40px 10px;display:flex;flex-direction:column;justify-content:center}
.st2 small{font-weight:800;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:#c9b6ff}
.st2 h3{margin:10px 0 12px;font-family:var(--f-disp);font-weight:800;font-size:clamp(2.2rem,4vw,3.2rem);line-height:1}
.st2 p{margin:0;color:rgba(255,255,255,.78)}
.st2 .chips{margin-top:20px}
.st2 .chips span{background:rgba(201,182,255,.14);color:#e3d9ff}
.st2 .go3{align-self:flex-start;margin-top:24px;padding:12px 20px;border-radius:999px;background:#7b3fe4;color:#fff;font-weight:800;text-decoration:none}

/* Network-Karten */
.netc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:30px}
.netc a{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-radius:16px;text-decoration:none;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);transition:background .2s}
.netc a:hover{background:rgba(255,255,255,.14)}
.netc b{font-weight:800}
.netc span{font-size:.78rem;color:rgba(255,255,255,.6)}

@media (max-width:1000px){.cmx,.dd,.st2{grid-template-columns:1fr}.st2 .tx{padding:28px}.st2 .pic::after{background:linear-gradient(to top,#17121c,transparent 60%)}.netc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tl-years{grid-template-columns:60px repeat(8,minmax(0,1fr));font-size:.62rem}.tl-lane{grid-template-columns:60px repeat(16,minmax(0,1fr))}.tl-lane a{font-size:.62rem;height:30px}}
@media (max-width:560px){.dlgrid{grid-template-columns:1fr 1fr}.tlw{padding:16px;overflow-x:auto}.tl-years,.tl-lane{min-width:560px}}

/* ===== N4: Comics-Band, ruhiges Heute-vor, Sammelkarten bei Zum Mitnehmen ===== */
/* Heute vor: passend zur Seite */
.onthisday{background:var(--paper)!important;color:var(--ink)!important;box-shadow:0 1px 0 var(--line),0 30px 60px -40px rgba(224,36,77,.45)!important;border-left:6px solid var(--crim)}
.onthisday .date{color:var(--crim)}
.onthisday .date small{color:var(--muted);opacity:1}
.onthisday b{color:var(--muted);opacity:1}
.onthisday p{color:var(--ink)}
.onthisday a{background:var(--crim)!important;color:#fff!important}

/* Comics-Band */
.comicb{margin-top:110px;position:relative;overflow:hidden;isolation:isolate;background:#16120a;color:#fff}
.comicb::before{content:"";position:absolute;inset:0;z-index:-2;opacity:.18;background:radial-gradient(circle,#f4c21b 1.4px,transparent 1.6px) 0 0/14px 14px}
.comicb::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 80% at 100% 0,rgba(244,194,27,.28),transparent 70%),linear-gradient(to right,#16120a 30%,transparent)}
.comicb .in{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:50px;align-items:center;padding:90px max(32px,env(safe-area-inset-right,0px)) 80px max(32px,env(safe-area-inset-left,0px))}
.comicb .k{font-family:var(--f-ui);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#f4c21b}
.comicb h2{margin:10px 0 0;font-family:var(--f-disp);font-weight:800;font-size:clamp(4rem,10vw,8rem);line-height:.82;letter-spacing:-.03em;color:#fff;
  -webkit-text-stroke:0;text-shadow:5px 5px 0 #f4c21b}
.comicb .sub{margin:16px 0 0;font-family:var(--f-disp);font-weight:700;font-size:clamp(1.2rem,2.2vw,1.7rem);color:#ffe28a}
.comicb p{margin:14px 0 0;max-width:46ch;color:rgba(255,255,255,.78)}
.series3{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:560px}
.series3 a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;text-decoration:none;background:rgba(244,194,27,.08);border:1px solid rgba(244,194,27,.25);transition:background .2s,transform .2s}
.series3 a:hover{background:#f4c21b;color:#16120a;transform:translateY(-2px)}
.series3 i{font-style:normal;font-family:var(--f-ui);font-weight:600;font-size:.78rem;padding:4px 8px;border-radius:8px;background:#f4c21b;color:#16120a}
.series3 a:hover i{background:#16120a;color:#f4c21b}
.series3 b{font-weight:800;font-size:.95rem}
.comicb .go4{display:inline-flex;margin-top:28px;padding:13px 22px;border-radius:999px;background:#f4c21b;color:#16120a;font-weight:800;text-decoration:none;box-shadow:0 10px 30px -10px #f4c21b}
/* Comicseite aus Panels */
.page3{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:150px 190px 150px;gap:8px;padding:10px;background:#fff;border-radius:6px;box-shadow:0 40px 80px -30px rgba(0,0,0,.8)}
.page3 .pn{position:relative;overflow:hidden;background:#000;border:3px solid #16120a}
.page3 .pn img{width:100%;height:100%;object-fit:cover;filter:contrast(1.25) saturate(1.3);transition:transform .8s}
.page3 .pn::after{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(0,0,0,.35) 1px,transparent 1.3px) 0 0/5px 5px;mix-blend-mode:multiply}
.page3 .pn:hover img{transform:scale(1.08)}
.page3 .p1{grid-column:1/4}.page3 .p2{grid-column:4/7}.page3 .p3{grid-column:1/7}.page3 .p4{grid-column:1/3}.page3 .p5{grid-column:3/5}.page3 .p6{grid-column:5/7}
.page3 .p3 img{object-position:50% 30%}
.bubble{position:absolute;z-index:2;left:14px;top:12px;max-width:62%;padding:8px 12px;border-radius:14px;background:#fff;color:#16120a;font-family:var(--f-disp);font-weight:800;font-size:.85rem;line-height:1.15;border:2px solid #16120a}
.bubble::after{content:"";position:absolute;left:18px;bottom:-10px;border:8px solid transparent;border-top-color:#16120a;border-bottom:0}
.caption{position:absolute;z-index:2;right:0;bottom:0;padding:5px 10px;background:#f4c21b;color:#16120a;font-family:var(--f-ui);font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}

/* Zum Mitnehmen: 3 Spalten */
.dd3{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,.9fr) minmax(0,1.2fr);gap:20px}
.cardsbox{--c:var(--c-cc);display:flex;flex-direction:column;justify-content:space-between;padding:26px;border-radius:24px;text-decoration:none;overflow:hidden;background:color-mix(in srgb,var(--c) 14%,var(--paper))}
.cardsbox h3{margin:0;font-family:var(--f-disp);font-weight:800;font-size:1.9rem;color:color-mix(in srgb,var(--c) 45%,var(--ink))}
.cardsbox p{margin:6px 0 0;color:var(--muted)}
.cardsbox .stage{min-height:220px;background:none}
.cardsbox .stage span{width:100px;height:140px;border-width:4px}
.cardsbox:hover .stage span:nth-child(1){transform:translate(-140%,-46%)}.cardsbox:hover .stage span:nth-child(3){transform:translate(40%,-46%)}
.dd3 .dlgrid{grid-template-columns:1fr 1fr}

@media (max-width:1000px){.comicb .in{grid-template-columns:1fr}.dd3{grid-template-columns:1fr}.series3{grid-template-columns:1fr}}
@media (max-width:560px){.page3{grid-template-rows:110px 140px 110px}.bubble{font-size:.72rem}}

/* Since 1999: Zeitreise der Seite */
.jubel{padding:90px 0!important}
.jubel .wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:50px;align-items:start}
.jubel .k{font-family:var(--f-ui);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#ff8aa3}
.jubel h2{margin-top:10px!important;font-size:clamp(3rem,6vw,5rem)!important;max-width:none!important}
.jubel h2 em{font-style:normal;background:linear-gradient(90deg,var(--c-ep),var(--c-ch),var(--c-snd));-webkit-background-clip:text;background-clip:text;color:transparent}
.jubel .netc{grid-column:1/-1}
.trip{position:relative;display:grid;gap:22px;padding-left:28px}
.trip::before{content:"";position:absolute;left:6px;top:8px;bottom:8px;width:2px;background:linear-gradient(var(--c-ch),var(--c-ep),var(--c-tl))}
.stop{position:relative}
.stop::before{content:"";position:absolute;left:-28px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--c-ep);box-shadow:0 0 0 4px rgba(224,36,77,.25)}
.stop:nth-child(1)::before{background:var(--c-ch);box-shadow:0 0 0 4px rgba(123,63,228,.25)}
.stop:nth-child(3)::before{background:var(--c-tl);box-shadow:0 0 0 4px rgba(242,165,22,.25)}
.stop .yr{font-family:var(--f-disp);font-weight:800;font-size:1.5rem;line-height:1}
.stop .yr small{margin-left:10px;font-family:var(--f-ui);font-size:.7rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.stop p{margin:6px 0 0!important;font-size:.92rem}
.win{margin-top:12px;border-radius:10px;overflow:hidden;background:#c0c0c0;border:2px solid #dfdfdf;border-right-color:#7b7b7b;border-bottom-color:#7b7b7b;box-shadow:0 20px 40px -20px rgba(0,0,0,.8)}
.win .tb{display:flex;align-items:center;gap:8px;padding:4px 8px;background:linear-gradient(90deg,#000080,#1084d0);color:#fff;font-family:Tahoma,Verdana,sans-serif;font-size:.72rem;font-weight:700}
.win .tb i{margin-left:auto;display:flex;gap:3px}.win .tb i::before,.win .tb i::after{content:"";width:12px;height:11px;background:#c0c0c0;border:1px solid #fff;border-right-color:#404040;border-bottom-color:#404040}
.win .body{display:flex;gap:6px;padding:6px;background:#000}
.win img{display:block;max-width:100%;height:auto;image-rendering:auto}
.win .body.two img:first-child{width:70px}
.win .body.two img:last-child{flex:1;min-width:0;object-fit:cover}
.now{margin-top:12px;display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;background:linear-gradient(90deg,var(--c-ep),var(--c-ch));font-weight:800}
.now span{font-weight:400;opacity:.9;font-size:.88rem}
@media (max-width:1000px){.jubel .wrap{grid-template-columns:1fr}}

/* Kopf als Bildband mit Angel-Umschalter */
.mB{position:sticky}
.hb2{position:relative;margin-top:-82px;min-height:min(86vh,760px);display:flex;align-items:flex-end;overflow:hidden;isolation:isolate;background:#0b0710;color:#fff}
.hb2 > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:45% 25%;z-index:-2}
.hb2::after{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(to top,rgba(11,7,16,.96) 4%,rgba(11,7,16,.55) 45%,rgba(11,7,16,.2)),
  radial-gradient(55% 65% at 0 100%,rgba(224,36,77,.45),transparent 70%),
  radial-gradient(45% 60% at 100% 100%,rgba(61,123,255,.38),transparent 70%)}
.hb2 .in{width:100%;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:30px;padding:150px max(32px,env(safe-area-inset-right,0px)) 64px max(32px,env(safe-area-inset-left,0px))}
.hb2 .jubi{color:#fff;border-color:rgba(255,255,255,.7)}
.hb2 h1{margin:16px 0 0;font-family:var(--f-logo);font-weight:400;font-size:clamp(6rem,15vw,12rem);line-height:.8;text-shadow:0 0 2px #fff,0 0 18px rgba(224,36,77,.75),0 0 60px rgba(224,36,77,.45)}
.hb2 .sub2{display:block;margin-top:14px;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.05}
.hb2 .sub2 em{font-style:normal;color:#ff6d8c}
.hb2 .lead{margin:16px 0 0;max-width:48ch;color:rgba(255,255,255,.82);font-size:1.05rem}
.hb2 .pills{margin-top:24px}
.toangel{display:block;text-align:right;text-decoration:none;color:#fff;padding-bottom:6px}
.toangel small{display:block;font-family:var(--f-ui);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:#9cc0ff}
.toangel 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(61,123,255,.85),0 0 46px rgba(61,123,255,.55);transition:text-shadow .3s}
.toangel span{display:inline-block;margin-top:14px;padding:10px 18px;border-radius:999px;border:1px solid rgba(120,160,255,.6);font-weight:800;font-size:.88rem;color:#dbe7ff;transition:background .25s}
.toangel:hover b{text-shadow:0 0 2px #fff,0 0 22px rgba(61,123,255,1),0 0 70px rgba(61,123,255,.8)}
.toangel:hover span{background:#3d7bff;border-color:#3d7bff;color:#fff}
.hb2 + .wrap .ticker{margin-top:-22px;position:relative;z-index:2}

/* Folge der Woche als eigener Abschnitt */
.fw{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:22px;align-items:stretch}
.fw .fotw img{height:100%;min-height:380px}
.fw .side{display:flex;flex-direction:column;justify-content:center;gap:14px;padding:28px;border-radius:24px;background:var(--paper);box-shadow:0 1px 0 var(--line)}
.fw .side h3{margin:0;font-family:var(--f-disp);font-weight:800;font-size:1.4rem}
.fw dl{margin:0;display:grid}
.fw dl div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.fw dt{color:var(--muted)}.fw dd{margin:0;font-weight:700;text-align:right}
@media (max-width:860px){.hb2 .in{grid-template-columns:1fr;padding-top:120px}.toangel{text-align:left}.fw{grid-template-columns:1fr}}
@media (max-width:560px){
  .mB{padding:10px 12px}
  .mB .bar{gap:8px;padding:5px 5px 5px 14px}
  .mB .wordmark{font-size:1.7rem}
  .mB .mini a{padding:6px 8px;font-size:.6rem}
  .mB summary{padding:8px 12px;font-size:0;gap:0}
  .mB summary .hb{margin:0}
}
/* Figuren in Originalfarben */
.fg .p{background:#000!important}
.fg img{mix-blend-mode:normal!important}
.fg:hover img{transform:scale(1.06)}
.fg b{border-top:3px solid var(--c);padding-top:10px!important}

/* Slayer-Studien-Band */
.studb{margin-top:110px;position:relative;overflow:hidden;isolation:isolate;background:#120b1f;color:#fff}
.studb::before{content:"";position:absolute;inset:0;z-index:-2;opacity:.12;background:repeating-linear-gradient(0deg,transparent 0 27px,#c9b6ff 27px 28px)}
.studb::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(55% 80% at 100% 0,rgba(123,63,228,.45),transparent 70%),radial-gradient(40% 60% at 0 100%,rgba(201,164,106,.18),transparent 70%),linear-gradient(to right,#120b1f 30%,transparent)}
.studb .in{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:50px;align-items:center;padding:90px max(32px,env(safe-area-inset-right,0px)) 80px max(32px,env(safe-area-inset-left,0px))}
.studb .k{font-family:var(--f-ui);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#c9b6ff}
.studb h2{margin:10px 0 0;font-family:var(--f-logo);font-weight:400;font-size:clamp(4rem,9vw,7.2rem);line-height:.85;text-shadow:0 0 2px #fff,0 0 18px rgba(123,63,228,.85),0 0 50px rgba(123,63,228,.5)}
.studb .sub{margin:16px 0 0;font-family:var(--f-disp);font-weight:700;font-size:clamp(1.2rem,2.2vw,1.7rem);color:#dccfff}
.studb p{margin:14px 0 0;max-width:46ch;color:rgba(255,255,255,.78)}
.topics{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:560px}
.topics a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;text-decoration:none;background:rgba(123,63,228,.12);border:1px solid rgba(160,130,255,.3);transition:background .2s,transform .2s}
.topics a:hover{background:#7b3fe4;border-color:#7b3fe4;transform:translateY(-2px)}
.topics i{font-style:normal;font-family:var(--f-logo);font-size:1.3rem;line-height:1;width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#c9a46a;color:#120b1f}
.topics b{font-weight:800;font-size:.95rem}
.studb .go5{display:inline-flex;margin-top:28px;padding:13px 22px;border-radius:999px;background:#7b3fe4;color:#fff;font-weight:800;text-decoration:none;box-shadow:0 10px 30px -10px #7b3fe4}
.studb .go5:hover{background:#9460f0}
/* Aufgeschlagenes Buch */
.book{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:14px;border-radius:10px;background:#3a2414;box-shadow:0 40px 80px -30px rgba(0,0,0,.85);transform:perspective(1400px) rotateX(6deg)}
.book::after{content:"";position:absolute;left:50%;top:14px;bottom:14px;width:30px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(0,0,0,.35),transparent);pointer-events:none}
.leaf{min-height:340px;padding:22px 22px 18px;background:#f3ead8;color:#2a1d12}
.leaf.l{border-radius:4px 0 0 4px}.leaf.r{border-radius:0 4px 4px 0}
.leaf .fig{position:relative;height:190px;border:3px double #8a6a3c;overflow:hidden;background:#000}
.leaf .fig img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;filter:sepia(.35) contrast(1.05)}
.leaf .cap{margin-top:10px;font-family:Georgia,serif;font-style:italic;font-size:.8rem;color:#6b5236}
.leaf h4{margin:0 0 10px;font-family:var(--f-logo);font-weight:400;font-size:1.6rem;line-height:1;color:#5a2d8a}
.leaf ol{margin:0;padding:0 0 0 18px;font-family:Georgia,serif;font-size:.86rem;line-height:1.9;color:#3a2a1a}
.leaf ol li::marker{color:#8a6a3c;font-weight:700}
.leaf .pg{margin-top:10px;text-align:right;font-family:Georgia,serif;font-size:.72rem;color:#8a6a3c}
.leaf.l .pg{text-align:left}
@media (max-width:1000px){.studb .in{grid-template-columns:1fr}.topics{grid-template-columns:1fr}}
@media (max-width:560px){.book{grid-template-columns:1fr;transform:none}.book::after{display:none}.leaf.l,.leaf.r{border-radius:4px}.leaf{min-height:0}}
/* Folge der Woche kompakt */
.fw{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:18px!important}
.fw .fotw img{min-height:0!important;height:260px!important}
.fw .fotw .in{padding:18px 22px!important}
.fw .fotw h2{display:none}
.fw .fotw p{font-size:.9rem;max-width:40ch}
.fw .fotw .no{margin-top:10px}
.fw .fotw .go{width:42px;height:42px;top:16px;right:16px;font-size:1.05rem}
.fw .side{padding:20px 22px!important;gap:8px!important}
.fw .side h3{font-size:1.1rem!important}
.fw dl div{padding:7px 0!important;font-size:.86rem!important}
#h-fw{font-size:clamp(1.8rem,3.2vw,2.5rem)}
.fw .fotw .badge{display:none}.fw .fotw img{object-position:50% 22%!important}.fw .fotw .no{margin-top:0}
.studb + .blk{margin-top:110px}

/* Studien: lesbarer Titel, Themen-Raster statt Buch */
.studb h2{font-family:var(--f-disp)!important;font-weight:800!important;font-size:clamp(3.2rem,7vw,5.6rem)!important;line-height:.92!important;letter-spacing:-.02em;text-shadow:0 0 30px rgba(123,63,228,.55)!important}
.studb h2 em{font-style:normal;color:#c9b6ff}
.sgrid{display:grid;grid-template-columns:1.15fr 1fr;grid-template-rows:200px 200px;gap:12px}
.sgrid a{position:relative;display:flex;align-items:flex-end;padding:18px;border-radius:20px;overflow:hidden;isolation:isolate;text-decoration:none;color:#fff;border:1px solid rgba(160,130,255,.25);transition:transform .3s,border-color .3s}
.sgrid a:first-child{grid-row:1/3}
.sgrid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.sgrid a::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(18,11,31,.95) 8%,rgba(18,11,31,.25) 60%,transparent)}
.sgrid a:hover{transform:translateY(-4px);border-color:#9b7bff}
.sgrid a:hover img{transform:scale(1.06)}
.sgrid small{display:block;font-family:var(--f-ui);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:#c9b6ff}
.sgrid b{display:block;margin-top:4px;font-family:var(--f-disp);font-weight:800;font-size:1.35rem;line-height:1.05}
.sgrid a:first-child b{font-size:1.9rem}
.sgrid a:first-child img{object-position:50% 15%}
@media (max-width:560px){.sgrid{grid-template-columns:1fr 1fr;grid-template-rows:240px 150px 150px}.sgrid a:first-child{grid-row:auto;grid-column:1/-1}}
.studb + .figs{margin-top:96px}

/* An diesem Tag: im Stil der übrigen Abschnitte */
.otd{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:28px;align-items:center;padding:24px 28px;border-radius:24px;background:var(--paper);box-shadow:0 1px 0 var(--line),0 30px 60px -40px rgba(224,36,77,.4)}
.cal{border-radius:18px;overflow:hidden;text-align:center;background:var(--paper);box-shadow:0 1px 0 var(--line),0 14px 30px -18px rgba(0,0,0,.35);border:1px solid var(--line)}
.cal .m{padding:7px 0;background:var(--c-ep);color:#fff;font-weight:800;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase}
.cal .d{padding:6px 0 0;font-family:var(--f-disp);font-weight:800;font-size:3.6rem;line-height:1}
.cal .y{padding:0 0 10px;font-family:var(--f-ui);font-size:.8rem;color:var(--muted)}
.otd h3{margin:0;font-family:var(--f-disp);font-weight:800;font-size:clamp(1.4rem,2.4vw,1.9rem);line-height:1.15}
.otd p{margin:6px 0 0;color:var(--muted)}
.otd .more2{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.otd .more2 span{padding:5px 11px;border-radius:999px;font-size:.78rem;font-weight:700;background:color-mix(in srgb,var(--c-ep) 10%,transparent);color:color-mix(in srgb,var(--c-ep) 75%,var(--ink))}
.otd .bt3{padding:12px 20px;border-radius:999px;background:var(--c-ep);color:#fff;font-weight:800;text-decoration:none;white-space:nowrap}
@media (max-width:760px){.otd{grid-template-columns:110px minmax(0,1fr)}.otd .bt3{grid-column:1/-1;justify-self:start}.cal .d{font-size:2.8rem}}
/* Folge der Woche: echte Bildfarben, neutraler Verlauf */
.fw .fotw{background:#0e0b12!important;box-shadow:0 30px 60px -40px rgba(0,0,0,.6)!important}
.fw .fotw img{mix-blend-mode:normal!important;opacity:1!important}
.fw .fotw::after{background:linear-gradient(to top,rgba(14,11,18,.92) 5%,rgba(14,11,18,.35) 55%,transparent)!important}
.fw .fotw .go{color:var(--ink)!important}

/* Footer */
.ft{position:relative;background:#0d0a12;color:#efe9f5;overflow:hidden;isolation:isolate}
.ft::before{content:"";display:block;height:4px;background:linear-gradient(90deg,var(--c-ep),var(--c-ch),var(--c-snd),var(--c-tl),#3d7bff)}
.ft::after{content:"Buffy";position:absolute;right:-.04em;bottom:-.22em;z-index:-1;font-family:var(--f-logo);font-size:clamp(10rem,24vw,20rem);line-height:1;color:rgba(255,255,255,.035);pointer-events:none}
.ft .in{max-width:1200px;margin:0 auto;padding:70px max(32px,env(safe-area-inset-right,0px)) 0 max(32px,env(safe-area-inset-left,0px))}
.ft .top{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(4,minmax(0,1fr));gap:34px}
.ft .brand .wordmark{color:#fff;font-size:2.8rem}
.ft .brand p{margin:14px 0 0;max-width:30ch;font-size:.92rem;color:rgba(239,233,245,.65)}
.ft .brand .jubi{margin-top:18px;color:#fff;border-color:rgba(255,255,255,.4)}
.ft h4{margin:6px 0 14px;font-family:var(--f-ui);font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(239,233,245,.5)}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ft ul a{text-decoration:none;font-size:.93rem;color:rgba(239,233,245,.85);transition:color .2s,padding .2s}
.ft ul a:hover{color:#fff;padding-left:4px}
.ft .col-b h4{color:#ff8aa3}.ft .col-a h4{color:#9cc0ff}.ft .col-m h4{color:#ffd36b}.ft .col-n h4{color:#c9b6ff}
.ft .col-a ul a:hover{color:#9cc0ff}.ft .col-b ul a:hover{color:#ff8aa3}
.ft .bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;margin-top:56px;padding:22px 0 calc(26px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(255,255,255,.1);font-family:var(--f-ui);font-size:.74rem;color:rgba(239,233,245,.55)}
.ft .bottom a{color:rgba(239,233,245,.8);text-decoration:none}.ft .bottom a:hover{color:#fff}
.ft .acts2{display:flex;gap:8px}
.ft .acts2 a{padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.18);font-family:var(--f-ui);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase}
.ft .acts2 a:hover{border-color:#fff}
.ft .acts2 .up{background:#fff;color:#0d0a12;border-color:#fff}
.ft .acts2 .up:hover{background:var(--crim);border-color:var(--crim);color:#fff}
.jubel + .ft{margin-top:0}
.jubel{border-bottom:0}
@media (max-width:1000px){.ft .top{grid-template-columns:1fr 1fr}.ft .brand{grid-column:1/-1}}
@media (max-width:560px){.ft .bottom{flex-direction:column;align-items:flex-start}}
/* kein Regenbogen in Geschichte und Footer */
.ft::before{background:var(--crim)!important;height:3px}
.jubel h2 em{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;color:#ff5a7d!important}
.trip::before{background:rgba(255,255,255,.18)!important}
.stop::before,.stop:nth-child(1)::before,.stop:nth-child(3)::before{background:#ff5a7d!important;box-shadow:0 0 0 4px rgba(224,36,77,.22)!important}
.now{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,90,125,.5)}
.now::before{content:"";width:9px;height:9px;border-radius:50%;background:#ff5a7d;box-shadow:0 0 10px #ff5a7d}

/* 254-Block mit Grafik */
.eg .stat{background:#2a0a14!important;isolation:isolate}
.eg .stat .bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 20%;z-index:-2;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.eg .stat::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(160deg,rgba(224,36,77,.88) 0%,rgba(142,15,44,.78) 45%,rgba(30,6,14,.55) 100%)}
.eg .stat:hover .bgimg{transform:scale(1.05)}
.eg .stat .film{position:absolute;right:-30px;bottom:24px;display:flex;gap:6px;transform:rotate(-8deg);z-index:-1;opacity:.55}
.eg .stat .film span{width:46px;height:34px;border-radius:4px;background:rgba(255,255,255,.25);border:2px solid rgba(255,255,255,.4)}

/* Timeline: erste Auftritte */
.debut{position:relative;display:grid;grid-template-columns:90px repeat(8,minmax(0,1fr));align-items:end;height:92px;margin-bottom:6px}
.debut > b{align-self:center;font-family:var(--f-ui);font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);line-height:1.3}
.debut .grp{display:flex;align-items:flex-end;gap:0;padding-left:4px}
.debut .grp a{position:relative;display:block;width:46px;height:46px;margin-left:-12px;border-radius:50%;overflow:hidden;border:3px solid var(--paper);box-shadow:0 6px 14px -6px rgba(0,0,0,.4);transition:transform .25s;background:#000}
.debut .grp a:first-child{margin-left:0}
.debut .grp a:hover{transform:translateY(-6px) scale(1.08);z-index:2}
.debut .grp img{width:100%;height:100%;object-fit:cover}
.debut .grp a.ang{border-color:#3d7bff}
.debut .grp .yr{display:block;margin:0 0 4px 6px;font-family:var(--f-ui);font-size:.66rem;color:var(--muted)}
.debut .g1{grid-column:2/4;grid-row:1}.debut .g3{grid-column:4/5;grid-row:1;padding-left:22px}
.debut{height:auto!important;padding:4px 0 14px;align-items:center}
.tlw{position:relative;overflow:hidden}
.tlw::after{content:"";position:absolute;right:-40px;top:-30px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c-tl) 18%,transparent),transparent 70%);pointer-events:none}
@media (max-width:1000px){.debut{grid-template-columns:60px repeat(8,minmax(0,1fr))}.debut .grp a{width:36px;height:36px}}
@media (max-width:560px){.debut{min-width:560px}}
/* 254: weniger Rot */
.eg .stat::after{background:linear-gradient(to top,rgba(14,10,18,.94) 8%,rgba(14,10,18,.62) 50%,rgba(14,10,18,.25)),linear-gradient(90deg,rgba(14,10,18,.55),transparent 70%)!important}
.eg .stat{background:#0e0a12!important}
.eg .stat > div > b:first-child{color:#fff}
.eg .stat .row2 b{color:#fff}
.eg .stat a{background:var(--c-ep)!important;color:#fff!important}

/* Logo: Pixel-B + uffy.de in Lila */
:root{--logo:#6d35c9}
html.dark{--logo:#9a6cf0}
.logo-g{display:inline-flex!important;align-items:center;font-family:var(--f-disp)!important;font-weight:900;letter-spacing:-.04em;line-height:1;text-decoration:none;color:var(--ink)}
.logo-g svg{width:30px;height:30px;color:var(--logo);margin-right:-2px;flex:0 0 auto}
.logo-g b{font-size:26px}
.logo-g small{font-size:12px;font-weight:800;letter-spacing:0;color:var(--logo);margin:9px 0 0 2px}
.ft .logo-g{color:#fff}.ft .logo-g svg{width:52px;height:52px;color:#9a6cf0}.ft .logo-g b{font-size:44px}.ft .logo-g small{font-size:20px;margin-top:16px;color:#9a6cf0}

/* Leitfarbe Lila statt Rot (Episodenguide bleibt rot) */
:root{--crim:#6d35c9;--pl:#9a6cf0;--pl-rgb:109,53,201}
html.dark{--crim:#9a6cf0}
.jubi b{background:var(--crim)!important}
.ticker b{background:#8b5cf6!important;color:#fff!important}
html.dark .ticker b{background:#c9b3ff!important;color:#1b1027!important}
.hb2::after{background:linear-gradient(to top,rgba(11,7,16,.96) 4%,rgba(11,7,16,.55) 45%,rgba(11,7,16,.2)),radial-gradient(55% 65% at 0 100%,rgba(var(--pl-rgb),.5),transparent 70%),radial-gradient(45% 60% at 100% 100%,rgba(61,123,255,.38),transparent 70%)!important}
.hb2 h1{text-shadow:0 0 2px #fff,0 0 18px rgba(var(--pl-rgb),.8),0 0 60px rgba(var(--pl-rgb),.5)!important}
.hb2 .sub2 em{color:#c3a6ff!important}
section[aria-labelledby="h-fw"] .bh{--c:var(--crim)!important}
section[aria-labelledby="h-fw"] .bh .ico{background:var(--crim)}
.fw .fotw .go{color:var(--crim)!important}
section[aria-labelledby="h-otd"] .bh{--c:var(--crim)!important}
.cal .m,.otd .bt3{background:var(--crim)!important}
.otd .more2 span{background:color-mix(in srgb,var(--crim) 12%,transparent)!important;color:color-mix(in srgb,var(--crim) 80%,var(--ink))!important}
.otd{box-shadow:0 1px 0 var(--line),0 30px 60px -40px rgba(var(--pl-rgb),.45)!important}
.jubel .k{color:#c3a6ff!important}
.jubel h2 em{color:#b48cff!important}
.stop::before,.stop:nth-child(1)::before,.stop:nth-child(3)::before{background:#b48cff!important;box-shadow:0 0 0 4px rgba(var(--pl-rgb),.3)!important}
.now{border-color:rgba(180,140,255,.55)!important}
.now::before{background:#b48cff!important;box-shadow:0 0 10px #b48cff!important}
.ft::before{background:#6d35c9!important}
.ft .col-b h4{color:#c3a6ff!important}.ft .col-b ul a:hover{color:#c3a6ff!important}
.ft .acts2 .up:hover{background:#6d35c9!important;border-color:#6d35c9!important}
.lane-b a{background:linear-gradient(90deg,#6d35c9,#9a6cf0)!important}
.tl-note i[style*="c-ep"]{background:#6d35c9!important}
.mB summary:hover{background:#2a1e3a!important}
html.dark .mB summary{background:#6d35c9!important}
html.dark .mega .series2 a[aria-current]{background:#6d35c9!important}
.segm a[aria-current]{color:var(--ink)}
@media (max-width:560px){.mB .logo-g svg{width:26px;height:26px}.mB .logo-g b{font-size:22px}}

/* Hell/Dunkel-Schalter: Buttons mit demselben Aussehen wie die früheren Links */
.mini button,.ft .acts2 button{font:inherit;cursor:pointer;-webkit-appearance:none;appearance:none;background:none}
.mini button{padding:7px 12px;border-radius:999px;border:1px solid var(--line);font-family:var(--f-ui);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.mini button:hover{color:var(--ink);border-color:var(--ink)}
.ft .acts2 button{padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.18);font-family:var(--f-ui);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:inherit}
.ft .acts2 button:hover{border-color:#fff}
.mini button:focus-visible,.ft .acts2 button:focus-visible{outline:2px solid var(--crim);outline-offset:3px}
@media (max-width:640px){.mB .mini button{padding:6px 8px;font-size:.6rem}}

/* Startseite: "Mehr auf Buffy.de" */
.mehr{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.mehr a{display:flex;flex-direction:column;gap:4px;padding:20px 22px;border:1px solid var(--line);border-radius:14px;background:var(--paper);text-decoration:none;transition:border-color .2s,transform .2s}
.mehr a:hover{border-color:var(--crim);transform:translateY(-3px)}
.mehr b{font-weight:800}
.mehr span{color:var(--muted);font-size:.9rem}

/* Lightbox (js/lightbox.js) */
.lb{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;background:rgba(10,6,14,.93);padding:24px}
.lb[hidden]{display:none}
.lb figure{margin:0;display:flex;flex-direction:column;align-items:center;max-width:96vw;max-height:94vh}
.lb img{max-width:92vw;max-height:84vh;width:auto;height:auto;image-rendering:auto;object-fit:contain;border-radius:6px;box-shadow:0 20px 60px rgba(0,0,0,.6);cursor:pointer;background:#111}
.lb figcaption{display:flex;gap:14px;margin-top:12px;max-width:92vw;color:#efe9f5;font-size:.9rem;justify-content:center;text-align:center}
.lb .lb-c{font-family:var(--f-ui);font-size:.72rem;letter-spacing:.1em;color:rgba(255,255,255,.6);white-space:nowrap}
.lb button{position:absolute;display:grid;place-items:center;border:0;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;border-radius:999px;transition:background .2s}
.lb button:hover,.lb button:focus-visible{background:rgba(255,255,255,.28);outline:2px solid #fff;outline-offset:2px}
.lb .lb-x{top:16px;right:16px;width:44px;height:44px;font-size:28px;line-height:1}
.lb .lb-p,.lb .lb-n{top:50%;width:48px;height:64px;margin-top:-32px;font-size:34px;border-radius:12px}
.lb .lb-p{left:12px}.lb .lb-n{right:12px}
.lb-offen{overflow:hidden}
.lb-zoom{cursor:zoom-in}
@media (max-width:640px){.lb{padding:8px}.lb .lb-p,.lb .lb-n{width:40px;height:52px;margin-top:-26px}}

/* Luft vor dem Footer: Inhalt klebt nicht mehr am Fuß */
.ft{margin-top:clamp(80px,11vw,160px)}
main.sp{padding-bottom:clamp(8px,2vw,24px)}

/* ==== v2.26: echte Fotos auf der Startseite ==== */
.hb2 > img{object-fit:cover;object-position:68% 22%}
.fotw img{object-fit:cover;object-position:center 25%}
.angelb > img{object-fit:cover;object-position:60% 30%}
.sgrid img{object-fit:cover;object-position:center 25%}
.frieze2 .p img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.debut img{object-fit:cover;object-position:center 20%}
.page3 .pn img{object-fit:cover;object-position:center top}
.stage img{object-fit:cover}
.weltduo{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.wd{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:flex-end;min-height:380px;padding:28px;border-radius:24px;color:#fff;text-decoration:none;background:#061418}
.wd img{position:absolute;inset:0 0 0 auto;z-index:-2;width:68%;height:100%;object-fit:cover;object-position:center 18%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 45%);mask-image:linear-gradient(90deg,transparent,#000 45%);transition:transform .6s}
.wd::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(0,0,0,.6),transparent 60%)}
.wd-dh{--w:#1d9bb2;background:radial-gradient(80% 90% at 0 100%,rgba(29,155,178,.45),transparent),#051519}
.wd-bt{--w:#c8782c;background:radial-gradient(80% 90% at 0 100%,rgba(200,120,44,.45),transparent),#150b05}
.wd:hover img{transform:scale(1.04)}
.wd div{max-width:24ch}
.wd small{font-family:var(--f-ui,monospace);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:color-mix(in srgb,var(--w) 50%,#fff)}
.wd b{display:block;margin:6px 0 8px;font-family:var(--f-logo);font-weight:400;font-size:clamp(2.6rem,5vw,3.8rem);line-height:.95;text-shadow:0 0 26px var(--w)}
.wd p{margin:0 0 14px;font-size:.95rem;line-height:1.5;color:rgba(255,255,255,.85)}
.wd span{font-weight:800;color:color-mix(in srgb,var(--w) 40%,#fff)}
@media (max-width:760px){.weltduo{grid-template-columns:1fr}.wd img{width:100%;-webkit-mask-image:linear-gradient(180deg,#000 20%,transparent 90%);mask-image:linear-gradient(180deg,#000 20%,transparent 90%)}.wd{min-height:440px}}
@media (max-width:760px){.fw{grid-template-columns:1fr!important}.fw .fotw img{height:300px!important}}
/* Figuren auf der Startseite: hochkant wie in Variante 09 */
.fg .p{aspect-ratio:4/5!important}
.frieze2 .p img{object-position:center 40%}

/* Startseite: Bilder-Block (Mosaik) */
.bimos{display:grid;grid-template-columns:2fr 1fr 1fr 1.3fr;grid-template-rows:220px 220px;gap:12px}
.bm{position:relative;display:block;overflow:hidden;border-radius:20px;background:#17121c;isolation:isolate;text-decoration:none}
.bm img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform .6s}
.bm::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(10,6,14,.75),transparent 45%)}
.bm:hover img{transform:scale(1.06)}
.bm span{position:absolute;left:14px;bottom:12px;color:#fff;font-weight:800;text-shadow:0 2px 10px rgba(0,0,0,.6)}
.bm1{grid-row:1/3}.bm4{grid-column:2/4}
.bm5{grid-column:4;grid-row:1}.bm6{display:none}
.bm-text{grid-column:4;grid-row:2;display:flex;flex-direction:column;justify-content:space-between;padding:20px;border-radius:20px;background:var(--paper);box-shadow:0 1px 0 var(--line)}
.bm-text p{margin:0;font-size:.95rem;line-height:1.5;color:var(--muted)}
.bm-text nav{display:flex;flex-wrap:wrap;gap:6px}
.bm-text nav a{padding:7px 12px;border-radius:999px;background:color-mix(in srgb,var(--c-bi) 12%,var(--paper));color:var(--ink);font-weight:700;font-size:.85rem;text-decoration:none}
.bm-text nav a:hover{background:var(--c-bi);color:#fff}
@media (max-width:860px){.bimos{grid-template-columns:1fr 1fr;grid-template-rows:200px 160px 160px auto}.bm1{grid-row:1;grid-column:1/3}.bm4{grid-column:auto}.bm5{grid-column:auto;grid-row:auto}.bm6{display:block}.bm-text{grid-column:1/3;grid-row:auto}}
/* Hören & Lesen: Sounds, Musik, Transcripts nebeneinander */
@media (min-width:1001px){.duo2{grid-template-columns:repeat(3,1fr)!important}}
.mu2 .songk{display:flex;gap:12px;align-items:center;padding:16px;border-radius:16px;background:color-mix(in srgb,var(--c-snd) 12%,var(--paper))}
.mu2 .song-nr{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--c-snd);color:#fff;font-weight:800;font-size:1.2rem}
.mu2 small{display:block;font-size:.72rem;color:var(--muted)}.mu2 b{display:block}.mu2 .songk span:not(.song-nr){font-size:.85rem;color:var(--muted)}
/* Musik hat eine eigene Rubrikfarbe (Fuchsia), Sounds bleibt Türkis */
:root{--c-mu:#c026d3}
html.dark{--c-mu:#e879f9}
.c-mu{--c:var(--c-mu)}
.duo2 a.mu2{--c:var(--c-mu)}
.mu2 .songk{background:color-mix(in srgb,var(--c-mu) 12%,var(--paper))}.mu2 .song-nr{background:var(--c-mu)}
/* Startseite: Knopf zur Vorgeschichte vor der Folge der Woche */
.vg-start{margin-top:28px}
.vg-btn{position:relative;isolation:isolate;display:flex;align-items:center;gap:20px;padding:16px 22px 16px 16px;border-radius:24px;overflow:hidden;color:#fff;text-decoration:none;background:#17121c;box-shadow:0 20px 40px -24px rgba(30,10,40,.6);transition:transform .2s}
.vg-btn:hover{transform:translateY(-2px)}
.vg-btn img{width:84px;height:84px;flex:none;border-radius:16px;object-fit:cover;object-position:center 25%}
.vg-btn::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,#17121c 30%,color-mix(in srgb,var(--crim) 55%,#17121c))}
.vg-btn-t{flex:1;min-width:0}
.vg-btn-t small{display:block;font-family:var(--f-ui);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--crim) 40%,#fff)}
.vg-btn-t b{display:block;font-family:var(--f-disp);font-weight:800;font-size:1.5rem;line-height:1.1;margin:2px 0}
.vg-btn-t span{color:rgba(255,255,255,.78);font-size:.92rem}
.vg-btn-p{display:grid;place-items:center;width:48px;height:48px;flex:none;border-radius:50%;background:var(--crim);font-size:1.3rem;font-weight:800}
@media (max-width:560px){.vg-btn img{width:60px;height:60px}.vg-btn-t span{display:none}}

/* Startseite: Timeline-Block groß (Vor den Serien · Serienjahre mit Staffel-Bildkacheln · Nach den Serien) */
.tlb-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.6fr) minmax(0,1fr);gap:14px;margin-top:8px}
.tlb-vor,.tlb-nach{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;min-height:420px;padding:20px;border-radius:24px;color:#fff;text-decoration:none;background:#0d0a14}
.tlb-vor > img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:40% center}
.tlb-vor::before,.tlb-nach::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(10,8,16,.95) 35%,rgba(10,8,16,.25))}
.tlb-vor small,.tlb-nach small,.tlb-kopf small{display:block;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--c-tl)}
.tlb-vor b,.tlb-nach b,.tlb-kopf b{display:block;font-family:var(--f-disp);font-weight:800;font-size:1.5rem;line-height:1.1;margin:2px 0 10px}
.tlb-vor ul{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px;font-size:.88rem;color:rgba(255,255,255,.85)}
.tlb-vor li i{display:inline-block;min-width:44px;font-style:normal;font-family:var(--f-ui);font-weight:600;color:var(--c-tl)}
.tlb-vor > div > span,.tlb-nach > div > span{font-weight:800;color:var(--c-tl)}
.tlb-nach p{margin:0 0 12px;font-size:.88rem;color:rgba(255,255,255,.82)}
.tlb-cov{position:absolute;inset:16px 16px auto;z-index:-2;display:flex;justify-content:center;gap:0}
.tlb-cov img{width:44%;aspect-ratio:2/3;object-fit:cover;border-radius:8px;box-shadow:0 14px 30px -10px rgba(0,0,0,.7);margin:0 -7%}
.tlb-cov img:nth-child(1){transform:rotate(-8deg) translateY(12px)}.tlb-cov img:nth-child(2){z-index:1}.tlb-cov img:nth-child(3){transform:rotate(8deg) translateY(12px)}
.tlb-nach::before{background:linear-gradient(0deg,rgba(10,8,16,.97) 42%,rgba(10,8,16,.1) 75%)}
.tlb-mitte{padding:20px;border-radius:24px;background:var(--paper);box-shadow:0 1px 0 var(--line),var(--shade)}
.tlb-kopf small{color:color-mix(in srgb,var(--c-tl) 75%,#000)}.tlb-kopf b{color:var(--ink)}
.tlb-grid{display:grid;gap:8px}
.tlb-jahre,.tlb-lane,.tlb-ms{display:grid;grid-template-columns:64px repeat(16,minmax(0,1fr));gap:4px;align-items:stretch}
.tlb-jahre span{font-family:var(--f-ui);font-size:.68rem;color:var(--muted);border-left:1px solid var(--line);padding-left:4px}
.tlb-l{grid-column:1;align-self:center;font-family:var(--f-disp);font-weight:800;font-size:.95rem;color:var(--c-ep)}
.tlb-l.ang{color:#2f6bea}
.tlb-s{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;height:118px;padding:8px;border-radius:12px;color:#fff;text-decoration:none;background:#1a0f14}
.tlb-s img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform .4s}
.tlb-s::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,color-mix(in srgb,var(--c-ep) 85%,#000) 0,rgba(0,0,0,.1) 75%)}
.tlb-s.ang::before{background:linear-gradient(0deg,rgba(28,70,184,.95) 0,rgba(0,0,0,.1) 75%)}
.tlb-s:hover img{transform:scale(1.08)}
.tlb-s b{font-family:var(--f-disp);font-weight:800;font-size:1.05rem;line-height:1}
.tlb-s span{font-size:.68rem;line-height:1.15;opacity:.9;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tlb-ms{margin-top:2px}
.tlb-m{grid-row:1;padding:4px 6px;border-radius:999px;background:color-mix(in srgb,var(--c-tl) 16%,var(--paper));font-family:var(--f-ui);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:color-mix(in srgb,var(--c-tl) 70%,#000);text-align:center;overflow:hidden;text-overflow:ellipsis}
.tlb-filter{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px}
.tlb-filter a{padding:9px 16px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font-weight:700;font-size:.88rem;text-decoration:none;color:var(--ink)}
.tlb-filter a:hover{background:var(--c-tl);border-color:var(--c-tl);color:#1a1205}
html.dark .tlb-kopf small{color:var(--c-tl)}html.dark .tlb-m{color:var(--c-tl)}
@media (max-width:1100px){.tlb-band{grid-template-columns:1fr 1fr}.tlb-mitte{grid-column:1/-1;grid-row:1;overflow-x:auto}.tlb-grid{min-width:760px}.tlb-vor,.tlb-nach{min-height:320px}}
@media (max-width:620px){.tlb-band{grid-template-columns:1fr}}
.tlb-mitte{display:flex;flex-direction:column}.tlb-grid{flex:1;align-content:center;gap:10px}
.tlb-jahre,.tlb-lane,.tlb-ms{grid-template-columns:54px repeat(16,minmax(0,1fr))}
.tlb-s{height:140px}
.tlb-m{font-size:.62rem;padding:6px 8px}
.tlb-m{text-transform:none;letter-spacing:0;font-family:var(--f-body);font-weight:700;font-size:.72rem;overflow:visible;text-overflow:clip}.tlb-vor > img{filter:brightness(1.35)}
/* Logo v2: Pixel-B größer und auf der Grundlinie, leichter Schein, „.de“ als Etikett */
.logo-g{gap:0}
.logo-g svg{width:36px;height:36px;margin:0 -3px 0 0;transform:translateY(-3px);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--logo) 45%,transparent));transition:filter .25s,transform .25s}
.logo-g:hover svg{filter:drop-shadow(0 0 10px var(--logo));transform:translateY(-3px) rotate(-4deg)}
.logo-g b{font-size:28px;letter-spacing:-.05em}
.logo-g small{align-self:flex-start;margin:4px 0 0 4px;padding:2px 6px;border-radius:6px;background:var(--logo);color:#fff!important;font-size:10.5px;letter-spacing:.02em}
.ft .logo-g svg{width:60px;height:60px;transform:translateY(-5px)}.ft .logo-g b{font-size:48px}
.ft .logo-g small{margin:8px 0 0 6px;padding:3px 9px;border-radius:8px;font-size:16px;background:#9a6cf0}
@media (max-width:560px){.mB .logo-g svg{width:30px;height:30px}.mB .logo-g b{font-size:23px}}

/* Startseite: Fanartikel-Band (Bild wie der Fanartikel-Kopf, rechts bündig, links ins Schwarz) */
.fanb{margin-top:110px;position:relative;overflow:hidden;isolation:isolate;background:#000;color:#fff;min-height:clamp(380px,36vw,520px);display:flex;align-items:center}
.fanb-bild{position:absolute;z-index:-2;top:0;right:0;height:100%;width:auto;max-width:none}
.fanb::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#000 0,rgba(0,0,0,.78) 28%,rgba(0,0,0,.3) 46%,transparent 60%)}
.fanb .in{width:100%;max-width:1200px;margin:0 auto;padding:70px max(32px,env(safe-area-inset-right,0px)) 70px max(32px,env(safe-area-inset-left,0px))}
.fanb-t{max-width:520px;text-shadow:0 2px 14px rgba(0,0,0,.7)}
.fanb .k{font-family:var(--f-ui);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:color-mix(in srgb,var(--crim) 45%,#fff)}
.fanb h2{margin:10px 0 0;font-family:var(--f-disp);font-weight:800;font-size:clamp(3rem,7vw,5.6rem);line-height:.9;letter-spacing:-.03em}
.fanb p{margin:14px 0 0;max-width:42ch;color:rgba(255,255,255,.85)}
.fanb-kat{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.fanb-kat a{display:inline-block;padding:9px 16px;border-radius:999px;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.28);color:#fff;font-weight:700;font-size:.9rem;text-decoration:none;text-shadow:none;backdrop-filter:blur(6px);transition:background .2s}
.fanb-kat a:hover{background:#fff;color:#111}
.fanb .go4{display:inline-flex;margin-top:24px;padding:13px 22px;border-radius:999px;background:var(--crim);color:#fff;font-weight:800;text-decoration:none;text-shadow:none}
@media (max-width:760px){.fanb::after{background:linear-gradient(0deg,rgba(0,0,0,.88) 30%,rgba(0,0,0,.45))}}

/* Startseite: Downloads als eigener Bereich, Kacheln wie auf der Downloads-Seite */
.dlb{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.dlb-k{--c:var(--c-dl);display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shade);text-decoration:none;color:var(--ink);transition:transform .2s}
.dlb-k:hover{transform:translateY(-4px)}
.dlb-b{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:100%;height:150px;overflow:hidden;background:#120d16}
.dlb-b img{width:100%;height:100%;min-height:0;object-fit:cover}
.dlb-b img:only-child{grid-column:1/-1}
.dlb-b img[src*="/kopf-"]{object-position:right center}
.dlb-b img[src*="kopf-skins"]{image-rendering:pixelated}
.dlb-t{padding:14px 16px 16px}
.dlb-t b{display:block;font-family:var(--f-disp);font-weight:800;font-size:1.15rem}
.dlb-t span{display:block;color:var(--muted);font-size:.88rem;margin-top:2px}
.dlb-t small{display:block;margin-top:8px;font-family:var(--f-ui);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--c)}
.dd3.dd2{grid-template-columns:1fr 1fr}
@media (max-width:1000px){.dlb{grid-template-columns:repeat(2,minmax(0,1fr))}.dd3.dd2{grid-template-columns:1fr}}
@media (max-width:520px){.dlb{grid-template-columns:1fr}}
.fanb::after{background:linear-gradient(90deg,rgba(0,0,0,.62) 0,rgba(0,0,0,.4) 30%,transparent 48%)}
.fanb-t{max-width:620px}
@media (max-width:760px){.fanb::after{background:linear-gradient(0deg,rgba(0,0,0,.88) 30%,rgba(0,0,0,.45))}}

/* Startseite: Hören & Lesen – zufälliges Soundzitat zum Anhören + Zeile aus einem Drehbuch */
.hq{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.hq-k{display:flex;flex-direction:column;gap:16px;padding:26px 28px;border-radius:24px;border:1px solid var(--line);box-shadow:var(--shade)}
.hq-snd{--c:var(--c-snd);background:color-mix(in srgb,var(--c) 10%,var(--paper))}
.hq-tr{--c:var(--c-tr);background:var(--paper)}
.hq-k header{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.hq-l{font-family:var(--f-ui);font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--c)}
.hq-k .lnk{--c:inherit}
.hq-who{display:flex;align-items:center;gap:12px}
.hq-av{flex:none;width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:center 20%;border:2px solid var(--c)}
.hq-who b{display:block;font-weight:800;font-size:1.05rem}
.hq-who span{display:block;font-size:.84rem;color:var(--muted)}
.hq-q{margin:0;flex:1;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:600;font-size:clamp(1.45rem,2.3vw,1.9rem);line-height:1.22;color:var(--ink)}
.hq-tr .hq-q{font-family:var(--f-mono,'IBM Plex Mono',monospace);font-style:normal;font-weight:400;font-size:1.02rem;line-height:1.6;padding:18px 20px;border-radius:12px;background:color-mix(in srgb,var(--c) 6%,var(--bg));border-left:3px solid var(--c)}
.hq-k audio{width:100%;height:40px}
.hq-u{align-self:flex-start;font-weight:700;font-size:.9rem;color:var(--c);text-decoration:none}
.hq-u::after{content:" →"}
.hq-u:hover{text-decoration:underline}
@media (max-width:900px){.hq{grid-template-columns:1fr}}

/* Startseite: Musik als eigenes Band (Bild wie der Musik-Kopf), vier zufällige Songs */
.mub{margin-top:110px;position:relative;overflow:hidden;isolation:isolate;background:#0a060e;color:#fff;min-height:clamp(420px,38vw,560px);display:flex;align-items:center}
.mub-bild{position:absolute;z-index:-2;top:0;right:0;height:100%;width:auto;max-width:none}
.mub::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(10,6,14,.92) 0,rgba(10,6,14,.7) 34%,rgba(10,6,14,.15) 62%,transparent 80%)}
.mub .in{width:100%;max-width:1200px;margin:0 auto;padding:70px max(32px,env(safe-area-inset-right,0px)) 70px max(32px,env(safe-area-inset-left,0px))}
.mub-t{max-width:560px}
.mub .k{font-family:var(--f-ui);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:color-mix(in srgb,var(--c-mu) 45%,#fff)}
.mub h2{margin:10px 0 0;font-family:var(--f-disp);font-weight:800;font-size:clamp(3rem,7vw,5.6rem);line-height:.9;letter-spacing:-.03em}
.mub p{margin:14px 0 0;max-width:44ch;color:rgba(255,255,255,.85)}
.mub-songs{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:8px}
.mub-songs a{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:14px;align-items:center;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#fff;text-decoration:none;backdrop-filter:blur(6px);transition:background .2s}
.mub-songs a:hover{background:rgba(255,255,255,.16)}
.mub-songs i{grid-row:1/3;font-style:normal;font-family:var(--f-ui);font-size:.72rem;font-weight:600;padding:5px 9px;border-radius:8px;background:var(--c-mu);color:#fff}
.mub-songs b{font-weight:800;font-size:.98rem}
.mub-songs span{font-size:.82rem;color:rgba(255,255,255,.7)}
.mub .go4{display:inline-flex;margin-top:24px;padding:13px 22px;border-radius:999px;background:var(--c-mu);color:#fff;font-weight:800;text-decoration:none}
@media (max-width:760px){.mub::after{background:linear-gradient(0deg,rgba(10,6,14,.92) 40%,rgba(10,6,14,.55))}}
.mub-t{max-width:680px}
.mub-songs{grid-template-columns:1fr 1fr}
@media (max-width:620px){.mub-songs{grid-template-columns:1fr}}
/* Musik-Band nicht durchgehend: eigene Zeile in Inhaltsbreite, abgerundet */
.mub{max-width:1136px;width:calc(100% - 64px);margin:96px auto 0;border-radius:28px;min-height:clamp(380px,34vw,480px)}
.mub .in{padding:56px 48px}
@media (max-width:760px){.mub{width:calc(100% - 32px)}.mub .in{padding:40px 24px}}
/* Musik-Block: links ganz dunkel (Schatten), Bild läuft nach rechts auf */
.mub::after{background:linear-gradient(90deg,#0a060e 0,#0a060e 30%,rgba(10,6,14,.75) 46%,rgba(10,6,14,.2) 66%,transparent 80%)}
@media (max-width:760px){.mub::after{background:linear-gradient(0deg,#0a060e 40%,rgba(10,6,14,.55))}}
/* Startseite: Fakten (früher Laufband) seitlich im Kopf, über dem Angel-Link */
.hb-rechts{display:flex;flex-direction:column;align-items:flex-end;gap:34px}
.hb-fakten{list-style:none;margin:0;padding:0;display:grid;gap:9px;max-width:330px;text-align:right}
.hb-fakten li{font-size:.9rem;line-height:1.35;color:rgba(255,255,255,.85);text-shadow:0 1px 10px rgba(0,0,0,.7)}
.hb-fakten li::after{content:"✦";margin-left:10px;color:#c3a6ff}
@media (max-width:860px){.hb-rechts{align-items:flex-start}.hb-fakten{text-align:left;max-width:none}.hb-fakten li::after{content:none}.hb-fakten li::before{content:"✦";margin-right:10px;color:#c3a6ff}}
.hb-fakten{max-width:400px}.hb-fakten li{white-space:nowrap}@media (max-width:1100px){.hb-fakten li{white-space:normal}}
/* Weitere Serien: eigene Schrift je Serie (wie die Serienlogos) */
.wd-dh b{font-family:'Josefin Sans',var(--f-disp);font-weight:300;text-transform:uppercase;letter-spacing:.14em;font-size:clamp(2rem,4vw,3rem)}
.wd-bt b{font-family:'Cinzel',Georgia,serif;font-weight:700;letter-spacing:.02em;font-size:clamp(2.2rem,4.4vw,3.3rem)}
.wd-dh b{font-size:clamp(1.6rem,2.7vw,2.25rem);letter-spacing:.1em}
.wd-dh img{width:62%;object-position:20% 18%}.wd-dh div{max-width:21ch}
@media (max-width:760px){.wd-dh img{width:100%;object-position:center 18%}}
.bm1 img[src*="bilder-s5"]{object-position:center 15%}
/* Menüleiste: Buffy/Angel-Umschalter mittig zwischen Schnellzugriff und EN */
.mB .quick{margin-right:0}
.serie-um{display:flex;gap:2px;margin:0 auto;padding:3px;border-radius:999px;background:color-mix(in srgb,var(--ink) 7%,transparent)}
.serie-um a{padding:6px 14px;border-radius:999px;text-decoration:none;font-family:var(--f-logo);font-size:1.05rem;line-height:1;color:var(--ink)}
.serie-um a[aria-current="page"]{background:var(--ink);color:var(--paper)}
.serie-um a[href$="angel/"][aria-current="page"]{background:#2f6bea;color:#fff}
.serie-um a:not([aria-current]):hover{background:color-mix(in srgb,var(--ink) 10%,transparent)}
@media (max-width:860px){.serie-um{margin-left:auto}}
@media (max-width:480px){.serie-um a{padding:5px 9px;font-size:.92rem}}
.serie-um a{font-family:var(--f-disp);font-weight:800;font-size:.86rem;letter-spacing:0;padding:7px 14px}
@media (max-width:480px){.serie-um a{padding:6px 10px;font-size:.8rem}}
@media (max-width:520px){.serie-um{display:none}}
/* Menü „Mehr“: zwischen Comics und Buffy/Angel; aufgeklappt eine Zeile unter der Leiste */
.mega .nur-mobil{display:none}
@media (min-width:1001px){
  .mB summary{background:none!important;box-shadow:none;color:var(--ink)!important;padding:8px 12px;font-weight:700;font-size:.84rem;gap:6px}
  .mB summary:hover{background:color-mix(in srgb,var(--ink) 6%,transparent)!important}
  .mB summary .hb{display:none}
  .mB summary::after{content:"";width:7px;height:7px;margin-top:-3px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s}
  .mB details[open] summary::after{transform:rotate(225deg);margin-top:3px}
  .mB .mega{display:flex!important;flex-wrap:nowrap;gap:4px;left:max(32px,calc((100vw - 1200px)/2));right:max(32px,calc((100vw - 1200px)/2));width:auto;max-width:none;padding:8px;border-radius:999px}
  .mB .mega .it{flex:1 1 auto;min-width:0;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:7px;padding:9px 10px;border-radius:999px;white-space:nowrap}
  .mB .mega .it > span:not(.ico){display:none}
  .mB .mega .it b{font-size:.84rem}
  .mB .mega .it .ico{width:24px;height:24px;flex:none}
}
@media (max-width:1000px){.mB .quick{display:none}.mega .nur-mobil{display:flex}.serie-um{margin-left:auto}.mega{grid-template-columns:1fr 1fr}}
@media (min-width:1001px){
  .mB .mega .it.nur-mobil{display:none}
  .mB .mega .it .ico{display:none}
  .mB .mega{left:0;right:0;justify-content:space-between}
  .mB .mega .it{flex:0 1 auto;padding:9px 12px}
}
@media (min-width:1001px) and (max-width:1120px){.mB .bar{gap:8px}.mB .quick a{padding:7px 7px;font-size:.8rem}.serie-um a{padding:6px 10px}}
@media (min-width:521px){.mega .nur-handy{display:none!important}}
/* „Mehr“ aufgeklappt: dunkle Zeile zum Unterscheiden, so breit wie nötig, enge Knöpfe */
.serie-um a[aria-current="page"]{background:rgb(var(--pl-rgb))!important;color:#fff!important}
.serie-um a[href$="angel/"][aria-current="page"]{background:#2f6bea!important}
.it-paar{display:flex;gap:2px;padding:3px!important;border-radius:999px}
.it-paar a{padding:6px 11px;border-radius:999px;text-decoration:none;font-weight:700;font-size:.84rem;color:inherit;white-space:nowrap}
.it-paar a[aria-current="page"]{background:rgb(var(--pl-rgb));color:#fff}
@media (min-width:1001px){
  .mB .mega{left:50%;right:auto;width:max-content;max-width:calc(100% - 16px);transform:translateX(-50%);justify-content:center;gap:2px;padding:6px;background:#17121c!important;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 40px -16px rgba(0,0,0,.55)}
  .mB .mega .it{padding:7px 11px;color:#fff!important;background:none!important}
  .mB .mega .it b{color:#fff}
  .mB .mega a.it:hover{background:rgb(var(--pl-rgb))!important}
  .mB .mega .it-paar{margin-left:6px;background:rgba(255,255,255,.08)!important}
  .mB .mega .it-paar a:not([aria-current]):hover{background:rgba(255,255,255,.14)}
}
@media (max-width:1000px){.it-paar{grid-column:1/-1;justify-content:center;background:color-mix(in srgb,var(--ink) 6%,transparent)}.it-paar a{flex:1;text-align:center}}
/* „Mehr“-Zeile: passt zur Menüleiste (hell/dunkel), nur dezent lila getönt */
@media (min-width:1001px){
  .mB .mega{background:color-mix(in srgb,var(--paper) 90%,rgb(var(--pl-rgb)) 10%)!important;border:1px solid color-mix(in srgb,var(--line) 70%,rgb(var(--pl-rgb)) 30%);box-shadow:0 14px 30px -18px rgba(0,0,0,.45);backdrop-filter:blur(12px)}
  .mB .mega .it,.mB .mega .it b{color:var(--ink)!important}
  .mB .mega a.it:hover{background:color-mix(in srgb,rgb(var(--pl-rgb)) 14%,transparent)!important}
  .mB .mega .it-paar{background:color-mix(in srgb,var(--ink) 6%,transparent)!important}
  .mB .mega .it-paar a:not([aria-current]):hover{background:color-mix(in srgb,rgb(var(--pl-rgb)) 14%,transparent)}
}
@media (min-width:1001px){html.dark .mB summary{background:none!important}html.dark .mB summary:hover{background:color-mix(in srgb,var(--ink) 8%,transparent)!important}}
@media (min-width:1001px){.mB summary,html.dark .mB summary{background:rgb(var(--pl-rgb))!important;color:#fff!important}.mB summary:hover,html.dark .mB summary:hover{background:color-mix(in srgb,rgb(var(--pl-rgb)) 85%,#000)!important}}
/* Menü in der Farbe des Bereichs (dezent): Buffy lila, Angel blau, Dollhouse petrol, Blood Ties kupfer */
body{--serie:rgb(var(--pl-rgb))}
body.w-angel{--serie:#2f6bea}body.w-dollhouse{--serie:#1d9bb2}body.w-bloodties{--serie:#c8782c}
.mB .bar{background:color-mix(in srgb,var(--paper) 86%,var(--serie) 14%)!important;border-color:color-mix(in srgb,var(--line) 60%,var(--serie) 40%)!important}
.mB .quick a{color:var(--ink)!important}
.mB .quick a:hover,.mB .quick a[aria-current="page"]{background:color-mix(in srgb,var(--serie) 16%,transparent)!important;color:var(--ink)!important}
@media (min-width:1001px){
  .mB summary,html.dark .mB summary{background:var(--serie)!important}
  .mB summary:hover,html.dark .mB summary:hover{background:color-mix(in srgb,var(--serie) 82%,#000)!important}
  .mB .mega{background:color-mix(in srgb,var(--paper) 88%,var(--serie) 12%)!important;border-color:color-mix(in srgb,var(--line) 60%,var(--serie) 40%)}
  .mB .mega a.it:hover{background:color-mix(in srgb,var(--serie) 16%,transparent)!important}
}
.it-paar a[aria-current="page"]{background:var(--serie)}
/* Serien-Schriftzug vor den Menüeinträgen (Dollhouse/Blood Ties) */
.mB .quick .quick-logo{padding:4px 12px 4px 4px;background:none!important;color:var(--serie)!important;line-height:1}
.ql-dollhouse{font-family:'Josefin Sans',var(--f-disp)!important;font-weight:300!important;text-transform:uppercase;letter-spacing:.14em;font-size:1rem!important}
.ql-bloodties{font-family:'Cinzel',Georgia,serif!important;font-weight:700!important;font-size:1rem!important}
@media (min-width:1001px){.mB details.nur-klein{display:none}}
/* Menüfarbe: hell kräftiger, dunkel zurückhaltender */
.mB .bar{background:color-mix(in srgb,var(--paper) 74%,var(--serie) 26%)!important}
html.dark .mB .bar{background:color-mix(in srgb,var(--paper) 92%,var(--serie) 8%)!important}
@media (min-width:1001px){
  .mB .mega{background:color-mix(in srgb,var(--paper) 80%,var(--serie) 20%)!important}
  html.dark .mB .mega{background:color-mix(in srgb,var(--paper) 93%,var(--serie) 7%)!important}
}
.serie-um a[href$="dollhouse/"][aria-current="page"]{background:#1d9bb2!important}
.serie-um a[href$="bloodties/"][aria-current="page"]{background:#c8782c!important}
.mB .quick{align-items:center}.mB .quick .quick-logo{display:inline-flex;align-items:center;padding-top:6px}
/* Startseite Comics: echte Cover statt Panel-Collage */
.cvg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.cvg a{display:block;border-radius:8px;overflow:hidden;box-shadow:0 22px 40px -18px rgba(0,0,0,.85);transition:transform .25s}
.cvg a:hover{transform:translateY(-6px)}
.cvg img{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:cover}
/* Startseite: Sammelkarten und Dollz als eigene Blöcke */
.skb,.dzb{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:32px;align-items:center;padding:28px 32px;border-radius:24px}
.skb{--c:var(--c-cc);background:color-mix(in srgb,var(--c) 12%,var(--paper))}
.dzb{--c:var(--c-dz);background:color-mix(in srgb,var(--c) 12%,var(--paper))}
.skb-t p,.dzb-t p{margin:0;color:var(--muted);font-size:1rem;max-width:40ch}
.skb-sets{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.skb-sets a{padding:7px 13px;border-radius:999px;background:var(--paper);border:1px solid color-mix(in srgb,var(--c) 30%,var(--line));color:var(--ink);font-weight:700;font-size:.85rem;text-decoration:none}
.skb-sets a:hover{background:var(--c);color:#fff;border-color:var(--c)}
.skb-reihe{display:flex;gap:12px;justify-content:flex-end}
.skb-reihe img{width:calc((100% - 48px)/5);max-width:130px;aspect-ratio:5/7;height:auto;object-fit:cover;border-radius:8px;box-shadow:0 16px 28px -14px rgba(0,0,0,.55);transition:transform .25s}
.skb-reihe:hover img{transform:translateY(-4px)}
.dzb-reihe{display:flex;gap:4px;justify-content:flex-end;align-items:flex-end;min-height:190px;padding-bottom:10px;background:linear-gradient(0deg,color-mix(in srgb,var(--c) 22%,transparent) 0 10px,transparent 10px);border-radius:0 0 12px 12px}
.dzb-reihe img{height:175px;width:auto;image-rendering:pixelated;filter:drop-shadow(0 8px 8px rgba(0,0,0,.3));transition:transform .2s}
.dzb-reihe img:hover{transform:translateY(-6px)}
@media (max-width:1100px){.dzb-reihe img{height:140px}}
@media (max-width:900px){.skb,.dzb{grid-template-columns:1fr}.skb-reihe,.dzb-reihe{justify-content:flex-start;overflow-x:auto}}
/* Startseite Comics: zwei Reihen überlappender Cover in leichter Perspektive */
.cvs{position:relative;padding:10px 0 20px}
.cvs-r{display:flex;justify-content:center;perspective:1200px}
.cvs-r a{flex:none;width:30%;max-width:190px;margin-left:-11%;border-radius:8px;overflow:hidden;box-shadow:-14px 20px 34px -16px rgba(0,0,0,.9);transform:rotateY(-16deg);transform-origin:left center;transition:transform .35s,margin .35s}
.cvs-r a:first-child{margin-left:0}
.cvs-r a:hover{transform:rotateY(0) translateY(-10px) scale(1.06);z-index:5}
.cvs-r img{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:cover}
.cvs-r2{margin-top:-18%;padding-left:16%;position:relative;z-index:2}
.cvs-r2 a{transform:rotateY(16deg);transform-origin:right center;box-shadow:14px 22px 34px -16px rgba(0,0,0,.9)}
@media (max-width:1000px){.cvs-r a{width:26%}}
/* Comics Startseite: eine Reihe großer Cover, leicht überlappend und versetzt */
.cvs{padding:10px 0 40px}
.cvs-r{justify-content:flex-start;perspective:1400px}
.cvs-r a{width:31%;max-width:none;margin-left:-8%;transform:rotateY(-8deg)}
.cvs-r a:nth-child(even){transform:rotateY(-8deg) translateY(34px)}
.cvs-r a:hover,.cvs-r a:nth-child(even):hover{transform:rotateY(0) translateY(-8px) scale(1.04)}
.comicb .in{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.comicb .in{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)}
.cvs-r a{width:31%;margin-left:-5%;transform:none;box-shadow:-10px 18px 30px -14px rgba(0,0,0,.9)}
.cvs-r a:nth-child(even){transform:translateY(30px)}
.cvs-r a:hover,.cvs-r a:nth-child(even):hover{transform:translateY(-8px) scale(1.04)}
/* Startseiten-Kopf: Foto rechts, läuft links ins Dunkle aus – Schriftzug liegt daneben statt auf Buffy */
@media (min-width:861px){
  .hb2 > img{left:auto!important;right:0;width:min(64%,1100px)!important;object-position:center 22%!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
}
/* Startseite: unser Zitat aus der alten Seite */
.zitat-uns{margin:80px auto 0;max-width:900px;text-align:center}
.zitat-uns blockquote{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:600;font-size:clamp(1.5rem,2.8vw,2.3rem);line-height:1.3;color:var(--ink);text-wrap:pretty}
.zitat-uns figcaption{margin-top:18px;font-family:var(--f-ui);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:rgb(var(--pl-rgb))}
.zitat-uns figcaption::before{content:"";display:block;width:48px;height:2px;margin:0 auto 14px;background:rgb(var(--pl-rgb))}
@media (min-width:861px){.hb2 > img{width:min(82%,1400px)!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%);mask-image:linear-gradient(90deg,transparent 0,#000 24%)}}
@media (min-width:861px){.hb2 > img{width:auto!important;height:100%!important;right:max(0px,calc(43% - 38vh))!important;object-fit:contain!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 26%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent 0,#000 26%,#000 88%,transparent)}}
@media (min-width:861px){.hb2 > img{right:max(0px,calc(41% - 490px))!important}}
@media (min-width:861px){.hb2 > img{right:max(0px,calc(41% - 550px))!important}}
a.jubi{text-decoration:none;color:inherit}a.jubi:hover{border-color:currentColor}
.jubel .win{display:block;text-decoration:none;color:inherit}.jubel .win .body img{display:block;width:100%;max-height:200px;object-fit:cover;object-position:top center}.jubel p + p{margin-top:10px}
/* Zeitleiste: alte Designs nur als kleine, unscharfe Rückblende (nicht anklickbar, Inhalte nicht lesbar) */
.jubel .win.rb{display:block;width:220px;max-width:100%;margin-top:10px;border-radius:10px;overflow:hidden;pointer-events:none;box-shadow:0 10px 24px -12px rgba(0,0,0,.7)}
.jubel .win.rb .body{padding:0;background:#000}
.jubel .win.rb img{display:block;width:100%;height:110px;object-fit:cover;object-position:top center;filter:blur(1.6px) saturate(.85);opacity:.85;transform:scale(1.04)}
.jubel .win.rb{border:0;background:none}
.jubel .win.rb.scharf img{filter:none;opacity:1;transform:none}
.jubel .win.rb.scharf{width:340px}.jubel .win.rb.scharf img{height:auto;object-fit:contain}
/* Dunkelmodus: Menü sichtbar in der Bereichsfarbe getönt (passend zum farbigen Rahmen) */
html.dark .mB .bar{background:color-mix(in srgb,var(--paper) 80%,var(--serie) 20%)!important}
@media (min-width:1001px){html.dark .mB .mega{background:color-mix(in srgb,var(--paper) 82%,var(--serie) 18%)!important}}
/* Logo im Menü in der Farbe der Serie (Angel blau, Dollhouse türkis, Blood Ties bernstein) */
body.w-angel .mB .logo-g,body.w-dollhouse .mB .logo-g,body.w-bloodties .mB .logo-g{--logo:var(--serie)}
html.dark body.w-angel .mB .logo-g{--logo:#5b8cf5}html.dark body.w-dollhouse .mB .logo-g{--logo:#3cc0d6}html.dark body.w-bloodties .mB .logo-g{--logo:#e09a52}
/* Startseite: Episodenguide mit Staffel-Kacheln wie im Guide */
.h-stf{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}
.hs-k{position:relative;display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:3/4;padding:12px;border-radius:16px;overflow:hidden;isolation:isolate;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.18);box-shadow:0 16px 30px -18px rgba(0,0,0,.8);transition:transform .25s,border-color .25s}
.hs-k img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 25%;filter:saturate(.8) brightness(.8);transition:transform .5s,filter .3s}
.hs-k::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,color-mix(in srgb,var(--c-ep) 50%,#0b0710) 0,rgba(11,7,16,.5) 42%,transparent 72%)}
.hs-n{align-self:flex-start;padding:4px 9px;border-radius:999px;background:rgba(11,7,16,.55);font-family:var(--f-mono,monospace);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}
.hs-t b{display:block;font-family:var(--f-disp);font-size:.95rem;line-height:1.15}.hs-t small{display:block;margin-top:3px;font-size:.75rem;opacity:.85}
.hs-k:hover{transform:translateY(-4px);border-color:#fff}.hs-k:hover img{transform:scale(1.06);filter:none}
.h-egz{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 30px;margin-top:20px;padding:16px 22px;border-radius:18px;background:var(--paper);box-shadow:0 1px 0 var(--line)}
.hz-z,.hz-l{display:flex;flex-wrap:wrap;gap:8px 26px;margin:0}
.hz-z span{font-size:.9rem;color:var(--mute,inherit)}.hz-z b{font-family:var(--f-disp);font-size:1.5rem;color:var(--ink);margin-right:4px}
.hz-l{gap:8px}.hz-l a{padding:8px 15px;border-radius:999px;border:1px solid var(--line);font-weight:700;font-size:.88rem;text-decoration:none;color:var(--ink)}
.hz-l a:hover{background:var(--c-ep);border-color:var(--c-ep);color:#fff}
@media (max-width:1000px){.h-stf{display:flex;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory}.hs-k{flex:0 0 160px;scroll-snap-align:start}}
/* Angel-Startseite: Bausteine der Buffy-Startseite in Angel-Blau */
.h-stf.n5{grid-template-columns:repeat(5,minmax(0,1fr))}.h-stf.n5 .hs-k{aspect-ratio:4/3.6}
.a-start .hs-k::after{background:linear-gradient(0deg,color-mix(in srgb,#2f6bea 45%,#060b1d) 0,rgba(6,11,29,.5) 42%,transparent 72%)}
.a-start .hz-l a:hover{background:var(--serie);border-color:var(--serie)}
.hb-kick{font-family:var(--f-ui);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#9cc0ff}
.hb2.hb-angel{background:#060b1d}
.hb2.hb-angel::after{background:linear-gradient(to top,rgba(6,11,29,.96) 4%,rgba(6,11,29,.55) 45%,rgba(6,11,29,.2)),radial-gradient(55% 65% at 0 100%,rgba(47,107,234,.5),transparent 70%),radial-gradient(45% 60% at 100% 100%,rgba(var(--pl-rgb),.35),transparent 70%)!important}
.hb2.hb-angel h1{text-shadow:0 0 2px #fff,0 0 18px rgba(61,123,255,.85),0 0 60px rgba(61,123,255,.5)!important}
.hb2.hb-angel .sub2 em{color:#9cc0ff!important}.hb2.hb-angel .hb-fakten li::after,.hb2.hb-angel .hb-fakten li::before{color:#9cc0ff}
.tobuffy2 small{color:#c3a6ff}.tobuffy2 b{text-shadow:0 0 2px #fff,0 0 16px rgba(var(--pl-rgb),.85),0 0 46px rgba(var(--pl-rgb),.55)}
.tobuffy2 span{border-color:rgba(var(--pl-rgb),.7);color:#ece2ff}.tobuffy2:hover span{background:rgb(var(--pl-rgb));border-color:rgb(var(--pl-rgb))}
.tobuffy2:hover b{text-shadow:0 0 2px #fff,0 0 22px rgba(var(--pl-rgb),1),0 0 70px rgba(var(--pl-rgb),.8)}
.angelb.buffyb{background:#0b0710}
.angelb.buffyb::after{background:radial-gradient(50% 70% at 0 100%,rgba(var(--pl-rgb),.45),transparent 70%),linear-gradient(to top,rgba(11,7,16,.9),transparent 60%)}
.angelb.buffyb .k,.angelb.buffyb .stats span{color:#c3a6ff}.angelb.buffyb .sub{color:#e6dcff}
.angelb.buffyb h2{text-shadow:0 0 2px #fff,0 0 18px rgba(var(--pl-rgb),.8),0 0 50px rgba(var(--pl-rgb),.5)}
.angelb.buffyb .go2{background:rgb(var(--pl-rgb));box-shadow:0 10px 30px -10px rgb(var(--pl-rgb))}
@media (max-width:1000px){.h-stf.n5{display:flex}}
.a-start .dzb-reihe{overflow:hidden}.hb2.hb-angel .pills a:nth-child(5){background:#2f6bea;box-shadow:0 10px 24px -12px #2f6bea}
/* Startseiten Dollhouse und Blood Ties */
.hb2.hb-dollhouse{background:#03161a}.hb2.hb-bloodties{background:#140b05}
.hb2.hb-dollhouse::after{background:linear-gradient(to top,rgba(3,22,26,.96) 4%,rgba(3,22,26,.55) 45%,rgba(3,22,26,.2)),radial-gradient(55% 65% at 0 100%,rgba(29,155,178,.5),transparent 70%)!important}
.hb2.hb-bloodties::after{background:linear-gradient(to top,rgba(20,11,5,.96) 4%,rgba(20,11,5,.55) 45%,rgba(20,11,5,.2)),radial-gradient(55% 65% at 0 100%,rgba(200,120,44,.5),transparent 70%)!important}
.hb2.hb-dollhouse h1{font-family:'Josefin Sans',var(--f-disp);font-weight:300;text-transform:uppercase;letter-spacing:.12em;font-size:clamp(3.2rem,8vw,6.4rem);line-height:1;text-shadow:0 0 30px rgba(29,155,178,.7)!important}
.hb2.hb-bloodties h1{font-family:'Cinzel',Georgia,serif;font-weight:700;font-size:clamp(3.4rem,8vw,6.6rem);line-height:1;text-shadow:0 0 30px rgba(200,120,44,.7)!important}
.hb2.hb-dollhouse .hb-kick,.hb2.hb-dollhouse .hb-fakten li::after,.hb2.hb-dollhouse .hb-fakten li::before{color:#7fd8e6}
.hb2.hb-bloodties .hb-kick,.hb2.hb-bloodties .hb-fakten li::after,.hb2.hb-bloodties .hb-fakten li::before{color:#f0b77a}
.hb2.hb-dollhouse .sub2,.hb2.hb-bloodties .sub2{font-size:clamp(1.3rem,2.4vw,1.9rem)}
.k-start .hb2 .pills a{background:var(--serie)!important;box-shadow:0 10px 24px -12px var(--serie)!important;color:#fff!important}
.k-start .hb2 .pills a+a{background:rgba(255,255,255,.12)!important;box-shadow:none!important;border:1px solid rgba(255,255,255,.3)}
.k-start .hs-k::after{background:linear-gradient(0deg,color-mix(in srgb,var(--serie) 50%,#06080a) 0,rgba(6,8,10,.5) 42%,transparent 72%)}
.h-stf.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.h-stf.n2 .hs-k{aspect-ratio:16/8}.h-stf.n2 .hs-t b{font-size:1.35rem}
.k-start .eg-ein{margin-top:60px}
.k-sf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.k-sf{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:560px){.k-sf{grid-template-columns:1fr}.h-stf.n2 .hs-k{flex:0 0 80%}}
.kb-band{margin-top:110px;position:relative;overflow:hidden;isolation:isolate;background:#03161a;color:#fff}
.kb-band .in{max-width:1200px;margin:0 auto;padding:80px max(32px,env(safe-area-inset-right,0px)) 80px max(32px,env(safe-area-inset-left,0px));display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.6fr);gap:40px;align-items:center}
.kb-band .k{font-family:var(--f-ui);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#7fd8e6}
.kb-band h2{margin:10px 0 0;font-family:var(--f-disp);font-weight:800;font-size:clamp(2rem,4vw,3.2rem);line-height:1}
.kb-band p{margin:14px 0 0;color:rgba(255,255,255,.8);max-width:44ch}
.kb-bild{margin:0}.kb-bild img{display:block;width:100%;height:auto;border-radius:18px;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.kb-bild figcaption{margin-top:8px;font-size:.72rem;color:rgba(255,255,255,.55);text-align:right}
.kb-bt{background:#140b05}.kb-bt .k{color:#f0b77a}.kb-bt .in{grid-template-columns:minmax(0,1fr)}
.kb-hg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.45}
.kb-bt::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(20,11,5,.95) 30%,rgba(20,11,5,.4))}
.kb-liste{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.kb-liste li{padding:10px 16px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(240,183,122,.35)}
.kb-liste i{display:block;font-style:normal;font-family:var(--f-ui);font-size:.7rem;color:#f0b77a}.kb-liste b{font-family:'Cinzel',Georgia,serif}
@media (max-width:860px){.kb-band .in{grid-template-columns:1fr}}
.fk-grid.k-sf{grid-template-columns:repeat(3,minmax(0,1fr))}@media (max-width:900px){.fk-grid.k-sf{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:560px){.fk-grid.k-sf{grid-template-columns:1fr}}
@media (max-width:600px){.hb2.hb-dollhouse h1{font-size:clamp(1.9rem,10vw,3rem);letter-spacing:.08em}.hb2.hb-bloodties h1{font-size:clamp(2.2rem,11vw,3.2rem)}}
/* Fuß: Hinweis ganz unten (ohne Drittanbieter, Cookies, Tracking) */
.ft .ft-ohne{margin:-6px 0 0;padding:18px 0 calc(28px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(255,255,255,.1);font-size:1rem;font-weight:600;line-height:1.5;letter-spacing:.01em;text-align:center;opacity:.85}
