/* =========================================================================
   reset.css — Schlanker, moderner CSS-Reset fuer den Spielplatz
   Setzt einen vorhersehbaren, sauberen Ausgangszustand fuer alle Demos.
   ========================================================================= */

/* Box-Model: border-box ueberall, inklusive Pseudo-Elemente. */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Margins zuruecksetzen — Abstaende kommen bewusst aus dem Layout, nicht
   aus Browser-Defaults. */
html,
body,
h1, h2, h3, h4, h5, h6,
p,
figure,
blockquote,
dl, dd,
ul, ol {
  margin: 0;
}

/* Listen ohne Standard-Padding/Bullets, wenn sie eine role bekommen
   (semantisch sauberes Entfernen). */
ul[role="list"],
ol[role="list"] {
  list-style: none;
  padding: 0;
}

/* Volle Hoehe, smoothes Scrollen, kein horizontaler Overflow durch
   Reset-Eigenheiten. */
html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  min-height: 100svh;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Medien blocken & nie ueber ihren Container hinauslaufen. */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Formular-Elemente erben Typo statt eigener UA-Schrift. */
input,
button,
textarea,
select {
  font: inherit;
  color: inherit;
}

button {
  cursor: pointer;
  background: none;
  border: none;
}

/* Lange Woerter brechen sauber statt das Layout zu sprengen. */
p,
h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

/* Sichtbarer, akzentuierter Fokus-Ring — nur bei Keyboard-Navigation. */
:focus-visible {
  outline: 2px solid var(--accent, #6c5ce7);
  outline-offset: 2px;
  border-radius: var(--radius-sm, 8px);
}

/* UA-Default-Outline entfernen, wenn :focus-visible greift. */
:focus:not(:focus-visible) {
  outline: none;
}

/* Sicherheitsnetz: Bewegungs-empfindliche Nutzer global daempfen.
   Demos sollten das respektieren, aber dies faengt Ausreisser ab. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}