/* =============================================================================
 * Dock-Pille · Glas statt grauer Platte (Vorgabe Betreiber, „wie Apple")
 *
 * Der eingefrorene Bundle malt auf `.glass-dock`:
 *
 *     background: #1c1c1ed9            → rgba(28,28,30, .85)
 *     backdrop-filter: blur(50px) saturate(200%)
 *     border: 1px solid rgba(255,255,255,.08)
 *     box-shadow: inset 0 1px #ffffff0d
 *
 * Der Name sagt Glas, die Zahl sagt Platte. Bei 85 % Deckung kommt vom Hintergrund
 * nichts mehr durch — gemessen am laufenden Schirm (1512×900, Chromium, Pixel in der
 * Lücke zwischen zwei Kacheln):
 *
 *     Motiv              Hintergrund   Pille VORHER   Pille NACHHER
 *     Ozean (Vorgabe)    #0F182D       #191A1F        #272D3C
 *     Sonnenuntergang    #321116       #1E191D        #462931
 *     Monochrom          #0A0A10       #19191C        #27272F
 *
 * Die mittlere Spalte ist der Befund: dreimal fast derselbe Wert, obwohl der
 * Hintergrund von Blau über Rot bis Schwarz reicht. Die Pille war vom Motiv
 * entkoppelt — ein flaches Neutralgrau, in dem weder die Farbe noch der 50px-Blur
 * sichtbar wurden. Der Blur lief die ganze Zeit, man sah ihn nur nicht. Rechts folgt
 * die Pille dem Motiv (kühl über Ozean, warm über Sonnenuntergang): eine Fläche AUS
 * dem Hintergrund statt einer AUF ihm.
 *
 * DIE STELLSCHRAUBE IST DIE DECKUNG, NICHT DER BLUR-RADIUS. Deshalb ändert diese
 * Datei ausschließlich den Grund (und die zwei Kanten, die ihn fassen) und lässt
 * `backdrop-filter` unangetastet beim Bundle. Der Radius bleibt bewusst bei 50px:
 * das Dock schwebt über frei stehenden App-Fenstern, und dort liegt echter Text
 * unter der Pille. Ein kleinerer Radius ließe ihn als lesbares Gewusel durchscheinen.
 * Über den Motiven selbst ist der Radius ohnehin folgenlos: `.wp-layer-*` sind bereits
 * mit `blur(80px)` gemalt, da ist nichts mehr zu verwischen.
 *
 * WARUM EIN HELLER TON UND KEIN DUNKLER. Der Grund ist bei JEDEM Motiv `#0a0a10`
 * (`.desktop-bg`); die Motive selbst sind nur durchsichtige Verläufe darüber
 * (`.wp-layer-*`). Ein dunkler Ton mit wenig Deckung wäre dort von seinem eigenen
 * Untergrund nicht zu unterscheiden — die Pille verschwände, und sie soll eine
 * schwebende Pille bleiben (CLAUDE.md: „Das Dock behält sein Glas; auch auf einem Mac
 * hat es einen Grund"). 12 % Weiß liegt sichtbar über jedem Motiv und lässt es
 * trotzdem durch. Gegengeprüft wurden .10 (glasklar, über Monochrom aber schon knapp)
 * und .18 (wieder eine Platte, nur eine helle) — .12 hält beides.
 *
 * Und anders als bei der Menüleiste (menubar-desktop.css) kostet das hier keine
 * Lesbarkeit: auf der Pille steht KEIN Text. Sie trägt nur die 56×56-Kacheln (volle
 * Eigenfarbe, weißes Glyph) und den 5px-Fokuspunkt in der App-Farbe — beide bringen
 * ihren Kontrast selbst mit. Der Hover-Tooltip hat seine eigene Fläche
 * (`bg-neutral-800/95`) und hängt nicht an diesem Grund. Deshalb bleibt die Regel auch
 * über einem hellen „Eigenen Bild" tragfähig, wo die Menüleiste eine ausdrückliche
 * Grenze hat.
 *
 * GILT NUR FÜR DIE DOCK-PILLE, NICHT FÜR DIE MENÜLEISTE. Beide tragen `.glass-dock`.
 * Getrennt wird hier über `.rounded-3xl` (Bundle: „glass-dock rounded-3xl px-4 py-3
 * flex items-center gap-2") — dieselbe Unterscheidung, die mobile-shell.css schon
 * benutzt. Die Leiste hat den Gegen-Anker `z-[9999]` und gar keine Fläche mehr.
 * Ein `!important` braucht es nicht: `.glass-dock.rounded-3xl` (0,2,0) schlägt
 * `.glass-dock` (0,1,0), und React setzt auf der Pille inline nur `pointer-events`.
 *
 * Alle drei Bildschirmklassen, eine Regel — die Pille ist auf Desktop, Tablet und
 * Telefon dasselbe Element. Gepinnt durch mockups/tests/dock-glas.test.js.
 * ==========================================================================*/

.glass-dock.rounded-3xl {
  /* Glas statt Platte: 85 % → 12 %, und der Ton wechselt von Dunkelgrau auf Weiß
     (Begründung oben). Der Blur des Bundles bleibt und wird dadurch erst sichtbar. */
  background: rgba(255, 255, 255, .12);
  /* Kante und inneres Licht fassen die Pille, die jetzt weniger Grund hat, um sich
     selbst abzugrenzen. Bundle: .08 / .05 — beides für eine deckende Fläche gedacht. */
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16);
}