/* Mobile input glass panels and button spacing - 20260730 */
@media (max-width: 900px) {
  /* All panels that contain inputs are marked by mobile-input-glass-spacing.js. */
  body .mobile-input-glass-panel {
    background: linear-gradient(
      180deg,
      rgba(247, 241, 221, .25),
      rgba(222, 233, 219, .14)
    ) !important;
    border-color: rgba(242, 223, 166, .34) !important;
    box-shadow: 0 10px 28px rgba(5, 24, 21, .16) !important;
    backdrop-filter: blur(5px) saturate(1.04) !important;
    -webkit-backdrop-filter: blur(5px) saturate(1.04) !important;
  }

  body input:not([type="checkbox"]):not([type="radio"]),
  body select,
  body textarea {
    background: rgba(255, 255, 255, .34) !important;
    border-color: rgba(104, 98, 72, .32) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24) !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
  }

  body input:not([type="checkbox"]):not([type="radio"]):focus,
  body select:focus,
  body textarea:focus {
    background: rgba(255, 255, 255, .52) !important;
    border-color: rgba(118, 90, 37, .50) !important;
  }

  /* Member and settings dialogs become translucent glass instead of yellow boards. */
  body .modal-overlay {
    background: rgba(8, 24, 20, .34) !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
  }

  body .modal-overlay .modal {
    background: linear-gradient(
      180deg,
      rgba(247, 240, 216, .56),
      rgba(228, 234, 216, .42)
    ) !important;
    border-color: rgba(238, 218, 157, .48) !important;
    box-shadow: 0 18px 48px rgba(7, 25, 21, .32) !important;
    backdrop-filter: blur(14px) saturate(1.08) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.08) !important;
  }

  body .modal-overlay .member-pane,
  body .modal-overlay .setting-row,
  body .modal-overlay .account-password-panel,
  body .modal-overlay .account-delete-panel {
    background: transparent !important;
  }

  /* Locked feature prompt remains readable while revealing the moving background. */
  body .premium-lock .lock-mask {
    background: linear-gradient(
      180deg,
      rgba(244, 237, 215, .42),
      rgba(224, 232, 216, .28)
    ) !important;
    border: 1px solid rgba(239, 218, 157, .34) !important;
    box-shadow: 0 12px 32px rgba(6, 24, 20, .16) !important;
    backdrop-filter: blur(7px) saturate(1.04) !important;
    -webkit-backdrop-filter: blur(7px) saturate(1.04) !important;
    padding-bottom: 38px !important;
  }

  body .premium-lock .lock-mask .lk-btn {
    margin-top: 18px !important;
  }

  /* Give the drawer button a clear gap from the drawer edge and page actions. */
  body.mobile-scene-entered.mobile-drawer-collapsed .mobile-drawer-toggle {
    bottom: calc(122px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.mobile-scene-entered.mobile-drawer-expanded .mobile-drawer-toggle {
    bottom: calc(min(72vh, 680px) + 50px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* A locked form has nothing to fill yet: show only the login/register action. */
  body.mobile-drawer-locked .mobile-drawer-toggle,
  body.mobile-member-modal-open .mobile-drawer-toggle {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}