.scrim {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: center;
  padding:
    calc(var(--spacing-md, 12px) + var(--app-safe-top, 0px))
    calc(var(--spacing-md, 12px) + var(--app-safe-right, 0px))
    calc(var(--spacing-md, 12px) + var(--app-safe-bottom, 0px))
    calc(var(--spacing-md, 12px) + var(--app-safe-left, 0px));
}

.panel {
  position: relative;
  width: 100%;
  max-width: var(--dialog-max-width, 380px);
  background: var(--color-dialog-background);
  border: var(--border-light) solid var(--color-dialog-border);
  border-radius: var(--responsive-card-radius, var(--radius-xl));
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45);
  color: var(--color-text-primary);
  overflow: hidden;
}
