.logout-confirm-overlay {
    z-index: 4200;
    padding: 24px;
    background: rgba(2, 7, 18, .72);
    backdrop-filter: blur(16px);
}

.logout-confirm-card {
    width: min(440px, calc(100vw - 32px));
    margin: auto;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 16px;
    padding: 22px;
    border: 1px solid rgba(146, 171, 219, .22);
    border-radius: 22px;
    color: var(--text, #f5f7ff);
    background: radial-gradient(circle at 8% 0%, rgba(139, 92, 246, .17), transparent 42%), rgba(8, 15, 29, .98);
    box-shadow: 0 28px 90px rgba(0, 0, 0, .48);
}

.logout-confirm-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(244, 114, 182, .25);
    border-radius: 15px;
    color: #fb9bbb;
    background: rgba(244, 63, 94, .1);
}
.logout-confirm-icon .ui-icon { width: 21px; height: 21px; }
.logout-confirm-copy { min-width: 0; }
.logout-confirm-copy > span { display: block; margin-bottom: 4px; color: #9ba9c2; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.logout-confirm-copy h3 { margin: 0; font-size: 21px; line-height: 1.25; }
.logout-confirm-copy p { margin: 8px 0 0; color: #aab6cb; font-size: 13px; line-height: 1.55; }
.logout-confirm-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 9px; padding-top: 3px; }
.logout-confirm-actions button { min-height: 42px; }
.logout-confirm-submit { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.logout-confirm-submit .ui-icon { width: 16px; height: 16px; }
.logout-confirm-submit.is-loading { opacity: .7; cursor: wait; }
body.logout-confirm-open { overflow: hidden; }

.auth-route-notice {
    width: 100%;
    margin: 0 0 14px;
    padding: 10px 12px;
    border: 1px solid rgba(94, 234, 212, .2);
    border-radius: 12px;
    color: #b9f5ec;
    background: rgba(20, 184, 166, .08);
    font-size: 12px;
    line-height: 1.45;
    text-align: left;
}

@media (max-width: 520px) {
    .logout-confirm-overlay { padding: 16px; align-items: end; }
    .logout-confirm-card { grid-template-columns: 42px minmax(0, 1fr); padding: 18px; border-radius: 20px; }
    .logout-confirm-icon { width: 42px; height: 42px; border-radius: 13px; }
    .logout-confirm-actions { display: grid; grid-template-columns: 1fr 1fr; }
}