.login-shell {
    position: relative;
    overflow: hidden;
}

.login-shell::before,
.login-shell::after {
    content: "";
    position: fixed;
    inset: auto;
    border-radius: 9999px;
    pointer-events: none;
    filter: blur(10px);
    opacity: 0.9;
}

.login-shell::before {
    top: 8%;
    left: -120px;
    width: 320px;
    height: 320px;
    background: radial-gradient(circle, rgba(96, 165, 250, 0.22) 0%, rgba(96, 165, 250, 0) 72%);
}

.login-shell::after {
    right: -140px;
    bottom: 6%;
    width: 360px;
    height: 360px;
    background: radial-gradient(circle, rgba(244, 114, 182, 0.16) 0%, rgba(244, 114, 182, 0) 72%);
}

.login-layout {
    position: relative;
    z-index: 1;
    width: min(440px, 100%);
}

.login-form-card {
    background: var(--surface-card-strong);
    border-color: var(--border-glow);
    box-shadow: var(--shadow-glow);
}

.login-brand {
    display: flex;
    justify-content: center;
    margin-bottom: var(--space-lg);
}

.login-eyebrow {
    display: block;
    margin-bottom: var(--space-sm);
    text-align: center;
}

.login-form-card .brand-mark {
    width: 64px;
    height: 64px;
    font-size: 20px;
    box-shadow: 0 0 32px rgba(96, 165, 250, 0.35);
}

.login-form-card h2 {
    margin-bottom: var(--space-sm);
    text-align: center;
    font-size: 28px;
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.login-card-subtitle {
    margin-bottom: var(--space-xl);
    text-align: center;
    color: var(--text-secondary);
    font-size: 14px;
}

.login-form label {
    display: block;
}

.login-form label > span {
    display: block;
    color: var(--text-secondary);
    font-size: 13px;
    font-weight: 500;
}

.login-form .input {
    padding-top: 14px;
    padding-bottom: 14px;
    font-size: 15px;
}

.login-submit {
    width: 100%;
    padding-top: var(--space-lg);
    padding-bottom: var(--space-lg);
    font-size: 16px;
}

.banquan {
    position: absolute;
    bottom: var(--space-lg);
    left: 0;
    right: 0;
    text-align: center;
    font-size: 12px;
}

.banquan a {
    color: var(--text-muted);
    transition: color var(--transition-fast);
}

.banquan a:hover {
    color: var(--accent-blue);
}

@media (max-width: 480px) {
    .login-form-card .brand-mark {
        width: 56px;
        height: 56px;
        font-size: 18px;
    }
}