/* Operian OS — APP-GLAS: eine App auf dem Telefon direkt auf dem Hintergrund
 * ============================================================================
 *
 * Vorgabe Betreiber (2026-10-01): „Wenn ich Team Control öffne, sieht es aus, als ob es eine
 * fremde App wäre." Dazu der Entwurf „team_control_startpage": der Hintergrund des
 * Startbildschirms bleibt SCHARF stehen, der Titel steht weiß direkt darauf, und der Inhalt liegt
 * auf hellen Milchglaskarten — die Sprache, die die Widgets auf dem Startbildschirm schon
 * sprechen. Eine App, die das will (`"glas": true` im Manifest), bekommt auf dem Telefon deshalb
 * KEINEN Fenstergrund mehr: das Fenster ist durchsichtig, die Karten malt die App selbst
 * (Team Control: `_fluent.css` §30).
 *
 * WER WAS TUT:
 *   · der Kernel (Block „App-Glas") setzt `data-vilo-glas` an die Fensterwurzel und sagt es der
 *     App (`vilo:app-glas`) — erst dann gibt sie ihren eigenen Grund ab. Zurück geht es in der
 *     umgekehrten Reihenfolge: erst malt die App wieder, dann nimmt die Shell das Attribut;
 *   · DIESE Datei nimmt dem Fenster seinen Grund, solange das Attribut steht.
 *
 * FAIL-CLOSED ohne einen Filter: solange die App ihren Grund nicht abgegeben hat, deckt er das
 * durchsichtige Fenster zu — dieselbe weiße Fläche wie vorher. Der Weichzeichner hinter der App
 * (§3) ist eine Zugabe: ohne ihn steht das Bild scharf da, die Karten tragen sich über ihr Weiß.
 *
 * Keine Schatten (Stilregel). Desktop und iPad sehen keine einzige Regel: der Kernel setzt das
 * Attribut nur auf dem Telefon (`compact`).
 * ==========================================================================*/

/* ── 1 · Das Fenster gibt seinen Grund ab ────────────────────────────────────────────────
 * (0,4,2) — schlägt den hellen Fenstergrund aus fenster-hell.css (0,3,2), unabhängig von der
 * Reihenfolge. Die Ecken trägt das Fenster auf dem Telefon ohnehin nicht (mobile-shell.css). */
html[data-vilo-appshell] .window-shadow[data-vilo-glas] div.bg-neutral-900 {
  background: transparent;
}

/* Das iframe spricht DIESELBE Farbsprache wie das Dokument darin. Unterscheiden sich beide
   (`color-scheme` am iframe-Element gegen das der App), malt Chromium dem Rahmen eine DECKENDE
   Leinwand — die App läge dann auf einem Brett statt auf dem Bild. Team Control steht fest hell
   (`data-theme="light"`), in Glas wie ohne. */
html[data-vilo-appshell] .window-shadow[data-vilo-glas] iframe {
  color-scheme: light;
}

/* In der App-Übersicht ist das Fenster eine KARTE — ohne Grund wären es lose Glasflächen über
   dem abgedunkelten Startbildschirm, ohne Kante, an der man sie greift. Dort trägt sie deshalb
   einen Hauch Milchglas; dasselbe Material wie die Karten darin, nur dünner. */
html[data-vilo-appshell][data-vilo-bl-wechsler] .window-shadow[data-vilo-glas] div.bg-neutral-900 {
  background: rgba(255, 255, 255, .18);
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  html[data-vilo-appshell][data-vilo-bl-wechsler] .window-shadow[data-vilo-glas] div.bg-neutral-900 {
    background: rgba(255, 255, 255, .14);
    -webkit-backdrop-filter: blur(18px) saturate(1.9) brightness(1.08);
    backdrop-filter: blur(18px) saturate(1.9) brightness(1.08);
  }
}

/* ── 2 · Die Leiste unter einer Glas-App ─────────────────────────────────────────────────
 * Hier standen vier Regeln, die die Leiste unter einer Glas-App durchsichtig und ihre Punkte
 * weiß machten. Seit die Leiste aus drei Flüssigglas-Flächen besteht (app-shell-seiten.css §4,
 * Vorgabe Betreiber 2026-10-13) hat sie weder Grund noch Erscheinungsbild — sie trägt unter
 * JEDER App dasselbe Glas und ist weiß —, und eine Regel ohne Wirkung malt beim nächsten Umbau
 * wieder etwas. Ersatzlos entfallen, samt der hellen Fassung in fenster-hell.css. */

/* ── 3 · Der Grund hinter einer Glas-App ist weichgezeichnet ─────────────────────────────
 * Vorgabe Betreiber (2026-10-01): „Das Milchige sollte einen Blur haben, damit es mit dem
 * bunten Hintergrund ruhiger wirkt — ähnlich wie Liquid Glass", dazu ein Ausschnitt des
 * Entwurfs: eine Karte aus 86 % Weiß, durch die der Hintergrund als weiche Farbfläche scheint.
 * Der Entwurf malt das je Karte (`backdrop-filter: blur(30px) saturate(180%)`).
 *
 * JE KARTE GEHT ES HIER NICHT, und das ist eine Grenze der Engines, keine Wahl: die Karten
 * liegen im iframe der App, und die Wurzel eines Dokuments ist eine Backdrop-Grenze (Filter
 * Effects 2) — WebKit (jeder Browser auf iPhone und iPad) und Gecko halten sich daran, der
 * Weichzeichner einer Karte sähe dort nichts als das leere Dokument. Chromium liest heute
 * hindurch; darauf zu bauen hiesse, auf dem iPhone gar nichts zu ändern.
 *
 * Deshalb wird der Grund in der SHELL weichgezeichnet, hinter der ganzen App: eine Fläche
 * über dem Hintergrund und unter den Fenstern (z 4 — über Klickfläche und Widget-Ebene, unter
 * dem abgedunkelten Grund der Übersicht, z 5), mit dem Filter des Entwurfs. Jede Karte zeigt
 * damit genau den Ausschnitt des Entwurfs, auf jedem Gerät; zwischen den Karten steht das Bild
 * als ruhige Farbfläche statt als scharfes Band. Sie reicht über die ganze Bühne, auch hinter
 * die Kopfleiste und die Leiste unten — eine Kante zwischen scharf und weich mitten im Bild
 * wäre die unruhigste Stelle des Schirms.
 *
 * Es gibt sie nur, solange eine Glas-App offen ist; sichtbar ist sie, solange eine davon VORNE
 * steht (`:has()` wie §2), und beim Seitenwechsel blendet sie über (die Dauer der Fahrt). In der
 * Übersicht trägt deren eigener Grund. Ohne `:has()` oder ohne `backdrop-filter` gibt es keine
 * Fläche: der Zustand von vorher, nichts deckt zu. */
html[data-vilo-appshell]:has(.window-shadow[data-vilo-glas]) .desktop-bg.relative::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity .34s cubic-bezier(.32, .72, 0, 1), visibility 0s linear .34s;
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  html[data-vilo-appshell]:has(.window-shadow[data-vilo-glas]) .desktop-bg.relative::after {
    -webkit-backdrop-filter: blur(30px) saturate(1.8);
    backdrop-filter: blur(30px) saturate(1.8);
  }
}
html[data-vilo-appshell]:not([data-vilo-bl-wechsler]):has(.window-shadow[data-vilo-glas]:not([data-vilo-minimized])) .desktop-bg.relative::after {
  opacity: 1;
  visibility: visible;
  transition: opacity .34s cubic-bezier(.32, .72, 0, 1), visibility 0s linear 0s;
}
@media (prefers-reduced-motion: reduce) {
  html[data-vilo-appshell]:has(.window-shadow[data-vilo-glas]) .desktop-bg.relative::after { transition: none; }
}