/* Liquid Glass: controlli soltanto. Il canvas conserva i dadi fisici, senza coperture DOM. */
body {
  --lg-ink: var(--notte); --lg-paper: var(--bianco); --lg-muted: var(--grigio);
  --lg-surface: #edf8fa; --lg-pip: #141b25; --lg-edge: #6c879b;
  --lg-glint: #ffffffed; --lg-tint: #edf8fad9; --lg-shade: #18213e24;
  --lg-radius: 999px; --lg-die-radius: 14px; --lg-target: 44px; --lg-blur: 12px;
  --lg-shadow: inset 0 1px 1px var(--lg-glint), inset 0 -1px 2px #18213e26, 0 3px 8px var(--lg-shade);
}
body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close) {
  min-height: var(--lg-target); min-width: var(--lg-target);
  border: 1px solid var(--lg-edge); border-radius: var(--lg-radius);
  background: linear-gradient(165deg,var(--lg-paper),var(--lg-surface));
  color: var(--lg-ink); box-shadow: var(--lg-shadow);
  text-shadow: none; transition: transform .16s ease-out;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
body :is(.btn-primary,.icon-button[aria-pressed="true"],.chat-jump) {
  background: linear-gradient(165deg,var(--notte-2),var(--notte));
  color: var(--lg-paper); border-color: var(--notte);
  box-shadow: inset 0 1px 1px #ffffffa6, inset 0 -1px 2px #0005, 0 4px 10px #18213e33;
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close) {
    background: linear-gradient(165deg,#ffffffeb,var(--lg-tint));
    backdrop-filter: blur(var(--lg-blur)) saturate(1.25);
    -webkit-backdrop-filter: blur(var(--lg-blur)) saturate(1.25);
  }
  body :is(.btn-primary,.icon-button[aria-pressed="true"],.chat-jump) {
    background: linear-gradient(165deg,#3b4e74f5,#18213ef5);
  }
}
@media (hover:hover) {
  body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close):hover:not(:disabled) {
    border-color: var(--lg-ink); box-shadow: var(--lg-shadow),0 0 0 1px var(--lg-edge);
  }
  body .btn-primary:hover:not(:disabled) { background: var(--notte-2); }
}
body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close):active:not(:disabled) {
  transform: translateY(1px) scale(.985); box-shadow: inset 0 2px 5px #18213e40;
}
body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close):disabled,
body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close)[aria-disabled="true"] {
  opacity: 1; background: var(--lg-surface); color: var(--lg-muted);
  border-style: solid; box-shadow: inset 0 2px 4px #18213e26; cursor: not-allowed;
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
body :is(.btn,.icon-button)[aria-busy="true"],
body .room-page.dadi-in-volo #roll-button {
  border-style: double; border-width: 3px; cursor: progress; color: var(--lg-muted);
  background: repeating-linear-gradient(135deg,var(--lg-surface) 0 8px,#d9e9ed 8px 16px);
}
body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close,.die):focus-visible {
  outline: 3px solid var(--lg-ink); outline-offset: 3px;
  box-shadow: 0 0 0 3px var(--lg-paper),0 0 0 6px var(--lg-ink);
}
/* Fallback senza WebGL: gli stessi valori e lo stesso segnale Tenuto del dado fisico. */
body .dice-stage:not(.has-physics) .die {
  min-width: var(--lg-target); min-height: var(--lg-target); border: 1px solid var(--lg-edge);
  border-radius: var(--lg-die-radius); background: linear-gradient(145deg,var(--lg-paper),var(--lg-surface));
  box-shadow: var(--lg-shadow); transition: transform .16s ease-out;
}
body .dice-stage:not(.has-physics) .die .pip { background: var(--lg-pip); }
body .dice-stage:not(.has-physics) .die.held {
  outline: 3px double var(--lg-ink); outline-offset: 2px; transform: translateY(-4px);
}
body .dice-stage:not(.has-physics) .die:disabled { border-style: solid; background: #dce7eb; box-shadow: inset 0 2px 4px #18213e26; opacity: 1; }
body .dice-stage:not(.has-physics) .die.empty { opacity: .45; }
body.app-layout-active .back-button { min-height: var(--lg-target); }
body .dice-stage:not(.has-physics) .die:focus-visible,
body .dice-stage.has-physics .die:focus-visible {
  outline: 3px solid var(--lg-ink); outline-offset: 3px;
  box-shadow: 0 0 0 3px var(--lg-paper),0 0 0 6px var(--lg-ink);
}
@media (prefers-reduced-transparency:reduce) {
  body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close) {
    backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--lg-paper);
  }
  body :is(.btn-primary,.icon-button[aria-pressed="true"],.chat-jump) { background: var(--lg-ink); }
  body :is(.btn,.icon-button):disabled { background: var(--lg-surface); color: var(--lg-muted); }
}
@media (prefers-reduced-motion:reduce) {
  body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close,.die) { transition: none; }
}
@media (forced-colors:active) {
  body :is(.btn,.icon-button,.back-button,.reaction,.chat-jump,.app-chat-close,.die) {
    border: 2px solid ButtonText; box-shadow: none;
  }
}