/* Shared surface treatment. Never blur layout roots: they anchor fixed dialogs
   and the keyboard-aware messenger. Geometry and semantic colors stay intact. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root {
    --panel: rgba(17,18,20,.64);
    --panel-2: rgba(21,22,25,.68);
    --panel-3: rgba(27,28,32,.74);
    --staff-surface: var(--panel);
    --staff-surface-2: var(--panel-2);
    --glass-blur: 14px;
    --glass-overlay: rgba(21,22,25,.8);
  }
  :is(.rail, .bottom-nav, .modal, .auth-card, .profile-card, .balance-card,
      .product-card, .seller-line, .suggest-card, .twofa-banner, .telegram-profile-banner,
      .chat-list-wrap, .chat-pane, .search-field, .filter-popover, .escrow-row,
      .staff-login, .staff-modal, .panel-tabs, .metric-card, .metric-grid article,
      .split-grid article, .support-stack article, .panel-section > .table-shell) {
    background-color: var(--panel);
    -webkit-backdrop-filter: blur(var(--glass-blur));
    backdrop-filter: blur(var(--glass-blur));
  }
  :is(.chat-overflow-menu, .chat-message-search, .message-context-menu, .search-suggestions) {
    background: var(--glass-overlay);
    -webkit-backdrop-filter: blur(var(--glass-blur));
    backdrop-filter: blur(var(--glass-blur));
  }
  :is(.modal-head, .chat-head, .message-form, .chat-search, .notification-item,
      .seller-stats > *, .account-metrics > *, .inventory-item, .order-row, .deal-row) {
    background-color: var(--panel-2);
  }
  .notification-item.telegram { background: linear-gradient(rgba(42,171,238,.08), rgba(42,171,238,.08)), var(--panel-2); }
  /* The image has no second painted surface or frame inside the glass modal. */
  .product-detail, .gallery, .gallery-stage, .detail-info { background: transparent; }
}

@media (prefers-reduced-transparency: reduce) {
  :root {
    --panel: #111214;
    --panel-2: #151619;
    --panel-3: #1b1c20;
    --glass-overlay: #151619;
    --glass-blur: 0px;
  }
}