/* CurioSignals · helles Gestaltungssystem (freigegebene Fraunces-Referenz vom 06.10.2026).
   Papierweiß, dunkle Schrift, Zinnober nur als sparsamer Akzent für Linien, Punkte und Markierungen. */

/* ---------- Schriften: alle lokal ausgeliefert ---------- */
@font-face {
  /* Dieselbe statische Fraunces-Bold-Datei wie in design/curiosignals-fraunces-reference.html. */
  font-family: 'CurioFraunces'; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url('assets/fraunces-bold.woff2') format('woff2');
}
@font-face {
  font-family: 'Roboto Flex'; font-style: normal; font-weight: 100 900; font-stretch: 75% 151%; font-display: swap;
  src: url('assets/roboto-flex-latin.woff2') format('woff2');
}
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('assets/jetbrains-mono-regular.woff2') format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('assets/jetbrains-mono-medium.woff2') format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 700; font-display: swap; src: url('assets/jetbrains-mono-bold.woff2') format('woff2'); }

/* ---------- Gestaltungsgrößen ---------- */
:root {
  --paper: #f5f1e8;
  --paper-deep: #ece6d9;
  --paper-light: #fbf9f4;
  --ink: #201f1d;
  --muted: #5b534d;
  --line: #d6cfc1;
  --line-strong: #201f1d;
  --panel: #fbf9f4;
  --accent: #ff4a1c;          /* Linien, Punkte, Balken – nie für kleinen Text */
  --accent-ink: #b8300b;      /* Zinnober für kleine Texte, Kontrast 5,4:1 auf Papier */
  --serif: 'CurioFraunces', Georgia, 'Times New Roman', serif;
  --sans: 'Roboto Flex', Arial, Helvetica, sans-serif;
  --mono: 'JetBrains Mono', 'Courier New', monospace;
  --space: clamp(20px, 4.5vw, 80px);
  --home-space: var(--space);
  --measure: 720px;
  color-scheme: light;
}
/* Dunkelmodus: umschaltbare Ergänzung (Schalter in der Kopfzeile, Auswahl über curio-theme.js).
   Gleiche Schriften, gleiches Layout, gleicher Zinnober; nur die Flächen- und Textwerte wechseln.
   Kontraste auf #171614: Schrift 15:1, gedämpft 7,8:1, Zinnober 5,4:1, Zinnober-Text 7:1. */
:root[data-theme="dark"] {
  --paper: #171614;
  --paper-deep: #1f1d1a;
  --paper-light: #22201c;
  --ink: #efe9dc;
  --muted: #b2a99a;
  --line: #3a3630;
  --line-strong: #efe9dc;
  --panel: #22201c;
  --accent: #ff4a1c;
  --accent-ink: #ff7a55;
  color-scheme: dark;
}

/* ---------- Grundlagen ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; }
html { background: var(--paper); color: var(--ink); -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; scroll-padding-top: 20px; }
body {
  min-height: 100vh; background: var(--paper); color: var(--ink);
  font-family: var(--sans); font-size: 17px; line-height: 1.6; font-variation-settings: 'wdth' 100;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden;
}
img, svg, video, canvas, audio { display: block; max-width: 100%; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 4px; }
a:hover { text-decoration-color: var(--accent); }
button, input, textarea, select { color: inherit; }
button, summary, label[for], [role="button"] { cursor: pointer; }
strong, b { font-weight: 650; }
em, i { font-style: italic; }
ol, ul { padding-left: 1.35em; }
p { margin: 0 0 1.2em; }
::selection { background: var(--ink); color: var(--paper); }
main:focus { outline: none; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
h1, h2, h3, .serif { font-family: var(--serif); font-weight: 600; letter-spacing: -.015em; line-height: 1.12; color: var(--ink); text-wrap: balance; }
h1 { letter-spacing: -.025em; }
[hidden] { display: none !important; }

.skip-link { position: fixed; top: 10px; left: 16px; z-index: 100; padding: 10px 14px; background: var(--ink); color: var(--paper); text-decoration: none; transform: translateY(-200%); }
.skip-link:focus { transform: none; }

/* Kleine Metadaten: Monoschrift in Großbuchstaben. */
.preview-bar, .home-kicker, .section-topline > span, .draft-note, .home-cover small, .article-meta,
.source-ref, .footer-bottom, .curio-hero-head, .curio-hero-note, .simple-block > span, .back-link {
  font-family: var(--mono); font-weight: 500; font-size: 12px; line-height: 1.65; letter-spacing: .1em; text-transform: uppercase;
}

/* ---------- Vorschauhinweis (nur lokale Fassung) ---------- */
.preview-bar { display: flex; justify-content: space-between; gap: 16px; padding: 10px var(--space); background: var(--paper-deep); color: var(--muted); border-bottom: 1px solid var(--line); }
.preview-bar span:first-child { color: var(--accent-ink); }

/* ---------- Kopfzeile ---------- */
.magazine-header { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 32px; padding: 22px var(--space); border-bottom: 1px solid var(--line); position: relative; z-index: 4; }
.magazine-brand { display: inline-flex; align-items: baseline; font-family: var(--serif); font-weight: 600; font-size: clamp(26px, 2.6vw, 34px); line-height: 1; letter-spacing: -.03em; text-decoration: none; white-space: nowrap; color: var(--ink); }
.brand-dot { display: inline-block; width: .2em; height: .2em; margin-left: .08em; border-radius: 50%; background: var(--accent); }
.magazine-header nav:not(.language-switch) { display: flex; flex-wrap: wrap; gap: 0 clamp(16px, 2vw, 30px); font-size: 16px; }
.magazine-header nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 4px 0; text-decoration: none; white-space: nowrap; border-bottom: 2px solid transparent; }
.magazine-header nav a:hover { border-bottom-color: var(--line-strong); }
.magazine-header nav a[aria-current] { border-bottom-color: var(--accent); }
.magazine-header .language-switch { display: flex; gap: 14px; margin-left: auto; font-family: var(--mono); font-size: 12px; letter-spacing: .06em; }
.language-switch a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; white-space: nowrap; color: var(--muted); }
.language-switch a[aria-current="page"] { color: var(--ink); text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 6px; }

/* Hell/Dunkel-Schalter: beschriftet, Zustand über aria-pressed; ohne JavaScript ausgeblendet. */
.theme-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 2px; background: transparent; color: var(--muted); font-family: var(--mono); font-size: 12px; letter-spacing: .06em; white-space: nowrap; }
.theme-toggle:hover, .theme-toggle[aria-pressed="true"] { color: var(--ink); }
.theme-toggle-track { position: relative; width: 30px; height: 16px; border: 1.5px solid currentColor; border-radius: 10px; flex-shrink: 0; }
.theme-toggle-track::after { content: ''; position: absolute; top: 2px; left: 2px; width: 9px; height: 9px; border-radius: 50%; background: currentColor; transition: transform .2s ease; }
.theme-toggle[aria-pressed="true"] .theme-toggle-track::after { transform: translateX(14px); background: var(--accent); }
.magazine-header .theme-toggle { margin-left: 4px; }

/* ---------- Startseite: Titel „Aus dem Rauschen“ ---------- */
#viewHome { display: block; }
.curio-hero { --curio-gap: clamp(46px, 6vw, 74px); position: relative; isolation: isolate; overflow: hidden; border-bottom: 1px solid var(--line); container-type: inline-size; }
.curio-hero-head { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; padding: 22px var(--space) 0; color: var(--muted); }
.curio-hero-head span:first-child { color: var(--ink); }
.curio-stage { position: relative; height: clamp(300px, 34vw, 430px); }
.curio-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.curio-title { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--curio-gap); padding: 0 16px; text-align: center; }
.curio-title h1 { margin: 0; font-size: clamp(42px, 13cqw, 156px); line-height: 1.05; letter-spacing: -.03em; white-space: nowrap; }
.curio-word { position: relative; display: block; padding: 5px 0; }
.curio-reserve { display: block; }
.curio-face { position: absolute; inset: 5px 0 auto; display: none; white-space: nowrap; text-align: left; }
.curio-face > span { display: inline-block; }
/* Erst wenn das Skript die Buchstaben vermessen hat, ersetzt die animierbare Ebene den lesbaren Text.
   Der Originaltext bleibt für Screenreader und Textauswahl im Dokument. */
.curio-hero.is-ready .curio-reserve { color: transparent; }
/* Mit Skript und erlaubter Bewegung startet der Titel verborgen; Sicherheitsnetz nach 2,5 s. */
@media (prefers-reduced-motion: no-preference) {
  .js .curio-hero:not(.is-ready) .curio-reserve, .js .curio-hero:not(.is-ready) .curio-claim { opacity: 0; animation: curio-failsafe 0s 2.5s forwards; }
  .js .curio-hero:not(.is-ready) .curio-word::after, .js .curio-hero:not(.is-ready) .curio-word::before { opacity: 0; animation: curio-failsafe 0s 2.5s forwards; }
}
@keyframes curio-failsafe { to { opacity: 1; } }
.curio-hero.is-ready .curio-face { display: flex; }
/* Ruhiger Endzustand ohne Skript bzw. bei reduzierter Bewegung: gerade Signallinie mit Punkt.
   Sobald das Skript bereit ist, zeichnet die Leinwand Linie und Punkt an derselben Stelle. */
.curio-word::after { content: ''; position: absolute; left: -10%; right: -10%; top: calc(100% + var(--curio-gap) * .45 - 1px); height: 2px; border-radius: 2px; background: var(--accent); }
.curio-word::before { content: ''; position: absolute; right: calc(-10% - 3px); top: calc(100% + var(--curio-gap) * .45 - 3px); width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.curio-hero.is-ready .curio-word::after, .curio-hero.is-ready .curio-word::before { display: none; }
.curio-claim { font-family: var(--mono); font-size: clamp(13px, 1.25vw, 16px); line-height: 1.5; letter-spacing: .02em; color: var(--muted); margin: 0; text-wrap: balance; }
.curio-hero-foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px 24px; padding: 0 var(--space) 26px; }
.curio-hero-note { color: var(--muted); max-width: 60ch; }
.curio-play { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 11px 19px; border-radius: 24px; background: var(--ink); color: var(--paper); font-size: 14px; line-height: 1.3; }
.curio-play::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }
.curio-play:hover { opacity: .88; }
.curio-play:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }

/* ---------- Startseite: Ausgabe ---------- */
.home-edition { padding: clamp(56px, 7vw, 96px) var(--space) clamp(56px, 7vw, 90px); }
.magazine-purpose { font-family: var(--serif); font-weight: 600; font-size: clamp(24px, 2.6vw, 36px); line-height: 1.3; letter-spacing: -.015em; max-width: 1020px; margin: 0 0 24px; text-wrap: pretty; }
.home-intro { font-size: 18px; line-height: 1.7; max-width: 680px; color: var(--muted); }
.home-intro a { color: var(--ink); }
.home-edition > .home-intro:last-of-type { margin-bottom: clamp(48px, 6vw, 80px); }
.section-topline { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-top: 18px; border-top: 2px solid var(--ink); margin-bottom: 8px; }
.section-topline h2 { font-size: clamp(30px, 3.6vw, 48px); margin: 0; }
.section-topline > span { color: var(--accent-ink); white-space: nowrap; }
.home-kicker { color: var(--muted); margin: 0 0 18px; }
.draft-note { color: var(--muted); max-width: 820px; padding: 4px 0 4px 16px; border-left: 2px solid var(--accent); margin: 18px 0 26px; text-transform: none; letter-spacing: .02em; font-size: 13px; }
.draft-note a { color: var(--ink); }

/* Karten */
.home-covers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 40px; margin: 18px 0 0; }
.home-cover {
  position: relative; display: flex; flex-direction: column; gap: 16px; min-width: 0;
  padding: 28px 0 30px; color: var(--ink); text-decoration: none; border-top: 1px solid var(--line);
}
.home-cover:first-child { grid-column: 1 / -1; padding-bottom: 40px; }
.home-cover:first-child h3 { font-size: clamp(34px, 4.6vw, 64px); max-width: 1000px; }
.home-cover:first-child > span { font-size: 19px; max-width: 760px; }
.home-cover small { color: var(--muted); }
.home-cover small:first-child { color: var(--accent-ink); }
.home-cover h3 { font-size: clamp(26px, 2.6vw, 36px); line-height: 1.12; margin: 0; overflow-wrap: break-word; hyphens: auto; }
.home-cover > span { font-size: 17px; line-height: 1.6; color: var(--muted); max-width: 620px; }
.home-cover .article-audio-card { border: 0; padding: 0; }
.card-link { margin-top: auto; display: flex; align-items: center; gap: 10px; color: var(--ink) !important; }
.card-link::before { content: ''; width: 28px; height: 2px; background: var(--ink); transition: width .25s ease, background .25s ease; }
.home-cover:hover h3 { text-decoration: underline; text-decoration-thickness: 2px; text-decoration-color: var(--accent); text-underline-offset: 6px; }
.home-cover:hover .card-link::before { width: 44px; background: var(--accent); }
.home-cover:focus-visible { outline-offset: -2px; }
.home-all { display: inline-flex; align-items: center; min-height: 44px; margin-top: 18px; font-weight: 600; }

/* Laufband auf der Startseite */
.story-ticker { position: fixed; inset: auto 0 0; z-index: 45; height: 50px; display: flex; align-items: stretch; background: var(--paper-light); color: var(--ink); border-top: 1px solid var(--line); font-family: var(--mono); }
.ticker-label { display: flex; align-items: center; gap: 12px; flex-shrink: 0; padding: 0 20px; font-size: 11px; font-weight: 500; letter-spacing: .12em; border-right: 1px solid var(--line); color: var(--accent-ink); }
.ticker-label span { font-size: 15px; }
.ticker-window { min-width: 0; flex: 1; overflow: hidden; display: flex; align-items: center; }
.ticker-track { display: flex; width: max-content; animation: story-scroll 70s linear infinite; }
.ticker-group { display: flex; flex-shrink: 0; align-items: center; }
.ticker-group a { display: flex; align-items: center; gap: 32px; padding: 10px 16px; text-decoration: none; white-space: nowrap; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
.ticker-group a::after { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); }
.ticker-group a:hover { text-decoration: underline; }
.ticker-toggle { width: 48px; flex-shrink: 0; border-left: 1px solid var(--line); background: transparent; color: var(--ink); font-family: var(--mono); }
.story-ticker:hover .ticker-track, .story-ticker:focus-within .ticker-track, .story-ticker.is-paused .ticker-track { animation-play-state: paused; }
@keyframes story-scroll { to { transform: translateX(-50%); } }

/* ---------- Inhaltsseiten ---------- */
.content-page { max-width: 1240px; margin: 0 auto; padding: clamp(40px, 6vw, 72px) var(--space) clamp(70px, 9vw, 110px); min-height: 60svh; }
.page-intro { margin: 0 0 clamp(40px, 6vw, 64px); max-width: 980px; }
.page-intro h1, .article-header h1 { font-size: clamp(38px, 6vw, 80px); line-height: 1.04; margin: 0 0 26px; overflow-wrap: break-word; hyphens: auto; }
.page-deck { font-size: clamp(19px, 1.8vw, 23px); line-height: 1.6; max-width: 760px; color: var(--muted); }
.back-link { display: inline-flex; align-items: center; min-height: 44px; margin: 0 0 18px; color: var(--muted); text-decoration: none; }
.back-link:hover { color: var(--ink); }
.article-header { max-width: 980px; margin: 18px 0 44px; }
.article-header .home-kicker { color: var(--accent-ink); }
.article-meta { color: var(--muted); text-transform: none; letter-spacing: .02em; font-size: 13px; border-bottom: 1px solid var(--line); padding-bottom: 22px; margin-bottom: 0; }
.article-meta + .article-meta { border-bottom: 0; padding-top: 10px; }
.article-meta a { color: var(--ink); }

.art-body { max-width: var(--measure); font-size: 18px; line-height: 1.75; color: var(--ink); }
.art-body p { margin: 0 0 1.4em; }
.art-body h2 { font-size: clamp(25px, 2.4vw, 32px); line-height: 1.18; margin: 1.9em 0 .7em; }
.art-body h3 { font-size: 22px; line-height: 1.25; margin: 1.4em 0 .5em; }
.art-body ul, .art-body ol { margin: 1em 0 1.8em; }
.art-body li { margin: .55em 0; }
.art-body li::marker { color: var(--muted); }
.art-body a { overflow-wrap: anywhere; text-decoration-color: var(--accent); }
.art-body strong { color: var(--ink); }
.art-body section:first-child > h2:first-child { margin-top: 0; }
.simple-block { margin: 0 0 40px; padding: 22px 26px; background: var(--paper-light); border-left: 3px solid var(--accent); font-size: 20px; line-height: 1.6; }
.simple-block > span { display: block; color: var(--accent-ink); margin-bottom: 10px; }
.simple-block p { margin: 0; }
.briefing-slot { margin: 52px 0; padding: 30px 0 0; border-top: 1px solid var(--line); }
.briefing-slot .home-kicker { color: var(--accent-ink); margin-bottom: 12px; }
.briefing-slot h2 { margin-top: 0; }
.source-ref { font-size: 11px; color: var(--muted); }
.source-ref a { color: var(--ink); }
.source-note { margin-top: 48px; padding-top: 26px; border-top: 2px solid var(--ink); font-size: 15px; line-height: 1.65; color: var(--muted); }
.source-note h2 { font-size: 22px; margin: 0 0 18px; color: var(--ink); }
.source-note li { margin-bottom: 20px; overflow-wrap: anywhere; }
.source-note li a { color: var(--ink); }
.source-note li p { margin-top: 6px; font-size: 15px; }
.editorial-note { margin-top: 44px; padding: 26px 28px; background: var(--paper-deep); font-size: 16px; line-height: 1.7; max-width: 1000px; }
.editorial-note h2 { font-size: 24px; margin: 0 0 12px; }
.editorial-note p:last-child { margin-bottom: 0; }
.text-link { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; text-decoration-color: var(--accent); }
.action-list li { margin-bottom: 26px; }
.uncertainty { border-top: 1px solid var(--line); margin-top: 52px; }

/* Praxis: hervorgehobener Artikel */
.safety-feature { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 56px; align-items: start; border-top: 1px solid var(--line); }
.safety-feature .home-cover, .safety-feature .home-cover:first-child { padding: 30px 0; grid-column: auto; border-top: 0; }
.safety-feature .home-cover h3 { font-size: clamp(32px, 3.8vw, 52px); }
.safety-feature .editorial-note { margin: 30px 0 0; }

/* Über-Seite: Porträt */
.publisher-intro { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 32px; align-items: start; margin-bottom: 12px; }
.publisher-portrait { width: 100%; max-width: 200px; height: auto; aspect-ratio: 1; object-fit: cover; }
.publisher-intro h2 { margin-top: 0; }

/* Kontakt */
.contact-form { margin: 36px 0; }
.contact-form fieldset { min-width: 0; }
.contact-form legend { margin-bottom: 20px; font-family: var(--serif); font-size: 26px; font-weight: 600; }
.contact-form label { display: block; margin: 22px 0 8px; font-weight: 600; }
.contact-form label span { font-weight: 400; color: var(--muted); }
.contact-form input, .contact-form textarea { display: block; width: 100%; padding: 13px 14px; border: 1px solid var(--muted); border-radius: 2px; background: var(--paper-light); font: inherit; }
.contact-form textarea { resize: vertical; }
.contact-form button { margin-top: 8px; min-height: 44px; padding: 12px 20px; border-radius: 24px; background: var(--ink); color: var(--paper); }
.contact-form :disabled { opacity: .6; cursor: not-allowed; }
.contact-form .contact-privacy { font-size: 15px; color: var(--muted); margin-top: 20px; }

/* Spickzettel */
.art-body .steps ol { padding-left: 1.3em; }
.cite { font-family: var(--mono); font-size: .75em; text-decoration: none; color: var(--accent-ink); }

/* ---------- Fußzeile ---------- */
.magazine-footer { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 36px 56px; padding: 56px var(--space) 56px; border-top: 2px solid var(--ink); background: var(--paper-deep); }
.footer-identity .magazine-brand { font-size: 32px; }
.footer-identity p { font-size: 16px; color: var(--muted); margin: 14px 0 0; max-width: 40ch; }
.footer-links { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; font-size: 16px; }
.footer-links a { display: inline-flex; align-items: center; min-height: 40px; text-decoration: none; }
.footer-links a:hover { text-decoration: underline; text-decoration-color: var(--accent); }
.footer-bottom { grid-column: 1 / -1; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; padding-top: 22px; border-top: 1px solid var(--line); color: var(--muted); }
.on-home .magazine-footer { padding-bottom: 110px; }

/* ---------- Comic: Seitenrahmen hell, Bilder und Sprechblasen unverändert ---------- */
.comic-page .content-page { max-width: 1240px; }
.comic-edition { background: transparent !important; color: var(--ink) !important; color-scheme: light !important; font-family: var(--sans) !important; }
.comic-edition .intro { padding-left: 0 !important; padding-right: 0 !important; }
.comic-edition .intro h1 { font-family: var(--serif); font-weight: 600; letter-spacing: -.025em !important; }
.comic-edition .kicker, .comic-edition .who .role, .comic-edition footer, .comic-edition .note { color: var(--muted) !important; font-family: var(--mono) !important; }
.comic-edition .kicker { color: var(--accent-ink) !important; font-size: 12px !important; }
.comic-edition .lead, .comic-edition .ending > p { color: var(--ink) !important; }
.comic-edition .avatar { border-color: var(--line) !important; }
.comic-edition .ending, .comic-edition footer { padding-left: 0 !important; padding-right: 0 !important; border-color: var(--line) !important; }
.comic-edition .paper { border-color: var(--line) !important; }
/* Comic-Papier bleibt in beiden Modi hell; Texte darauf behalten die Comic-Farben. */
.comic-edition .paper h2, .comic-edition .paper strong { color: #111; }

/* ---------- Ansichten ab Tablet abwärts ---------- */
@media (max-width: 900px) {
  .home-covers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .safety-feature { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 700px) {
  body { font-size: 16px; }
  .preview-bar { flex-direction: column; gap: 2px; font-size: 11px; }
  .magazine-header { padding: 16px var(--space) 8px; gap: 4px 20px; }
  .magazine-brand { font-size: 28px; }
  .magazine-header nav:not(.language-switch) { order: 3; width: 100%; gap: 0 18px; font-size: 15px; }
  .magazine-header .language-switch { margin-left: auto; }
  .magazine-header .theme-toggle { order: 2; margin-left: 0; }
  .curio-stage { height: 270px; }
  .curio-hero { --curio-gap: 50px; }
  .curio-claim { max-width: 240px; }
  .home-covers { grid-template-columns: 1fr; }
  .home-cover { padding: 26px 0; }
  .home-cover:first-child h3 { font-size: clamp(32px, 9vw, 44px); }
  .magazine-purpose { font-size: 24px; }
  .art-body { font-size: 17px; line-height: 1.72; }
  .simple-block { font-size: 18px; padding: 18px 18px; }
  .editorial-note { padding: 22px; }
  .publisher-intro { grid-template-columns: 1fr; gap: 20px; }
  .publisher-portrait { max-width: 180px; }
  .magazine-footer { grid-template-columns: 1fr; padding: 44px var(--space) 44px; }
  .on-home .magazine-footer { padding-bottom: 96px; }
  .story-ticker { height: 46px; }
  .ticker-label { padding: 0 12px; }
  .ticker-label span { display: none; }
}

@media (max-width: 360px) {
  .magazine-brand { font-size: 24px; }
  .magazine-header .language-switch { gap: 10px; }
}

/* ---------- Bewegung, Kontrast, Druck ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .ticker-window { overflow-x: auto; }
  .ticker-group[aria-hidden] { display: none; }
  .ticker-toggle { display: none; }
}
@media (forced-colors: active) {
  .brand-dot, .curio-word::after, .curio-word::before, .card-link::before, .ticker-group a::after, .curio-play::before { background: CanvasText; forced-color-adjust: none; }
}
@media print {
  .preview-bar, .story-ticker, .magazine-header nav, .language-switch, .curio-hero-foot, .share-bar { display: none !important; }
  :root, :root[data-theme="dark"] { --paper: #fff; --paper-deep: #fff; --paper-light: #fff; --ink: #201f1d; --muted: #5b534d; --line: #d6cfc1; color-scheme: light; }
}

/* Kurze Artikel-Hörfassungen; Bedienung ohne JavaScript. */
.article-audio { margin: -12px 0 42px; padding: 24px; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); scroll-margin-top: 30px; }
.art-body .article-audio h2 { font-size: 25px; line-height: 1.2; letter-spacing: -.02em; margin: 0; }
.article-audio-top { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:14px; }
.article-audio-duration { font-family:var(--mono); font-size:12px; white-space:nowrap; color:var(--muted); }
.article-audio audio { display:block; width:100%; min-width:0; height:54px; }
.art-body .article-audio .article-audio-caption { color:var(--muted); font-size:13px; margin:12px 0 8px; line-height:1.6; }
.article-audio details { border-top:1px solid var(--line); margin-top:16px; }
.article-audio summary { cursor:pointer!important; font-size:15px; padding:12px 0 0; min-height:44px; }
.article-audio summary:focus-visible, .article-audio audio:focus-visible { outline:2px solid var(--ink); outline-offset:5px; }
.art-body .article-audio details p { font-size:17px; line-height:1.8; margin:14px 0 0; }
.article-audio-card { color:inherit; display:block; padding-top:10px; border-top:1px solid var(--line); }
@media(max-width:400px){ .article-audio { padding:16px; } .art-body .article-audio h2 { font-size:22px; } .article-audio-top { gap:8px; } }

.media-check-promo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 56px;align-items:end;margin:clamp(56px,7vw,90px) 0 0;padding:clamp(28px,4vw,48px);background:var(--paper-deep)}
.media-check-promo .home-kicker{grid-column:1/-1;margin:0;color:var(--accent-ink)}
.media-check-promo h2{font-size:clamp(28px,3.4vw,46px);line-height:1.1;margin:0;grid-row:2/4}
.media-check-promo p:not(.home-kicker){font-size:18px;line-height:1.65;color:var(--muted);margin:0}
.media-check-promo .text-link{grid-column:2}
.media-check{max-width:1120px}
.media-check .art-body{max-width:850px}
.media-check-jumps{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 35px}
.media-check-jumps a{border:1px solid var(--line);padding:12px 18px;text-decoration:none;font-size:16px;line-height:1.5}
.media-check-jumps a:hover{background:var(--panel)}
.media-check :is(a,summary,input):focus-visible{outline:3px solid var(--ink);outline-offset:5px}
.media-check section{scroll-margin-top:30px}
.media-check details{border:1px solid var(--line);background:var(--panel);padding:0 22px;margin:14px 0}
.media-check summary{cursor:pointer;padding:19px 0;font-weight:650;line-height:1.5}
.media-check details p:last-child{margin-bottom:22px}
.media-check .check-list{list-style:none;padding:0;margin:24px 0}
.media-check .check-list li{border-bottom:1px solid var(--line);margin:0;padding:16px 0}
.media-check .check-list label{display:flex;align-items:flex-start;gap:14px;cursor:pointer}
.media-check .check-list input{appearance:auto;flex:0 0 auto;width:21px;height:21px;margin:6px 0 0;accent-color:var(--ink)}
.media-check .check-list label span{min-width:0}
.media-check .check-list small{display:block;color:var(--muted);font-size:15px;line-height:1.6;margin-top:5px}
.media-check-evidence{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:25px 0}
.media-check-evidence>div{border:1px solid var(--line);padding:24px;min-width:0}
.media-check-evidence h3{font-size:23px;line-height:1.25;margin:12px 0 20px}
.media-check-evidence p{font-size:16px;line-height:1.7}
.media-check .check-caption{color:var(--muted);font-size:15px;line-height:1.65}
.media-check .check-tools{list-style:none;padding:0}
.media-check .check-tools>li{border-top:1px solid var(--line);padding:24px 0;margin:0}
.media-check .check-tools h3{font-size:24px;margin:0 0 12px;line-height:1.3}
.media-check .check-tools p{margin-bottom:12px}
.media-check .source-note li{overflow-wrap:anywhere}
@media(max-width:900px){.media-check-promo{grid-template-columns:1fr}.media-check-promo h2{grid-row:auto}.media-check-promo .text-link{grid-column:auto}}
@media(max-width:600px){.media-check-evidence{grid-template-columns:1fr}.media-check-jumps a{flex:1 1 130px;text-align:center}.media-check details{padding:0 17px}}

/* Text labels, native disclosures and no third-party widgets. */
.share-bar { margin:40px 0; padding:24px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.share-bar [hidden] { display:none!important; }
.share-bar h2, .art-body .share-bar h2 { margin:0 0 14px; font-size:19px; line-height:1.4; letter-spacing:0; }
.share-actions { display:flex; align-items:flex-start; flex-wrap:wrap; gap:8px; }
.share-actions a, .share-actions button, .share-actions summary { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:9px 13px; border:1px solid var(--line); border-radius:4px; background:transparent; color:var(--ink); font:inherit; font-size:14px; line-height:1.5; text-decoration:none; cursor:pointer!important; }
.share-actions a:hover, .share-actions button:hover, .share-actions summary:hover { background:var(--panel); border-color:var(--muted); }
.share-actions :focus-visible, .share-fallback input:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.share-actions button:disabled { opacity:.6; cursor:wait!important; }
.share-bar .share-more { border:0; padding:0; margin:0; background:transparent; }
.share-bar .share-more summary { list-style:none; padding:9px 13px; font-weight:400; }
.share-more summary::-webkit-details-marker { display:none; }
.share-more summary::after { content:'+'; margin-left:10px; }
.share-more[open] summary::after { content:'−'; }
.share-more>div { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.share-bar .share-status, .art-body .share-bar .share-status { margin:12px 0 0; font-size:14px; line-height:1.6; color:var(--muted); }
.share-status:empty { display:none; }
.share-fallback { display:block; margin-top:12px; font-size:14px; }
.share-fallback input { display:block; box-sizing:border-box; width:100%; min-height:44px; margin-top:8px; padding:10px; border:1px solid var(--line); background:var(--panel); color:var(--ink); font:inherit; }
.share-bar-inactive .share-status, .art-body .share-bar-inactive .share-status { display:block; margin:0 0 16px; }
.share-bar-inactive .share-actions span { display:inline-flex; align-items:center; min-height:44px; padding:9px 13px; border:1px dashed var(--line); border-radius:4px; color:var(--muted); font-size:14px; }
@media print { .share-bar { display:none; } }
