/* Paarklang – Markenfarben (nur Variablen, Kontrastwerte in DESIGN.md) */
:root {
  --marke: #7a3b5e;
  --marke-dunkel: #5c2a46;
  --marke-hell: #f5e9ef;
  --akzent: #c7782c;
  --flaeche: #f8f3f0;
  --radius: 14px;
}
/* App-Seite: Antwortknöpfe gleich breit und gleich gestaltet (kein Nein in Rot, Sprachleitfaden Regel 4) */
.antworten { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); max-width: 40rem; }
.antworten .btn { width: 100%; }
.app-karte { max-width: 40rem; font-size: 1.35rem; font-family: var(--schrift-kopf); line-height: 1.35; min-height: 9rem; display: flex; flex-direction: column; justify-content: center; }
.linkfeld { font-family: var(--schrift-mono); font-size: .8rem; word-break: break-all; max-height: 7rem; overflow: auto; background: var(--flaeche); padding: .75rem; border-radius: var(--radius-klein); max-width: 40rem; }
#ansicht h1:focus, #ansicht h2:focus { outline: none; } /* Fokus nur für Screenreader-Ansage gesetzt */
h1, h2 { hyphens: auto; overflow-wrap: break-word; } /* lange deutsche Wörter (z. B. „Datenschutzerklärung“) bei 390 px */