/* C11 Skript-Bestandsaufnahme: Nummer | Originalzeile | Inhalt vorher (UTF-8 Bytes) | Zweck | Ablage 1 | 5 | 239 | Adresssprache | inline: Anfangszustand/Sprache/Daten/Reihenfolge 2 | 8 | 422 | Sprachspeicher | inline: Anfangszustand/Sprache/Daten/Reihenfolge 3 | 240 | 607 | JSON-LD Seite | inline: Anfangszustand/Sprache/Daten/Reihenfolge 4 | 331 | 594 | Fruehe Kopfmasse | inline: Anfangszustand/Sprache/Daten/Reihenfolge 5 | 354 | 172 | Anfangssprache | inline: Anfangszustand/Sprache/Daten/Reihenfolge 6 | 474 | 1097 | Globale Sprachwahl | inline: Anfangszustand/Sprache/Daten/Reihenfolge 7 | 500 | 21624 | Canvas-Simulation | inline: Anfangszustand/Sprache/Daten/Reihenfolge 8 | 1340 | 0 | Externe Kanten | bestehender externer Verweis 9 | 1380 | 2411 | Bewegungspause/html-Klasse | inline: Anfangszustand/Sprache/Daten/Reihenfolge 10 | 1435 | 3248 | Pausierbare Animationsuhr | inline: Anfangszustand/Sprache/Daten/Reihenfolge 11 | 1837 | 0 | Externer Bildretter | bestehender externer Verweis 12 | 1843 | 583 | Schildsprache | inline: Anfangszustand/Sprache/Daten/Reihenfolge Kein Skript ausgelagert: Canvas/Pause/Uhr und Sprachlogik bleiben in Reihenfolge. */ /* C11 Stil-Bestandsaufnahme: Nummer | Originalzeile | Inhalt vorher (UTF-8 Bytes) | Zweck | Ablage 1 | 40 | 7592 | Grundgestaltung und lokale Schriften | inline: relative Pfade/Bildvariablen/noscript/Reihenfolge 2 | 262 | 1136 | Medienkennzeichnung | extern 3 | 291 | 82 | Mobile Knopfabstaende | extern 4 | 292 | 132 | Kennzeichengroesse | extern 5 | 293 | 200 | Pauseknopf und Zahlenausrichtung | extern 6 | 294 | 16 | Linkfarbe | extern 7 | 295 | 1082 | Mobile Bild- und Videohoehen | extern 8 | 317 | 580 | Hinweisleiste | extern 9 | 326 | 165 | Kopfzeilen-Position | extern 10 | 370 | 1060 | Einleitungsanzeige | extern 11 | 1223 | 1669 | Lesbarkeit | extern 12 | 1261 | 1010 | Druckdarstellung | extern 13 | 1279 | 549 | Tastaturfokus und Sprunglink | extern 14 | 1289 | 2741 | Fette lokale Schriften | extern 15 | 1311 | 1286 | Mobile Schriftgroessen | extern 16 | 1342 | 783 | Kopfzeilen-Verlauf | extern 17 | 1361 | 1168 | Pauseknopf | extern 18 | 1516 | 521 | Animationen pausieren | extern 19 | 1527 | 744 | Tastaturfokus | extern 20 | 1546 | 1525 | Mobile Abstaende und Umbrueche | extern 21 | 1579 | 10546 | Druckregeln | extern 22 | 1807 | 190 | Touch- und Schriftverhalten | extern 23 | 1812 | 656 | Umbrueche und Scrollgrenzen | extern 24 | 1823 | 444 | Kontrastmodi | extern */ /* Original-Stilblock 2, Zeile 262; 1136 Bytes. */ /* KI-KENNZEICHNUNG - kanonische Fassung (EU-KI-Verordnung Artikel 50). Eine einzige Gestalt auf allen Seiten: volle Deckkraft, 17 Pixel, eigene Ruhe-Platte. Die Platte sitzt am Rahmen (div), nicht am Absatz - so bleibt die Sprach-Umschaltung jeder Seite unangetastet, auch wenn sie den Absatz auf inline stellt (das war der Layout-Bruch im Deutsch-Modus). Das !important ist noetig, weil aeltere Fassungen die Deckkraft direkt am Element auf 72 Prozent gedimmt hatten - die blasseste Zeile der Seite. */ .ki-kennzeichnung-platte{ margin:18px auto 6px; max-width:900px; flex-basis:100%; text-align:center; padding:12px clamp(16px,3vw,28px) 14px; border-radius:18px; background:radial-gradient(118% 150% at 50% 50%, rgba(6,9,15,.90) 0%, rgba(6,9,15,.85) 56%, rgba(6,9,15,.58) 82%, rgba(6,9,15,0) 100%); } .ki-kennzeichnung-platte p{ opacity:1 !important; font-size:17px !important; line-height:1.5; color:#b6b1a4 !important; background:none !important; padding:0 !important; margin:0 auto !important; } .ki-kennzeichnung-platte p span{ opacity:1 !important; color:inherit !important; } /* Original-Stilblock 3, Zeile 291; 82 Bytes. */ @media (max-width:600px){a.scrollcue{bottom:214px;}#bewegung-knopf{bottom:214px;}} /* Original-Stilblock 4, Zeile 292; 132 Bytes. */ .bs-mitte-film::after{opacity:1!important;font-size:16px!important;}.ki-kennzeichnung{opacity:1!important;font-size:16px!important;} /* Original-Stilblock 5, Zeile 293; 200 Bytes. */ .aug-pause-knopf,[data-pause-knopf],button[aria-label*="ause"]{background:rgba(8,11,18,.88)!important;}.pl-glow,.t-glow,[class*="zahl"],[class*="count"]{font-variant-numeric:lining-nums tabular-nums;} /* Original-Stilblock 6, Zeile 294; 16 Bytes. */ a{color:inherit} /* Original-Stilblock 7, Zeile 295; 1082 Bytes. */ /* 07.08.2026 HANDY-BILDER: Hintergrund-Filme wurden ueber die ganze Abschnitts-Hoehe gespannt (bis 3733 Bildpunkte). Ein Querformat-Bild zeigt darin nur 6-21 % seiner Breite - ein sinnloser Streifen, bei Personen sieht man Hals statt Gesicht. Am Handy sitzen sie jetzt oben im Abschnitt mit ruhiger Hoehe. Rechner unveraendert. */ @media (max-width:820px){ .secbg, .k2-ambient, .k2-ambient-wrap, .bs-mitte-film{ height:62svh !important; max-height:62svh !important; bottom:auto !important; } /* der Rest des Abschnitts bekommt einen weichen Auslauf statt harter Kante */ .secbg::after, .k2-ambient::after, .bs-mitte-film::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:38%; background:linear-gradient(180deg, rgba(6,8,12,0), rgba(6,8,12,.92)); pointer-events:none; } /* Held-Bereich: nicht hoeher als ein Bildschirm, sonst wird der Film zum Faden */ .hero.bs-harmonie-hero{ min-height:auto !important; } .hero.bs-harmonie-hero .bg{ height:78svh !important; max-height:78svh !important; bottom:auto !important; } } /* Original-Stilblock 8, Zeile 317; 580 Bytes. */ .rs-banner{position:relative;z-index:60;width:100%;background:rgba(10,12,18,.88);border-bottom:1px solid rgba(201,162,63,.3);text-align:center;padding:6px 12px;} .rs-banner span{font-family:Georgia,'Times New Roman',serif;font-size:16px;letter-spacing:.13em;text-transform:uppercase;color:rgba(233,216,166,.78);} .rs-banner [data-en]{display:none;} .rs-banner [data-de]{display:inline;} html[lang='en'] .rs-banner [data-de], html[data-lang='en'] .rs-banner [data-de]{display:none;} html[lang='en'] .rs-banner [data-en], html[data-lang='en'] .rs-banner [data-en]{display:inline;} /* Original-Stilblock 9, Zeile 326; 165 Bytes. */ .rs-banner{pointer-events:none;} .topbar{top:var(--rs-banner-hoehe, 0px) !important;} #raum-erstsatz{top:calc(var(--rs-kopf-unten, 72px) + 24px) !important;} /* Original-Stilblock 10, Zeile 370; 1060 Bytes. */ #raum-erstsatz{ position:fixed; left:50%; transform:translateX(-50%); top:calc(72px + env(safe-area-inset-top)); z-index:22; width:min(680px, calc(100vw - 32px)); text-align:center; pointer-events:none; font:400 17px/1.6 var(--body,Georgia,'Times New Roman',serif); color:rgba(232,224,206,.94); text-shadow:0 2px 18px rgba(4,10,16,.95), 0 1px 3px rgba(4,10,16,.9); } #raum-erstsatz b{ color:#e0c878; font-weight:600; } @media (max-width:640px){ /* Am Handy bricht die Kopfzeile um ("Zurueck zum Labor" rutscht in die zweite Zeile), deshalb faengt der Text hier tiefer an - sonst laege er auf dem Link. */ #raum-erstsatz{ top:calc(104px + env(safe-area-inset-top)); font-size:16px; line-height:1.55; } } /* Haupt-Ueberschrift nur fuer Vorlese-Programme: die Seite hatte gar keine h1, dadurch begann die Gliederung bei h2. Sichtbar aendert sich nichts. */ .raum-titel-vorlesen{position:absolute;width:1px;height:1px;margin:-1px;padding:0; overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;} /* Original-Stilblock 11, Zeile 1223; 1669 Bytes. */ /* LESBARKEITS-SCHILD 27.07. — Hintergruende, Filme und Farben bleiben UNANGETASTET. Nur die Schrift: kleine Groessen auf mindestens 17 Pixel, Staerke 500 (echte Datei da, 600 waere gefaelschtes Fett), und ein enger Licht-Schild direkt hinter den Buchstaben. */ :root{ --les-tief:12,6,5; } body p, body li, body dd, body dt, body figcaption, body blockquote, body td, body th, body small, body summary, body p span, body li span, body p em, body p strong, body p a, body .lede, body .sub, body .eyebrow, body .kicker, body .caption, body .hinweis{ font-size:max(17px, 1em); font-weight:500; text-shadow: 0 0 1px rgba(var(--les-tief), .98), 0 1px 2px rgba(var(--les-tief), .95), 0 0 7px rgba(var(--les-tief), .92), 0 0 15px rgba(var(--les-tief), .80), 0 0 26px rgba(var(--les-tief), .55); } body h1, body h2, body h3, body h4, body h5, body h6{ text-shadow: 0 0 2px rgba(var(--les-tief), .96), 0 2px 5px rgba(var(--les-tief), .92), 0 0 12px rgba(var(--les-tief), .85), 0 0 24px rgba(var(--les-tief), .70), 0 0 44px rgba(var(--les-tief), .45); } /* Menue, Knoepfe, Siegel: ausgenommen, die haben schon einen eigenen Grund */ nav p, nav li, nav a, header li, header a, .wg-nav li, .wg-nav a, .ml-topbar li, .ml-topbar a, button, .btn, .cta, [class*="siegel"], [class*="seal"], [class*="badge"]{ font-size:inherit; font-weight:inherit; text-shadow:none; } /* Ruhe-Ausgang: wer weniger Bewegung eingestellt hat, bekommt denselben Kontrast */ @media (prefers-reduced-motion:reduce){ body p, body li, body .lede, body .sub{ text-shadow:0 0 1px rgba(var(--les-tief),.95), 0 1px 2px rgba(var(--les-tief),.92); } } /* Original-Stilblock 12, Zeile 1261; 1010 Bytes. */ /* DRUCK-REGELN 27.07. - gelten NUR auf Papier. Ein Ausdruck soll lesbar sein: dunkle Schrift auf weissem Grund, keine Filme, keine Leisten, keine Effekte. */ @media print{ *{animation:none !important;transition:none !important;text-shadow:none !important; box-shadow:none !important;-webkit-mask-image:none !important;mask-image:none !important} html,body{background:#fff !important;color:#111 !important} body *{background-color:transparent !important;background-image:none !important;color:#111 !important} h1,h2,h3,h4,h5,h6{color:#000 !important;-webkit-text-fill-color:#000 !important;background:none !important} a{color:#000 !important;text-decoration:underline} video,canvas,nav,header[class*=intro],.naht-traeger-2607,.naht-weich-2607, [id*=loader],[class*=loader],[class*=veil],[class*=aurora],[class*=ambient], button,.btn,.cta{display:none !important} details{display:block} details > *{display:block !important} img{max-width:80mm !important;height:auto !important} } /* Original-Stilblock 13, Zeile 1279; 549 Bytes. */ /* TASTATUR 27.07.: Sprung-Link (erscheint NUR beim Tab-Druck) + sichtbare Fokus-Markierung. */ .sprung-inhalt{position:fixed;left:14px;top:-60px;z-index:99999;background:#0d0e12;color:#ffd97a; border:1px solid #c9a23f;border-radius:4px;padding:10px 18px;font-size:17px;text-decoration:none; transition:top .2s ease} .sprung-inhalt:focus{top:14px} a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible, input:focus-visible,textarea:focus-visible{outline:2px solid #ffd97a !important;outline-offset:3px !important} /* Original-Stilblock 14, Zeile 1289; 2741 Bytes. */ /* ECHTES FETT 28.07. - vorher verlangte die Gestaltung Fettgrade 600-900, als Datei lagen nur 400/500 vor: der Browser rechnete sich das Fett selbst zusammen (verschmiert). Jetzt liegen echte 600er/700er-Dateien im fonts-Ordner (freie SIL-Lizenz). */ @font-face{font-family:'Cormorant Garamond';font-weight:600;font-style:normal;font-display:swap; src:url('/fonts/cormorant-garamond-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC} @font-face{font-family:'Cormorant Garamond';font-weight:600;font-style:normal;font-display:swap; src:url('/fonts/cormorant-garamond-latin-ext-600-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF} @font-face{font-family:'Cormorant Garamond';font-weight:700;font-style:normal;font-display:swap; src:url('/fonts/cormorant-garamond-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC} @font-face{font-family:'Cormorant Garamond';font-weight:700;font-style:normal;font-display:swap; src:url('/fonts/cormorant-garamond-latin-ext-700-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF} @font-face{font-family:'BsHead';font-weight:600;font-style:normal;font-display:swap;src:url('/fonts/cormorant-garamond-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC} @font-face{font-family:'BsHead';font-weight:600;font-style:normal;font-display:swap;src:url('/fonts/cormorant-garamond-latin-ext-600-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF} @font-face{font-family:'BsHead';font-weight:700;font-style:normal;font-display:swap;src:url('/fonts/cormorant-garamond-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC} @font-face{font-family:'BsHead';font-weight:700;font-style:normal;font-display:swap;src:url('/fonts/cormorant-garamond-latin-ext-700-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF} @font-face{font-family:'BsText';font-weight:600;font-style:normal;font-display:swap;src:url('/fonts/newsreader-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC} @font-face{font-family:'BsText';font-weight:600;font-style:normal;font-display:swap;src:url('/fonts/newsreader-latin-ext-600-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF} @font-face{font-family:'BsText';font-weight:700;font-style:normal;font-display:swap;src:url('/fonts/newsreader-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20AC} @font-face{font-family:'BsText';font-weight:700;font-style:normal;font-display:swap;src:url('/fonts/newsreader-latin-ext-700-normal.woff2') format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF} /* Original-Stilblock 15, Zeile 1311; 1286 Bytes. */ /* HANDY-TYPOGRAFIE 28.07. — Fliesstext am Handy auf Forschungs-Soll (19/1.6). Belege: GOV.UK-Typoskala 19/25 · WCAG 1.4.8 Zeilenhoehe >= 1,5 · WCAG 1.4.12 Textabstand. Nur bis 640 Pixel Breite. Grosse Schrift bleibt gross (max), leise Nebentexte bleiben leise. */ @media (max-width:640px){ body p, body li, body dd, body blockquote, body .body, body .lede, body .sub, body .text, body .absatz{ font-size:max(19px, 1em); line-height:1.62; letter-spacing:.004em; } /* Bewusst leise: Bild-Unterschriften, Fussnoten, Kennzeichnungen, Marken-Zeilen, Siegel-Text */ body figcaption, body small, body .caption, body .hinweis, body .fussnote, body .ki-zeile, body .lebend, body .stand, body .quelle, body .meta, body [class*="siegel"], body [class*="seal"], body [class*="badge"], body [class*="chip"], body nav p, body nav li, body nav a, body footer p, body footer li{ font-size:max(16px, 1em); line-height:1.5; } /* Tipp-Flaechen: Forschungs-Soll 44 Pixel (WCAG-Untergrenze waere 24) */ body nav a, body nav button, body .lang button, body [class*="lang"] button{ min-height:44px; display:inline-flex; align-items:center; } /* Zeilenlaenge: nie mehr als rund 80 Zeichen (WCAG 1.4.8) */ body p, body li{ max-width:72ch; } } /* Original-Stilblock 16, Zeile 1342; 783 Bytes. */ /* KOPF-SAUM 28.07. — Menue-Leiste ohne Kante: Verlauf statt Flaeche, keine Trennlinie, darunter ein weicher Saum, der ins Bild ausblendet. Aendert kein Layout. */ .topbar, .topbar.is-scrolled{ background-color:transparent !important; background-image:linear-gradient(to bottom, rgba(12,6,5,.985) 0%, rgba(12,6,5,.955) 55%, rgba(12,6,5,.86) 84%, rgba(12,6,5,.62) 100%) !important; border-bottom:0 !important; box-shadow:none !important; } .topbar::after{ content:"";position:absolute;left:0;right:0;top:100%;height:34px; pointer-events:none;z-index:-1; background:linear-gradient(to bottom, rgba(12,6,5,.58) 0%, rgba(12,6,5,.26) 46%, rgba(12,6,5,0) 100%); } @media (max-width:640px){ .topbar::after{height:26px} } @media print{ .topbar::after{display:none} } /* Original-Stilblock 17, Zeile 1361; 1168 Bytes. */ /* BEWEGUNG ANHALTEN 28.07. — WCAG 2.2.2 (Pause) + Schutz bei "weniger Bewegung". Leises Gegenstueck zum Nach-oben-Knopf: gleiche Groesse, gleiche Zurueckhaltung. */ #bewegung-knopf{ position:fixed;left:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:60; width:46px;height:46px;border-radius:50%; border:1px solid rgba(255,210,87,.42);background:rgba(10,12,20,.62); color:rgba(255,210,87,.92);font-family:Georgia,'Times New Roman',serif;font-size:16px; letter-spacing:.06em;line-height:1;cursor:pointer; display:flex;align-items:center;justify-content:center; opacity:.85;transition:opacity .35s ease,border-color .35s ease,color .35s ease; -webkit-backdrop-filter:saturate(120%);backdrop-filter:saturate(120%); } #bewegung-knopf:hover,#bewegung-knopf:focus-visible{opacity:1;border-color:rgba(255,210,87,.85);color:#fff} #bewegung-knopf:focus-visible{outline:2px solid rgba(255,210,87,.9);outline-offset:3px} #bewegung-knopf[aria-pressed="true"]{opacity:.95;border-color:rgba(255,210,87,.8)} @media (max-width:640px){ #bewegung-knopf{width:44px;height:44px;left:14px;bottom:14px} } @media print{ #bewegung-knopf{display:none} } /* Original-Stilblock 18, Zeile 1516; 521 Bytes. */ /* Wenn angehalten: auch reine Zeichen-Animationen ruhen lassen, nicht nur Filme */ html.bewegung-aus *, html.bewegung-aus *::before, html.bewegung-aus *::after{ animation-play-state:paused !important; } /* SCHLUSS-KONTROLLE 30.07.: Die Auftakt-Blende der Seite darf NICHT eingefroren werden. Sie beginnt bei Deckkraft 0 - angehalten blieb die ganze Seite unsichtbar. Richtig ist der Endzustand sofort: keine Blende, volle Deckkraft. */ html.bewegung-aus body{ animation:none !important; opacity:1 !important; } /* Original-Stilblock 19, Zeile 1527; 744 Bytes. */ /* FOKUS-RING 30.07.: Die Sprach-Knoepfe stehen in einer Leiste, die alles Ueberstehende abschneidet. Ein Ring AUSSEN am Knopf war deshalb nicht zu sehen. Der Ring liegt jetzt INNEN im Knopf und hat zwei Farben - so hebt er sich sowohl vom dunklen als auch vom hellen (gerade gewaehlten) Knopf klar ab. */ .lang-btn:focus-visible, .langswitch button:focus-visible, .s2lang button:focus-visible, .lang-pills button:focus-visible{ box-shadow: inset 0 0 0 3px #ffd97a, inset 0 0 0 6px #0d0e12 !important; } .lang-btn.active:focus-visible, .langswitch button.active:focus-visible, .s2lang button.active:focus-visible, .lang-pills button.active:focus-visible{ box-shadow: inset 0 0 0 3px #1a1408, inset 0 0 0 6px #ffd97a !important; } /* Original-Stilblock 20, Zeile 1546; 1525 Bytes. */ /* ============================================================ r65-handy · 2026-07-30 · Handy-Feinschliff (Kuerzel: handy) Steht bewusst ganz unten im Seitenkoerper: viele Seiten laden ihre eigenen Stil-Bloecke erst dort nach und wuerden einen Block im Kopf ueberstimmen. Wirkt NUR bis 440 Pixel Bildschirmbreite - am Rechner aendert sich nichts. Drei Ziele: (1) nichts laeuft seitlich aus dem Bild, (2) jede Tipp-Flaeche ist mindestens 44 Pixel hoch, (3) kein Text faellt unter 16 Pixel. ============================================================ */ @media (max-width:440px){ /* Bei 360 Pixel lief der Menue-Knopf halb aus dem Bild. */ .topbar{ column-gap:8px; padding-left:12px; padding-right:12px; } .topbar .brand{ min-width:0; } .langswitch{ column-gap:0; } .langswitch button{ min-width:44px !important; padding-left:5px; padding-right:5px; } .bs-burger, .nav-toggle{ flex:0 0 44px; } /* Tipp-Flaechen mindestens 44 Pixel hoch */ .topbar a, .topbar button, .rueckweg-2807 a, .foot-links a, footer nav a, #seiten-inhalt > a.brand, #seiten-inhalt > a.back, a.scrollcue, a.sprung-inhalt, a.back, .lb-ignite-target > a{ min-height:44px !important; display:inline-flex; align-items:center; box-sizing:border-box; } .bs-burger, .nav-toggle{ min-width:44px !important; justify-content:center; } .rueckweg-2807 a, .lb-ignite-target > a, .foot-links a, footer > a{ display:inline-flex !important; align-items:center; min-height:44px !important; } } /* Original-Stilblock 21, Zeile 1579; 10546 Bytes. */ /* ========================================================================== DRUCK-KANON R85 - 01.08.2026 - eine einzige Regel fuer ALLE Seiten beider Auftritte (augmanitai + ballscience). WIRKT NUR AUF PAPIER. Alles steht in @media print bzw. @page. Am Bildschirm kann sich dadurch nichts aendern. WARUM ES DIESEN BLOCK BRAUCHT (Messung R84, 01.08.2026): Der alte Druck-Reset setzte "body *{background:transparent; color:#111}". Die dunkle Ruhe-Platte steht aber unter "main.wrap > .term-section" - das ist der genauere Selektor, also gewann die Platte. Ergebnis: fast schwarze Schrift auf fast schwarzem Grund, auf 251 von 261 Seiten. Dieser Block steht zuletzt im Dokument UND ist genauer als alles andere: ":root" sechsfach zaehlt wie 6 Klassen und schlaegt damit die genaueste vorhandene Klassen-Regel (5 Klassen). Die neun vorhandenen ID-Regeln, die Hintergrund oder Schriftfarbe mit !important setzen, sind namentlich mitgefuehrt und mit ":root" dreifach ueberboten. ========================================================================== */ @page{ size:A4; margin:18mm 16mm 20mm 16mm; } @media print{ /* --- 1. Grundflaeche: weisses Blatt, dunkle Schrift -------------------- */ :root:root:root:root:root:root:root, :root:root:root:root:root:root:root body{ background:#fff !important; background-image:none !important; color:#111 !important; } /* --- 2. Keine Platten, keine Schleier, keine Leucht-Effekte ----------- Gilt fuer jedes Element und auch fuer die gemalten Zusatz-Ebenen (::before / ::after). Schlaegt auch Stil-Angaben, die direkt im HTML-Tag stehen, weil !important dort gewinnt. */ :root:root:root:root:root:root *, :root:root:root:root:root:root *::before, :root:root:root:root:root:root *::after, :root:root:root #bewegung-knopf, :root:root:root #seiten-inhalt > footer, :root:root:root footer#fuss, :root:root:root footer#fuss p.ki-kennz, :root:root:root #begriff-des-tages > .funke-card, :root:root:root #nn-progress, :root:root:root #coaches::before, :root:root:root #qualifikationen::before, :root:root:root #bs-augmanitai-cta::before{ background:none !important; background-color:transparent !important; background-image:none !important; color:#111 !important; -webkit-text-fill-color:#111 !important; -webkit-background-clip:border-box !important; background-clip:border-box !important; box-shadow:none !important; text-shadow:none !important; filter:none !important; -webkit-filter:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; mix-blend-mode:normal !important; animation:none !important; transition:none !important; -webkit-mask-image:none !important; mask-image:none !important; text-shadow:none !important; } /* --- 3. Ueberschriften richtig schwarz --------------------------------- */ :root:root:root:root:root:root h1, :root:root:root:root:root:root h2, :root:root:root:root:root:root h3, :root:root:root:root:root:root h4, :root:root:root:root:root:root h5, :root:root:root:root:root:root h6, :root:root:root:root:root:root h1 *, :root:root:root:root:root:root h2 *, :root:root:root:root:root:root h3 *{ color:#000 !important; -webkit-text-fill-color:#000 !important; } /* --- 4. Filme, Leinwaende, Stimmungs-Ebenen: raus --------------------- */ video, canvas, iframe, audio, model-viewer, .aug-ambient, .aug-ambient-wrap, .aug-ambient-veil, .aug-ambient-vignette, .aug-field, .aug-aurora, .aug-vignette, .aug-sky, .aug-dust, .aug-comet, .aug-ripple, .aug-welcome-bd, .aug-shimmer, .aug-tilt::after, .nn-bloom, .nn-spark, .nn-click-ring, .wow-spark, .film-grund, .held-schleier, .held-galerie, .kv-backdrop, .bs-ambient-wrap, .bs-ambient-veil, .bs-field, .bs-floodlight, .bs-cone, .bs-cursor-ring, .bs-cursor-trail, .bs-scrollbar, .bs-scroll-ball, .ix-gold-thread, .mb-ripple, .mr-breath, .amb-base, .amb-video-wrap, .amb-veil, .wk2-lightcones, .wk2-sparks-layer, .aug-dustline, [id*="loader"], [class*="loader"], [class*="veil"], [class*="aurora"], [class*="ambient"], #bs-scrollbar, #bs-scroll-ball, #wow-lesefaden-bar, #wk-glut-cones, #aug-nervengold, #aug-faden-marken, #augFieldCanvas, #klang, #buehne, body::before, body::after{ display:none !important; } /* --- 5. Feste Baender sind nicht mehr fest ---------------------------- Alles mit position:fixed wiederholt Chrome sonst auf JEDEM Blatt. Feste Elemente MIT Text werden nur geloest (sie kommen einmal, an ihrer Stelle im Text). Feste Elemente OHNE Text werden ausgeblendet. Beide Listen stammen aus der vollen Inventur ueber alle 261 Seiten vom 01.08.2026 - nicht geraten. */ .topbar, header.topbar, .primary-nav, .bs-mobile-nav, .langswitch, .rueckweg, .toast, footer#fuss, .klang, #fuss, #panel, .introwrap, #intro, #kath-erstsatz, p.hinweis, header.titelblock, #ruheUhr, section.tafel, #schluss, .results-bar, #raum-erstsatz, #hint, a.scrollcue, #bsIntro{ position:static !important; } /* Deko-Ebenen, die ueber der ganzen Seite kleben (kein Text darin) */ [style*="position:fixed"], [style*="position: fixed"], .w4-aura, .aug-ww7-depth, #augwowThread, #lebende-ebene, .aug-nervengold, .wow-lesefaden, .ng-aura, .wn-frame, #nerveVignette, .bg-vignette, .celebrate, #ambientVeil, .nightlayer, .wk-glut-layer, #bsClickWave, #wkRipple, .plm-rail, /* Riesen-Schattenwoerter im Hintergrund: am Bildschirm blass hinter dem Text, auf Papier wuerden sie mitten durch den Fliesstext laufen. */ .aug-ghostword, .ag-ghostword, .roman-ghost, /* Hintergrund-Bildebene im Kopfbereich: liegt frei hinter der Ueberschrift und lief auf Papier mitten durch die Buchstaben (gemessen: BallScience Leistungs-Labor). Der Text darueber bleibt vollstaendig erhalten. */ .hero > .bg, header.hero .bg, .hero-motion-overlay, /* Alle frei liegenden Film-/Bild-Ebenen hinter Ueberschriften (position:absolute, inset:0, pointer-events:none) - gefunden in der vollen Inventur ueber alle 261 Seiten. */ [class*="bg-wrap"], [class*="kino-wrap"], [class*="hero-bg"], .buehne-film, .u6r-cine, .aug-cinema-bg, .amb-wrap, .fb-zoomwrap, .secbg, .faq-hero-media, .bs-mitte-film, .footer-ball, .bs-cta-media, .bs-footer-media, .bs-proof-media{ display:none !important; } /* --- 6. Sprung-Knoepfe und Bedien-Knoepfe: nie mit aufs Blatt --------- Der Knopf "Zum Inhalt springen" stand bisher auf jedem Blatt und verdeckte echten Text. Am Bildschirm bleibt er unveraendert. */ [class*="sprung"], [class*="skip"], [class*="Skip"], a[href="#top"], a[href="#inhalt"], a[href="#main"], a[href="#hauptinhalt"], #bewegung-knopf, .aug-totop, .nav-toggle, .navtoggle, .bs-burger, .augdrop-menu, .augdrop-sum, .druck-knopf, .print-btn, nav, .topbar, header.topbar, .primary-nav, .bs-mobile-nav, .langswitch, button, .btn, .cta, [role="button"]{ display:none !important; } /* --- 7. Inhalte, die erst beim Scrollen erscheinen, sind sichtbar ----- */ .reveal, .wave-reveal, .wow-fade-init, .sz-scene, .aug-reward span, .aug-dustline-armed > *, [data-reveal]{ opacity:1 !important; transform:none !important; visibility:visible !important; } /* --- 8. Seitenumbruch: Ueberschriften bleiben bei ihrem Text ---------- */ h1, h2, h3, h4, h5, h6{ break-after:avoid-page; page-break-after:avoid; break-inside:avoid-page; page-break-inside:avoid; } /* Nur KLEINE Einheiten zusammenhalten - grosse Bloecke duerfen umbrechen, sonst entstehen halbleere Blaetter. */ .cite-box, .card, .funke-card, .qual-card, .beleg, .kn, .punkt, figure, table, blockquote, li, dd, .bw-kachel, .siegel-chip{ break-inside:avoid-page; page-break-inside:avoid; } p{ orphans:3; widows:3; } /* --- 8b. Keine bildschirmhohen Leerflaechen --------------------------- Der Kopfbereich ist am Bildschirm einen ganzen Bildschirm hoch. Auf Papier war dadurch das erste Blatt zur Haelfte leer. Nur der Kopfbereich wird gestaucht - NICHT die Film-Buehnen mitten im Text: dort liegt die Bildunterschrift frei ueber dem Bild und wuerde beim Stauchen wegfallen (gemessen 01.08.2026 auf coaches). */ .aug-hero-stage, .hero, .hero-stage, .bs-hero, .held, .buehne{ min-height:0 !important; height:auto !important; } /* --- 9. Bilder klein halten (Toner) ----------------------------------- */ img, svg{ max-width:80mm !important; height:auto !important; } /* --- 10. Werk-Galerie: Namensliste statt 101 dunkler Bilder ----------- */ .raster{ display:block !important; columns:2; column-gap:10mm; } a.bw-kachel{ display:block !important; border:none !important; } a.bw-kachel img{ display:none !important; } a.bw-kachel span{ text-align:left !important; padding:1px 0 !important; } /* --- 11. Link-Ziele in Klammern --------------------------------------- Ein Ausdruck soll ohne Bildschirm nachvollziehbar sein. Nur im Haupttext, nicht in Navigation und Fusszeilen - sonst quillt es auf. */ main a[href^="http"]::after, article a[href^="http"]::after, main.wrap a[href^="http"]::after{ content:" (" attr(href) ")"; font-size:8.5pt; font-weight:400; word-break:break-all; } nav a::after, .topbar a::after, footer a::after, .foot-links a::after, .footbar a::after, .crumb a::after, .breadcrumb a::after, .term-nav a::after, .rueckweg a::after, .wg-nav a::after, .funnel-line a::after, a.bw-kachel::after, .navi a::after{ content:"" !important; } /* --- 12. Hochzaehl-Zahlen: im Ausdruck die echte Zahl, nicht 0 -------- Die Zahl zaehlt am Bildschirm erst hoch, wenn man hinscrollt. Wer die Seite druckt, ohne dort gewesen zu sein, bekam bisher "0 Jahre". Der richtige Wert steht im Tag als data-count und wird hier ausgegeben. Gemessen 01.08.2026: betrifft nur die vier Zahlen auf coaches (BallScience); alle anderen Zaehler (.fig, .count-hero) drucken bereits richtig. */ .fl-count > .num{ display:none !important; } .fl-count::before{ content: attr(data-count); font-size:24pt; font-weight:500; letter-spacing:.02em; } /* --- 13. Links lesbar, Rahmen dezent ---------------------------------- */ a{ color:#111 !important; text-decoration:underline !important; } details{ display:block !important; } details > *{ display:block !important; } } /* Original-Stilblock 22, Zeile 1807; 190 Bytes. */ /* Runde 131 (05.08.): iPhone-Schrift-Aufblaehen im Querformat aus (text-size-adjust, stand bisher nur auf der Startseite). */ html{-webkit-text-size-adjust:100%;text-size-adjust:100%;} /* Original-Stilblock 23, Zeile 1812; 656 Bytes. */ /* Runde 132b (06.08.): Schrift-Umbruch-Haertung fuer alle Handy-Formate - ausgewogene Ueberschriften-Umbrueche, Silbentrennung fuer lange deutsche Woerter (mit Zurueckhaltungs-Grenzen gegen Trennstrich-Leitern), kein Durchscrollen der Seite hinter dem offenen Handy-Menue. Muster von der augmanitai-Startseite uebernommen. */ h1,h2,h3{ text-wrap:balance; overflow-wrap:break-word; } p,li{ text-wrap:pretty; hyphens:auto; -webkit-hyphens:auto; overflow-wrap:break-word; hyphenate-limit-chars:6 3 3; -webkit-hyphenate-limit-before:3; -webkit-hyphenate-limit-after:3; } .bs-mobile-nav,.bs-mobilenav,.mobile-nav{ overscroll-behavior:contain; } /* Original-Stilblock 24, Zeile 1823; 444 Bytes. */ /* Runde 139 (06.08.): Windows-Kontrast-Themen (forced-colors) und die Nutzer-Einstellung "mehr Kontrast" respektieren - Deko-Schatten weichen, Links werden unterstrichen, Systemfarben behalten das Sagen. */ @media (forced-colors: active){ a{ text-decoration:underline; } *{ text-shadow:none !important; box-shadow:none !important; } } @media (prefers-contrast: more){ a{ text-decoration:underline; } body{ text-shadow:none; } }