/* 1NFINIT3 QUANTUM CLEAR GLASS — owner visual lock, 2026-09-07.
   Public-shell visual override only. Keeps the existing drawer geometry, state machine,
   swipe-to-dismiss behavior, and 1NFINIT3 public identity intact. */

:root {
  --quantum-glass-fill: rgba(10, 12, 18, 0.14);
  --quantum-glass-highlight: rgba(255, 255, 255, 0.075);
  --quantum-glass-edge: rgba(255, 255, 255, 0.20);
  --quantum-glass-edge-soft: rgba(255, 255, 255, 0.08);
}

/* Keep the live world visible, but softly drop it out of focus while navigation is open. */
.drawer-scrim {
  background: rgba(2, 4, 10, 0.08);
  backdrop-filter: blur(7px) saturate(92%);
  -webkit-backdrop-filter: blur(7px) saturate(92%);
}

/* Narrow transmitted quantum-clear-glass navigation blade. */
.side-drawer {
  background:
    linear-gradient(145deg,
      rgba(255, 255, 255, 0.075) 0%,
      rgba(255, 255, 255, 0.025) 28%,
      rgba(255, 255, 255, 0.008) 56%,
      rgba(5, 8, 15, 0.055) 100%),
    var(--quantum-glass-fill);
  border-color: var(--quantum-glass-edge);
  backdrop-filter: blur(20px) saturate(148%);
  -webkit-backdrop-filter: blur(20px) saturate(148%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    inset 1px 0 0 rgba(255, 255, 255, 0.055),
    inset -1px 0 0 rgba(255, 255, 255, 0.03),
    16px 0 40px rgba(0, 0, 0, 0.12);
}

.side-drawer::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(120% 72% at 8% 0%, rgba(255, 255, 255, 0.10), transparent 44%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.025), transparent 30%, rgba(255, 255, 255, 0.018));
  mix-blend-mode: screen;
  opacity: 0.78;
}

.side-drawer > * {
  position: relative;
  z-index: 1;
}

.drawer-section-primary,
.drawer-bottom {
  border-color: var(--quantum-glass-edge-soft);
}

.drawer-action:active,
.drawer-section a:active,
.account-strip:active,
.popover-row:active {
  background: rgba(255, 255, 255, 0.065);
}

/* Accessible fallback: stay translucent even where backdrop-filter is unavailable. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .drawer-scrim { background: rgba(2, 4, 10, 0.24); }
  .side-drawer { background: rgba(10, 12, 18, 0.68); }
}