/* Login dialog (assets/auth-modal.js): the login form in an iframe over the page a visitor was on. */
/* margin:auto is the browser's own centring for a modal <dialog>; the CSS reset (margin: 0 on every element) removed it and pinned the dialog to the top left */
dialog.auth-modal { margin: auto; width: min(440px, calc(100% - 32px)); max-height: calc(100vh - 48px); padding: 0; border: 1px solid var(--border, rgba(255,255,255,.12)); border-radius: 16px; background: var(--card, #111); color: var(--card-foreground, inherit); box-shadow: 0 24px 80px rgba(0,0,0,.45); overflow: visible; }
dialog.auth-modal::backdrop { background: rgba(0,0,0,.55); backdrop-filter: blur(2px); }
dialog.auth-modal .auth-modal-frame { display: block; width: 100%; height: 420px; max-height: calc(100vh - 48px); border: 0; border-radius: 16px; background: transparent; }
dialog.auth-modal .auth-modal-close { position: absolute; top: -14px; right: -14px; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid var(--border, rgba(255,255,255,.12)); border-radius: 999px; background: var(--card, #111); color: inherit; cursor: pointer; padding: 0; }
dialog.auth-modal .auth-modal-close svg { width: 16px; height: 16px; }
dialog.auth-modal .auth-modal-close:hover { background: var(--muted, rgba(127,127,127,.2)); }
html.auth-modal-open { overflow: hidden; }