Barrierefreiheit

helpers/a11y.css plus Prinzipien, die sich durch das gesamte System ziehen statt in einer einzelnen Datei zu stecken.

Klassen

Klasse	Zweck
`.ncss-visually-hidden`	Für Screenreader lesbar, visuell ausgeblendet
`.ncss-visually-hidden-focusable`	Wie oben, wird aber bei Tastaturfokus sichtbar
`.ncss-skip-link`	"Zum Inhalt springen"-Link, sichtbar erst bei Fokus - auf jeder Seite direkt nach `<body>`. Versteckt per `translate` um die eigene Höhe, bleibt dadurch auch bei großer Schrift/Zeilenhöhe und 200 % Textzoom vollständig außerhalb des Bildes

<body>
  <a href="#main" class="ncss-skip-link">Zum Inhalt springen</a>
  <header class="ncss-topbar">...</header>
  <main id="main">...</main>

  <button type="button">
    <span class="ncss-icon ncss-icon-search" aria-hidden="true"></span>
    <span class="ncss-visually-hidden">Suche öffnen</span>
  </button>

Durchgängige Prinzipien

Native Elemente zuerst - <dialog>, <details>, <fieldset>, <progress>/<meter> bringen Tastatursteuerung, Fokus-Management und Rollen kostenlos mit, ohne ARIA-Nachbau.
:focus-visible bleibt immer ungated - anders als :hover, das nur bei echten Zeigegeräten aktiv ist (siehe Touch & mobile Viewports).
prefers-reduced-motion wird global respektiert (*-Selektor schließt html mit ein) - keine Animation muss das einzeln selbst prüfen.
Farbkontrast ist Teil der Token-Palette: -on-soft-Textfarben je Familie sind gegen ihre eigene -100-Fläche geprüft, nicht geraten (siehe Farben & Flächen).
.ncss-table-stacked ist die eine bewusste Ausnahme - bricht programmatische Tabellensemantik zugunsten der Lesbarkeit auf schmalen Screens, siehe Bekannte Grenzen.