/* Indexwartung, Teil 2 „Aufgeräumt, aber ohne Platz“ (Entwurf unter _dev/) und
   Teil 3 „Wenn der Index ohne Wartung wächst“ (Entwurf unter _dev/; Titel bis 06.10.2026
   „Die Brent Line: 68 % und trotzdem Splits“), dazu Teil 1 (Seitenbilder, unten).
   Nur Ergänzungen zu site.css, Präfix iw-. Farben und Schriften aus den site.css-Variablen.
   Die Grafiken erzeugen Prototypen/build-indexwartung.py (Teil 2) und build-indexwartung-3.py (Teil 3); jede gibt es breit
   und schmal. Umschaltung seit 07.10.2026 bei 820 px statt 640 px (Review 7.2, Punkt 7): Die breite Variante (viewBox 760)
   erscheint erst, wenn sie annähernd in Originalgröße passt; die schmale (viewBox 360) ist auf 460 px Breite begrenzt.
   display:none blendet die jeweils andere Variante auch für assistive Technik aus. */

.iw-h2{font-size:clamp(2rem,3.6vw,3.2rem)}
.iw-head{max-width:900px;margin-bottom:26px}
.iw-head h2{font-size:clamp(2rem,3.8vw,3.4rem)}
.iw-nw{white-space:nowrap}
.iw-fine{font-size:.84rem;color:var(--muted);margin:12px 0 0}
.iw-sec{padding:clamp(28px,4vw,48px) 0}
.iw-sec .article > h2:first-child{margin-top:0}

/* Kopf */
.iw-hero{padding-bottom:80px}
.iw-hero h1{max-width:12em}
.iw-hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:end}
.iw-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.iw-pill{display:inline-flex;gap:8px;align-items:center;font-family:var(--mono);font-size:.78rem;padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.22);color:#d4e6f3;text-decoration:none;background:rgba(255,255,255,.04)}
.iw-pill b{font-weight:500;color:#7fa3bd;text-transform:uppercase;letter-spacing:.08em;font-size:.68rem}
a.iw-pill:hover{border-color:var(--orange);color:#fff}
.iw-karte{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);padding:24px 24px 18px;color:#d4e6f3}
.iw-karte-k{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:#9ccbea;margin:0 0 18px}
.iw-karte-z{display:grid;grid-template-columns:1fr auto;gap:4px 12px;margin-bottom:20px}
.iw-karte-n{font-family:var(--display);font-weight:600;font-size:1.3rem;color:#fff;line-height:1.1}
.iw-karte-f{font-size:.84rem;color:#9fb7c8;text-align:right;align-self:end}
.iw-karte-f b{color:#fff;font-weight:600}
.iw-karte-bar{grid-column:1 / -1;height:14px;border-radius:7px;background:rgba(255,255,255,.07);overflow:hidden}
.iw-karte-bar i{display:block;height:100%;border-radius:7px;background:var(--blue-300)}
.iw-karte-z.o .iw-karte-bar i{background:var(--orange)}
.iw-karte-w{grid-column:1 / -1;font-size:.92rem}
.iw-karte-w b{font-family:var(--display);font-weight:600;font-size:1.9rem;color:#fff;margin-right:6px;font-variant-numeric:tabular-nums}
.iw-karte-z.o .iw-karte-w b{color:#f7b27a}
.iw-karte-q{font-size:.78rem;color:#7fa3bd;margin:0}
.iw-karte-q a{color:#9ccbea}

/* Befund in 30 Sekunden */
.iw-befund-sec{padding-bottom:clamp(28px,4vw,48px)}
.iw-befund{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:b}
.iw-befund li{counter-increment:b;position:relative;background:var(--blue-50);border:1px solid var(--line);border-radius:var(--radius);padding:44px 22px 22px;color:var(--ink-2);font-size:.98rem;line-height:1.55}
.iw-befund li::before{content:counter(b,decimal-leading-zero);position:absolute;left:22px;top:18px;font-family:var(--mono);font-size:.74rem;color:var(--muted)}
.iw-befund li b{color:var(--ink)}
.iw-befund li.iw-befund-fazit{grid-column:1 / -1;background:var(--navy);border-color:var(--navy);color:#fff;font-family:var(--display);font-weight:600;font-size:clamp(1.15rem,1.8vw,1.45rem);line-height:1.3;padding:22px 24px 22px 76px}
.iw-befund li.iw-befund-fazit::before{color:#f7b27a;top:50%;transform:translateY(-50%)}
@media (max-width:1000px){.iw-befund{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.iw-befund{grid-template-columns:minmax(0,1fr)}.iw-befund li.iw-befund-fazit{padding:44px 22px 22px}.iw-befund li.iw-befund-fazit::before{top:18px;transform:none}}

/* Kästen */
.iw-schultern{margin:26px 0 28px;padding:20px 24px}
.iw-schultern p{margin:6px 0 0;color:var(--ink-2)}
.iw-messbox{margin:8px 0 26px;border:1px solid var(--line);border-top:3px solid var(--blue);border-radius:var(--radius-sm);padding:18px 22px;background:#fff;box-shadow:0 10px 26px rgba(5,28,44,.06)}
.iw-messbox b{display:block;font-family:var(--mono);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;font-weight:500;color:var(--blue);margin-bottom:6px}
.iw-messbox p{margin:0;font-size:.97rem}
.iw-merksatz{font-family:var(--display);font-weight:600;font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.25;color:var(--ink) !important;border-left:4px solid var(--orange);padding:4px 0 4px 18px;margin:22px 0 30px}
.iw-steps{margin:8px 0 26px}
.iw-nach-steps{font-weight:600;color:var(--ink) !important}
.iw-ausblick{background:var(--blue-50);border-radius:var(--radius-sm);padding:16px 20px;font-size:.97rem;margin-top:26px}

/* Tabellen */
.iw-tw{overflow-x:auto;margin:6px 0 22px;-webkit-overflow-scrolling:touch}
.iw-table td,.iw-table th{padding:11px 12px}
.iw-table td.n,.iw-table th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.iw-table tr.iw-zeile-o td:first-child{box-shadow:inset 4px 0 0 var(--orange)}
.iw-table tr.iw-zeile-b td:first-child{box-shadow:inset 4px 0 0 var(--blue)}

/* Grafiken */
.iw-fig{margin:28px 0 26px;padding:22px 22px 16px;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.iw-fig-kopf{margin-bottom:16px}
.iw-fig-nr{display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:6px}
.article .iw-fig-titel{font-family:var(--display);font-weight:600;font-size:clamp(1.15rem,1.7vw,1.4rem);line-height:1.2;color:var(--ink);margin:0}
.article .iw-fig-unter{font-size:.9rem;color:var(--muted);margin:4px 0 0}
.iw-fig figcaption{font-size:.85rem;color:var(--muted);margin-top:12px;line-height:1.5}
.iw-quelle{display:block;margin-top:4px;font-family:var(--mono);font-size:.72rem;letter-spacing:.02em}
.iw-svg{display:block;width:100%;height:auto;overflow:visible}
.iw-schmal{display:none}
@media (max-width:820px){
  .iw-breit{display:none}
  .iw-schmal{display:block;max-width:460px;margin:0 auto}
}
@media (max-width:640px){
  .iw-fig{padding:16px 12px 12px;margin-left:-8px;margin-right:-8px}
}
@media (max-width:400px){
  .iw-fig{padding:14px 8px 10px;margin-left:-12px;margin-right:-12px}
}
.iw-svg text{font-family:var(--text);fill:var(--ink-2)}
.iw-svg .t-ax{fill:var(--muted)}
.iw-svg .t-axt{fill:var(--ink-2);font-weight:600}
.iw-svg .t-kat{fill:var(--ink)}
.iw-svg .b,.iw-svg .t-kat.b{font-weight:700}
.iw-svg .t-wert{fill:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.iw-svg .t-wert.o{fill:var(--orange-600)}
.iw-svg .t-wert.b{fill:var(--blue)}
.iw-svg .t-wert.g{fill:var(--ink-2)}
.iw-svg .grid{stroke:var(--line);stroke-width:1}
.iw-svg .axis{stroke:#9fb1be;stroke-width:1.2}
.iw-svg .bar-o{fill:var(--orange)}
.iw-svg .bar-o2{fill:#f6b981}
.iw-svg .bar-b{fill:var(--blue)}
.iw-svg .bar-b3{fill:var(--blue-300)}
.iw-svg .bar-g{fill:#a9b8c3}
.iw-svg .zone{fill:var(--orange-100)}
.iw-svg .ff{stroke:var(--ink-2);stroke-width:1.2;stroke-dasharray:4 3}
.iw-svg .leit{fill:none;stroke:var(--orange);stroke-width:1.2}
.iw-svg .bruch{fill:#fff}
.iw-svg polyline{fill:none;stroke-linejoin:round;stroke-linecap:round}
.iw-svg .ln-o{stroke:var(--orange);stroke-width:3.5}
.iw-svg .ln-b{stroke:var(--blue);stroke-width:3.5}
.iw-svg .ln-g{stroke:#8aa0af;stroke-width:3;stroke-dasharray:7 5}
.iw-svg .pt-o{fill:var(--orange)}
.iw-svg .pt-b{fill:var(--blue)}
.iw-svg .pt-g{fill:#8aa0af}
.iw-svg .hohl{fill:#fff;stroke:var(--orange);stroke-width:1.6}
/* Skizze */
.iw-svg .sk-seite{fill:#fff;stroke:#9fb1be;stroke-width:1.5}
.iw-svg .sk-zeile{fill:var(--blue)}
.iw-svg .sk-frei{fill:var(--blue-50);stroke:var(--blue-300);stroke-width:1;stroke-dasharray:3 2}
.iw-svg .sk-neu{fill:var(--orange)}
.iw-svg .sk-pfeil{stroke:var(--orange);stroke-width:2}
.iw-svg .sk-spitze{fill:none;stroke:var(--orange);stroke-width:2;stroke-linejoin:round}
.iw-skizze{background:var(--blue-50);border-color:transparent}

/* Aufklapper */
.iw-daten{margin-top:12px}
.iw-daten summary,.iw-grenzen summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:8px}
.iw-daten summary::-webkit-details-marker,.iw-grenzen summary::-webkit-details-marker{display:none}
.iw-daten summary{font-size:.85rem;font-weight:650;color:var(--blue);padding:6px 14px;border:1px solid var(--line);border-radius:999px;background:#fff}
.iw-daten summary::before,.iw-grenzen summary::before{content:"+";font-family:var(--mono);color:var(--orange)}
.iw-daten[open] summary::before,.iw-grenzen[open] summary::before{content:"–"}
.iw-daten .iw-tw{margin-top:12px}
.iw-daten .iw-table{font-size:.86rem}
.iw-grenzen{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:6px 0}
.iw-grenzen summary{padding:16px 0;width:100%}
.iw-grenzen summary::before{font-size:1.4rem}
.iw-grenzen-t{font-family:var(--display);font-weight:600;font-size:clamp(1.4rem,2.2vw,1.8rem);color:var(--ink)}
.iw-grenzen .checks{margin:6px 0 14px}

/* Quiz und Weiterlesen */
.iw-quiz-sec{background:var(--blue-50)}
.iw-links{padding-left:1.1em}
.iw-links li{margin-bottom:8px;color:var(--ink-2)}

@media (max-width:960px){
  .iw-hero-grid{grid-template-columns:minmax(0,1fr);gap:32px}
}
@media (max-width:560px){
  .iw-karte{padding:20px 18px 14px}
  .iw-karte-z{grid-template-columns:1fr}
  .iw-karte-f{text-align:left}
}

/* Teil 3: fünf Befundkarten (3 + 2), Kennzahlenkarte mit Startmarke, Linien- und Referenzklassen */
.iw-befund-5{grid-template-columns:repeat(6,minmax(0,1fr))}
.iw-befund-5 li{grid-column:span 2}
.iw-befund-5 li:nth-child(n+4){grid-column:span 3}
@media (max-width:1000px){.iw-befund-5{grid-template-columns:repeat(2,minmax(0,1fr))}.iw-befund-5 li,.iw-befund-5 li:nth-child(n+4){grid-column:auto}.iw-befund-5 li:last-child{grid-column:1 / -1}}
@media (max-width:560px){.iw-befund-5{grid-template-columns:minmax(0,1fr)}}
.iw-karte-bar-start{position:relative}
.iw-karte-bar-start em{position:absolute;top:2px;bottom:2px;width:3px;margin-left:-1.5px;border-radius:2px;background:#fff;opacity:.75}
.iw-karte-s{font-size:.92rem;margin:0 0 14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.14)}
.iw-karte-s b{font-family:var(--display);font-weight:600;font-size:1.6rem;color:#fff;margin-right:6px;font-variant-numeric:tabular-nums}
.iw-svg .ln-o.mittel,.iw-svg .ln-b.mittel{stroke-width:2.6}
.iw-svg .ln-o.st,.iw-svg .ln-b.st{stroke-width:1.8}
.iw-svg .ref{stroke:#6c7c88;stroke-width:1.3;stroke-dasharray:6 4}
.iw-svg .leit-b{fill:none;stroke:var(--blue);stroke-width:1.2}
.iw-svg .hohl-b{fill:#fff;stroke:var(--blue);stroke-width:1.6}

/* Teil 1 „Platz für die nächste Zeile“ (06.10.2026, Entwurf unter /_dev/indexwartung-verstehen/): das Seitenbild.
   Markup aus Prototypen/build-indexwartung-1.py, Schritte über assets/js/indexwartung-seiten.js.
   Seiten = Kästen mit vier Plätzen (--iw-platz), Einträge = Zahlenkärtchen, gelesen = blau umrandet, neue Zeile = orange,
   verschoben = hell orange mit gestrichelter Umrandung bis zum nächsten Schritt, freie Plätze gestrichelt.
   (.iw-befund-7 stammt aus der Fassung vom 06.10. mit sieben Karten und wird seit 07.10. nicht mehr verwendet.) */
.iw-befund-7{grid-template-columns:repeat(12,minmax(0,1fr))}
.iw-befund-7 li{grid-column:span 3}
.iw-befund-7 li:nth-child(n+5){grid-column:span 4}
@media (max-width:1000px){.iw-befund-7{grid-template-columns:repeat(2,minmax(0,1fr))}.iw-befund-7 li,.iw-befund-7 li:nth-child(n+5){grid-column:auto}.iw-befund-7 li:last-child{grid-column:1 / -1}}
@media (max-width:560px){.iw-befund-7{grid-template-columns:minmax(0,1fr)}}

.iw-bild{--iw-platz:33px;--iw-luft:4px}
.iw-buehne{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:20px 28px;padding:4px 0}
.iw-buehne.iw-spalten{--iw-platz:40px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0 16px;align-items:start}
.iw-feld{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0}
.iw-spalten .iw-feld + .iw-feld{border-left:1px dashed var(--line)}
.iw-buehne .iw-feld-titel{margin:0;font-family:var(--display);font-weight:600;font-size:1.12rem;line-height:1.2;color:var(--ink);text-align:center}
.iw-buehne .iw-weg{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:5px 6px;margin:0;font-family:var(--mono);font-size:.74rem;line-height:1.3;color:var(--ink-2)}
.iw-weg-k{font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:2px}
.iw-weg-e{padding:3px 9px;border-radius:999px;background:var(--blue-50);border:1px solid var(--line);white-space:nowrap;transition:background-color .6s,border-color .6s}
.iw-seiten{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 14px}
.iw-spalten .iw-seiten{flex-direction:column;flex-wrap:nowrap;align-items:center;gap:10px}
.iw-mit-warte .iw-seiten{padding-top:calc(var(--iw-platz) + 18px);row-gap:calc(var(--iw-platz) + 30px)}
.iw-mit-warte.iw-spalten .iw-seiten{row-gap:10px}
.iw-seite{position:relative;flex:none;background:#fff;border:1.5px solid #9fb1be;border-radius:10px;padding:3px 6px 6px;transition:border-color .3s,box-shadow .3s}
.iw-seite-nr{display:block;font-family:var(--mono);font-size:.66rem;line-height:1.6;letter-spacing:.03em;color:var(--muted);padding:0 2px;border-radius:4px;transition:background-color .6s,color .6s}
.iw-plaetze{display:flex;gap:var(--iw-luft)}
.iw-platz{display:flex;width:var(--iw-platz);height:var(--iw-platz);border-radius:6px}
.iw-frei{border:1.5px dashed #8fa9bb;background:var(--blue-50)}
.iw-e{flex:1;display:flex;align-items:center;justify-content:center;border-radius:6px;background:var(--blue-100);border:1px solid #bcd5e7;color:var(--ink);font-family:var(--mono);font-weight:600;font-size:max(12px,calc(var(--iw-platz) * .4));line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;transition:background-color .6s,border-color .6s,color .6s,box-shadow .6s}
.iw-e.iw-neu{background:var(--orange);border-color:var(--orange-600);color:#fff}
.iw-e.iw-bewegt{background:#fbd5b0;border-color:var(--orange-600);color:var(--ink);outline:2px dashed var(--orange-600);outline-offset:1px}
.iw-weg-e.iw-bewegt{background:var(--orange-100);border-color:var(--orange-600);border-style:dashed}
.iw-seite-nr.iw-bewegt{background:var(--orange-100);color:#a94f04;outline:1px dashed var(--orange-600)}
.iw-gelesen{border-color:var(--blue);box-shadow:0 0 0 2px var(--blue)}
.iw-treffer{border-color:var(--orange);border-style:dashed;box-shadow:0 0 0 3px var(--orange-100)}
.iw-luecke{margin-left:26px}
.iw-luecke::before{content:"…";position:absolute;left:-21px;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:1.1rem;color:var(--muted)}
.iw-spalten .iw-luecke{margin-left:0;margin-top:20px}
.iw-spalten .iw-luecke::before{content:"⋮";left:50%;top:-24px;transform:translateX(-50%)}
.iw-warte{position:absolute;left:50%;bottom:calc(100% + 14px);display:flex;width:var(--iw-platz);height:var(--iw-platz);margin-left:calc(var(--iw-platz) / -2)}
.iw-warte::after{content:"";position:absolute;left:50%;top:100%;margin:2px 0 0 -5px;border:5px solid transparent;border-top:7px solid var(--orange);border-bottom:0}
.iw-buehne .iw-anzeigen{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:0}
.iw-anz{font-family:var(--mono);font-size:.72rem;line-height:1.3;padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink-2);white-space:nowrap}
.iw-buehne .iw-ergebnis{margin:0;max-width:30em;text-align:center;font-size:.9rem;line-height:1.4;color:var(--ink-2)}
.iw-ergebnis b{display:table;margin:0 auto 6px;padding:3px 14px;border-radius:999px;font-family:var(--display);font-weight:600;font-size:1.1rem;line-height:1.3;color:#fff}
.iw-ergebnis-split b{background:var(--orange-600)}
.iw-ergebnis-passt b{background:var(--blue)}
.iw-geist{position:absolute;margin:0;pointer-events:none}
.iw-steuerung{display:flex;flex-direction:column;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.iw-steuerung[hidden]{display:none}
.iw-bild .iw-schritt-text{margin:0;font-size:.97rem;line-height:1.5;color:var(--ink)}
.iw-zaehler{font-family:var(--mono);font-size:.8rem;font-weight:600;color:var(--blue);white-space:nowrap;margin-right:4px}
.iw-frage{display:inline-block;margin-left:2px;padding:0 8px;border-radius:6px;background:var(--orange-100);color:#8a4204;font-weight:650}
.iw-knoepfe{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.iw-knoepfe .btn{min-height:44px;justify-content:center;color:var(--blue);text-align:left;line-height:1.25}
.iw-knoepfe .iw-weiter{background:var(--blue);border-color:var(--blue);color:#fff}
.iw-knoepfe .iw-weiter:hover{background:var(--blue-700);border-color:var(--blue-700)}
.iw-knoepfe .btn[aria-disabled="true"]{opacity:.45;cursor:default;box-shadow:none}
.iw-knoepfe .iw-weiter[aria-disabled="true"]{background:transparent;color:var(--blue)}
.iw-knoepfe .btn:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.iw-hinweis{margin:14px auto 0;max-width:40em;font-size:.92rem;font-weight:600;line-height:1.45;color:var(--ink);text-align:center}
#bild-1 .iw-hinweis{font-weight:400;color:var(--ink-2)}
#bild-1 .iw-hinweis::before{content:"Legende";display:inline-block;margin-right:8px;font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.iw-legende{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:14px 0 0;font-size:.8rem;line-height:1.3;color:var(--ink-2)}
.iw-legende-k{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.iw-lg{display:inline-flex;align-items:center;gap:6px}
.iw-lg i{display:inline-block;width:16px;height:16px;border-radius:4px;flex:none}
.iw-lg-neu{background:var(--orange);border:1px solid var(--orange-600)}
.iw-lg-frei{background:var(--blue-50);border:1.5px dashed #8fa9bb}
.iw-lg-bewegt{background:#fbd5b0;outline:2px dashed var(--orange-600);outline-offset:1px}
.iw-lg-gelesen{background:#fff;border:1.5px solid var(--blue);box-shadow:0 0 0 2px var(--blue)}
.iw-lg-treffer{background:#fff;border:1.5px dashed var(--orange)}
.iw-alle{margin-top:12px;font-size:.92rem}
.iw-alle summary{cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:32px;font-weight:650;color:var(--blue)}
.iw-alle summary::marker{color:var(--orange)}
.iw-alle summary:focus-visible{outline:3px solid var(--orange);outline-offset:2px;border-radius:4px}
.iw-schritte{margin:10px 0 0;padding-left:1.4em;font-size:.92rem;color:var(--ink-2)}
.iw-schritte li{margin-bottom:4px}
.iw-endzustand{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line)}
.iw-bild .iw-end-k{margin:0 0 10px;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
/* Bild 9: Seiten und Statistik */
.iw-buehne .iw-stat-pfeil{margin:0;display:flex;flex-direction:column;align-items:center}
.iw-stat-pfeil span{position:relative;font-family:var(--mono);font-size:.74rem;font-weight:600;letter-spacing:.03em;color:#fff;background:var(--orange-600);padding:5px 12px;border-radius:999px;white-space:nowrap}
.iw-stat-pfeil span::after{content:"";position:absolute;left:50%;top:100%;width:2px;height:16px;margin-left:-1px;background:var(--orange-600)}
.iw-stat-pfeil::after{content:"";margin-top:16px;border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid var(--orange-600)}
.iw-buehne .iw-histo{margin:0;display:grid;grid-template-columns:auto minmax(48px,1fr) auto;gap:8px 8px;align-items:center;width:100%;max-width:300px;padding:10px 12px 12px;border:1.5px solid #9fb1be;border-radius:10px;background:#fff;font-family:var(--mono);font-size:.74rem;color:var(--ink-2)}
.iw-histo-z{display:contents}
.iw-histo-t{grid-column:1 / 3;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.iw-histo-tn{grid-column:3;text-align:right}
.iw-histo-k{white-space:nowrap}
.iw-histo-b{height:16px;border-radius:4px;background:var(--blue-50);overflow:hidden}
.iw-histo-b i{display:block;height:100%;border-radius:4px;background:var(--blue-300)}
.iw-histo-n{text-align:right;font-weight:600;color:var(--ink)}
/* Kopf: Mini-Seitenbild „Wohin mit der 25?“ */
.iw-karte-bild{--iw-platz:clamp(26px,2.6vw,38px);--iw-luft:4px}
.iw-karte-bild .iw-seiten{gap:16px 20px}
.iw-dunkel{padding-top:calc(var(--iw-platz) + 30px)}
.iw-schwebt{position:absolute;top:0;left:50%;display:flex;width:var(--iw-platz);height:var(--iw-platz);margin-left:calc(var(--iw-platz) / -2)}
.iw-schwebt::after{content:"";position:absolute;left:50%;top:calc(100% + 5px);height:16px;border-left:2px dashed rgba(240,125,26,.75)}
.iw-dunkel .iw-seite{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.3)}
.iw-dunkel .iw-seite-nr{color:#9fb7c8}
.iw-dunkel .iw-frei{background:transparent;border-color:rgba(255,255,255,.26)}
.iw-dunkel .iw-e{background:rgba(156,203,234,.16);border-color:rgba(156,203,234,.38);color:#fff}
.iw-dunkel .iw-e.iw-neu{background:var(--orange);border-color:var(--orange);color:#fff}
.iw-karte-frage{margin:16px 0 12px;font-family:var(--display);font-weight:600;font-size:clamp(1.4rem,2vw,1.75rem);line-height:1.15;color:#fff;text-align:center}
.iw-karte-bild .iw-karte-q{text-align:center}
@media (max-width:960px){.iw-karte-bild{--iw-platz:clamp(26px,5vw,38px)}}
@media (max-width:640px){
  .iw-bild{--iw-platz:28px;--iw-luft:3px}
  .iw-buehne{gap:18px 12px}
  .iw-buehne.iw-spalten{--iw-platz:26px;gap:0 8px}
  .iw-seite{padding:2px 4px 5px;border-radius:8px}
  .iw-seiten{gap:14px 10px}
  .iw-luecke{margin-left:22px}
  .iw-luecke::before{left:-17px}
  .iw-buehne .iw-weg{font-size:.66rem;gap:4px}
  .iw-weg-e{padding:2px 7px}
  .iw-ergebnis b{font-size:.98rem}
  .iw-knoepfe{width:100%;justify-content:space-between}
}
/* Bild 9: zwei beschriftete Wirkungspfade, unter beiden Spalten */
.iw-buehne.iw-bild9{grid-auto-flow:row;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px 16px}
.iw-bild9 .iw-pfade{grid-column:1 / -1;display:grid;gap:10px;padding-top:14px;border-top:1px dashed var(--line)}
.iw-buehne .iw-pfad{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:0;font-family:var(--mono);font-size:.78rem;line-height:1.3;color:var(--ink)}
.iw-pfad-k{flex:0 0 7.5em;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.iw-pfad-s{padding:4px 10px;border-radius:999px;border:1.5px solid var(--blue);background:#fff;font-weight:600}
.iw-pfad-k + .iw-pfad-s{background:var(--orange-600);border-color:var(--orange-600);color:#fff}
.iw-pfad-p{color:var(--orange-600);font-weight:700}
.iw-bild9 .iw-feld{gap:14px}
@media (max-width:480px){.iw-buehne.iw-bild9{grid-template-columns:minmax(0,1fr)}.iw-pfad-k{flex-basis:100%}}

/* Vergleichsbilder (Bild 6, 8, 9) unter 480 px untereinander statt nebeneinander */
@media (max-width:480px){
  .iw-buehne.iw-spalten{--iw-platz:30px;grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:minmax(0,1fr);gap:22px 0}
  .iw-spalten .iw-feld + .iw-feld{border-left:0;border-top:1px dashed var(--line);padding-top:18px}
  .iw-spalten .iw-seiten{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:16px 12px}
  .iw-mit-warte.iw-spalten .iw-seiten{row-gap:16px}
  .iw-spalten .iw-luecke{margin-top:0;margin-left:22px}
  .iw-spalten .iw-luecke::before{content:"…";left:-17px;top:50%;transform:translateY(-50%)}
  .iw-knoepfe .btn{flex:1 1 100%}
}

/* Bewegung reduziert: keine Farb- und Rahmenübergänge (die Schritte selbst wechseln ohne Bewegung, indexwartung-seiten.js) */
@media (prefers-reduced-motion:reduce){.iw-e,.iw-weg-e,.iw-seite-nr,.iw-seite,.iw-knoepfe .btn{transition:none}}

/* Druck: Bedienung ausblenden, Bilder im Endzustand (Skript beim Drucken), Schritte als Text */
@media print{
  .iw-steuerung,.iw-alle summary{display:none}
  .iw-alle,.iw-alle[open]{display:block}
  .iw-fig{break-inside:avoid}
  .iw-e,.iw-weg-e,.iw-seite{transition:none}
  .iw-breit{display:block}.iw-schmal{display:none}
}

/* Seitenbausteine seit dem Review vom 07.10.2026 (alle drei Teile) */
/* Teil 1 „Worum es geht“: Kasten mit drei Sätzen statt sieben Karten */
.iw-kurz{margin:26px 0 0;padding:22px 26px;border-radius:var(--radius);background:var(--blue-50);border:1px solid var(--line);max-width:900px}
.iw-kurz ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.iw-kurz li{position:relative;padding-left:30px;font-size:1.02rem;line-height:1.5;color:var(--ink-2)}
.iw-kurz li::before{content:"";position:absolute;left:4px;top:.55em;width:12px;height:12px;border-radius:3px;background:var(--orange)}
.iw-kurz li b{color:var(--ink)}
/* Zusammenfassung am Ende: ruhige Liste */
.iw-zusammen{margin:8px 0 0;padding-left:1.2em;color:var(--ink-2)}
.iw-zusammen li{margin-bottom:8px;padding-left:4px}
.iw-zusammen li::marker{color:var(--blue-300)}
/* Herkunft und weiterführende Arbeiten: dezent, kein Zitatkasten */
.iw-herkunft .article > h2{font-size:clamp(1.3rem,2vw,1.6rem)}
.iw-herkunft .article p{font-size:.95rem}
/* Leitlinie: ruhiger als der frühere Merksatz */
.iw-leitlinie{margin:18px 0 26px;padding:14px 0 14px 18px;border-left:4px solid var(--blue);font-family:var(--display);font-weight:600;font-size:clamp(1.12rem,1.7vw,1.35rem);line-height:1.3;color:var(--ink)}
.iw-leitlinie p{margin:0;color:var(--ink) !important}
/* Vertiefung: optisch abgesetzter Abschnitt (Teil 2 strategien, Teil 3 intervalle und theorie) */
.iw-vertiefung{background:var(--blue-50)}
.iw-vertiefung .article{border-left:3px dashed var(--blue-300);padding-left:24px}
.iw-vt-k{display:block;width:max-content;margin-bottom:10px;padding:3px 10px;border-radius:999px;border:1px solid var(--blue-300);background:#fff;font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.iw-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:560px){.iw-vertiefung .article{padding-left:16px}}
/* Teil 3, Grafik 4: Zusatzskizze alte Seiten mit Reserve, neue volle Seiten am Ende (im SVG) */
.iw-svg .sk-alt{fill:#fff;stroke:#9fb1be;stroke-width:1.5}
.iw-svg .sk-voll{fill:var(--blue-300)}
/* Linien zusätzlich über Linienart und Symbol unterscheidbar (Review 6.2/6.3) */
.iw-svg .gestr{stroke-dasharray:8 5}
.iw-svg .punktiert{stroke-dasharray:2 4}
.iw-svg .pt-hohl-o{fill:#fff;stroke:var(--orange);stroke-width:2}
.iw-svg .pt-hohl-b{fill:#fff;stroke:var(--blue);stroke-width:2}
.iw-svg .pt-hohl-g{fill:#fff;stroke:#8aa0af;stroke-width:2}
.iw-lesen{margin:0 0 12px;font-size:.92rem;line-height:1.45;color:var(--ink-2)}
.iw-lesen b{color:var(--ink)}
.iw-svg .rahmen{fill:none;stroke:var(--line);stroke-width:1.2}
.iw-svg .detail{fill:var(--blue-50)}
.iw-svg .t-detail{fill:var(--blue);font-weight:600;letter-spacing:.06em}
.iw-svg .fenster{fill:var(--blue-100);opacity:.7}
.iw-svg .zone-b{fill:none;stroke:var(--orange-600);stroke-width:1.2;stroke-dasharray:3 3}