Raster
Spacing · Radius · Elevation · Glass — die Werte, die jede Fläche im Kit benutzt (Quelle: tokens.css / app.css)
Spacing — 4-pt-Basisraster
4
8
12
14
18
24
32
18 = Screen-Rand (Content-Padding) · 14 = Karten-Abstand + Karten-Innenraum-Rhythmus · 12 = Grid-Gap · 8 = Element-Gap in Zeilen · 4 = Mikro-Abstände (Bars, Dots).
Radius-Stufen
r-sm · Metrik-Karten
r · Karten
26 · Frames/Kacheln
r-pill · Buttons, Chips, Felder
Elevation — 3 Ebenen + 2 Glows
shadow
Karten (ruht)
Karten (ruht)
shadow-lift
Schwebendes (Nav, Frame)
Schwebendes (Nav, Frame)
Herz-Glow
Primär-CTA
Primär-CTA
Gold-Glow
Mic/Voice
Mic/Voice
Farbige Schatten NUR unter farbigen Flächen (der Glow gehört zur Fläche, nie zu neutralem Paper).
Glass-Rezept
Glass über der Welt
background: rgba(253,251,246,.46–.60)
backdrop-filter: blur(16–18px) saturate(1.12)
border: 1px rgba(255,255,255,.55) + shadow
Glass existiert NUR über der Welt-Atmosphäre (Nav, Score-Chip, Gesprächsfläche, Topnav-Buttons).
Auf Paper/Cream-Flächen: normale Karten, kein Blur.