.modal {
  margin: auto;
  width: min(100% - 1.5rem, 680px); max-height: min(92vh, 900px);
  padding: 0; border: 1px solid var(--c-velvet-line); border-radius: var(--r-md);
  background: var(--c-velvet); color: var(--c-linen);
}
.modal::backdrop { background: rgba(5,7,13,.78); backdrop-filter: blur(4px); }
.modal[open] { animation: modal-in .22s var(--ease); }
@keyframes modal-in { from { opacity: 0; transform: translateY(12px) scale(.98); } }
.modal__head {
  position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between;
  padding: var(--s-4) var(--s-5); background: var(--c-velvet); border-bottom: 1px solid var(--c-velvet-line);
}
.modal__head h2 { font-size: var(--t-lg); }
.modal__body { padding: var(--s-5); }
.modal__foot {
  position: sticky; bottom: 0; display: flex; justify-content: flex-end; gap: var(--s-3);
  padding: var(--s-4) var(--s-5); background: var(--c-velvet); border-top: 1px solid var(--c-velvet-line);
}