/* ===========================================================================
   RADIUS & SHADOW — Onda
   13px Buttons, 16px Kacheln – nur der Icon-Button ist rund.
   GENERIERT aus tokens.json – nicht von Hand ändern (build-tokens.py).
   =========================================================================== */
:root {
  /* --- Corner radii --- */
  --onda-radius-button:            13px;                         /* primär/sekundär Buttons */
  --onda-radius-textknopf:         8px;                          /* Textknöpfe für Erwachsene (Elternbereich, Code-Eingabe, Website), flacher als der Symbol-Knopf; Jan-Philip 17.09./28.09.2026 */
  --onda-radius-chip:              11px;                         /* kleine Pills / Tags */
  --onda-radius-tile:              16px;                         /* Laut-Kachel */
  --onda-radius-card:              18px;                         /* Inhalts-/Hör-Karten */
  --onda-radius-panel:             22px;                         /* große Panels / Tablet-Inhalt */
  --onda-radius-bezel:             42px;                         /* Tablet-Bezel */
  --onda-radius-pill:              999px;                        /* Fortschritts-Schiene, Punkte */
  --onda-radius-round:             50%;                          /* Icon-Button, Avatar */

  /* --- Spacing scale (8er-Raster, mit weichen Zwischenwerten) --- */
  --onda-space-1:                  4px;
  --onda-space-2:                  8px;
  --onda-space-3:                  12px;
  --onda-space-4:                  16px;
  --onda-space-5:                  24px;
  --onda-space-6:                  36px;
  --onda-space-7:                  44px;

  /* --- Elevation --- */
  --onda-shadow-card:              0 6px 34px rgba(1, 31, 38, 0.08); /* schwebende Panels */
  --onda-shadow-blatt:             0 24px 34px -14px rgba(1, 31, 38, 0.10); /* Blatt für Erwachsene ab 720 px (EL41) – nur nach unten, der Kopf des Blatts bleibt ohne Schatten; Jan-Philip 29.09.2026 */
  --onda-shadow-soft:              0 3px 10px rgba(1, 31, 38, 0.06); /* Chrome-Elemente */
  --onda-shadow-pop:               0 8px 22px rgba(1, 31, 38, 0.07); /* Sprechblase */
  --onda-shadow-hand:              0 2px 5px rgba(1, 31, 38, 0.32); /* Ondas Hand über der Bühne (drop-shadow, 16.09.2026) – kräftiger als die Flächen-Schatten, weil ein 44-px-Symbol sonst keinen Schatten zeigt */
  --onda-tile-press-petrol:        0 4px 0 rgba(1, 31, 38, 0.18);
  --onda-tile-press-pink:          0 4px 0 rgba(193, 60, 96, 0.40);
  --onda-tile-lift-petrol:         0 6px 0 rgba(1, 31, 38, 0.22), 0 12px 22px rgba(2, 104, 115, 0.28);
  --onda-shadow-pink:              0 6px 16px rgba(242, 102, 139, 0.35);
  --onda-glow-pink:                0 6px 16px rgba(242, 102, 139, 0.22); /* aktive Stationskarte (R14.5.16) – leiser als shadow-pink, weil die Karte weiß bleibt */
  --onda-shadow-petrol:            0 6px 16px rgba(2, 104, 115, 0.34);
  --onda-shadow-sage:              0 6px 16px rgba(3, 166, 136, 0.30);
  --onda-tile-press-petrol-aktiv:  0 2px 0 rgba(1, 31, 38, 0.18); /* Laut-Kachel gedrückt: 2 px tiefer, Kante bleibt */
  --onda-marker-ring:              0 0 0 4px rgba(242, 102, 139, 0.25); /* Say-and-Pull-Marker, ruhig (R14.5.17) – seit 15.09.2026 ungenutzt: der Marker ist Ondas Hand, kein Punkt mehr */
  --onda-marker-ring-puls:         0 0 0 9px rgba(242, 102, 139, 0.14); /* Say-and-Pull-Marker, Puls-Spitze – leiser als bis 13.09. (12 px), weil zu wild; seit 15.09.2026 ungenutzt */
  --onda-tile-press-pink-aktiv:    0 2px 0 rgba(193, 60, 96, 0.40); /* Graphem-Kachel gedrückt: 2 px tiefer, Kante bleibt */
}