.surface-glass,
.glass-surface {
  background: var(--glass-bg);
  border: 1px solid var(--glass-line);
  box-shadow:
    0 26px 86px rgba(0, 0, 0, .28),
    inset 0 1px 0 rgba(255, 255, 255, .12),
    inset 0 -1px 0 rgba(0, 0, 0, .20);
  -webkit-backdrop-filter: blur(11px) saturate(126%);
  backdrop-filter: blur(11px) saturate(126%);
}

.surface-button,
.glass-button {
  background: rgba(245, 242, 223, .07);
  border: 1px solid rgba(245, 242, 223, .16);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .11),
    0 16px 44px rgba(0, 0, 0, .20);
  -webkit-backdrop-filter: blur(9px);
  backdrop-filter: blur(9px);
}

.surface-panel {
  background: var(--glass-bg-strong);
  border: 1px solid var(--glass-line);
  box-shadow: var(--shadow);
}

.surface-soft {
  background: rgba(245, 242, 223, .045);
  border: 1px solid rgba(245, 242, 223, .12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .075);
}

.surface-dropdown {
  background: var(--surface-bg, var(--glass-bg-strong));
  border: 1px solid var(--surface-border, rgba(245, 242, 223, .16));
  box-shadow: var(--surface-shadow, var(--shadow));
  -webkit-backdrop-filter: var(--surface-filter, blur(14px) saturate(118%));
  backdrop-filter: var(--surface-filter, blur(14px) saturate(118%));
}