/* collecto.css — gemeinsames Stylesheet für katalog.html und die statischen Seiten (S5b-2, 14.10.2026).
   Bis S5b-2 stand es inline in katalog.html. Eine Quelle für beide Wege, damit sie nicht auseinanderlaufen.
   Bewusst nicht "styles.css": der Seitentest prüft dort ein 404 als Beleg, dass v2 abgeschaltet ist (S4). */
:root{
  --ink:#16171B; --ink-2:#4A4D57; --ink-3:#84889A;
  --line:#DEDFE4; --line-soft:#EDEEF1;
  --paper:#FBFBFC; --card:#FFFFFF;
  --accent:#2B4C8C;
  --ok:#1F6F5C; --ok-bg:#EAF3F0; --ok-line:#B8D9CD;
  --warn:#9A6B12; --warn-bg:#FAF2E2; --warn-line:#E8D3A0;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',system-ui,sans-serif;background:var(--paper);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px}
a{color:inherit}

.topbar{border-bottom:1px solid var(--line);background:var(--card);position:sticky;top:0;z-index:10}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:58px;gap:20px}
.logo{font-family:'Newsreader',serif;font-size:21px;font-weight:500;text-decoration:none;cursor:pointer}
.logo span{color:var(--ink-3)}
.topbar nav{display:flex;gap:20px;font-size:13.5px;color:var(--ink-2)}
.topbar nav a{text-decoration:none;cursor:pointer}
.topbar nav a:hover{color:var(--ink)}
.topbar nav a.here{color:var(--ink);font-weight:500}

.eyebrow{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
h1{font-family:'Newsreader',serif;font-weight:400;letter-spacing:-.022em;line-height:1.1;font-size:44px;margin-bottom:16px}
h2{font-family:'Newsreader',serif;font-size:26px;font-weight:400;letter-spacing:-.015em;margin-bottom:6px;line-height:1.2}
.shead{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);font-weight:500;margin-bottom:18px}
section{padding:44px 0}
section + section{border-top:1px solid var(--line)}
.lede{font-family:'Newsreader',serif;font-size:19px;line-height:1.65;color:var(--ink-2);max-width:70ch}
.lede b{color:var(--ink);font-weight:500}
.fineprint{font-size:13.5px;color:var(--ink-3);line-height:1.7;max-width:68ch;margin-top:18px}

/* Kennzahlenleiste */
.stats{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--line);border-radius:4px;background:var(--card);margin-top:26px;overflow:hidden}
.stat{padding:15px 22px;flex:1 1 auto;min-width:130px;border-right:1px solid var(--line-soft)}
.stat:last-child{border-right:none}
.stat .n{font-family:'JetBrains Mono',monospace;font-size:22px;line-height:1.2}
.stat .l{font-size:12px;color:var(--ink-3);margin-top:2px}
.stat.gap .n{color:var(--warn)}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:14px}
.hcard{border:1px solid var(--line);border-radius:4px;background:var(--card);padding:20px 22px;cursor:pointer;display:flex;flex-direction:column}
.hcard:hover{border-color:var(--ink-3)}
.hc-k{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);margin-bottom:7px}
.hc-t{font-family:'Newsreader',serif;font-size:20px;margin-bottom:9px;line-height:1.3}
.hc-badges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.hc-m{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3);margin-top:auto;padding-top:11px;border-top:1px solid var(--line-soft)}

.badge{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:3px;font-weight:500;white-space:nowrap}
.badge.ok{background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok-line)}
.badge.warn{background:var(--warn-bg);color:var(--warn);border:1px solid var(--warn-line)}
.badge.mute{background:var(--line-soft);color:var(--ink-3);border:1px solid var(--line)}

/* Detailansicht */
.back{font-size:13px;color:var(--ink-2);text-decoration:none;cursor:pointer;display:inline-block;margin-bottom:18px}
.back:hover{color:var(--ink)}

.ed{border:1px solid var(--line);border-radius:4px;background:var(--card);padding:18px 20px;margin-bottom:12px}
.ed.gap{border-style:dashed;background:transparent}
.ed-top{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:10px}
.ed-market{font-family:'Newsreader',serif;font-size:19px}
.ed-time{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--ink-3)}
.marker{display:grid;grid-template-columns:88px 1fr;gap:8px;font-size:13.5px;padding:8px 0;border-top:1px solid var(--line-soft)}
.marker .where{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);padding-top:3px}
.marker .what b{font-weight:500}
.prov{font-size:11.5px;color:var(--ink-3);margin-top:3px}
.conf{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.04em;text-transform:uppercase;padding:1px 7px;border-radius:3px;border:1px solid var(--line);background:var(--line-soft);color:var(--ink-3)}
.conf.strong{background:var(--ok-bg);color:var(--ok);border-color:var(--ok-line)}
.conf.medium{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-line)}
/* Ausgabenseite (S5b-3): Link auf die Ausgabe, Vergleich mit den anderen Ausgaben */
.ed-link{color:inherit;text-decoration:underline;text-decoration-color:var(--ink-3);text-underline-offset:3px}
.ed-link:hover{text-decoration-color:var(--ink)}
.sib{border:1px solid var(--line);border-radius:4px;background:var(--card);padding:12px 18px;margin-bottom:10px}
.sib.gap{border-style:dashed;background:transparent}
.sib .ed-top{margin-bottom:4px}
.sib .ed-market{font-size:17px}
.sib-m{list-style:none;margin:0;padding:0;font-size:13px;color:var(--ink-2)}
.sib-m li{padding:4px 0;border-top:1px solid var(--line-soft)}
.sib-m .where{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);margin-right:6px}
.oq{margin-top:12px;padding-top:11px;border-top:1px solid var(--line-soft)}
.oq summary{font-size:12.5px;color:var(--warn);cursor:pointer;font-weight:500}
.oq ul{margin:9px 0 0 18px;font-size:13px;color:var(--ink-2)}
.oq li{margin-bottom:5px}
.gap-note{font-size:13.5px;color:var(--ink-2);font-style:italic}

.struct{font-size:13.5px;color:var(--ink-2);line-height:1.8}
.struct code{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-3)}

.err{border:1px solid var(--warn-line);background:var(--warn-bg);color:var(--warn);border-radius:4px;padding:18px 22px;font-size:14px;line-height:1.7}
.err code{font-family:'JetBrains Mono',monospace;font-size:12.5px}

/* ── Zweite Datenklasse: redaktioneller Kontext (10.08.2026) ────────────────
   Bis heute zeigte diese Seite ausschliesslich Unterscheidungsmerkmale. Alles,
   was ein Objekt erzaehlbar macht — wer es gemacht hat, wann die Serie lief,
   was danebensteht, wie ein einzelnes Stueck aussieht — hatte kein Feld und
   folglich keine Darstellung. Die Bloecke unten erscheinen NUR, wenn Daten da
   sind: bei Simpsons Comics wird die Seite dadurch voll, bei Zelda bleibt sie
   duenn. Das ist Absicht. Eine Oberflaeche, die Fuelle vortaeuscht, wo keine
   ist, waere genau die Unehrlichkeit, gegen die Collecto antritt. */

.lead-img{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:34px;align-items:start;margin-top:30px}
.lead-img img{width:100%;border-radius:5px;border:1px solid var(--line);display:block;background:var(--card)}
.lead-img figcaption{font-size:12.5px;color:var(--ink-3);margin-top:9px;line-height:1.6}
@media(max-width:820px){.lead-img{grid-template-columns:1fr}}

.prose{font-family:'Newsreader',serif;font-size:18px;line-height:1.72;color:var(--ink-2);max-width:66ch}
.prose .s{display:inline}
.prose .cite{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-3);vertical-align:super;
  text-decoration:none;padding:0 1px;cursor:help;border-bottom:1px dotted var(--line)}
.prose .cite:hover{color:var(--accent)}
.prose .s.weak{color:var(--ink-3)}

.credits{display:grid;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:0 26px}
.crole{border-top:1px solid var(--line);padding:13px 0}
.crole .r{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}
.crole .n{font-size:15px;line-height:1.55}
.crole .n .nm{font-weight:500}
.crole .n .hint{font-size:11.5px;color:var(--ink-3)}

.tl{border-left:2px solid var(--line);margin-left:6px;padding-left:22px}
.tlx{position:relative;padding:0 0 20px}
.tlx:last-child{padding-bottom:0}
.tlx::before{content:'';position:absolute;left:-29px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--ink-3);border:2px solid var(--paper)}
.tlx.own::before{background:var(--accent)}
.tlx .d{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--ink-3)}
.tlx .t{font-size:14.5px;margin-top:2px}
.tlx .t b{font-weight:500}
.tlx .why{font-size:12px;color:var(--ink-3);margin-top:3px}

.rel{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.relc{border:1px solid var(--line);border-radius:4px;background:var(--card);padding:14px 16px}
.relc.confused{border-color:var(--warn-line);background:var(--warn-bg)}
.relc .k{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-bottom:5px}
.relc.confused .k{color:var(--warn)}
.relc .t{font-size:15px;font-weight:500;line-height:1.4}
.relc .n{font-size:12.5px;color:var(--ink-3);margin-top:6px;line-height:1.6}
.relc .miss{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-3);margin-top:8px;display:block}

.item{border:1px solid var(--line);border-radius:5px;background:var(--card);margin-bottom:18px;overflow:hidden}
.item-head{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap;padding:16px 20px;border-bottom:1px solid var(--line-soft)}
.item-grade{font-family:'Newsreader',serif;font-size:24px}
.item-grade .h{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.06em;color:var(--ink-3);text-transform:uppercase;margin-right:8px;vertical-align:middle}
.item-cert{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3)}
.item-body{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:24px;padding:18px 20px}
@media(max-width:820px){.item-body{grid-template-columns:1fr}}
.item-shots{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.item-shots figure{margin:0}
.item-shots img{width:100%;border-radius:4px;border:1px solid var(--line);display:block;cursor:zoom-in}
.item-shots figcaption{font-size:10.5px;color:var(--ink-3);margin-top:4px;line-height:1.45}
.kv{display:grid;grid-template-columns:132px 1fr;gap:7px 12px;font-size:13.5px}
.kv dt{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);padding-top:3px}
.kv dd{margin:0;line-height:1.6}
.kv dd .sub{font-size:12px;color:var(--ink-3);display:block;margin-top:2px}

.compare{border:1px solid var(--accent);border-radius:4px;background:#F4F7FC;padding:16px 20px;margin-bottom:20px;font-size:14px;line-height:1.7;color:var(--ink-2)}
.compare b{color:var(--ink);font-weight:500}

.rights{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line);border-radius:3px;padding:2px 7px;display:inline-block}

.empty{font-size:13.5px;color:var(--ink-3);font-style:italic;line-height:1.7;max-width:66ch}

.lightbox{position:fixed;inset:0;background:rgba(12,13,16,.9);display:none;align-items:center;justify-content:center;z-index:50;padding:32px;cursor:zoom-out}
.lightbox.on{display:flex}
.lightbox img{max-width:100%;max-height:100%;border-radius:4px}

/* ── Titelvorlage (Schritt 2b, 02.10.2026) ──────────────────────────────────
   Gestalt nach der v2-SML-Seite (ADR-022: Spezifikation, nicht migrieren):
   Kopf mit Faktenbox, Sprungleiste, danach die Abschnitte in Leistenreihenfolge. */
section.hero{padding:30px 0 40px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:44px;align-items:start}
.hero .prose{max-width:62ch}
.factbox{border:1px solid var(--line);border-radius:5px;background:var(--card);padding:6px 20px 8px}
.factbox h3{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);font-weight:500;padding:14px 0 8px}
.fact{display:grid;grid-template-columns:104px minmax(0,1fr);gap:4px 14px;padding:10px 0;border-top:1px solid var(--line-soft);font-size:14px}
.fk{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);padding-top:3px}
.fv{line-height:1.5;min-width:0;overflow-wrap:anywhere}
.fv small{display:block;font-size:12px;color:var(--ink-3);margin-top:2px}
.fv .hint{font-size:11.5px;color:var(--ink-3)}
.fv .sale{margin-bottom:8px;font-size:13.5px;line-height:1.55}
.fv .sale:last-child{margin-bottom:0}
.fv .sale.weak .s{color:var(--ink-2)}
.fv .cite{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-3);vertical-align:super;text-decoration:none;cursor:help}

nav.jump{position:sticky;top:58px;z-index:9;background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
nav.jump .wrap{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-top:8px;padding-bottom:8px}
nav.jump .wrap::-webkit-scrollbar{display:none}
nav.jump button,nav.jump a{font:inherit;font-size:13px;color:var(--ink-2);background:none;border:1px solid transparent;border-radius:4px;padding:5px 12px;cursor:pointer;white-space:nowrap;flex:0 0 auto}
nav.jump button:hover,nav.jump a:hover{color:var(--ink);border-color:var(--line)}
nav.jump button.on,nav.jump a.on{color:var(--ink);background:var(--card);border-color:var(--line);font-weight:500}
section[id],.ed[id]{scroll-margin-top:112px}

p.sub{font-size:14.5px;color:var(--ink-2);max-width:68ch;margin:6px 0 20px;line-height:1.65}
h3.sub3{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);font-weight:500;margin:30px 0 12px}
.gapline{border:1px dashed var(--line);border-radius:4px;padding:12px 16px;background:transparent;margin:0 0 14px}
.mhead{font-family:'Newsreader',serif;font-size:21px;margin:26px 0 10px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.mhead:first-of-type{margin-top:6px}
.mhead span{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3)}
.ed-id{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3);margin-left:8px}

.lst{border:1px solid var(--line);border-radius:4px;background:var(--card);padding:14px 18px;margin-bottom:10px}
.lst-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.lst-link{font-weight:500;color:var(--accent)}
.lst-date,.lst-id{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3)}
.lst-as{font-size:13.5px;margin-top:6px;color:var(--ink-2)}
.lst-ed{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-color:var(--ink-3);text-underline-offset:2px}
.lst-src{font-size:12px;color:var(--ink-3);margin-top:4px}
.lst-note{font-size:12.5px;color:var(--ink-3);margin-top:5px}
.panel{border:1px solid var(--line);border-radius:5px;background:var(--card);padding:18px 22px;margin-top:30px}
.panel h3{font-family:'Newsreader',serif;font-size:19px;font-weight:400;margin-bottom:10px}
.panel .gapline{margin-bottom:0}
.panel h4{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-weight:500;margin:18px 0 6px}
.chk{display:flex;gap:12px;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--line-soft);font-size:14.5px;line-height:1.55}
.chk-n{flex:0 0 22px;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-3);text-align:right}
.chk-t .cite{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-3);vertical-align:super;text-decoration:none;margin-left:2px}
.chk.warn{background:var(--card);border-left:3px solid var(--accent);padding-left:10px;margin:6px 0}
.chk.warn .chk-n{color:var(--accent);font-weight:600}
.chk-src{font-size:12px;color:var(--ink-3);margin-top:14px}

details.concept{border:1px solid var(--line);border-radius:4px;background:var(--card);padding:12px 18px;margin-bottom:10px}
details.concept summary{cursor:pointer;font-size:14.5px;line-height:1.5}
details.concept .prose{margin-top:10px;font-size:16px}

ul.srcs{list-style:none;border-top:1px solid var(--line)}
ul.srcs li{padding:11px 0;border-bottom:1px solid var(--line-soft);font-size:14.5px;display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline}
ul.srcs .lic{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.04em;color:var(--ink-3);border:1px solid var(--line);border-radius:3px;padding:1px 7px}
ul.srcs .lic.attr{color:var(--ok);border-color:var(--ok-line);background:var(--ok-bg)}

section.wipsec{padding:0 0 56px;border-top:none}
.wip{border-top:1px solid var(--line);padding-top:22px;font-size:14.5px;color:var(--ink-2);line-height:1.7}
.wip b{font-weight:500;color:var(--ink)}

/* Handy (390 px): eine Spalte, schmalere Ränder, Sprungleiste scrollt waagerecht */
@media(max-width:820px){
  .hero-grid{grid-template-columns:1fr;gap:26px}
}
@media(max-width:600px){
  .wrap{padding:0 20px}
  .topbar .wrap{height:52px}
  nav.jump{top:52px}
  section[id],.ed[id]{scroll-margin-top:104px}
  h1{font-size:32px}
  h2{font-size:23px}
  section{padding:34px 0}
  section.hero{padding:22px 0 30px}
  .fact{grid-template-columns:1fr;gap:2px}
  .marker{grid-template-columns:1fr;gap:2px}
  .kv{grid-template-columns:1fr}
  .stat{min-width:45%;border-bottom:1px solid var(--line-soft)}
  .lead-img{gap:18px}
}

/* Statische Seiten (S5b-2): Karten und Sprungleiste sind dort echte Links. */
a.hcard{color:inherit;text-decoration:none}
nav.jump a{display:inline-block;text-decoration:none}
.relc a.miss{text-decoration:none;color:var(--accent)}
.relc a.miss:hover{text-decoration:underline}
.site-foot{border-top:1px solid var(--line);margin-top:48px;padding:24px 0 40px}
.site-foot a{color:inherit}