/* ============================================
   流体力学虚拟仿真实验室 - 主题切换系统 v2
   完整的深色/浅色主题适配
   ============================================ */

/* ===== 深色主题（默认） ===== */
:root {
    /* 由 style.css 中的 :root 提供，此处仅补充主题系统特有变量 */
    --theme-toggle-icon: "🌙";
    --theme-glass-accent: rgba(0, 242, 255, 0.03);
    --theme-card-hover-glow: 0 20px 40px rgba(0,0,0,0.4);
    --theme-input-glow: 0 0 0 4px rgba(0, 242, 255, 0.1);
    --theme-btn-glow: 0 10px 30px -10px rgba(0, 242, 255, 0.4);
}

/* ===== 浅色主题 ===== */
[data-theme="light"] {
    /* --- 全局基底 --- */
    --bg-deep: #f0f4f8;
    --glass: rgba(255, 255, 255, 0.92);
    --border: rgba(0, 0, 0, 0.08);
    --text-primary: #1e293b;
    --text-secondary: #475569;
    --text-sub: #64748b;
    --text-muted: #94a3b8;
    --text-label: #94a3b8;

    /* --- 主题色调整 --- */
    --primary: #0284c7;
    --primary-glow: rgba(2, 132, 199, 0.25);
    --success: #059669;
    --error: #dc2626;
    --warning: #d97706;
    --danger: #e11d48;

    /* --- 阴影系统 --- */
    --shadow-heavy: rgba(0, 0, 0, 0.08);
    --shadow-medium: rgba(0, 0, 0, 0.05);
    --shadow-light: rgba(0, 0, 0, 0.03);

    /* --- 导航栏 --- */
    --nav-bg: rgba(255, 255, 255, 0.92);
    --nav-border: rgba(0, 0, 0, 0.06);

    /* --- 输入框 --- */
    --input-bg: rgba(0, 0, 0, 0.04);
    --input-bg-focus: rgba(0, 0, 0, 0.06);
    --input-border: rgba(0, 0, 0, 0.12);
    --input-label-bg: #ffffff;

    /* --- 按钮 --- */
    --btn-text: #fff;
    --btn-back-bg: rgba(0, 0, 0, 0.06);
    --btn-back-hover: rgba(0, 0, 0, 0.1);
    --btn-back-text: #334155;
    --btn-secondary-bg: #e2e8f0;
    --btn-page-bg: #f1f5f9;
    --btn-page-border: #cbd5e1;
    --btn-page-text: #475569;

    /* --- 卡片 --- */
    --card-bg: linear-gradient(145deg, rgba(255,255,255,0.9), rgba(255,255,255,0.7));
    --card-bg-hover: rgba(2, 132, 199, 0.04);
    --icon-glow: drop-shadow(0 1px 3px rgba(0,0,0,0.08));
    --icon-glow-hover: drop-shadow(0 2px 8px rgba(2, 132, 199, 0.25));
    --theme-card-hover-glow: 0 20px 40px rgba(0,0,0,0.06);

    /* --- 列表 --- */
    --list-bg: rgba(255, 255, 255, 0.7);
    --list-bg-hover: rgba(2, 132, 199, 0.04);

    /* --- 论坛 --- */
    --forum-bg: rgba(248, 250, 252, 0.9);
    --msg-bg: rgba(0, 0, 0, 0.025);
    --input-box-bg: #f8fafc;
    --msg-input-bg: rgba(0, 0, 0, 0.04);
    --msg-input-border: rgba(0, 0, 0, 0.1);
    --msg-input-text: #1e293b;
    --msg-input-placeholder: rgba(0, 0, 0, 0.3);
    --msg-input-focus-bg: rgba(0, 0, 0, 0.06);

    /* --- 管理后台 --- */
    --overlay-bg: #f0f4f8;
    --admin-h-border: #e2e8f0;
    --stat-bg: #ffffff;
    --stat-border: #e2e8f0;
    --stat-bg-hover: #f8fafc;
    --data-panel-bg: #ffffff;
    --data-panel-border: #e2e8f0;
    --table-text: #334155;
    --table-th-text: #64748b;
    --table-th-border: #e2e8f0;
    --table-td-border: #f1f5f9;

    /* --- 弹窗 --- */
    --m-content-bg: #ffffff;
    --m-content-border: rgba(0, 0, 0, 0.08);
    --m-content-shadow: rgba(0, 0, 0, 0.1);
    --edit-input-bg: #f1f5f9;
    --edit-input-border: #cbd5e1;
    --edit-input-text: #1e293b;
    --modal-overlay-bg: rgba(15, 23, 42, 0.5);
    --modal-overlay-bg-heavy: rgba(15, 23, 42, 0.6);

    /* --- 时间线 --- */
    --timeline-border: #e2e8f0;
    --t-content-bg: rgba(0, 0, 0, 0.02);
    --t-content-border: #e2e8f0;
    --t-content-text: #334155;

    /* --- Toast --- */
    --toast-bg: #1e293b;
    --toast-text: #ffffff;
    --toast-shadow: rgba(0, 0, 0, 0.15);

    /* --- 进度面板 --- */
    --progress-bg: #ffffff;
    --progress-header-bg: #f8fafc;
    --user-cell-bg: #f8fafc;
    --p-cell-bg: #f1f5f9;
    --p-cell-border: #e2e8f0;

    /* --- 排行榜 --- */
    --lb-item-border: #e2e8f0;
    --lb-name-color: #1e293b;

    /* --- 证书 --- */
    --cert-overlay-bg: rgba(15, 23, 42, 0.6);
    --cert-border: #e2e8f0;
    --cert-close-bg: rgba(0, 0, 0, 0.06);
    --cert-close-border: rgba(0, 0, 0, 0.1);
    --cert-close-text: #334155;
    --cert-close-hover: rgba(0, 0, 0, 0.1);

    /* --- Hero 区域 --- */
    --hero-title-from: #0f172a;
    --hero-title-to: #475569;
    --hero-title-shadow: none;
    --hero-subtitle-shadow: none;
    --hero-stats-bg: rgba(0, 0, 0, 0.04);
    --hero-stats-border: rgba(0, 0, 0, 0.06);
    --hero-stats-text: #475569;
    --hero-stats-shadow: 0 2px 8px rgba(0,0,0,0.04);

    /* --- 品牌 / 登录 --- */
    --brand-title-from: #0f172a;
    --brand-title-to: #0284c7;
    --brand-title-shadow: none;
    --auth-overlay-bg: rgba(241, 245, 249, 0.85);
    --switch-link-color: #94a3b8;
    --switch-link-hover: #1e293b;

    /* --- 杂项 --- */
    --footer-color: rgba(0, 0, 0, 0.25);
    --footer-border: rgba(0, 0, 0, 0.05);
    --scrollbar-thumb: #cbd5e1;
    --map-cell-bg: rgba(0, 0, 0, 0.04);
    --map-cell-border: rgba(0, 0, 0, 0.06);
    --map-cell-text: #94a3b8;
    --chal-hud-bg: rgba(0, 0, 0, 0.03);
    --chal-hud-border: rgba(0, 0, 0, 0.06);
    --cs-val-color: #1e293b;
    --upload-btn-bg: rgba(0, 0, 0, 0.04);
    --upload-btn-border: rgba(0, 0, 0, 0.1);
    --upload-btn-text: #475569;
    --level-btn-bg: rgba(0, 0, 0, 0.04);
    --level-btn-unlocked-bg: rgba(0, 0, 0, 0.06);
    --level-btn-unlocked-border: rgba(0, 0, 0, 0.12);
    --admin-h-title: #1e293b;
    --detail-border: #e2e8f0;

    /* 主题系统特有 */
    --theme-glass-accent: rgba(2, 132, 199, 0.02);
    --theme-input-glow: 0 0 0 4px rgba(2, 132, 199, 0.08);
    --theme-btn-glow: 0 10px 30px -10px rgba(2, 132, 199, 0.2);

    /* --- 关卡页面专属变量覆盖 --- */
    --panel-bg: #ffffff;
    --text-main: #1e293b;
    --secondary: #d97706;

}

/* ============================================
   浅色主题 - 视觉细节覆盖
   覆盖 inline styles 和需要 !important 的场景
   ============================================ */

/* --- 全局基底 --- */
[data-theme="light"] body {
    background: linear-gradient(160deg, #f0f4f8 0%, #e8eef5 40%, #f5f7fa 100%) !important;
    color: var(--text-primary);
    position: relative;
}

/* 亮色模式背景装饰光斑 */
[data-theme="light"] body::before {
    content: "";
    position: fixed;
    top: -200px;
    right: -150px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(2, 132, 199, 0.05) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}
[data-theme="light"] body::after {
    content: "";
    position: fixed;
    bottom: -100px;
    left: -100px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(5, 150, 105, 0.035) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

/* --- Canvas 背景降低不透明度 --- */
[data-theme="light"] #bg-canvas {
    opacity: 0.15;
}

/* --- 登录卡片 --- */
[data-theme="light"] .auth-card {
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.04);
}

/* --- Hero 区域文字 --- */
[data-theme="light"] .hero-title {
    -webkit-text-fill-color: #0f172a;
    background: none;
    text-shadow: none;
}
[data-theme="light"] .hero-subtitle {
    text-shadow: none;
    color: #0284c7;
}
[data-theme="light"] .hero-stats b {
    text-shadow: none;
}

/* --- 品牌 LOGO --- */
[data-theme="light"] .brand-title {
    -webkit-text-fill-color: #0f172a;
    background: none;
    text-shadow: none;
}
[data-theme="light"] .brand-title span {
    -webkit-text-fill-color: #0284c7;
    color: #0284c7;
}

/* --- 菜单卡片 --- */
[data-theme="light"] .menu-card {
    box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 0 0 1px rgba(0,0,0,0.03);
}
[data-theme="light"] .menu-card:hover {
    box-shadow: var(--theme-card-hover-glow), 0 0 0 1px rgba(2, 132, 199, 0.15);
}
[data-theme="light"] .menu-card h3 {
    color: #1e293b;
}

/* --- 输入框聚焦 --- */
[data-theme="light"] .auth-input:focus {
    box-shadow: var(--theme-input-glow);
}

/* --- 主按钮 --- */
[data-theme="light"] .btn-main {
    box-shadow: var(--theme-btn-glow);
    color: #fff;
}

/* --- 列表项 --- */
[data-theme="light"] .list-item {
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

/* --- 弹窗覆盖 --- */
[data-theme="light"] .m-content {
    box-shadow: 0 20px 60px rgba(0,0,0,0.08), 0 0 0 1px rgba(0,0,0,0.04);
}

/* --- 进度面板 --- */
[data-theme="light"] .progress-content {
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}

/* --- 闯关 HUD --- */
[data-theme="light"] #c-rank {
    text-shadow: none;
}
[data-theme="light"] #c-score {
    text-shadow: none;
}

/* --- 排行榜 --- */
[data-theme="light"] .lb-myself {
    background: rgba(2, 132, 199, 0.06);
}

/* --- 时间线 --- */
[data-theme="light"] .timeline-item::before {
    box-shadow: none;
}

/* --- 论坛消息 --- */
[data-theme="light"] .msg-row {
    background: rgba(0, 0, 0, 0.02);
}

/* --- 图片预览 --- */
[data-theme="light"] #img-preview,
[data-theme="light"] div[style*="background:rgba(255,255,255,0.1)"] {
    background: rgba(0, 0, 0, 0.04) !important;
}

/* ============================================
   浅色主题 - Inline Style 覆盖
   index.php 中有大量 inline style，需用高优先级选择器覆盖
   ============================================ */

/* --- 弹窗标题和文字 --- */
[data-theme="light"] #sys-modal h3,
[data-theme="light"] #sys-modal p,
[data-theme="light"] .m-content h3,
[data-theme="light"] .m-content p {
    color: #1e293b !important;
}

/* --- 排行榜弹窗 --- */
[data-theme="light"] #leaderboard-modal h3 {
    color: #b45309 !important; /* 金色标题变深 */
}
[data-theme="light"] #leaderboard-modal .lb-item span[style*="color:#666"],
[data-theme="light"] .lb-item span[style*="font-size:10px"] {
    color: #64748b !important;
}

/* --- 管理后台标题 --- */
[data-theme="light"] #admin-progress-modal h3,
[data-theme="light"] #admin-progress-modal div[style*="color:#fff"] {
    color: #1e293b !important;
}
[data-theme="light"] #admin-progress-modal div[style*="background:#080b12"] {
    background: #f8fafc !important;
    border-bottom-color: #e2e8f0 !important;
}

/* --- 进度面板头部 --- */
[data-theme="light"] div[style*="background:#080b12"] {
    background: #f8fafc !important;
}

/* --- 详情弹窗 --- */
[data-theme="light"] #detail-modal h3,
[data-theme="light"] #detail-modal div[style*="color:#fff"] {
    color: #1e293b !important;
}
[data-theme="light"] #detail-modal div[style*="color:#888"],
[data-theme="light"] #detail-modal div[style*="font-size:12px"] {
    color: #64748b !important;
}
[data-theme="light"] #detail-modal div[style*="border-bottom:1px solid #333"] {
    border-bottom-color: #e2e8f0 !important;
}

/* --- 管理后台 overlay --- */
[data-theme="light"] #admin-overlay {
    background: #f0f4f8 !important;
}
[data-theme="light"] .admin-h h2,
[data-theme="light"] .admin-h div[style*="color:#fff"] {
    color: #1e293b !important;
}
[data-theme="light"] .stat-item div[style*="color:#888"],
[data-theme="light"] .stat-item div[style*="font-size:12px"] {
    color: #64748b !important;
}
[data-theme="light"] .stat-item div[style*="color:#fff"] {
    color: #1e293b !important;
}

/* --- 数据面板标题 --- */
[data-theme="light"] .data-panel h3 {
    color: #334155 !important;
}
[data-theme="light"] .data-panel div[style*="border-bottom:1px solid #333"] {
    border-bottom-color: #e2e8f0 !important;
}

/* --- 管理后台按钮(深色背景) --- */
[data-theme="light"] .btn-k[style*="background:#333"] {
    background: #e2e8f0 !important;
    color: #475569 !important;
}
[data-theme="light"] .btn-k[style*="background:transparent"] {
    background: transparent !important;
    color: #e11d48 !important;
    border-color: #e11d48 !important;
}

/* --- 编辑弹窗 --- */
[data-theme="light"] #edit-modal .btn-k[style*="background:#333"] {
    background: #e2e8f0 !important;
    color: #475569 !important;
}
[data-theme="light"] #admin-level-modal .btn-k[style*="background:#333"] {
    background: #e2e8f0 !important;
    color: #475569 !important;
}

/* --- 证书弹窗 --- */
[data-theme="light"] #cert-preview-overlay div[style*="color:#ffb300"] {
    color: #b45309 !important;
}
[data-theme="light"] #cert-preview-overlay div[style*="color:#8b9bb4"] {
    color: #64748b !important;
}

/* --- 重置密码弹窗 --- */
[data-theme="light"] #admin-level-modal h3 {
    color: #e11d48 !important;
}
[data-theme="light"] #admin-level-modal p {
    color: #475569 !important;
}

/* --- 导航栏 --- */
[data-theme="light"] .navbar .brand-title {
    -webkit-text-fill-color: #1e293b;
    background: none;
    text-shadow: none;
}
[data-theme="light"] .navbar .brand-title span {
    -webkit-text-fill-color: #0284c7;
    color: #0284c7;
}
[data-theme="light"] .navbar span[style*="color:#777"],
[data-theme="light"] .navbar div[style*="color:#777"] {
    color: #94a3b8 !important;
}

/* --- 菜单卡片描述文字 --- */
[data-theme="light"] .menu-card p[style*="color:#666"] {
    color: #64748b !important;
}

/* --- 页脚 --- */
[data-theme="light"] .app-footer div[style*="color:rgba(255"] {
    color: rgba(0, 0, 0, 0.35) !important;
}

/* --- 登录表单辅助文字 --- */
[data-theme="light"] span[style*="color:#666"] {
    color: #94a3b8 !important;
}

/* --- 论坛图片预览 --- */
[data-theme="light"] div[style*="background:rgba(255,255,255,0.1)"][style*="padding:5px"] {
    background: rgba(0, 0, 0, 0.04) !important;
}
[data-theme="light"] span[style*="color:#aaa"] {
    color: #64748b !important;
}

/* --- 闯关大厅分隔线 --- */
[data-theme="light"] div[style*="background:rgba(255,255,255,0.1)"][style*="width:1px"] {
    background: rgba(0, 0, 0, 0.08) !important;
}

/* --- 闯关按钮(深色背景) --- */
[data-theme="light"] .btn-main[style*="background:#333"] {
    background: #e2e8f0 !important;
    color: #475569 !important;
}

/* --- 标签颜色适配（浅色下保持可见） --- */
[data-theme="light"] .tag-login { background: rgba(2, 132, 199, 0.1); color: #0369a1; }
[data-theme="light"] .tag-challenge { background: rgba(5, 150, 105, 0.1); color: #047857; }
[data-theme="light"] .tag-post { background: rgba(217, 119, 6, 0.1); color: #b45309; }

/* --- 地图格子 done 状态 --- */
[data-theme="light"] .map-cell.done {
    box-shadow: none;
}

/* --- 上传按钮 hover --- */
[data-theme="light"] .btn-upload-icon:hover {
    color: #fff !important;
}

/* --- 删除按钮 --- */
[data-theme="light"] .msg-del-btn {
    border-color: #fca5a5;
    color: #dc2626;
}
[data-theme="light"] .msg-del-btn:hover {
    background: rgba(220, 38, 38, 0.06);
}

/* ============================================
   主题切换按钮样式
   ============================================ */
.theme-toggle {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 10000;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 2px solid var(--border);
    background: var(--glass);
    backdrop-filter: blur(10px);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 10px var(--shadow-light);
}

.theme-toggle:hover {
    transform: scale(1.1);
    border-color: var(--primary);
    box-shadow: 0 0 20px var(--primary-glow);
}

/* 浅色主题下的切换按钮 */
[data-theme="light"] .theme-toggle {
    background: rgba(255, 255, 255, 0.9);
    border-color: #e2e8f0;
    color: #d97706;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

[data-theme="light"] .theme-toggle:hover {
    border-color: #d97706;
    box-shadow: 0 0 15px rgba(217, 119, 6, 0.2);
}

/* ============================================
   过渡动画 - 主题切换时平滑过渡
   ============================================ */
body, .glass-panel, .neon-card, .cyber-button,
.navbar, .hero-section, .experiment-card,
.score-display, .login-form, input, textarea, select, button,
.auth-card, .menu-card, .list-item, .forum-box, .msg-row,
.input-box, .m-content, .progress-content, .stat-item, .data-panel,
.btn-main, .btn-back, .btn-page, .btn-k, .btn-upload-icon,
.hero-stats, .hero-title, .hero-subtitle, .brand-title,
.chal-hud, #admin-overlay, .app-footer {
    transition: background-color 0.35s ease, color 0.35s ease,
                border-color 0.35s ease, box-shadow 0.35s ease,
                -webkit-text-fill-color 0.35s ease;
}

/* ============================================
   浅色主题 - 代码块/iframe 等补充
   ============================================ */
[data-theme="light"] iframe {
    border-color: #e2e8f0;
}
[data-theme="light"] .btn-main[style*="background:#ff4757"] {
    background: #e11d48 !important;
    color: #fff !important;
}

/* --- God mode 按钮 --- */
[data-theme="light"] button[style*="border:1px solid #f05"],
[data-theme="light"] button[style*="border: 1px solid #f05"] {
    border-color: #e11d48 !important;
    color: #e11d48 !important;
    background: rgba(225, 29, 72, 0.06) !important;
}

/* --- 风云榜按钮 --- */
[data-theme="light"] button[style*="border:1px solid var(--warning)"],
[data-theme="light"] button[style*="border: 1px solid var(--warning)"] {
    border-color: #d97706 !important;
    color: #d97706 !important;
    background: rgba(217, 119, 6, 0.06) !important;
}

/* --- 导出/清空等操作按钮 --- */
[data-theme="light"] .btn-k[style*="background:#0984e3"] {
    background: #0284c7 !important;
    color: #fff !important;
    border-color: #7dd3fc !important;
}
[data-theme="light"] .btn-k[style*="border:1px solid #74b9ff"] {
    border-color: #7dd3fc !important;
}
[data-theme="light"] .btn-k[style*="border:1px solid #ff6b81"] {
    border-color: #fda4af !important;
}

/* ============================================
   浅色主题 - AI 辅导面板适配（收编 fl-tutor-panel 子系统）
   该面板的深色写死分散在 ai/*.css 且带 !important，
   故在此集中用高优先级覆盖，保证浅色下协调可读。
   青蓝主色 #00f2ff→#0284c7；苏格拉底金色保留。
   ============================================ */
[data-theme="light"] .fl-tutor-panel {
    background: rgba(255, 255, 255, 0.97) !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
    box-shadow: -5px 0 30px rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .fl-tutor-panel__header {
    background: linear-gradient(135deg, rgba(2,132,199,0.08), rgba(2,132,199,0.02)) !important;
    border-bottom-color: rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .fl-tutor-panel__title { color: #0284c7 !important; }
[data-theme="light"] .fl-tutor-panel__close {
    background: rgba(0,0,0,0.05) !important; color: #64748b !important;
}
[data-theme="light"] .fl-tutor-panel__quota {
    background: rgba(2,132,199,0.05) !important; color: #64748b !important;
}
[data-theme="light"] .fl-tutor-panel__quota-count { color: #0284c7 !important; }
[data-theme="light"] .fl-tutor-panel__messages { scrollbar-color: rgba(2,132,199,0.25) transparent; }
[data-theme="light"] .fl-tutor-panel__messages::-webkit-scrollbar-thumb { background: rgba(2,132,199,0.2) !important; }
/* 消息气泡 */
[data-theme="light"] .fl-msg--user {
    background: linear-gradient(135deg, rgba(2,132,199,0.14), rgba(2,132,199,0.07)) !important;
    color: #0c4a6e !important;
}
[data-theme="light"] .fl-msg--ai {
    background: rgba(0,0,0,0.04) !important; color: #1e293b !important;
}
[data-theme="light"] .fl-msg--socratic {
    background: rgba(217,119,6,0.07) !important;
    border-color: rgba(217,119,6,0.28) !important;
}
[data-theme="light"] .fl-msg__content,
[data-theme="light"] .fl-msg__content p { color: #1e293b !important; }
[data-theme="light"] .fl-msg__citations-title { color: #64748b !important; }
[data-theme="light"] .fl-msg__citations-title:hover { color: #0284c7 !important; }
[data-theme="light"] .fl-msg__citations-list { background: rgba(2,132,199,0.04) !important; color: #475569 !important; }
[data-theme="light"] .fl-msg__delete { color: #94a3b8 !important; }
[data-theme="light"] .fl-feedback-btn { color: #64748b !important; border-color: rgba(0,0,0,0.12) !important; }
/* 输入区 */
[data-theme="light"] .fl-tutor-panel__input-area {
    background: rgba(248,250,252,0.95) !important; border-top-color: rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .fl-tutor-panel__input {
    background: #ffffff !important; color: #1e293b !important; border-color: rgba(0,0,0,0.12) !important;
}
[data-theme="light"] .fl-tutor-panel__input::placeholder { color: #94a3b8 !important; }
[data-theme="light"] .fl-tutor-panel__send { color: #fff !important; }
/* 悬浮唤起按钮/气泡若为深色也压浅 */
[data-theme="light"] .fl-tutor-fab, [data-theme="light"] .fl-guidance-bubble {
    background: rgba(255,255,255,0.97) !important; color: #1e293b !important;
    border-color: rgba(0,0,0,0.08) !important;
}

/* ============================================
   浅色主题 - 闯关模式数据 HUD 适配（chal-hud-v2）
   该 HUD 定义在 index.php 内联 <style>，深底写死，
   浅色下未适配会成突兀深灰横条，故此处覆盖。
   ============================================ */
[data-theme="light"] .chal-hud-v2 {
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08), 0 0 30px rgba(2,132,199,0.04) !important;
}
[data-theme="light"] .chal-stat-lbl { color: #64748b !important; }
[data-theme="light"] .chal-stat-val { color: #0284c7 !important; }
[data-theme="light"] .chal-stat-progress { color: #059669 !important; }
[data-theme="light"] .chal-stat-icon { filter: drop-shadow(0 0 6px rgba(2,132,199,0.25)) !important; }
[data-theme="light"] .chal-section-title,
[data-theme="light"] .chal-section-title span { color: #475569 !important; }

/* ============================================
   浅色主题 - 闯关模式「你的旅程」章节故事卡片适配
   (.story-chapter-card / .story-level-path 等)
   该子系统整套深底+白色半透文字写死在 style.css，未做浅色适配，
   浅色下 --glass 解析成近白 → 关卡路径区大面积突兀白底 +
   白色半透文字/连线在白底上几乎隐形。此处统一覆盖为浅青灰体系。
   ============================================ */
/* 卡片外框：浅青白玻璃底 */
[data-theme="light"] .story-chapter-card {
    background: rgba(255, 255, 255, 0.72) !important;
    border-color: rgba(2,132,199,0.10) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06), 0 0 30px rgba(2,132,199,0.03) !important;
}
[data-theme="light"] .story-chapter-card:hover {
    box-shadow: 0 8px 28px rgba(2,132,199,0.14) !important;
    border-color: rgba(2,132,199,0.18) !important;
}
/* 头部：浅青渐变条 */
[data-theme="light"] .story-chapter-header {
    background: linear-gradient(180deg, rgba(2,132,199,0.06), rgba(2,132,199,0.02)) !important;
    border-bottom-color: rgba(2,132,199,0.08) !important;
}
[data-theme="light"] .story-chapter-progress { color: #64748b !important; }
/* 引言：深灰斜体 */
[data-theme="light"] .story-chapter-intro {
    color: #64748b !important;
    border-bottom-color: rgba(2,132,199,0.06) !important;
}
/* 角色行 */
[data-theme="light"] .story-characters { border-bottom-color: rgba(2,132,199,0.06) !important; }
[data-theme="light"] .story-char-item { color: #64748b !important; }
[data-theme="light"] .story-char-avatar {
    background: rgba(2,132,199,0.06) !important;
    border-color: rgba(2,132,199,0.14) !important;
}
/* 关卡路径区：那块刺眼白底 → 极浅青灰渐变，与页面 #f0f4f8 协调 */
[data-theme="light"] .story-level-path {
    background: linear-gradient(180deg, rgba(236,244,250,0.55), rgba(240,244,248,0.35)) !important;
}
[data-theme="light"] .story-level-section-label { color: #94a3b8 !important; }
/* 节点间连接线：浅灰可见 */
[data-theme="light"] .story-level-node:not(:last-child)::after {
    background: rgba(2,132,199,0.14) !important;
}
/* 节点文字：深色 */
[data-theme="light"] .story-node-title { color: #475569 !important; }
[data-theme="light"] .story-level-node.locked .story-node-title { color: #cbd5e1 !important; }
[data-theme="light"] .story-level-node.locked .story-node-num { color: #cbd5e1 !important; }
/* 锁定节点圆点：浅灰底深字（原白色半透在浅底隐形） */
[data-theme="light"] .story-node-circle.locked {
    background: rgba(148,163,184,0.10) !important;
    border-color: rgba(148,163,184,0.30) !important;
    color: #94a3b8 !important;
}

/* ================================================================
   浅色主题 · 配色秩序化精修 (LIGHT HARMONY REFINEMENT)
   目标：把深色主题遗留的高饱和霓虹强调色(粉/橙/青/绿)在白底上的
   杂乱感彻底整治，建立"中性为主、单一主色强调"的层级秩序，
   达到克制、统一、高级的产品级视觉。
   —— 只在 [data-theme="light"] 生效，深色主题完全不受影响。
   主色板：primary #0284c7 / success #059669 / 中性 slate 系
   ================================================================ */

/* ---------- 1) 顶部导航胶囊：从"四色霓虹"→"统一中性 + 单一主色" ----------
   原 index.php 内联写死 #f05/橙/青/绿，白底下像一排彩色贴纸。
   统一为浅灰中性胶囊，emoji 已足够区分功能，无需靠颜色喊叫。 */
[data-theme="light"] #god-btn,
[data-theme="light"] #nav-leaderboard,
[data-theme="light"] #notif-btn,
[data-theme="light"] #nav-teacher {
    border: 1px solid rgba(15, 23, 42, 0.10) !important;
    color: #334155 !important;
    background: rgba(15, 23, 42, 0.035) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
    transition: background .18s ease, border-color .18s ease, color .18s ease !important;
}
[data-theme="light"] #god-btn:hover,
[data-theme="light"] #nav-leaderboard:hover,
[data-theme="light"] #notif-btn:hover,
[data-theme="light"] #nav-teacher:hover {
    background: rgba(15, 23, 42, 0.06) !important;
    border-color: rgba(15, 23, 42, 0.16) !important;
    color: #0f172a !important;
    filter: none !important;
}
/* 仅"消息"作为主入口保留一丝主色暗示（悬停时点亮），其余保持中性 */
[data-theme="light"] #notif-btn:hover {
    color: #0284c7 !important;
    border-color: rgba(2,132,199,0.35) !important;
    background: rgba(2,132,199,0.06) !important;
}
/* 消息未读红点：降饱和为柔和珊瑚红，不刺眼 */
[data-theme="light"] #notif-badge {
    background: #ef4444 !important;
    box-shadow: 0 1px 3px rgba(239,68,68,0.35) !important;
}

/* ---------- 2) 闯关模式 Hero 横幅：霓虹青 → 柔雾蓝，去电子发光 ---------- */
[data-theme="light"] .chal-hero {
    background: linear-gradient(135deg, rgba(2,132,199,0.06) 0%, rgba(2,132,199,0.02) 100%) !important;
    border-bottom: 1px solid rgba(2,132,199,0.10) !important;
}
[data-theme="light"] .chal-hero-glow {
    background: radial-gradient(ellipse, rgba(2,132,199,0.06) 0%, transparent 70%) !important;
}
/* 旗帜图标：去掉刺眼青色光晕，换柔和阴影 + 停用脉冲 */
[data-theme="light"] .chal-hero-icon {
    filter: drop-shadow(0 2px 6px rgba(2,132,199,0.18)) !important;
    animation: none !important;
}
/* 标题：实心深蓝→主色渐变，稳重清晰（原白→霓虹青在白底几乎看不清） */
[data-theme="light"] .chal-hero-title {
    background: linear-gradient(90deg, #0f172a 0%, #0284c7 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: none !important;
}
[data-theme="light"] .chal-hero-sub {
    color: #64748b !important;
}
[data-theme="light"] .ver-badge {
    color: #0284c7 !important;
    text-shadow: none !important;
}
/* 145关 徽章：柔和主色描边，去霓虹外发光 */
[data-theme="light"] .chal-hero-badge {
    background: linear-gradient(135deg, rgba(2,132,199,0.10), rgba(2,132,199,0.03)) !important;
    border: 1.5px solid rgba(2,132,199,0.28) !important;
    box-shadow: 0 2px 10px rgba(2,132,199,0.10) !important;
}
[data-theme="light"] .chal-badge-num { color: #0284c7 !important; }
[data-theme="light"] .chal-badge-lbl { color: #64748b !important; }

/* ---------- 3) 统计卡数字：统一主色层级，去三色跳跃 ----------
   原青/橙/绿三色并列。统一为：主要指标主色蓝，进度用稳重绿点缀，
   使三者同属一个语义体系而非各自为政。(已有 .chal-stat-val=#0284c7)  */
[data-theme="light"] .chal-stat-divider {
    background: rgba(15,23,42,0.08) !important;
}

/* ---------- 4) 关卡节点圆圈：去廉价霓虹发光 → 克制填充 + 柔阴影 ----------
   原 done 绿光/unlocked 青光 + 脉冲在白底显廉价。改低饱和实感设计：
   状态靠"填充深浅 + 细腻阴影"区分，仅当前关保留极轻主色提示。 */
/* 已完成：稳重绿，柔和不发光 */
[data-theme="light"] .story-node-circle.done {
    background: linear-gradient(135deg, rgba(5,150,105,0.14), rgba(5,150,105,0.06)) !important;
    border-color: rgba(5,150,105,0.45) !important;
    color: #059669 !important;
    box-shadow: 0 2px 6px rgba(5,150,105,0.14) !important;
}
[data-theme="light"] .story-level-node.done:hover .story-node-circle {
    box-shadow: 0 4px 12px rgba(5,150,105,0.22) !important;
    transform: scale(1.06) !important;
}
[data-theme="light"] .story-level-node.done:not(:last-child)::after {
    background: linear-gradient(90deg, rgba(5,150,105,0.35), rgba(5,150,105,0.10)) !important;
}
/* 当前可挑战：主色蓝，极轻脉冲（保留"当前在这"的引导，但不刺眼） */
[data-theme="light"] .story-node-circle.unlocked {
    background: linear-gradient(135deg, rgba(2,132,199,0.14), rgba(2,132,199,0.05)) !important;
    border-color: rgba(2,132,199,0.45) !important;
    color: #0284c7 !important;
    box-shadow: 0 2px 8px rgba(2,132,199,0.14) !important;
    animation: storyPulseLight 2.8s ease-in-out infinite !important;
}
@keyframes storyPulseLight {
    0%, 100% { box-shadow: 0 2px 8px rgba(2,132,199,0.12); }
    50%       { box-shadow: 0 3px 14px rgba(2,132,199,0.24); }
}
[data-theme="light"] .story-level-node.unlocked:hover .story-node-circle {
    transform: scale(1.08) !important;
    box-shadow: 0 4px 14px rgba(2,132,199,0.26) !important;
}
[data-theme="light"] .story-level-node.unlocked:not(:last-child)::after {
    background: linear-gradient(90deg, rgba(2,132,199,0.30), rgba(2,132,199,0.08)) !important;
}

/* ---------- 5) 主行动按钮 & 胶囊扁平化：收束最后的高亮焦点 ----------
   "继续挑战/开始旅程"原为霓虹青渐变+黑字+强青光，是全页最吵的元素。
   改为稳重实心主色蓝+白字+柔阴影，成为克制而明确的主按钮。 */
[data-theme="light"] .chal-btn-primary {
    background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(2,132,199,0.22) !important;
}
[data-theme="light"] .chal-btn-primary:hover {
    box-shadow: 0 6px 20px rgba(2,132,199,0.32) !important;
    transform: translateY(-1px) !important;
}
/* 顶部导航胶囊：再降存在感，趋于扁平（去多余阴影） */
[data-theme="light"] #god-btn,
[data-theme="light"] #nav-leaderboard,
[data-theme="light"] #notif-btn,
[data-theme="light"] #nav-teacher {
    box-shadow: none !important;
    font-weight: 600 !important;
}

/* ============================================
   关卡页面亮色模式 - 硬编码深色样式覆盖
   ============================================ */

/* 侧边栏/面板 */
[data-theme=light] #control-panel,
[data-theme=light] .sidebar,
[data-theme=light] .panel {
    background: var(--panel-bg) !important;
    box-shadow: 2px 0 12px rgba(0,0,0,0.06);
}

/* 选项按钮 */
[data-theme=light] .option-btn {
    background: rgba(0,0,0,0.03) !important;
    color: #334155 !important;
    border-color: rgba(0,0,0,0.1) !important;
}
[data-theme=light] .option-btn:hover {
    background: rgba(2,132,199,0.08) !important;
    border-color: #0284c7 !important;
}
[data-theme=light] .option-btn.selected {
    background: rgba(2,132,199,0.12) !important;
    border-color: #0284c7 !important;
    color: #0284c7 !important;
}
[data-theme=light] .option-btn.correct {
    background: rgba(5,150,105,0.12) !important;
    border-color: #059669 !important;
    color: #059669 !important;
}
[data-theme=light] .option-btn.wrong {
    background: rgba(220,38,38,0.1) !important;
    border-color: #dc2626 !important;
    color: #dc2626 !important;
}

/* 操作按钮 */
[data-theme=light] .action-btn {
    background: rgba(0,0,0,0.04) !important;
    color: #334155 !important;
    border-color: rgba(0,0,0,0.1) !important;
}
[data-theme=light] .action-btn:hover {
    background: rgba(2,132,199,0.1) !important;
    border-color: #0284c7 !important;
}
[data-theme=light] .action-btn.correct {
    background: rgba(5,150,105,0.12) !important;
    border-color: #059669 !important;
    color: #059669 !important;
}
[data-theme=light] .action-btn.wrong {
    background: rgba(220,38,38,0.1) !important;
    border-color: #dc2626 !important;
    color: #dc2626 !important;
}

/* 统计卡片 */
[data-theme=light] .stat-card {
    background: rgba(0,0,0,0.03) !important;
    border-left-color: #94a3b8 !important;
}

/* 下拉选择框 */
[data-theme=light] select {
    background: #f1f5f9 !important;
    color: #1e293b !important;
    border-color: rgba(0,0,0,0.1) !important;
}

/* 文本颜色覆盖 */
[data-theme=light] .panel-desc,
[data-theme=light] .desc-text,
[data-theme=light] .hint-text {
    color: #475569 !important;
}

/* 底部信息栏 */
[data-theme=light] .bottom-bar,
[data-theme=light] .info-bar {
    background: rgba(0,0,0,0.02) !important;
}

/* Canvas实验区域 - 降低深色canvas不透明度 */
[data-theme=light] canvas {
    border-color: rgba(0,0,0,0.1) !important;
}