/**
 * Всплывающее окно на нативном <dialog>. Браузер сам блокирует фон
 * (::backdrop), управляет фокусом и Esc — js/modal.js только открывает
 * /закрывает диалог по клику на data-modal-open/data-modal-close.
 */
.brosteel-modal {
  border: none;
  border-radius: var(--radius);
  padding: 0;
  width: min(480px, calc(100% - 2rem));
  box-shadow: var(--shadow-hover);
}

.brosteel-modal::backdrop {
  background: rgba(6, 26, 45, 0.6);
}

.brosteel-modal[open] {
  animation: brosteel-modal-in 0.2s ease;
}

@keyframes brosteel-modal-in {
  from {
    opacity: 0;
    transform: translateY(-12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.brosteel-modal__inner {
  position: relative;
  padding: 2.5rem 2rem 2rem;
}

.brosteel-modal__close {
  position: absolute;
  top: 0.5rem;
  right: 0.75rem;
  background: none;
  border: none;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
  color: var(--color-text-light);
}

.brosteel-modal__close:hover {
  color: var(--color-accent);
}