/* Native transparency is independent of the optional, translucent WebGL rim. */
:where([data-liquid-glass]) { position: relative; }
body [data-liquid-glass] { isolation: isolate; box-shadow: none; }
body [data-liquid-glass="panel"] { --liquid-tint: .18; --liquid-blur: 16px; }
/* Nested capsules use the same material as their desktop counterparts. */
body [data-liquid-glass="capsule"] { --liquid-tint: .10; --liquid-blur: 8px; }
body [data-liquid-glass] .bottom-nav-indicator { box-shadow: none; }
.liquid-glass-layer {
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 0;
  pointer-events: none;
}
body[data-material-mode="liquid-glass"] [data-liquid-glass] {
  background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.02) 46%, rgba(255,255,255,.06)), rgba(249,249,255,var(--liquid-tint, .10));
  -webkit-backdrop-filter: blur(var(--liquid-blur, 8px)) saturate(130%);
  backdrop-filter: blur(var(--liquid-blur, 8px)) saturate(130%);
  box-shadow: none;
}
[data-liquid-glass]:not([data-glass-state="ready"]) > .liquid-glass-layer { display: none; }
@media (prefers-contrast: more), (forced-colors: active) {
  [data-liquid-glass] > .liquid-glass-layer { display: none; }
  body[data-material-mode="liquid-glass"] [data-liquid-glass] {
    background: var(--surface);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: none;
  }
}
@media (forced-colors: active) {
  body[data-material-mode="liquid-glass"] [data-liquid-glass] { background: Canvas; color: CanvasText; border-color: CanvasText; }
}
@media print {
  [data-liquid-glass] > .liquid-glass-layer { display: none; }
}
