.login-page-wrap {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 20px;
    background:
        radial-gradient(circle at top left, color-mix(in srgb, var(--primary) 20%, transparent), transparent 28%),
        radial-gradient(circle at bottom right, color-mix(in srgb, var(--primary-2) 16%, transparent), transparent 24%),
        var(--bg);
}
.login-card {
    width: min(92vw, 460px);
    background: color-mix(in srgb, var(--bg-panel) 96%, transparent);
    border: 1px solid var(--line);
    border-radius: 24px;
    box-shadow: var(--shadow);
    padding: 24px;
    backdrop-filter: blur(14px);
}
.login-card-header { margin-bottom: 18px; }
.login-badge { color: var(--text-soft); font-size: 13px; margin-bottom: 10px; font-weight: 700; }
.login-title { margin: 0; font-size: 30px; color: var(--text); }
.login-subtitle { margin-top: 8px; color: var(--text-soft); font-size: 14px; }
.login-form { display: grid; gap: 14px; }
.captcha-row { display: grid; grid-template-columns: 1fr 132px; gap: 12px; align-items: stretch; }
.captcha-box {
    border: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-panel) 94%, transparent);
    border-radius: 14px;
    cursor: pointer;
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.captcha-box:hover { border-color: color-mix(in srgb, var(--primary) 58%, var(--line)); }
.captcha-image { width: 120px; height: 42px; display: block; }
.captcha-loading { color: var(--text-soft); font-size: 13px; }
.login-actions { margin-top: 4px; }
.login-submit { width: 100%; }
@media (max-width: 560px) {
    .captcha-row { grid-template-columns: 1fr; }
}