/* Anbieter-Auswahlseite „Gold“ (Entwurf „Netflix“ vom 30.10.2026, Frank: „Passt, weiter“), baut auf wg-film-gold.css
   und wg-kategorie-gold.css auf (main trägt .wgfg .wgkg .wgab). Quelle: projektdateien/redesign/abo-2026-10-30/abo.css.
   Neu gegenüber dem Entwurf: Neu auf …, Verlässt bald, Hinweise in der Liste. */
.wgab .kat-kopf h1{font-size:clamp(32px,3vw,44px);max-width:24ch}
.wgab .unter{margin-top:2px}
.wgab .unter a{display:inline-flex;align-items:center;gap:7px}
.wgab .unter .ic{width:17px;height:17px;color:var(--gold-text)}
.wgab .unter small{color:var(--leise);font-weight:500}

/* Abendplaner */
.wgab .planer{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}
.wgab .p-frage{margin-bottom:14px}
.wgab .p-frage > b{display:block;font-size:15.5px;margin-bottom:8px}
.wgab .p-ergebnis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;list-style:none;margin:18px 0 0;padding:0}
.wgab .p-ergebnis a{display:grid;grid-template-columns:76px minmax(0,1fr);gap:12px;align-items:start;padding:10px;border-radius:12px;background:var(--flaeche);color:var(--text);text-decoration:none;height:100%}
.wgab .p-ergebnis a:hover{box-shadow:inset 0 0 0 1px var(--linie)}
.wgab .p-ergebnis img,.wgab .p-ergebnis .pl-leer{width:76px;aspect-ratio:2/3;object-fit:cover;border-radius:6px;background:var(--linie);display:block}
.wgab .p-ergebnis b{display:block;font-size:16px;line-height:1.3}
.wgab .p-ergebnis small{display:block;font-size:13px;color:var(--leise)}
.wgab .p-ergebnis em{display:block;font-style:normal;font-size:12.5px;color:var(--gold-text);font-weight:650}
.wgab .p-ergebnis .sk{margin-top:6px}.wgab .p-ergebnis .sk img{width:26px;height:26px}.wgab .p-ergebnis .sk b{font-size:15px}
.wgab .p-ergebnis .sk.leer{display:none}
.wgab .p-leer{padding:14px;border-radius:10px;background:var(--flaeche);margin:14px 0 0}

/* Ranglisten und Verlässt bald */
.wgab .rangliste,.wgab .geht-liste{list-style:none;margin:0;padding:0}
.wgab .rangliste li{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:center;border-top:1px solid var(--linie)}
.wgab .rangliste li:first-child,.wgab .geht-liste li:first-child{border-top:0}
.wgab .rang-nr{font-size:22px;font-weight:860;color:var(--gold-text);text-align:center}
.wgab .rangliste a,.wgab .geht-liste a{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:14px;align-items:center;padding:9px 6px;border-radius:10px;color:var(--text);text-decoration:none}
.wgab .geht-liste a{grid-template-columns:46px minmax(0,1fr) auto 70px}
.wgab .geht-liste li{border-top:1px solid var(--linie)}
.wgab .rangliste a:hover,.wgab .geht-liste a:hover{background:var(--flaeche)}
.wgab .rangliste a > img,.wgab .geht-liste a > img{width:46px;height:69px;object-fit:cover;border-radius:4px;background:var(--flaeche)}
.wgab .r-text{min-width:0}
.wgab .r-text b{display:block;font-size:16.5px;font-weight:680;line-height:1.3}
.wgab .r-text small{display:block;font-size:13px;color:var(--gold-text);font-weight:600}
.wgab .rangliste .sk,.wgab .geht-liste .sk{justify-self:end}
.wgab .frist{text-align:right;white-space:nowrap}
.wgab .frist b{display:block;font-size:15px;font-weight:720}
.wgab .frist small{display:block;font-size:13px;color:var(--leise)}

/* Plakat: Hinweis oben links */
.wgab .pl .merk{position:absolute;left:6px;top:6px;font-style:normal;font-size:12px;font-weight:700;padding:3px 8px;border-radius:6px;background:var(--gold);color:#1b1a17}
.wgab .pl .pl-leer{display:block;width:100%;aspect-ratio:2/3;border-radius:8px;background:var(--flaeche)}

/* Zeile unter dem Plakat als eigene Zeile */
.wgab .plakatreihe small{display:block;line-height:1.4;margin-top:2px}

/* Liste: Typfilter vor der Sortierung, Hinweise Neu und Frist */
.wgab .sortierung .chips{margin-right:auto}
.wgab .z-abo .neu{background:var(--gold);color:#1b1a17}
.wgab .z-abo .frist{background:var(--gold-hell);color:var(--text)}
.wgab .quelle .wg-jw-attr{color:inherit}

@media (max-width:1000px){
  .wgab .p-ergebnis{grid-template-columns:minmax(0,1fr)}
  .wgab .p-ergebnis a{grid-template-columns:64px minmax(0,1fr)}
  .wgab .p-ergebnis img,.wgab .p-ergebnis .pl-leer{width:64px}
}
@media (max-width:700px){
  .wgab .kat-kopf h1{font-size:30px}
  .wgab .rangliste li{grid-template-columns:28px minmax(0,1fr)}
  .wgab .rang-nr{font-size:18px}
  .wgab .rangliste a{grid-template-columns:40px minmax(0,1fr) auto;gap:10px;padding:8px 2px}
  .wgab .geht-liste a{grid-template-columns:40px minmax(0,1fr) auto;gap:10px;padding:8px 2px}
  .wgab .geht-liste .sk{display:none}
  .wgab .rangliste a > img,.wgab .geht-liste a > img{width:40px;height:60px}
  .wgab .rangliste .z-meta span:nth-child(3){display:none}
  .wgab .wisch{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:28%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:thin}
  .wgab .wisch li{scroll-snap-align:start}
  .wgab .r-text b{font-size:15.5px}
  .wgab .z-meta{flex-wrap:wrap;row-gap:0}
  .wgab .sortierung .chips{width:100%;margin-right:0}
  .wgab .liste .z-abo{display:none}
}
.wgab .leiste .verwandt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:4px}
.wgab .leiste .verwandt a{padding:3px 8px}
