/* ============================================
   二次元「晴空蓝」· 页面层
   目前包含：登录页（深空蓝夜空 + 玻璃卡片 + 星点）
   依赖：theme-anime/tokens.css
   加载：应放在页面自身 <style> 之后，以便覆盖旧配色
   ============================================ */

/* ---------------- 登录页 ---------------- */
body {
    background-color: #0C1626 !important;
    /* 层级：暗色蒙层（保证文字可读）→ 随机二次元壁纸 → 光晕 → 星点 → 深空渐变（图片失败时的兜底） */
    background-image:
        linear-gradient(180deg, rgba(6, 14, 28, .52) 0%, rgba(6, 14, 28, .28) 45%, rgba(6, 14, 28, .58) 100%),
        url('https://acg.yaohud.cn/dm/adaptive.php'),
        radial-gradient(1000px 520px at 15% 0%, rgba(76, 157, 255, .28), transparent 65%),
        radial-gradient(900px 480px at 85% 100%, rgba(108, 123, 255, .22), transparent 65%),
        var(--starfield),
        var(--g-side) !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/* 卡片：玻璃拟态 + 顶部渐变装饰条 */
.card--login {
    position: relative;
    overflow: hidden;
    background: rgba(255, 255, 255, .93) !important;
    backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, .55) !important;
    border-radius: var(--r-lg) !important;
    box-shadow: 0 24px 60px rgba(6, 14, 28, .45), 0 0 0 1px rgba(127, 210, 255, .14) !important;
}

.card--login::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 4px;
    background: var(--g-main);
}

/* 标题：渐变字 + 音符点缀 */
.card-title {
    background: linear-gradient(135deg, #3A86F0 0%, #6C7BFF 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 800;
    letter-spacing: 2px;
}

#loginCue {
    color: var(--text-2) !important;
}

/* 登录方式切换 */
.login-tabs {
    border-bottom-color: var(--border) !important;
}

.login-tab {
    color: var(--text-2);
}

.login-tab.active {
    color: var(--p-600);
}

.login-tab.active::after {
    background: var(--g-main);
}

/* 输入框 */
.form-control {
    border-color: var(--border-strong) !important;
    border-radius: var(--r-sm) !important;
    color: var(--text-main);
    transition: all var(--dur) var(--ease);
}

.form-control:focus {
    border-color: var(--p-500) !important;
    box-shadow: 0 0 0 3px rgba(76, 157, 255, .16) !important;
}

/* 主按钮：渐变 + 发光 */
.btn {
    background: var(--g-main) !important;
    color: #fff !important;
    border-radius: var(--r-sm) !important;
    box-shadow: 0 6px 18px rgba(76, 157, 255, .35);
}

.btn:hover {
    background: var(--g-main-h) !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(76, 157, 255, .42);
}

.btn:disabled {
    background: var(--p-300) !important;
    transform: none;
    box-shadow: none;
}

/* 验证码按钮：幽灵按钮，避免和主按钮抢视觉 */
.btn.btn-code {
    background: #fff !important;
    color: var(--p-600) !important;
    border: 1px solid var(--p-300) !important;
    box-shadow: none;
}

.btn.btn-code:hover {
    background: var(--p-50) !important;
    transform: none;
    box-shadow: none;
}

/* 底部链接 */
.yaohu {
    border-top-color: var(--border) !important;
}

.yaohu .home {
    color: var(--text-2);
}

.yaohu .home:hover {
    color: var(--p-600);
}

#wait.show {
    color: var(--text-2);
}
