/* One filtered surface per pane. No texture, displacement or extra grain. */
body.glass-study {
  background: #000;
  --gx-glass-filter: blur(24px) saturate(1.04);
  --gx-glass-fill: rgba(16, 30, 48, .42);
  --gx-glass-rim: rgba(191, 219, 255, .30);
}

/* Keep near/far smoke in the same exposure; dim the composed scene once. */
.glass-study #nebula-back { opacity: 1 !important; }
.glass-study .stage::before { background: #000; }
.glass-study #working-shade { background: rgba(2, 5, 11, .88); }
/* The desktop is a viewport, not a hidden scroll container for focus jumps. */
.glass-study .stage { overflow: clip; }

body.glass-study #floating {
  background: var(--gx-glass-fill);
  backdrop-filter: var(--gx-glass-filter);
  -webkit-backdrop-filter: var(--gx-glass-filter);
  border-color: var(--gx-glass-rim);
  border-top-color: rgba(223, 239, 255, .49);
  border-bottom-color: rgba(145, 178, 219, .20);
  box-shadow: inset 0 1px 1px rgba(234, 245, 255, .15),
    inset 1px 0 1px rgba(207, 229, 255, .07),
    inset 0 -1px 1px rgba(182, 210, 245, .045),
    0 20px 56px rgba(0, 5, 15, .28);
}
body.glass-study #floating::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(208, 230, 255, .055), transparent 42%);
}
body.glass-study #float-handle {
  background: rgba(196, 220, 251, .025);
  border-bottom-color: rgba(177, 205, 242, .10);
}

body.glass-study:not([data-composer="line"]) .dx-composer {
  background: rgba(23, 39, 59, .40);
  backdrop-filter: var(--gx-glass-filter);
  -webkit-backdrop-filter: var(--gx-glass-filter);
  border-top-color: rgba(216, 235, 255, .39);
  box-shadow: inset 0 1px 1px rgba(225, 240, 255, .09),
    inset 0 -1px rgba(178, 208, 248, .035), 0 9px 30px rgba(0, 5, 14, .14);
}
body.glass-study[data-composer="hybrid"] .dx-composer {
  background: rgba(23, 39, 59, .32);
  border-bottom-color: rgba(197, 221, 255, .49);
}
body.glass-study .dx-command-overlay,
body.glass-study .dx-inbox-panel {
  background: var(--gx-glass-fill);
  backdrop-filter: var(--gx-glass-filter);
  -webkit-backdrop-filter: var(--gx-glass-filter);
  border-top-color: rgba(216, 235, 255, .39);
}
/* The overlay already filters the scene. Its input must not filter it again. */
body.glass-study[data-composer] .dx-command-overlay .dx-composer,
body.glass-study[data-composer] .dx-command-overlay .dx-composer button {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.glass-study .dv-research-node {
  background: rgba(13, 27, 44, .30);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top-color: rgba(205, 228, 255, .32);
  box-shadow: inset 0 1px rgba(215, 235, 255, .06), 0 7px 25px rgba(0, 6, 18, .10);
}

/* The blur stays fully established. Only the uniform tint fades in/out. */
.glass-study .gx-library,
.glass-study .gx-library::backdrop {
  --gx-library-color: rgba(9, 14, 23, .66);
  --gx-library-clear: rgba(9, 14, 23, 0);
  --gx-library-filter: blur(24px);
}
.glass-study .gx-library::backdrop {
  background: var(--gx-library-color);
  backdrop-filter: var(--gx-library-filter);
  -webkit-backdrop-filter: var(--gx-library-filter);
  opacity: 1;
}
.glass-study .gx-library[open]::backdrop {
  animation: gx-glass-backdrop-in .24s ease both;
}
.glass-study .gx-library.is-closing::backdrop {
  animation: gx-glass-backdrop-out .18s ease both;
}
.glass-study[data-library] .gx-library .launcher__app:is(:hover, :focus-visible) {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
/* A hovering hologram, without the thick bevel of a physical glass tile. */
.glass-study[data-library="original"] .gx-library .launcher__app:is(:hover, :focus-visible) {
  transform: none;
  border-color: rgba(177, 207, 243, .32);
  border-top-color: rgba(195, 219, 251, .36);
  background: rgba(75, 106, 148, .13);
  box-shadow: inset 0 0 18px rgba(162, 198, 244, .02), 0 0 24px rgba(137, 184, 241, .035);
}
.glass-study[data-library="original"] .gx-library .launcher__app::before,
.glass-study[data-library="original"] .gx-library .launcher__app::after { content: none; }
.glass-study[data-library="original"] .gx-library .launcher__app:is(:hover, :focus-visible)>svg {
  color: #c4d9f3;
  filter: drop-shadow(0 0 4px rgba(165, 202, 249, .10));
}
@keyframes gx-glass-backdrop-in {
  from { background-color: var(--gx-library-clear); }
  to { background-color: var(--gx-library-color); }
}
@keyframes gx-glass-backdrop-out {
  from { background-color: var(--gx-library-color); }
  to { background-color: var(--gx-library-clear); }
}
@media (prefers-reduced-motion: reduce) {
  .glass-study .gx-library[open]::backdrop,
  .glass-study .gx-library.is-closing::backdrop { animation: none !important; }
}
