/* Ansicht und Barrierefreiheit (Knopf in der Kopfzeile, /ansicht.js). Nur Rollen-Variablen aus brand.css, keine neuen Markenfarben;
   Ausnahme: der Modus «Hoher Kontrast» setzt bewusst Schwarz/Weiss. */
.a11y { position: relative; flex: none; }
.a11y[hidden], .a11y-panel[hidden] { display: none; }
.a11y-btn { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.75rem; padding: 0 .7rem; font: 600 .85rem/1 var(--font-body, var(--f-body, inherit)); color: var(--ink-dim); background: transparent; border: 1px solid var(--line); border-radius: var(--radius-sm, 8px); cursor: pointer; }
.a11y-btn:hover, .a11y-btn[aria-expanded="true"] { color: var(--ink); border-color: var(--ink-dim); }
.a11y-btn:focus-visible, .a11y-panel :focus-visible { outline: 3px solid var(--brand); outline-offset: 2px; }
.a11y-btn svg { flex: none; }
.a11y-panel { position: absolute; right: 0; top: calc(100% + .4rem); z-index: 40; width: min(20rem, calc(100vw - 2rem)); display: grid; gap: .8rem; padding: 1rem; background: var(--raise, var(--ground)); color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius-lg, 12px); box-shadow: 0 12px 32px rgba(0, 0, 0, .18); text-align: left; }
.a11y-h { margin: 0; font: 700 1rem/1.3 var(--font-body, var(--f-body, inherit)); }
.a11y-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; font: 400 .92rem/1.35 var(--font-body, var(--f-body, inherit)); cursor: pointer; }
.a11y-row input[type="checkbox"] { width: 1.35rem; height: 1.35rem; flex: none; margin: 0; accent-color: var(--brand); cursor: pointer; }
.a11y-seg { display: inline-flex; border: 1px solid var(--line); border-radius: var(--radius-sm, 8px); overflow: hidden; flex: none; }
.a11y-seg button { min-width: 2.75rem; min-height: 2.75rem; border: 0; background: var(--raise, var(--ground)); color: var(--ink); font-family: var(--font-body, var(--f-body, inherit)); font-weight: 650; cursor: pointer; }
.a11y-seg button + button { border-left: 1px solid var(--line); }
.a11y-seg button[aria-pressed="true"] { background: var(--brand); color: var(--brand-ink); }
.a11y-s0 { font-size: .9rem; } .a11y-s1 { font-size: 1.1rem; } .a11y-s2 { font-size: 1.3rem; }
.a11y-actions { display: flex; gap: .6rem; justify-content: flex-end; flex-wrap: wrap; }
.a11y-act { min-height: 2.75rem; padding: .45rem .9rem; font: 650 .9rem/1.2 var(--font-body, var(--f-body, inherit)); color: var(--brand-ink); background: var(--brand); border: 1px solid var(--brand); border-radius: var(--radius-sm, 8px); cursor: pointer; }
.a11y-act-ghost { color: var(--ink); background: transparent; border-color: var(--line); }
@media (max-width: 40rem) {
  .a11y-btn { padding: 0 .55rem; }
  .a11y-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .a11y-panel { position: fixed; left: 1rem; right: 1rem; top: 4.25rem; width: auto; max-height: calc(100vh - 5.5rem); overflow: auto; }
}

/* Einstellungen (data-Attribute auf <html>) */
:root[data-size="1"] { font-size: 112.5%; }
:root[data-size="2"] { font-size: 125%; }
:root[data-motion="reduce"] { scroll-behavior: auto; }
:root[data-motion="reduce"] *, :root[data-motion="reduce"] *::before, :root[data-motion="reduce"] *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
:root[data-read="1"] body { line-height: 1.85; letter-spacing: .015em; word-spacing: .06em; }
:root[data-read="1"] p, :root[data-read="1"] li, :root[data-read="1"] dd { max-width: 68ch; }
:root[data-links="1"] a { text-decoration: underline !important; text-decoration-thickness: 2px !important; }
:root[data-contrast="high"]:not(#_), :root[data-contrast="high"]:not(#_) body {
  color-scheme: light;
  --ground: #ffffff; --raise: #ffffff; --band: #ffffff; --shade: #ffffff;
  --ink: #000000; --ink-dim: #000000; --ink-faint: #000000; --line: #000000;
  --brand: #0b3d2e; --brand-ink: #ffffff; --brand-soft: #e8f0ec; --accent: #0b3d2e; --accent-ink: #ffffff;
  --glass: #ffffff; --glass-lift: #e8f0ec;
}
:root[data-contrast="high"] .top, :root[data-contrast="high"] .foot { border-color: #000000; }
:root[data-contrast="high"] :focus-visible { outline: 3px solid #000000 !important; outline-offset: 3px; box-shadow: 0 0 0 6px #ffffff; }

/* Schmale Telefone: Platz für den Knopf in der Kopfzeile (start.css-Seiten), Ziele bleiben >= 29 px (WCAG 2.5.8: 24 px) */
@media (max-width: 26rem) {
  .top-in:has(.a11y) { gap: var(--space-1); }
  .top-in:has(.a11y) nav.lang a { min-width: 1.85rem; }
  .top-in:has(.a11y) .btn-sm { padding-inline: var(--space-3); }
  .top-in .a11y-btn { padding: 0 .45rem; }
}