.portal-login-root {
    position: relative;
    /* 覆盖 body 上较深的背景，让登录页整体更柔和、偏亮 */
    background:
        radial-gradient(
            circle at top,
            var(--portal-login-bg-top, rgba(8, 18, 40, 0.96)) 0,
            var(--portal-login-bg-mid, rgba(2, 8, 23, 0.98)) 42%,
            var(--portal-login-bg-bottom, rgba(1, 6, 18, 1)) 100%
        ),
        linear-gradient(to bottom, #050b1d, #01040f);
}

.portal-login-root::before,
.portal-login-root::after {
    content: "";
    position: absolute;
    width: 42vmax;
    height: 42vmax;
    border-radius: 50%;
    display: none;
    pointer-events: none;
    z-index: 0;
    background: radial-gradient(circle at 50% 50%, var(--portal-login-corner-light, rgba(0, 229, 255, 0.28)) 0, transparent 60%);
    opacity: 0.7;
    mix-blend-mode: screen;
    filter: blur(8px);
    animation: portal-login-corner-orbit 36s linear infinite;
}

.portal-login-root::before {
    top: -18vmax;
    left: -12vmax;
}

.portal-login-root::after {
    top: -18vmax;
    right: -12vmax;
    animation-direction: reverse;
}

@keyframes portal-login-corner-orbit {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(180deg) scale(1.05);
    }
    100% {
        transform: rotate(360deg) scale(1);
    }
}

/* 登录中状态：整体略微变暗，禁止重复点击 */
.portal-login-root.is-submitting {
    pointer-events: none;
    animation: portal-login-bg-pulse 1.1s ease-out forwards;
}

.portal-login-root.is-submitting .portal-button {
    opacity: 0.9;
    filter: saturate(1.15) brightness(1.05);
}

.portal-login-root.is-submitting .portal-card {
    animation: portal-login-submit 1.1s ease-out forwards;
}

/* 登录页几何背景 canvas */
.portal-login-root .portal-login-canvas {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0.9;
}

/* 登录成功时卡片周围的阳光淡黄色生长光晕 */
.portal-login-root .portal-card {
    position: relative;
    z-index: 1; /* 确保在几何 canvas 之上 */
}

.portal-login-root .portal-solar-term-label {
    position: absolute;
    top: 14px;
    right: 22px;
    z-index: 2;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    letter-spacing: 0.08em;
    color: rgba(241, 245, 249, 0.92);
    background: radial-gradient(circle at 0% 0%, rgba(15, 23, 42, 0.9), transparent 60%),
                linear-gradient(120deg, rgba(148, 163, 184, 0.55), rgba(15, 23, 42, 0.9));
    box-shadow: 0 0 12px rgba(15, 23, 42, 0.85);
    backdrop-filter: blur(10px);
    white-space: nowrap;
}

.portal-login-root .portal-card::after {
    content: "";
    position: absolute;
    inset: -8%;
    border-radius: inherit;
    background:
        radial-gradient(circle at 50% 10%, rgba(250, 250, 210, 0.25) 0, transparent 55%),
        radial-gradient(circle at 50% 80%, rgba(250, 204, 21, 0.2) 0, transparent 60%);
    opacity: 0;
    pointer-events: none;
    z-index: -1;
}

.portal-login-root.is-submitting .portal-card::after {
    animation: portal-login-flare 1.1s ease-out forwards;
}

/* 登录失败：轻微抖动卡片并高亮错误区域 */
.portal-login-root.has-error .portal-card {
    animation: portal-login-shake 0.45s ease-out;
}

.portal-login-root.has-error .portal-error {
    animation: portal-login-error-pulse 0.6s ease-out;
}

@keyframes portal-login-submit {
    0% {
        transform: translateY(0) scale(1);
        opacity: 1;
    }
    35% {
        transform: translateY(-4px) scale(1.04);
        opacity: 1;
    }
    70% {
        transform: translateY(-10px) scale(1.08);
        opacity: 1;
    }
    100% {
        transform: translateY(16px) scale(0.94);
        opacity: 0;
    }
}

@keyframes portal-login-shake {
    0% { transform: translateX(0); }
    15% { transform: translateX(-6px); }
    30% { transform: translateX(6px); }
    45% { transform: translateX(-4px); }
    60% { transform: translateX(4px); }
    75% { transform: translateX(-2px); }
    100% { transform: translateX(0); }
}

@keyframes portal-login-error-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(248, 113, 113, 0.5);
    }
    57% {
        box-shadow: 0 0 0 8px rgba(248, 113, 113, 0);
    }
    60% {
        box-shadow: 0 0 0 0 rgba(248, 113, 113, 0.4);
    }
    69% {
        box-shadow: 0 0 0 8px rgba(248, 113, 113, 0);
    }
}

/* 阳光色的生长光晕：从卡片中心向外扩散后消失 */
@keyframes portal-login-flare {
    0% {
        transform: scale(0.85);
        opacity: 0;
    }
    40% {
        transform: scale(1);
        opacity: 0.85;
    }
    100% {
        transform: scale(1.25);
        opacity: 0;
    }
}

/* 登录成功时的背景能量脉冲 */
@keyframes portal-login-bg-pulse {
    0% {
        filter: none;
    }
    40% {
        filter: brightness(1.1) saturate(1.15);
    }
    100% {
        filter: none;
    }
}

.portal-footer-links {
    margin-top: 16px;
    text-align: center;
}

.portal-footer-link {
    font-size: 13px;
    color: var(--portal-text-secondary, #64748b);
    text-decoration: none;
}

.portal-footer-link:hover {
    color: var(--portal-primary, #6366f1);
    text-decoration: underline;
}

.portal-icp {
    margin-top: 8px;
    font-size: 12px;
    text-align: center;
    color: var(--portal-text-secondary, #64748b);
}

.portal-icp a {
    color: inherit;
    text-decoration: none;
}

.portal-icp a:hover {
    color: var(--portal-primary, #6366f1);
    text-decoration: underline;
}