.site-dialog {
    width: min(440px, calc(100vw - 32px));
    max-height: calc(100dvh - 48px);
    box-sizing: border-box;
    padding: 0;
    margin: auto;
    border: 0;
    border-radius: 16px;
    background: #fff;
    color: #243447;
    box-shadow: 0 18px 64px rgba(0, 35, 75, .24);
    font-family: inherit;
}
.site-dialog::backdrop { background: rgba(15, 30, 50, .48); }
.site-dialog[open] { display: flex; flex-direction: column; }
.site-dialog-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 24px;
    background: #0066cc;
    color: #fff;
    flex-shrink: 0;
}
.site-dialog-header h2 { margin: 0; font-size: 19px; font-weight: 600; color: inherit; }
.site-dialog button { font: inherit; cursor: pointer; }
.site-dialog-x { border: 0; background: transparent; color: #fff; font-size: 28px !important; line-height: 1; padding: 4px 8px; }
.site-dialog-message { padding: 26px 24px; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.75; overflow-y: auto; }
.site-dialog-actions { display: flex; flex-shrink: 0; justify-content: flex-end; gap: 12px; padding: 0 24px 22px; }
.site-dialog-actions button { min-width: 88px; border-radius: 8px; padding: 9px 20px; border: 1px solid #0066cc; }
.site-dialog-primary { background: #0066cc; color: #fff; }
.site-dialog-primary:hover { background: #0052a3; }
.site-dialog-cancel { background: #fff; color: #0066cc; }
.site-dialog-cancel:hover { background: #edf5ff; }
.site-dialog button:focus-visible { outline: 3px solid #8fc7ff; outline-offset: 3px; }