/* ============================================
 * preview.html 样式表
 * 从 preview.html 中抽离，便于维护
 * 已集成 premium-enhance.css 微光玻璃拟态
 * ============================================ */

@import "design-tokens.css";

:root {
    /* 页面独有渐变色 - 不与 theme.css 冲突 */
    --gradient-1: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --gradient-2: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    --gradient-3: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    --gradient-4: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
    --shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    --shadow-hover: 0 12px 40px rgba(0, 0, 0, 0.15);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { 
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; 
    min-height: 100vh;
    color: var(--text-primary);
    background: radial-gradient(circle at 20% 30%, var(--page-bg-start), var(--page-bg-end));
    animation: pageFadeIn 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    font-size: 16px; /* 视力友好基础字号 */
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 0.01em;
}



.container {
    width: 100%;
    max-width: 100%;
    padding: 2px 10px 2px;
    position: relative;
    z-index: 1;
}

.material-header {
    background: rgba(10, 12, 26, 0.6);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(124, 58, 237, 0.2);
    border-radius: 10px;
    padding: 5px 14px;
    box-shadow: 0 2px 12px rgba(124, 58, 237, 0.06);
    margin-bottom: 5px;
    display: flex; justify-content: space-between; align-items: center;
    position: relative;
    overflow: hidden;
}
.material-header::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(124,58,237,0.2), rgba(217,119,6,0.1), transparent);
    pointer-events: none;
}
.material-header::after {
    content: '✦';
    position: absolute;
    top: 4px; right: 10px;
    font-size: 8px;
    color: rgba(167,139,250,0.15);
    pointer-events: none;
}
.material-title { font-size: 15px; background: var(--primary-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: 700; letter-spacing: -0.3px; position: relative; }
.material-title::before {
    content: '📖';
    font-size: 12px;
    margin-right: 4px;
    -webkit-text-fill-color: initial;
    display: inline-block;
}
.material-meta { color: var(--text-secondary); font-size: 11px; margin-top: 1px; line-height: 1.4; }

.main-layout {
    display: flex;
    gap: 0;
    height: calc(100vh - 95px);
    align-items: stretch;
    justify-content: center;
    position: relative;
}

.sidebar {
    background: rgba(10, 12, 26, 0.6);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(124, 58, 237, 0.15);
    border-radius: 12px;
    padding: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: none;
    width: 28%;
    min-width: 250px;
    max-width: 900px;
    isolation: isolate;
    max-height: calc(100vh - 100px);
    position: relative;
    box-shadow: 0 4px 20px rgba(124,58,237,0.06), inset 0 1px 0 rgba(167,139,250,0.08);
}
.sidebar::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(167,139,250,0.25), transparent);
    pointer-events: none;
}

/* ===== 新 React 布局：侧边栏上下分区 ===== */
.sidebar-agent {
    padding: 6px 8px 3px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.sidebar-cards {
    padding: 1px 8px 3px 8px;
    overflow: auto;
    min-height: 0;
}
.sidebar-divider {
    height: 1px;
    background: rgba(255,255,255,0.06);
    margin: 0 8px;
    flex-shrink: 0;
}

/* AI 对话容器（保留原有 .cards-panel 等定义） */

/* 快捷操作按钮行 */
.agent-quick-buttons {
    display: flex;
    gap: 3px;
    padding: 3px 6px;
    flex-shrink: 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

/* 自定义滚动条（暗色模式） */

.ppt-section {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    position: relative;     /* ★ 创建层叠上下文，在手绘装饰之上 */
    z-index: 5;
}
.ppt-content-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    position: relative;
}
.ppt-viewer {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(10, 12, 26, 0.5);
    border-radius: 8px;
    position: relative;
    overflow: visible;
    padding: 5px;
    min-height: 100px;
    z-index: 5;
    max-height: 100%;
}
#pptxPreviewContainer {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;     /* ★ 卡片不被裁剪 */
}
.annotation-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;  /* ★ 不阻挡图片点击，但卡片子元素可点 */
    z-index: 10;
}
.annotation-overlay > .draggable-card {
    pointer-events: auto;  /* ★ 卡片本身可交互 */
}
[data-theme="day"] .ppt-viewer {
    background: #f8fafc;
    border: 1px solid #eef2f7;
}

.cards-panel { flex: 1; display: flex; flex-direction: column; overflow: hidden; min-height: 0; }

.cards-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; flex-shrink: 0; }
.cards-list { flex: 1; overflow-y: auto; min-height: 0; }

/* 自定义滚动条（暗色模式） */
.cards-list::-webkit-scrollbar { width: 5px; }
.cards-list::-webkit-scrollbar-track { background: transparent; }
.cards-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 3px; }
.cards-list::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.3); }

/* 地球动画容器 */
.earth-sidebar-container {
    padding: 30px 20px; text-align: center; display: flex; flex-direction: column;
    align-items: center; justify-content: flex-start; min-height: 100%; overflow-y: auto; box-sizing: border-box;
}
.earth-sidebar-title { font-size: 24px; font-weight: bold; margin-bottom: 10px; background: var(--gradient-1); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.earth-sidebar-subtitle { font-size: 14px; color: rgba(240,243,255,0.5); margin-bottom: 30px; }
.earth-sidebar-sphere { width: 100px; height: 100px; margin: 0 auto 25px; position: relative; flex-shrink: 0; }
.earth-sidebar-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; width: 100%; flex-shrink: 0; }
.earth-sidebar-feature-card { padding: 12px; border-radius: 10px; transition: transform 0.2s; }
.earth-sidebar-feature-card:hover { transform: translateY(-2px); }
.earth-sidebar-feature-icon { font-size: 22px; margin-bottom: 5px; }
.earth-sidebar-feature-title { font-size: 11px; font-weight: 600; margin-bottom: 3px; color: #1a1a1a !important; }
.earth-sidebar-feature-desc { font-size: 9px; color: #1a1a1a !important; font-weight: 500; }
.earth-sidebar-hint { margin-top: 20px; padding: 12px; background: rgba(var(--primary-rgb), 0.08); border-radius: 8px; width: 100%; }
.earth-sidebar-hint p { font-size: 11px; color: var(--primary); margin: 0; }

@keyframes pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.05); opacity: 0.8; } }

@keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* ═══ 小地球加载动画（纯CSS，无外部依赖）═══ */
.globe-loading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 0;
}
.globe-sphere-wrapper {
    width: 90px;
    height: 90px;
    position: relative;
    margin-bottom: 24px;
    flex-shrink: 0;
}
/* 地球主体 — 渐变球体 + 呼吸光晕 */
.globe-core {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #4facfe 0%, #00f2fe 30%, #667eea 60%, #764ba2 100%);
    box-shadow:
        0 0 40px rgba(102,126,234,0.35),
        0 0 80px rgba(102,126,234,0.12),
        inset 0 -8px 20px rgba(0,0,0,0.25);
    position: relative;
    overflow: hidden;
    animation: globePulse 2.5s ease-in-out infinite;
}
/* 大陆轮廓 — 用多个半透明不规则色块模拟 */
.globe-core::before {
    content: '';
    position: absolute;
    top: -10%;
    left: -15%;
    width: 120%;
    height: 120%;
    background:
        radial-gradient(ellipse at 30% 40%, rgba(16,185,129,0.35) 0%, transparent 35%),
        radial-gradient(ellipse at 60% 30%, rgba(52,211,153,0.25) 0%, transparent 30%),
        radial-gradient(ellipse at 70% 60%, rgba(16,185,129,0.20) 0%, transparent 25%),
        radial-gradient(ellipse at 20% 70%, rgba(52,211,153,0.20) 0%, transparent 30%),
        radial-gradient(ellipse at 45% 75%, rgba(16,185,129,0.15) 0%, transparent 25%);
    animation: globeShift 8s ease-in-out infinite alternate;
}
/* 高光反射 */
.globe-core::after {
    content: '';
    position: absolute;
    top: 8%;
    left: 12%;
    width: 35%;
    height: 30%;
    border-radius: 50%;
    background: radial-gradient(ellipse at center, rgba(255,255,255,0.4) 0%, transparent 70%);
    animation: globeHighlight 3s ease-in-out infinite alternate;
}
/* 经线网格 — 纵向旋转 */
.globe-grid {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    animation: globeSpin 6s linear infinite;
    pointer-events: none;
}
.globe-grid::before,
.globe-grid::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.15) 20%, rgba(255,255,255,0.25) 50%, rgba(255,255,255,0.15) 80%, transparent);
    transform: translateX(-50%);
}
.globe-grid::after {
    width: 100%;
    height: 1px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background: linear-gradient(to right, transparent, rgba(255,255,255,0.12) 20%, rgba(255,255,255,0.20) 50%, rgba(255,255,255,0.12) 80%, transparent);
}
/* 纬线 — 横向 */
.globe-lat-line {
    position: absolute;
    left: 8%;
    width: 84%;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(255,255,255,0.08) 30%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0.08) 70%, transparent);
    pointer-events: none;
}
.globe-lat-line:nth-child(1) { top: 25%; }
.globe-lat-line:nth-child(2) { top: 75%; }
.globe-lat-line:nth-child(3) { top: 50%; }

/* 公转轨道环 */
.globe-orbit {
    position: absolute;
    top: -8px;
    left: -8px;
    width: calc(100% + 16px);
    height: calc(100% + 16px);
    border: 1.5px solid rgba(102,126,234,0.15);
    border-radius: 50%;
    animation: globeSpin 12s linear infinite reverse;
    pointer-events: none;
}
.globe-orbit::before {
    content: '';
    position: absolute;
    top: -3px;
    left: 50%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(167,139,250,0.5);
    box-shadow: 0 0 8px rgba(167,139,250,0.3);
    transform: translateX(-50%);
}
.globe-orbit-outer {
    position: absolute;
    top: -16px;
    left: -16px;
    width: calc(100% + 32px);
    height: calc(100% + 32px);
    border: 1px dashed rgba(118,75,162,0.12);
    border-radius: 50%;
    animation: globeSpin 18s linear infinite;
    pointer-events: none;
}
.globe-orbit-outer::after {
    content: '';
    position: absolute;
    bottom: -3px;
    left: 50%;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(79,70,229,0.35);
    box-shadow: 0 0 6px rgba(79,70,229,0.2);
    transform: translateX(-50%);
}

@keyframes globePulse {
    0%, 100% { box-shadow: 0 0 40px rgba(102,126,234,0.35), 0 0 80px rgba(102,126,234,0.12), inset 0 -8px 20px rgba(0,0,0,0.25); }
    50% { box-shadow: 0 0 55px rgba(102,126,234,0.50), 0 0 100px rgba(102,126,234,0.18), inset 0 -8px 20px rgba(0,0,0,0.25); }
}
@keyframes globeSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes globeShift {
    0% { transform: translate(-3%, -2%) scale(1); }
    33% { transform: translate(2%, -1%) scale(1.02); }
    66% { transform: translate(-1%, 2%) scale(0.98); }
    100% { transform: translate(3%, -2%) scale(1.01); }
}
@keyframes globeHighlight {
    0% { opacity: 0.6; transform: translate(0, 0); }
    50% { opacity: 1; transform: translate(2px, -1px); }
    100% { opacity: 0.6; transform: translate(0, 0); }
}
/* 日间模式小地球 — 更清爽的颜色 */
[data-theme="day"] .globe-core {
    background: radial-gradient(circle at 35% 35%, #60a5fa 0%, #38bdf8 30%, #6366f1 60%, #8b5cf6 100%);
    box-shadow:
        0 0 40px rgba(99,102,241,0.20),
        0 0 80px rgba(99,102,241,0.06),
        inset 0 -8px 20px rgba(0,0,0,0.15);
}
[data-theme="day"] .globe-core::before {
    background:
        radial-gradient(ellipse at 30% 40%, rgba(16,185,129,0.25) 0%, transparent 35%),
        radial-gradient(ellipse at 60% 30%, rgba(52,211,153,0.18) 0%, transparent 30%),
        radial-gradient(ellipse at 70% 60%, rgba(16,185,129,0.15) 0%, transparent 25%),
        radial-gradient(ellipse at 20% 70%, rgba(52,211,153,0.15) 0%, transparent 30%),
        radial-gradient(ellipse at 45% 75%, rgba(16,185,129,0.10) 0%, transparent 25%);
}
[data-theme="day"] .globe-grid::before { background: linear-gradient(to bottom, transparent, rgba(79,110,246,0.15) 20%, rgba(79,110,246,0.25) 50%, rgba(79,110,246,0.15) 80%, transparent); }
[data-theme="day"] .globe-grid::after { background: linear-gradient(to right, transparent, rgba(79,110,246,0.12) 20%, rgba(79,110,246,0.20) 50%, rgba(79,110,246,0.12) 80%, transparent); }
[data-theme="day"] .globe-lat-line { background: linear-gradient(to right, transparent, rgba(79,110,246,0.10) 30%, rgba(79,110,246,0.15) 50%, rgba(79,110,246,0.10) 70%, transparent); }
[data-theme="day"] .globe-orbit { border-color: rgba(99,102,241,0.15); }
[data-theme="day"] .globe-orbit::before { background: rgba(99,102,241,0.4); box-shadow: 0 0 6px rgba(99,102,241,0.2); }
[data-theme="day"] .globe-orbit-outer { border-color: rgba(99,102,241,0.10); }
[data-theme="day"] .globe-orbit-outer::after { background: rgba(79,70,229,0.25); box-shadow: 0 0 6px rgba(79,70,229,0.15); }

/* ═══ PPT 覆盖层标注卡片（拖拽卡片）═══ */
.draggable-card {
    position: absolute;
    cursor: grab;
    font-size: 12px;
    line-height: 1.5;
    color: #f0f3ff;
    user-select: none;
    z-index: 100;
}

/* ★ 折叠态：仅小图标，无大背景 */
.draggable-card[data-expanded="false"] {
    min-width: auto !important;
    max-width: none !important;
    width: 14px !important;
    height: 14px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

/* ★ 展开态：完整卡片 */
.draggable-card[data-expanded="true"] {
    min-width: 140px;
    max-width: 220px;
    padding: 0;
    border-radius: 12px;
    background: transparent;
}
.draggable-card:hover {
    z-index: 200;
}
.draggable-card.dragging {
    cursor: grabbing !important;
    opacity: 0.92;
}

/* 日间模式 — 干净明亮卡片 */
[data-theme="day"] .draggable-card[data-expanded="true"] {
    background: transparent;
}
.draggable-card .card-actions {
    position: absolute;
    top: 6px;
    right: 6px;
    display: flex;
    gap: 2px;
    opacity: 0;
    transition: opacity 0.2s;
}
.draggable-card:hover .card-actions { opacity: 1; }
/* mini-btn 基础样式（夜间默认）— 由 734 行统一定义，此处保留兼容 */
.draggable-card .mini-btn {
    width: 24px; height: 24px;
    border: 1px solid rgba(255,255,255,0.08); border-radius: 6px;
    background: rgba(255,255,255,0.06);
    color: #94a3b8;
    font-size: 11px;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.draggable-card .mini-btn:hover { background: rgba(255,255,255,0.10); border-color: rgba(255,255,255,0.15); color: #e2e8f0; }
[data-theme="day"] .draggable-card .mini-btn {
    background: #fff !important;
    border-color: #e2e8f0 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
    color: #64748b !important;
}
[data-theme="day"] .draggable-card .mini-btn:hover {
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
}

.draggable-card .annotation-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 4px;
    opacity: 0.85;
}
.draggable-card .annotation-label .card-type-icon { font-size: 11px; }

.draggable-card .annotation-text {
    font-size: 13px;
    line-height: 1.6;
    color: var(--text-primary, #f0f3ff);
    word-break: break-word;
    max-height: 120px;
    overflow-y: auto;
}
[data-theme="day"] .draggable-card .annotation-text {
    color: #1e293b;
}

.draggable-card .annotation-text::-webkit-scrollbar { width: 3px; }
.draggable-card .annotation-text::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.2); border-radius: 2px;
}
[data-theme="day"] .draggable-card .annotation-text::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.15);
}

.draggable-card .card-resize-handle {
    position: absolute;
    right: 2px; bottom: 2px;
    width: 14px; height: 14px;
    cursor: nwse-resize;
    background: radial-gradient(circle, rgba(255,255,255,0.25) 1px, transparent 1px);
    background-size: 4px 4px;
    border-radius: 0 0 14px 0;
}

/* 页码分组卡片 */
.page-group { margin-bottom: 14px; }
.page-group h4 { font-size: 13px; color: var(--primary-glow); margin: 0 0 8px 0; cursor: pointer; display: flex; align-items: center; gap: 6px; }
.page-group h4 i { transition: transform 0.2s; }
.page-group.collapsed .page-cards { display: none; }
.page-group .page-cards { display: block; }

.card-item {
    background: rgba(10, 12, 26, 0.7); backdrop-filter: blur(8px);
    border-radius: 10px; padding: 8px 10px; margin-bottom: 6px;
    border-left: 4px solid; transition: all 0.2s;
}
.card-item.explanation { border-left-color: var(--warning); }   /* 🟠 橙 - 讲解 */
.card-item.supplement  { border-left-color: var(--success); }   /* 🟢 绿 - 补充 */
.card-item.note        { border-left-color: var(--accent-purple); }   /* 🟣 紫 - 笔记 */

/* 新5大类型：question / keypoint（需要独立的夜间模式定义） */
.card-item.question    { border-left-color: var(--primary-light); }   /* 柔紫 - 题目 */
.card-item.keypoint    { border-left-color: #fbbf24; }               /* 琥珀金 - 考点 */

/* ---- 向后兼容：旧类型映射到新样式 ---- */
.card-item.exam            { border-left-color: var(--primary-light); } /* → question 柔紫 */
.card-item.example         { border-left-color: var(--primary-light); }
.card-item.exercise        { border-left-color: var(--primary-light); }
.card-item.error           { border-left-color: var(--primary-light); }
.card-item.knowledge       { border-left-color: #fbbf24; } /* → keypoint 琥珀金 */
.card-item.teacher_emphasis{ border-left-color: #f472b6; } /* → explanation 粉紫 */
.card-item.teacher_tip     { border-left-color: #f472b6; }
.card-item.teacher_reminder{ border-left-color: #f472b6; }
.card-item.user_note       { border-left-color: var(--accent-purple); } /* → note */

.card-item .card-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
}
.card-item .card-header-row .card-title { font-weight: 600; font-size: 13px; color: var(--text-primary); text-shadow: 0 1px 2px rgba(0,0,0,0.5); margin-bottom: 0; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.source-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 10px;
    padding: 2px 8px;
    border-radius: 10px;
    white-space: nowrap;
    font-weight: 500;
    flex-shrink: 0;
    cursor: default;
    transition: all 0.2s;
}
.source-badge:hover { transform: scale(1.08); filter: brightness(1.1); }

/* 来源筛选区 */
.source-filter-title {
    font-size: 11px;
    color: var(--muted);
    margin-bottom: 6px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.source-filter-items {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.source-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.04);
    color: var(--muted);
    font-size: 11px;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.source-filter-chip:hover { background: rgba(255,255,255,0.08); transform: translateY(-1px); }
.source-filter-chip.active { box-shadow: 0 0 8px rgba(var(--primary-rgb),0.3); }
.source-filter-chip .source-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 700;
}

.card-item .card-title { font-weight: 600; margin-bottom: 2px; font-size: 12px; color: var(--text-primary); }
.card-item .card-content { font-size: 11px; color: var(--text-primary); margin-bottom: 3px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; }
/* ★ ReactMarkdown 生成的 <p> 标签消除默认 margin，避免大空行 */
.card-item .card-content p { margin: 0; }
.card-item .card-content p + p { margin-top: 4px; }
.card-item .card-content ul, .card-item .card-content ol { margin: 2px 0; padding-left: 14px; }
.card-item .card-content li { margin: 1px 0; }
.card-item .card-actions { display: flex; gap: 6px; justify-content: flex-end; }
.card-item .exam-answer-toggle { background: none; border: none; color: var(--primary-glow); cursor: pointer; font-size: 12px; padding: 4px 8px; border-radius: 4px; transition: all 0.2s; }
.card-item .exam-answer-toggle:hover { background: rgba(var(--primary-rgb), 0.2); }

.current-page-highlight { background: rgba(var(--primary-rgb), 0.2); border-radius: 8px; padding: 2px 6px; font-size: 11px; color: var(--primary-glow); font-weight: 600; }
.card-item.empty { text-align: center; color: var(--text-secondary); padding: 40px; background: transparent; border: 2px dashed var(--glass-border); }
.card-item.empty a { color: var(--primary-glow); text-decoration: none; }
.card-item.empty a:hover { text-decoration: underline; }

.annotation-section {
    background: var(--glass-bg); backdrop-filter: blur(20px);
    border: 1px solid var(--glass-border); border-radius: 16px; padding: 12px;
    box-shadow: var(--shadow); overflow: hidden; max-height: 100%;
    display: flex; flex-direction: column; position: relative;
}
.annotation-content-wrapper { flex: 1; overflow-y: auto; overflow-x: visible; min-height: 0; border-radius: 12px; }
.section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--glass-border); }
.section-title { font-size: 14px; font-weight: 600; color: var(--text-primary); }

.annotation-tabs { display: flex; gap: 6px; margin-bottom: 8px; flex-wrap: wrap; }
.tab-btn { padding: 4px 10px; border: none; border-radius: 30px; cursor: pointer; font-size: 12px; transition: all 0.2s; display: flex; align-items: center; gap: 4px; background: rgba(255,255,255,0.1); color: var(--text-secondary); }
/* ===== Tab 按钮激活态渐变色（新5大类型） ===== */
.tab-btn.question.active    { background: var(--primary-gradient); color: white; }
.tab-btn.keypoint.active    { background: var(--accent-gradient); color: white; }
.tab-btn.explanation.active { background: var(--primary-gradient); color: white; }
.tab-btn.supplement.active  { background: var(--success-gradient); color: white; }
.tab-btn.note.active        { background: var(--accent-gradient); color: white; }
.tab-btn.all.active { background: var(--primary-gradient); color: white; }
.tab-btn .count { background: rgba(0,0,0,0.1); padding: 2px 6px; border-radius: 10px; font-size: 11px; }
.tab-btn.active .count { background: rgba(255,255,255,0.3); }
.annotation-cards { display: flex; flex-direction: column; gap: 8px; }

.annotation-card {
    background: rgba(10, 12, 26, 0.85); backdrop-filter: blur(12px);
    border-radius: 12px; padding: 10px 12px; border: 1px solid rgba(var(--primary-rgb), 0.4);
    position: relative; transition: all 0.3s; overflow: hidden;
    box-shadow: var(--elevation-1);
}
.annotation-card:hover { border-color: var(--primary); transform: translateX(5px); box-shadow: 0 12px 40px rgba(var(--primary-rgb),0.15); background: #202438; }
.annotation-card .card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.annotation-card .type-badge { font-size: 11px; font-weight: 600; padding: 4px 10px; border-radius: 20px; display: flex; align-items: center; gap: 4px; }
/* 新5大类型 badge */
.annotation-card.question    .type-badge { background: rgba(var(--warning-rgb), 0.25); color: var(--warning); }
.annotation-card.keypoint    .type-badge { background: rgba(239, 68, 68, 0.25); color: #fca5a5; }
.annotation-card.explanation .type-badge { background: rgba(249, 115, 22, 0.25); color: #fdba74; }
.annotation-card.supplement  .type-badge { background: rgba(var(--success-rgb), 0.25); color: var(--success); }
.annotation-card.note        .type-badge { background: rgba(167, 139, 250, 0.25); color: var(--accent-purple); }
.annotation-card .page-num { font-size: 10px; color: var(--muted); background: rgba(var(--primary-rgb), 0.2); padding: 3px 10px; border-radius: 12px; }
.annotation-card .card-content { font-size: 13px; color: var(--text-primary) !important; line-height: 1.6; padding: 10px; background: rgba(10, 12, 26, 0.6); border-radius: 10px; border-left: 4px solid var(--glass-border); text-shadow: 0 1px 3px rgba(0,0,0,0.5); }
/* 新5大类型内容区左边框 */
.annotation-card.question    .card-content { border-left-color: #a78bfa; }  /* 柔紫 - 融入主题 */
.annotation-card.keypoint    .card-content { border-left-color: #fbbf24; }  /* 琥珀金 */
.annotation-card.explanation .card-content { border-left-color: #f472b6; }  /* 粉紫 */
.annotation-card.supplement  .card-content { border-left-color: #34d399; }  /* 翠绿 */
.annotation-card.note        .card-content { border-left-color: #818cf8; }  /* 靛紫 */
.annotation-card .card-actions { display: flex; gap: 8px; margin-top: 8px; justify-content: flex-end; }
.card-btn { padding: 5px 12px; font-size: 11px; border: none; border-radius: 30px; cursor: pointer; transition: all 0.3s; font-weight: 500; }
.card-btn.edit { background: var(--primary-gradient); color: white; box-shadow: 0 4px 12px rgba(var(--primary-rgb), 0.3); }
.card-btn.edit:hover { transform: scale(1.05); box-shadow: 0 6px 15px rgba(var(--primary-rgb), 0.4); }
.card-btn.delete { background: linear-gradient(135deg, var(--error), var(--error)); color: white; box-shadow: 0 4px 12px rgba(255, 107, 107, 0.3); }
.card-btn.delete:hover { transform: scale(1.05); box-shadow: 0 6px 15px rgba(255, 107, 107, 0.4); }
/* ★ 侧边栏卡片操作按钮（JS 使用 .edit-card / .delete-card） */
.edit-card, .delete-card {
    padding: 5px 12px; font-size: 11px; border: none; border-radius: 30px; cursor: pointer;
    transition: all 0.3s; font-weight: 500;
}
.edit-card { background: var(--primary-gradient); color: white; box-shadow: 0 4px 12px rgba(var(--primary-rgb), 0.3); }
.edit-card:hover { transform: scale(1.05); box-shadow: 0 6px 15px rgba(var(--primary-rgb), 0.4); }
.delete-card { background: linear-gradient(135deg, var(--error), var(--error)); color: white; box-shadow: 0 4px 12px rgba(255, 107, 107, 0.3); }
.delete-card:hover { transform: scale(1.05); box-shadow: 0 6px 15px rgba(255, 107, 107, 0.4); }

/* ★ draggable-card 入场动画（减少延迟，无nth-child累积） */
.draggable-card {
    will-change: transform, opacity;
    animation: cardSlideIn 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
    animation-fill-mode: both;
}
.draggable-card:active { cursor: grabbing; }
@keyframes cardSlideIn { from { opacity: 0; transform: scale(0.9) translateY(-10px); } to { opacity: 1; transform: scale(1) translateY(0); } }

/* 拖拽卡片按钮 — 方形克制风格，日夜统一 */
.draggable-card .mini-btn { width: 24px; height: 24px; border: 1px solid rgba(255,255,255,0.08); border-radius: 6px; background: rgba(255,255,255,0.06); cursor: pointer; font-size: 11px; display: flex; align-items: center; justify-content: center; transition: background 0.2s, color 0.2s, border-color 0.2s; color: #94a3b8; }
.draggable-card .mini-btn.edit:hover,
.draggable-card .mini-btn.delete:hover { color: white !important; }
.draggable-card .mini-btn.edit:hover { background: var(--primary) !important; border-color: transparent !important; }
.draggable-card .mini-btn.delete:hover { background: var(--error) !important; border-color: transparent !important; }

.glass-card { background: rgba(10, 12, 26, 0.65); backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,0.12); border-top-color: rgba(255,255,255,0.22); border-left-color: rgba(255,255,255,0.14); border-radius: var(--radius-lg, 20px); padding: 10px; transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); box-shadow: 0 8px 32px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.06), inset 0 -1px 0 rgba(0,0,0,0.12); position: relative; overflow: hidden; }
/* glass-card 光扫过 — 日间模式完全禁用（避免斜向光带） */
[data-theme="day"] .glass-card::before { display: none !important; }

/* hover — 日间上浮 / 夜间仅边框微亮零位移 */
[data-theme="day"] .glass-card:hover { transform: translateY(-5px); border-color: rgba(79,110,246,0.20); box-shadow: 0 16px 48px rgba(100,116,139,0.12), 0 4px 16px rgba(100,116,139,0.06), 0 0 40px rgba(79,110,246,0.04), inset 0 1px 0 rgba(255,255,255,0.9), inset 0 -1px 0 rgba(148,163,184,0.08); }

body:not([data-theme="day"]) .glass-card:hover {
    transform: none !important;
    border-color: rgba(167,139,250,0.18);
    box-shadow: 0 10px 40px rgba(0,0,0,0.28), 0 2px 12px rgba(0,0,0,0.15),
        inset 0 1px 0 rgba(255,255,255,0.07), inset 0 -1px 0 rgba(0,0,0,0.16) !important;
}

/* 真题解析 */
.exam-answer-container { margin-top: 10px; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 8px; }
.exam-answer-toggle { background: none; border: none; color: var(--primary); cursor: pointer; font-size: 12px; padding: 4px 8px; border-radius: 4px; transition: all 0.2s; }
.exam-answer-toggle:hover { background: rgba(var(--primary-rgb), 0.1); color: var(--primary); }
.exam-actions { margin-top: 8px; }
.exam-hidden-content { margin-top: 10px; }
.exam-section { margin-top: 12px; padding: 8px 0; border-top: 1px solid rgba(255,255,255,0.1); }
.exam-section-title { font-weight: 600; font-size: 13px; margin-bottom: 6px; color: var(--primary); }
.exam-section-content { font-size: 13px; line-height: 1.5; color: var(--text-light); background: rgba(255,255,255,0.08); padding: 8px; border-radius: 6px; white-space: pre-wrap; }
.exam-section.exam-section-error { background: linear-gradient(135deg, #FFF3E0, #FFE0B2); padding: 8px; border-radius: 8px; border-left: 3px solid #FF9800; }
.exam-section.exam-section-error .exam-section-title { color: #E65100; }
.exam-section.exam-section-error .exam-section-content { background: rgba(255,255,255,0.1); color: #ef9a9a; }
/* 日间模式易错提醒 — 高对比 */
[data-theme="day"] .exam-section.exam-section-error { background: linear-gradient(135deg, #FFF8F0, #FFEED9); }
[data-theme="day"] .exam-section.exam-section-error .exam-section-content { color: #6B3A00; background: rgba(255,255,255,0.6); }
[data-theme="day"] .exam-section-content { color: #475569; background: #f8fafc; }

.knowledge-exercise-box { background: rgba(25, 118, 210, 0.1); border-left: 3px solid #1976D2; padding: 10px; margin: 8px 0; border-radius: 6px; }

/* ════════════════════════════════════════
   AI消息 Markdown 渲染样式
   ════════════════════════════════════════ */
.md-content { line-height: 1.55; font-size: 14px; color: var(--text-light); }
.md-content p { margin: 3px 0; }
.md-content strong { color: var(--primary); font-weight: 700; }
.md-content em { font-style: italic; }
.md-content h1, .md-content h2, .md-content h3,
.md-content h4, .md-content h5, .md-content h6 {
    margin: 10px 0 6px; font-weight: 700; color: var(--text-primary);
}
.md-content h1 { font-size: 18px; }
.md-content h2 { font-size: 16px; }
.md-content h3 { font-size: 15px; }
.md-content ul, .md-content ol { padding-left: 22px; margin: 6px 0; }
.md-content li { margin: 3px 0; }
.md-content code {
    background: rgba(102,126,234,0.15); color: #a78bfa; padding: 2px 6px;
    border-radius: 4px; font-size: 13px; font-family: 'JetBrains Mono', monospace;
}
.md-content pre {
    background: rgba(15,17,30,0.8); border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px; padding: 12px; margin: 8px 0; overflow-x: auto;
}
.md-content pre code {
    background: none; padding: 0; color: #e2e8f0; font-size: 13px;
    line-height: 1.5; white-space: pre;
}
.md-content blockquote {
    border-left: 3px solid var(--primary); padding: 6px 12px; margin: 8px 0;
    background: rgba(102,126,234,0.06); border-radius: 0 6px 6px 0;
    color: rgba(240,243,255,0.7);
}
.md-content table { border-collapse: collapse; margin: 8px 0; width: 100%; }
.md-content th, .md-content td {
    border: 1px solid rgba(255,255,255,0.1); padding: 6px 10px; text-align: left;
    font-size: 13px;
}
.md-content th { background: rgba(102,126,234,0.1); color: var(--primary); font-weight: 600; }
.md-content a { color: #a78bfa; text-decoration: underline; }
.md-content hr { border: none; border-top: 1px solid rgba(255,255,255,0.08); margin: 12px 0; }
.md-content details { margin: 6px 0; }
.md-content summary { cursor: pointer; color: var(--primary); font-weight: 600; }

/* ════════════════════════════════════════
   Mermaid 流程图样式
   ════════════════════════════════════════ */
.mermaid-wrapper {
    position: relative; margin: 10px 0; padding: 12px;
    background: rgba(15,17,30,0.6); border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.08); overflow: hidden;
}
.mermaid-wrapper .mermaid svg { max-width: 100%; height: auto; }
.mermaid-zoom-btn {
    position: absolute; top: 6px; right: 6px; width: 28px; height: 28px;
    background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15);
    border-radius: 6px; color: rgba(240,243,255,0.5); cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all 0.2s; opacity: 0;
}
.mermaid-wrapper:hover .mermaid-zoom-btn { opacity: 1; }
.mermaid-zoom-btn:hover { background: rgba(102,126,234,0.3); color: #a78bfa; }

/* Mermaid 放大模态框 */
.mermaid-modal-overlay {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.7); backdrop-filter: blur(8px);
    z-index: 10000; display: flex; align-items: center; justify-content: center;
    opacity: 0; transition: opacity 0.2s;
}
.mermaid-modal-overlay.show { opacity: 1; }
.mermaid-modal-box {
    background: rgba(15,17,30,0.95); border: 1px solid rgba(255,255,255,0.15);
    border-radius: 14px; padding: 24px; max-width: 90vw; max-height: 90vh;
    overflow: auto; position: relative;
}
.mermaid-modal-close {
    position: absolute; top: 8px; right: 12px;
    background: none; border: none; color: rgba(240,243,255,0.5);
    font-size: 24px; cursor: pointer; z-index: 1;
}
.mermaid-modal-close:hover { color: #fff; }
.mermaid-modal-content .mermaid svg { width: 100%; height: auto; min-height: 200px; }

/* ════════════════════════════════════════
   考点卡片下的真题子项（真题卷专用）
   ════════════════════════════════════════ */
.exam-related-questions {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.08);
}
.exam-related-title {
    font-size: 12px;
    font-weight: 600;
    color: #a78bfa;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.exam-related-item {
    background: rgba(167,139,250,0.06);
    border-left: 2px solid rgba(167,139,250,0.3);
    padding: 8px 10px;
    margin-bottom: 6px;
    border-radius: 0 6px 6px 0;
}
.exam-related-num {
    font-size: 11px;
    font-weight: 600;
    color: #a78bfa;
    margin-bottom: 4px;
}
.exam-related-content {
    font-size: 12px;
    line-height: 1.5;
    color: var(--text-light);
    margin-bottom: 4px;
}
.exam-related-answer {
    font-size: 12px;
    color: #86efac;
    background: rgba(16,185,129,0.08);
    padding: 4px 8px;
    border-radius: 4px;
    margin-top: 4px;
}
.exam-related-answer-label {
    font-weight: 600;
    color: #34d399;
}
.knowledge-exercise-title { font-size: 12px; font-weight: 600; color: #42A5F5; margin-bottom: 6px; }
.knowledge-exercise-body { font-size: 12.5px; color: #e0e0ff; line-height: 1.6; }
.teacher-reminder-content { color: #FFCCBC; }
.teacher-timestamp-bar { display: inline-flex; align-items: center; gap: 4px; background: rgba(255,87,34,0.15); border-radius: 20px; padding: 4px 12px; font-size: 11px; color: #FF8A65; cursor: pointer; margin-top: 6px; transition: background 0.2s; }
.teacher-timestamp-bar:hover { background: rgba(255,87,34,0.3); }
.exam-edit-btn { background: linear-gradient(135deg, #43A047, #388E3C) !important; color: white !important; }
.exam-edit-btn:hover { opacity: 0.9 !important; }
.exam-regen-btn { background: linear-gradient(135deg, #FF7043, #F4511E) !important; color: white !important; }
.exam-regen-btn:hover { opacity: 0.9 !important; }
.mistake-collect-btn { background: var(--accent-gradient) !important; color: white !important; font-weight: 600; }
.mistake-collect-btn:hover { opacity: 0.9 !important; transform: scale(1.02); }

.ppt-section { background: rgba(10, 12, 26, 0.6); backdrop-filter: blur(16px); border-radius: 12px; padding: 2px 4px; box-shadow: var(--shadow); display: flex; flex-direction: column; overflow: hidden; flex: 1; min-width: 0; position: relative; isolation: isolate; }
.ppt-content-wrapper { flex: 1; overflow-y: auto; overflow-x: visible; min-height: 0; display: flex; flex-direction: column; align-items: center; border-radius: 8px; background: var(--content-bg); backdrop-filter: blur(8px); }
.ppt-toolbar { 
    display: flex; justify-content: space-between; align-items: center; 
    padding: 4px 8px; margin-bottom: 0; flex-shrink: 0;
    background: rgba(255,255,255,0.03); border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.05);
}
[data-theme="day"] .ppt-toolbar {
    background: rgba(255,255,255,0.45);
    border-color: rgba(148,163,184,0.12);
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.toolbar-group { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.toolbar-btn { padding: 8px 16px; border: 1px solid var(--glass-border); background: rgba(255,255,255,0.08); border-radius: 10px; cursor: pointer; font-size: 13px; font-weight: 500; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1); color: var(--text-light); box-shadow: 0 1px 2px rgba(0,0,0,0.15); }
.toolbar-btn:hover { border-color: var(--primary); color: var(--primary); transform: translateY(-1px); }
.toolbar-btn.primary { background: var(--gradient-1); color: white; border-color: transparent; box-shadow: 0 4px 15px rgba(var(--primary-rgb), 0.3); }
.toolbar-btn.primary:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(var(--primary-rgb), 0.4); }

/* 视图切换标签页 */
.view-mode-tabs {
    display: flex;
    gap: 1px;
    background: rgba(255,255,255,0.05);
    border-radius: 5px;
    padding: 1px;
}
.view-mode-btn {
    padding: 2px 8px;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    font-size: 10px;
    display: flex;
    align-items: center;
    gap: 2px;
    transition: all 0.2s ease;
    background: transparent;
    color: var(--text-secondary);
}
.view-mode-btn.active {
    color: white;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}
.view-mode-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}
[data-theme="day"] .view-mode-tabs {
    background: rgba(0,0,0,0.04);
}
[data-theme="day"] .view-mode-btn {
    color: #64748b;
}
[data-theme="day"] .view-mode-btn.active {
    color: white;
}

/* 更多操作下拉菜单项样式 */
.toolbar-more-item {
    display: flex; align-items: center; gap: 8px; width: 100%;
    padding: 8px 14px; border: none; background: none;
    color: rgba(240,243,255,0.8); font-size: 13px; cursor: pointer;
    border-radius: 6px; text-align: left;
}
.toolbar-more-item:hover { background: rgba(255,255,255,0.08); }

.ppt-viewer { background: rgba(10, 12, 26, 0.5); border-radius: 12px; display: flex; flex-direction: column; position: relative; overflow: hidden; flex: 1; min-height: 0; padding: 12px; align-items: center; justify-content: center; width: 100%; }
#pptxPreviewContainer { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; border-radius: 12px; overflow: hidden; }
#pptxPreviewContainer img, #pptxPreviewContainer canvas, #pptxPreviewContainer .ppt-slide { border-radius: 8px; overflow: hidden; }
.ppt-viewer::before { display: none; }

.annotation-panel { background: rgba(255, 255, 255, 0.08); border-radius: 10px; padding: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); overflow-y: auto; flex: 1; min-height: 0; border: 1px solid rgba(255,255,255,0.4); }
.panel-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,0.1); }
.panel-title { font-size: 14px; font-weight: 600; color: var(--text-light); }
.add-annotation-btn { width: 100%; padding: 8px; border: 2px dashed rgba(255,255,255,0.3); background: rgba(255,255,255,0.05); border-radius: 6px; cursor: pointer; font-size: 12px; color: var(--primary); transition: all 0.2s; margin-bottom: 10px; }
.add-annotation-btn:hover { border-color: var(--primary); background: rgba(30,136,229,0.05); }

.modal { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); z-index: 1000; justify-content: center; align-items: center; }
.modal.show { display: flex; }
.modal-content { background: rgba(20, 24, 40, 0.9); border-radius: 12px; padding: 25px; width: 90%; max-width: 500px; }
.modal-title { font-size: 18px; font-weight: 600; }

.form-group { margin-bottom: 15px; }
.form-label { display: block; margin-bottom: 6px; font-weight: 500; color: rgba(240,243,255,0.8); }
.form-input, .form-select, .form-textarea { width: 100%; padding: 10px; border: 1px solid rgba(255,255,255,0.2); border-radius: 6px; font-size: 14px; background: rgba(255,255,255,0.08); color: #f0f3ff; }
.form-textarea { resize: vertical; min-height: 100px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }

.modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; }
/* .btn 样式由 theme.css 统一提供，此处不再覆盖 */

.empty-state { text-align: center; padding: 40px; color: rgba(240,243,255,0.5); }
.empty-state i { font-size: 48px; margin-bottom: 15px; color: var(--muted); }

.status-badge { display: inline-block; padding: 4px 12px; border-radius: 12px; font-size: 12px; margin-left: 10px; font-weight: 600; }
.status-completed { background: rgba(67,160,71,0.1); color: var(--success); }
.status-processing { background: rgba(251,140,0,0.1); color: var(--warning); }
.status-pending { background: rgba(100,116,139,0.1); color: var(--text-secondary); }
.status-failed { background: rgba(239,68,68,0.1); color: #fca5a5; }

.success-box { background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%); border-radius: 12px; padding: 30px; text-align: center; color: white; max-width: 450px; }
.success-box i { font-size: 48px; margin-bottom: 15px; }

.edit-guide { background: linear-gradient(135deg, #fff8e1 0%, #ffecb3 100%); border-radius: 10px; padding: 12px; margin-top: 15px; border: 1px solid #ffe082; }
.guide-icon { color: #f9a825; font-size: 20px; margin-bottom: 8px; }
.guide-content strong { color: #f57f17; font-size: 13px; display: block; margin-bottom: 8px; }
.guide-content p { font-size: 11px; color: rgba(240,243,255,0.7); margin: 4px 0; line-height: 1.4; }

.project-switcher { position: relative; }
.project-dropdown { min-width: 280px; max-height: 400px; overflow-y: auto; }
.project-dropdown-header { padding: 12px 16px; font-size: 12px; color: rgba(240,243,255,0.5); border-bottom: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.05); }
.project-item { padding: 12px 16px; cursor: pointer; transition: all 0.2s; border-bottom: 1px solid #f5f5f5; }
.project-item:hover { background: rgba(var(--primary-rgb), 0.08); }
.project-item.active { background: rgba(var(--primary-rgb), 0.15); border-left: 3px solid var(--primary); }
.project-item-name { font-weight: 500; color: var(--text-light); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.project-item-meta { font-size: 11px; color: rgba(240,243,255,0.4); margin-top: 3px; }

.autosave-status { position: fixed; bottom: 20px; right: 20px; background: rgba(20, 24, 40, 0.9); padding: 12px 20px; border-radius: 10px; box-shadow: 0 4px 20px rgba(0,0,0,0.15); display: flex; align-items: center; gap: 10px; font-size: 13px; z-index: 999; opacity: 0; transform: translateY(20px); transition: all 0.3s; }
.autosave-status.show { opacity: 1; transform: translateY(0); }
.autosave-status.saving { color: var(--warning); }
.autosave-status.saved { color: var(--success); }
.autosave-status.error { color: var(--error); }

.modal-overlay { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.3); z-index: 1000; justify-content: center; align-items: center; }
.modal-overlay.show { display: flex; }
.modal-box { background: rgba(20, 24, 40, 0.9); backdrop-filter: blur(20px); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 16px; padding: 25px; width: 90%; max-width: 600px; max-height: 90vh; overflow-y: auto; animation: modalSlideIn 0.3s ease; }
@keyframes modalSlideIn { from { opacity: 0; transform: translateY(-30px); } to { opacity: 1; transform: translateY(0); } }
.modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding-bottom: 15px; border-bottom: 2px solid #f0f0f0; }
.modal-header h3 { font-size: 18px; background: var(--gradient-1); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.modal-close { background: none; border: none; font-size: 24px; cursor: pointer; color: rgba(240,243,255,0.5); padding: 5px; border-radius: 50%; transition: all 0.2s; }
.modal-close:hover { background: rgba(255,255,255,0.1); color: var(--text-light); }

.export-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 20px; }
.export-option { padding: 20px; border: 2px solid rgba(255,255,255,0.15); border-radius: 12px; text-align: center; cursor: pointer; transition: all 0.3s; }
.export-option:hover { border-color: var(--primary); background: rgba(var(--primary-rgb), 0.05); }
.export-option.selected { border-color: var(--primary); background: rgba(var(--primary-rgb), 0.1); }
.export-option i { font-size: 32px; margin-bottom: 10px; color: var(--primary); }
.export-option h4 { font-size: 14px; color: var(--text-light); margin-bottom: 5px; }
.export-option p { font-size: 11px; color: rgba(240,243,255,0.4); }

/* ===== 导出 Modal 6宫格（Phase 1.2 增强） ===== */
.export-modal-wide { max-width: 720px !important; }
.export-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
@media (max-width: 600px) {
    .export-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 420px) {
    .export-grid { grid-template-columns: 1fr; }
}

.export-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px;
    border: 2px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.25s ease;
    background: rgba(15, 18, 35, 0.7);
    position: relative;
}
.export-card:hover { border-color: rgba(var(--primary-rgb), 0.5); background: rgba(25, 30, 55, 0.8); transform: translateY(-2px); }
.export-card.selected { border-color: var(--primary); background: rgba(var(--primary-rgb), 0.08); box-shadow: 0 0 20px rgba(var(--primary-rgb), 0.12); }

.export-icon {
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 17px;
}
.export-info { flex: 1; min-width: 0; }
.export-info h4 {
    font-size: 13.5px;
    color: var(--text-light);
    margin: 0 0 3px 0;
    font-weight: 600;
}
.export-ext {
    display: inline-block;
    font-size: 10px;
    padding: 1px 8px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(240, 243, 255, 0.45);
    margin-right: 6px;
}
.export-info p {
    font-size: 11px;
    color: rgba(240, 243, 255, 0.35);
    margin: 4px 0 0 0;
    line-height: 1.4;
}
.export-tag {
    position: absolute;
    top: -6px;
    right: 8px;
    font-size: 9px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.export-tag.recommended { background: var(--gradient-1); color: white; }
.export-tag.new { background: var(--warning-gradient); color: #1a1a1a; }

/* ================================================================
 * 日间模式全局覆写 — 消除所有紫色硬编码
 * （补充组件：annotation-card / 按钮 / 真题 / 导出）
 * 主容器/卡片/PPT区等核心样式已在下方「晨曦书房」设计系统统一处理
 * ================================================================ */
/* .material-title 已在主日间设计系统中统一定义（Slate 渐变） */
[data-theme="day"] .earth-sidebar-title {
    background: linear-gradient(135deg, #334155 0%, #475569 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
[data-theme="day"] .earth-sidebar-subtitle,
[data-theme="day"] .earth-sidebar-feature-desc { color: var(--day-text-faint); }
[data-theme="day"] .earth-sidebar-hint { background: rgba(79,110,246,0.06); }
[data-theme="day"] .earth-sidebar-hint p { color: var(--day-primary); }

/* 标注卡片（覆盖层拖拽卡片） */
[data-theme="day"] .annotation-card {
    background: #ffffff !important;
    border-color: #e2e8f0 !important;
}
[data-theme="day"] .annotation-card:hover {
    border-color: var(--day-primary) !important;
    box-shadow:
        0 8px 28px rgba(79,110,246,0.10),
        0 2px 8px rgba(100,116,139,0.06) !important;
}
[data-theme="day"] .annotation-card .page-num {
    background: #EEF1FE;
    color: var(--day-primary);
    font-weight: 600;
}
[data-theme="day"] .annotation-card .card-content {
    color: #475569 !important;
    background: #fafbfc !important;
    text-shadow: none !important;
}

/* 卡片操作按钮 */
[data-theme="day"] .card-btn.edit {
    background: var(--day-primary) !important;
    color: white !important;
    box-shadow: 0 3px 12px rgba(79,110,246,0.25) !important;
}
[data-theme="day"] .card-btn.edit:hover {
    box-shadow: 0 5px 18px rgba(79,110,246,0.35) !important;
    transform: translateY(-1px);
}
[data-theme="day"] .mini-btn {
    background: #fff !important;
    color: #64748B !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 6px !important;  /* 方形而非圆形 */
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}
[data-theme="day"] .mini-btn:hover {
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
    border-color: var(--day-primary-light) !important;
    color: var(--day-primary) !important;
}
[data-theme="day"] .draggable-card .mini-btn { background: #f1f5f9; }
[data-theme="day"] .draggable-card .annotation-text { color: #334155; }

/* 真题解析区域 */
[data-theme="day"] .exam-answer-toggle {
    color: var(--day-primary);
    font-weight: 500;
}
[data-theme="day"] .exam-answer-toggle:hover {
    background: rgba(79,110,246,0.06);
}
[data-theme="day"] .exam-section-title {
    color: var(--day-primary);
    font-weight: 600;
}
[data-theme="day"] .exam-section-content {
    color: #475569;
    background: #f8fafc;
    border-radius: 10px;
}

/* 导出选项卡片 */
[data-theme="day"] .export-option {
    border-color: #e2e8f0;
    background: #ffffff;
    border-radius: 14px;
}
[data-theme="day"] .export-option:hover {
    border-color: var(--day-primary-light);
    background: #fafbff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(79,110,246,0.08);
}
[data-theme="day"] .export-option.selected {
    border-color: var(--day-primary) !important;
    background: var(--day-surface-gradient) !important;
    box-shadow: 0 0 0 1px rgba(79,110,246,0.1), 0 4px 16px rgba(79,110,246,0.08);
}
[data-theme="day"] .export-option i { color: var(--day-primary); }
[data-theme="day"] .export-option h4 { 
    color: #1E293B !important; 
    font-weight: 600 !important; 
    font-size: 13px !important;
    line-height: 1.3 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
[data-theme="day"] .export-option p { 
    color: #94a3b8 !important; 
    font-size: 11px !important;
    line-height: 1.4 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 导出卡片图标 */
[data-theme="day"] .export-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 12px;
}

/* 导出 Tag */
[data-theme="day"] .export-tag.recommended {
    background: var(--day-gradient-primary) !important;
    color: white !important;
}
[data-theme="day"] .export-tag.new {
    background: var(--warning-gradient) !important;
    color: #1a1a1a !important;
}

/* 导出扩展名 */
[data-theme="day"] .export-ext {
    background: #EEF1FE !important;
    color: var(--day-primary) !important;
}

/* ════════════════════════════════════════
   Phase 1 P0: 考点清单面板 + 复习建议面板
   ════════════════════════════════════════ */

/* ---- Tab 按钮默认态（新5大类型 - 紫色主题和谐色板） ---- */
.tab-btn.question    { background: rgba(167, 139, 250, 0.08); color: #a78bfa; border: 1px solid rgba(167, 139, 250, 0.15); }  /* 柔紫 */
.tab-btn.keypoint    { background: rgba(251, 191, 36, 0.08); color: #fbbf24; border: 1px solid rgba(251, 191, 36, 0.15); }  /* 琥珀金 */
.tab-btn.explanation { background: rgba(244, 114, 182, 0.08); color: #f472b6; border: 1px solid rgba(244, 114, 182, 0.15); }  /* 粉紫 */
.tab-btn.supplement  { background: rgba(52, 211, 153, 0.08); color: #34d399; border: 1px solid rgba(52, 211, 153, 0.15); }  /* 翠绿 */
.tab-btn.note        { background: rgba(129, 140, 248, 0.08); color: #818cf8; border: 1px solid rgba(129, 140, 248, 0.15); }  /* 靛紫 */

/* ---- 日间模式 Tab 默认态 ---- */
[data-theme="day"] .tab-btn.question    { background: rgba(139, 92, 246, 0.06); color: #7c3aed; border-color: rgba(139, 92, 246, 0.15); }
[data-theme="day"] .tab-btn.keypoint    { background: rgba(217, 119, 6, 0.06); color: #d97706; border-color: rgba(217, 119, 6, 0.15); }
[data-theme="day"] .tab-btn.explanation { background: rgba(219, 39, 119, 0.06); color: #db2777; border-color: rgba(219, 39, 119, 0.15); }
[data-theme="day"] .tab-btn.supplement  { background: rgba(22, 163, 74, 0.06); color: #16a34a; border-color: rgba(22, 163, 74, 0.15); }
[data-theme="day"] .tab-btn.note        { background: rgba(99, 102, 241, 0.06); color: #6366f1; border-color: rgba(99, 102, 241, 0.15); }

/* ---- 复习建议面板 ---- */
.review-modal-wide { max-width: 720px; width: 92%; max-height: 85vh; overflow-y: auto; }
.review-panel-body { padding: 24px; }

.review-score-card {
    display: flex; align-items: center; gap: 24px;
    background: rgba(139, 92, 246, 0.06);
    border: 1px solid rgba(139, 92, 246, 0.15);
    border-radius: 16px; padding: 24px; margin-bottom: 20px;
}
.review-score-ring { flex-shrink: 0; }
.review-score-info { text-align: center; min-width: 80px; }
.review-score-label { font-size: 13px; color: rgba(240,243,255,0.45); margin-bottom: 4px; }
.review-score-value { font-size: 36px; font-weight: 800; color: var(--accent-purple); line-height: 1; }
.review-encouragement { font-size: 13px; color: rgba(240,243,255,0.5); margin-top: 8px; line-height: 1.4; }

.review-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; flex: 1; }
.review-stat-item { text-align: center; padding: 10px 8px; background: rgba(255,255,255,0.04); border-radius: 10px; border: 1px solid rgba(255,255,255,0.06); }
.review-stat-num { display: block; font-size: 20px; font-weight: 700; color: var(--accent-purple); }
.review-stat-label { font-size: 11px; color: rgba(240,243,255,0.35); margin-top: 2px; }

.review-section { margin-bottom: 18px; }
.review-section-title { font-size: 14px; font-weight: 600; color: rgba(240,243,255,0.85); margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }

/* 薄弱知识点列表 */
.review-weak-list { display: flex; flex-wrap: wrap; gap: 8px; }
.review-weak-item {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 14px; background: rgba(239, 68, 68, 0.08);
    border: 1px solid rgba(239, 68, 68, 0.2); border-radius: 20px;
    color: #fca5a5; font-size: 13px;
}
.review-weak-item i { color: #ef4444; font-size: 11px; }

/* 艾宾浩斯时间线 */
.plan-timeline-item { display: flex; gap: 14px; position: relative; margin-bottom: 4px; }
.plan-dot {
    width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    background: rgba(139, 92, 246, 0.15); border: 2px solid rgba(139, 92, 246, 0.3);
}
.plan-dot.active { background: var(--accent-gradient); border-color: transparent; }
.plan-day-label { font-size: 11px; font-weight: 700; color: var(--accent-purple); }
.plan-connector { width: 2px; margin-left: 17px; background: rgba(139, 92, 246, 0.2); min-height: 30px; }
.plan-connector.last { display: none; }
.plan-card {
    flex: 1; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06);
    border-radius: 10px; padding: 14px 16px;
}
.plan-focus { font-size: 14px; color: rgba(240,243,255,0.85); line-height: 1.5; margin-bottom: 6px; }
.plan-meta { display: flex; gap: 16px; font-size: 12px; color: rgba(240,243,255,0.35); }
.plan-meta i { margin-right: 3px; }

/* 建议操作卡片 */
.review-actions-list { display: flex; flex-direction: column; gap: 8px; }
.review-action-card {
    display: flex; align-items: center; gap: 14px; padding: 12px 16px;
    background: rgba(255,255,255,0.03); border-radius: 10px;
    cursor: pointer; transition: all 0.2s ease; border: 1px solid rgba(255,255,255,0.05);
}
.review-action-card:hover { background: rgba(255,255,255,0.07); transform: translateX(4px); }
.review-action-icon {
    width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; font-size: 15px;
}
.review-action-desc { font-size: 13px; color: rgba(240,243,255,0.8); line-height: 1.4; }
.review-action-page { font-size: 11px; color: rgba(240,243,255,0.35); margin-top: 3px; }

/* ---- 考点清单面板 ---- */
.studyguide-modal-wide { max-width: 800px; width: 94%; max-height: 88vh; display: flex; flex-direction: column; }
.studyguide-toolbar {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    padding: 14px 24px; border-bottom: 1px solid rgba(255,255,255,0.06); flex-wrap: wrap;
}
.studyguide-search {
    display: flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px; padding: 7px 14px; flex: 1; min-width: 180px;
}
.studyguide-search i { color: rgba(240,243,255,0.3); font-size: 13px; }
.studyguide-search input {
    background: none; border: none; outline: none; color: rgba(240,243,255,0.85);
    font-size: 13px; width: 100%; font-family: inherit;
}
.studyguide-search input::placeholder { color: rgba(240,243,255,0.25); }
.studyguide-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.md-btn {
    padding: 4px 10px; background: rgba(var(--secondary-rgb),0.08);
    border: 1px solid rgba(var(--secondary-rgb),0.2); border-radius: 5px;
    color: var(--accent-purple); font-size: 12px; cursor: pointer; transition: all 0.2s;
    font-family: inherit;
}
.md-btn:hover { background: rgba(var(--secondary-rgb),0.18); color: var(--text-light); }
.md-preview-toggle.active { background: var(--secondary-gradient); color: white; border-color: transparent; }
.sg-btn-copy:hover { border-color: var(--primary); color: var(--accent-purple); background: rgba(var(--primary-rgb),0.1); }
.sg-select {
    background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px; color: rgba(240,243,255,0.7); font-size: 12px;
    padding: 6px 10px; outline: none; cursor: pointer; font-family: inherit;
}

.studyguide-summary {
    display: flex; gap: 24px; padding: 12px 24px;
    background: rgba(16,185,129,0.05); border-bottom: 1px solid rgba(16,185,129,0.1);
}
.sg-summary-item { font-size: 13px; color: rgba(240,243,255,0.55); }
.sg-summary-item strong { color: var(--success); font-weight: 700; }

.studyguide-body { flex: 1; overflow-y: auto; padding: 16px 24px; }

.sg-page-group { margin-bottom: 12px; }
.sg-page-header {
    display: flex; align-items: center; gap: 8px; padding: 10px 14px;
    background: rgba(16,185,129,0.08); border: 1px solid rgba(16,185,129,0.12);
    border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600;
    color: rgba(240,243,255,0.8); transition: background 0.2s;
}
.sg-page-header:hover { background: rgba(16,185,129,0.14); }
.sg-page-header i { font-size: 11px; color: var(--success); }
.sg-page-count { margin-left: auto; font-size: 11px; font-weight: 400;
    color: rgba(52,211,153,0.6); background: rgba(16,185,129,0.1); padding: 2px 10px; border-radius: 10px; }
.sg-page-items { padding-top: 8px; }

.sg-item {
    background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.05);
    border-left: 3px solid var(--success); border-radius: 8px; padding: 14px 16px; margin-bottom: 8px;
    transition: border-color 0.2s, background 0.2s;
}
.sg-item:hover { background: rgba(255,255,255,0.05); border-left-color: var(--success); }
.sg-item[data-type="error"] { border-left-color: var(--error); }
.sg-item[data-type="teacher_emphasis"] { border-left-color: var(--warning); }

.sg-item-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.sg-item-type-badge {
    font-size: 11px; padding: 2px 10px; border-radius: 4px; font-weight: 600;
    background: rgba(var(--success-rgb),0.12); color: var(--success);
}
.sg-item-type-badge.error { background: rgba(239,68,68,0.12); color: #fca5a5; }
.sg-item-type-badge.question    { background: rgba(var(--warning-rgb),0.12); color: var(--warning); }
.sg-item-type-badge.keypoint    { background: rgba(239,68,68,0.12); color: #fca5a5; }
.sg-item-type-badge.explanation { background: rgba(249,115,22,0.12); color: #fdba74; }
.sg-item-type-badge.supplement  { background: rgba(34,197,94,0.12); color: #86efac; }
.sg-item-type-badge.note        { background: rgba(167,139,250,0.12); color: var(--accent-purple); }
.sg-item-type-badge.teacher_emphasis { background: rgba(var(--warning-rgb),0.12); color: var(--warning); }
.sg-source-tag { font-size: 10px; padding: 1px 8px; border-radius: 4px; border-style: solid; border-width: 1px; }
.sg-importance-tag { font-size: 10px; color: var(--warning); margin-left: auto; }

/* 置信度标签 */
.sg-confidence-tag {
    font-size: 10px; padding: 1px 8px; border-radius: 4px;
    font-weight: 600; display: inline-flex; align-items: center; gap: 3px;
}
.sg-confidence-tag i { font-size: 9px; }

.sg-item-content { font-size: 13px; color: rgba(240,243,255,0.8); line-height: 1.65; white-space: pre-wrap; word-break: break-word; }
.sg-error-hint {
    margin-top: 8px; padding: 8px 12px; font-size: 12px;
    background: rgba(239,68,68,0.08); border: 1px solid rgba(239,68,68,0.15);
    border-radius: 6px; color: #fca5a5; line-height: 1.5;
}

.sg-item-footer { display: flex; gap: 8px; margin-top: 10px; }
.sg-goto-page-btn, .sg-collect-mistake-btn {
    display: inline-flex; align-items: center; gap: 4px; padding: 5px 12px;
    border: 1px solid rgba(var(--primary-rgb),0.25); border-radius: 5px;
    background: rgba(var(--primary-rgb),0.08); color: var(--accent-purple); font-size: 11px;
    cursor: pointer; transition: all 0.2s; font-family: inherit;
}
.sg-goto-page-btn:hover { background: rgba(var(--primary-rgb),0.2); border-color: var(--primary); }
.sg-collect-mistake-btn { border-color: rgba(239,68,68,0.25); color: #fca5a5; background: rgba(239,68,68,0.08); }
.sg-collect-mistake-btn:hover { background: rgba(239,68,68,0.2); border-color: #ef4444; }

/* 日间模式适配 */
[data-theme="day"] .review-score-card { background: rgba(139, 92, 246, 0.04); border-color: rgba(139, 92, 246, 0.12); }
[data-theme="day"] .review-score-value { color: var(--accent-purple); }
[data-theme="day"] .review-stat-item { background: rgba(79,110,246,0.04); border-color: rgba(79,110,246,0.08); }
[data-theme="day"] .review-stat-num { color: #6366f1; }
[data-theme="day"] .plan-card { background: rgba(248,250,252,0.8); border-color: rgba(203,213,225,0.5); }
[data-theme="day"] .plan-focus { color: #334155; }
[data-theme="day"] .plan-meta { color: #94a3b8; }
[data-theme="day"] .sg-item { background: #fff; border-color: rgba(203,213,225,0.5); }
[data-theme="day"] .sg-item-content { color: #334155; }
[data-theme="day"] .studyguide-search { background: #f1f5f9; border-color: #cbd5e1; }
[data-theme="day"] .studyguide-search input { color: #334155; }
[data-theme="day"] .sg-select { background: #f1f5f9; border-color: #cbd5e1; color: #475569; }

/* ════════════════════════════════════════
   打印友好样式（考点清单导出打印）
   ════════════════════════════════════════ */
@media print {
    body { background: #fff !important; color: #000 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .navbar, .toolbar, .starfield-wrapper, .annotation-sidebar, .modal-overlay,
    .ppt-controls, footer, .no-print, script { display: none !important; }
    .main-content { margin: 0 !important; padding: 20px !important; max-width: 100% !important; width: 100% !important; }
    .ppt-viewer { box-shadow: none !important; border: 1px solid #ddd !important; page-break-inside: avoid; }
    .sg-item { border: 1px solid #ccc !important; background: #fafafa !important; page-break-inside: avoid; }
    .sg-item-content { color: #222 !important; font-size: 12pt !important; }
    .sg-item-header, .sg-item-footer { display: flex !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    a[href]:after { content: "" !important; } /* 隐藏链接URL */
}

/* ════════════════════════════════════════
   移动端增强适配 (preview 主内容区)
   ════════════════════════════════════════ */
@media (max-width: 768px) {
    /* 工具栏换行 */
    .toolbar { flex-wrap: wrap; gap: 6px; padding: 8px 12px !important; }
    .toolbar-btn { padding: 7px 10px !important; font-size: 11px !important; }
    .toolbar-btn i { margin-right: 3px !important; }

    /* 标注侧边栏变为底部抽屉 */
    .annotation-sidebar {
        position: fixed; bottom: 0; left: 0; right: 0; top: auto;
        max-height: 55vh; width: 100%; border-radius: 16px 16px 0 0;
        z-index: 200; transform: translateY(100%); transition: transform .3s ease;
    }
    .annotation-sidebar.active { transform: translateY(0); }

    /* PPT 区域自适应 */
    .main-content { padding-left: 8px !important; padding-right: 8px !important; }
    .ppt-container { height: auto !important; min-height: 50vh; }

    /* 模态框全屏 */
    .modal-box { width: 96% !important; max-height: 92vh; margin: 10px auto; border-radius: 14px; }
    .review-modal-wide, .studyguide-modal-wide { width: 97% !important; max-height: 90vh; }

    /* 复习面板移动端 */
    .review-score-card { flex-direction: column; text-align: center; gap: 16px; }
    .review-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .studyguide-toolbar { flex-direction: column; align-items: stretch; }
    .studyguide-actions { justify-content: flex-start; flex-wrap: wrap; }

    /* Tab 筛选按钮缩小 */
    .tab-btn { font-size: 10px !important; padding: 6px 8px !important; }
    .tab-btn .count { display: none; }
}

/* ================================================================
 * ========== 日间模式 Preview · 全新设计系统 ==========
 *
 * 设计语言：「晨曦书房」— 温暖、通透、有层次
 *
 * 色彩策略：
 *   - 底色：暖宣纸白 (#FAF9F6) + 极淡靛蓝氛围晕染
 *   - 卡片：纯白 + 微暖阴影（三层递进）+ 1px 描边
 *   - 主色：靛蓝 #4F6EF6（CTA醒目但不刺眼）
 *   - 文字：Slate 灰阶（800/600/400 三级）
 *   - 标注卡片左侧彩色条：保留，但降低饱和度适配浅底
 *
 * 视觉层次：
 *   - 页面 → 宣纸底 + SVG噪点纹理
 *   - 容器(ppt-section/sidebar) → 白卡 + 柔和投影
 *   - 卡片(item) → 更白的内层 + 细边框 + 左侧彩色标识
 * ================================================================ */

[data-theme="day"] .container {
    padding-top: 12px;
}

/* ─── PPT 预览区域 — 文档阅读器风格 ─── */
[data-theme="day"] .ppt-section {
    background: #ffffff !important;
    border: none !important;
    border-radius: 20px !important;
    box-shadow:
        /* 外层大柔影 */
        0 4px 24px rgba(100, 116, 139, 0.08),
        0 1px 3px rgba(100, 116, 139, 0.04),
        /* 内侧高光线（模拟纸张厚度） */
        inset 0 1px 0 rgba(255, 255, 255, 1),
        inset 0 -1px 0 rgba(240, 242, 245, 0.8) !important;
    position: relative;
}
/* PPT 区域顶部微妙的渐变高光（模拟屏幕反光） */
[data-theme="day"] .ppt-section::before {
    content: '';
    position: absolute;
    top: 0; left: 10%; right: 30%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(79,110,246,0.15), transparent);
    border-radius: 20px 20px 0 0;
    pointer-events: none;
}

[data-theme="day"] .ppt-content-wrapper {
    background: #f8fafc !important;
    border: 1px solid #eef2f7;
    border-radius: 14px;
    box-shadow: inset 0 2px 12px rgba(100,116,139,0.03);
}

[data-theme="day"] .ppt-toolbar {
    border-bottom: 1px solid #eef2f7 !important;
    padding-bottom: 4px !important;
}

/* 工具栏按钮 — 日间模式 */
[data-theme="day"] .toolbar-btn {
    border-radius: 10px !important;
    font-weight: 500;
    font-size: 13px;
    padding: 8px 16px;
    box-shadow: 0 1px 2px rgba(100,116,139,0.04) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
/* 通用操作按钮（无内联渐变的）→ 浅色风格 */
[data-theme="day"] .toolbar-btn:not([style*="linear-gradient"]) {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    color: #475569 !important;
}
/* 功能按钮（MD/授课模式/视频等，带内联渐变背景的）→ 保留彩色 + 加白色边框增强可见性 */
[data-theme="day"] .toolbar-btn[style*="linear-gradient"] {
    border: 1px solid rgba(255,255,255,0.5) !important;
    box-shadow:
        0 2px 8px rgba(0,0,0,0.08),
        0 0 0 1px rgba(255,255,255,0.1) inset !important;
}
[data-theme="day"] .toolbar-btn:hover {
    transform: translateY(-1px);
}

/* PPT 画布区 — 干净的白色展示台 */
[data-theme="day"] .ppt-viewer {
    background: linear-gradient(145deg, #fefefe 0%, #f9fafb 100%) !important;
    border: 1px solid #eef2f7;
    border-radius: 16px;
    box-shadow:
        inset 0 2px 16px rgba(100,116,139,0.03),
        0 1px 0 rgba(255,255,255,1);
}
/* 日间模式 ppt-content-wrapper 背景 */
[data-theme="day"] {
    --content-bg: rgba(245, 245, 245, 0.85);
}

[data-theme="day"] #pageNavBottomBar {
    background: linear-gradient(to top, #f8fafc, #fcfcfd) !important;
    border-top: 1px solid #eef2f7 !important;
    border-radius: 0 0 16px 16px;
}

/* ─── 右侧标注列表 — 卡片流式设计 ─── */
[data-theme="day"] .sidebar {
    background: #ffffff !important;
    border: none !important;
    border-radius: 20px !important;
    box-shadow:
        0 4px 24px rgba(100, 116, 139, 0.08),
        0 1px 3px rgba(100, 116, 139, 0.04),
        inset 0 1px 0 rgba(255,255,255,1) !important;
}
[data-theme="day"] .sidebar-agent {
    color: var(--text-primary);
}
[data-theme="day"] .sidebar-cards {
    color: var(--text-primary);
}
[data-theme="day"] .sidebar-divider {
    background: rgba(0,0,0,0.06) !important;
}
[data-theme="day"] .agent-quick-buttons {
    border-bottom-color: rgba(0,0,0,0.06) !important;
}
[data-theme="day"] .agent-quick-buttons button {
    color: inherit;
}

[data-theme="day"] .cards-panel {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}

[data-theme="day"] .cards-header {
    margin-bottom: 14px;
}

/* 标注卡片 — 白底 + 左侧彩色条 + 悬停上浮 */
[data-theme="day"] .card-item {
    background: #ffffff !important;
    border-left-width: 3px;
    border-radius: 14px !important;
    padding: 14px 16px;
    margin-bottom: 10px;
    box-shadow:
        0 1px 3px rgba(100,116,139,0.05),
        0 0 0 1px rgba(226,232,240,0.6);
    border-top: 1px solid transparent;
    border-right: 1px solid transparent;
    border-bottom: 1px solid transparent;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
[data-theme="day"] .card-item:hover {
    transform: translateY(-2px);
    transform: translateX(0) !important;  /* 覆盖旧的 translateX */
    background: #fdfdff !important;
    box-shadow:
        0 6px 20px rgba(100,116,139,0.08),
        0 0 0 1px rgba(199,210,254,0.4) !important;
    border-color: #e2e8f0;
}

/* 卡片文字层级 */
[data-theme="day"] .card-item .card-title {
    color: #1E293B !important;
    text-shadow: none !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em;
}
[data-theme="day"] .card-item .card-content {
    color: #64748B !important;
    text-shadow: none !important;
    line-height: 1.55;
    font-size: 13px;
    /* 防止超长内容撑乱卡片 */
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
}

/* 卡片左侧彩色条 — 降低饱和度适配浅底 */
[data-theme="day"] .card-item.exam { border-left-color: #7c3aed; }  /* 紫色→题目 */
[data-theme="day"] .card-item.knowledge { border-left-color: #d97706; }  /* 琥珀金→考点 */
[data-theme="day"] .card-item.supplement { border-left-color: #22c55e; }  /* 翠绿→网课补充 */
[data-theme="day"] .card-item.teacher_reminder { border-left-color: #db2777; }  /* 粉紫→老师提示 */
[data-theme="day"] .card-item.keypoint { border-left-color: #d97706; }  /* 琥珀金→考点 */
[data-theme="day"] .card-item.question { border-left-color: #7c3aed; }  /* 紫色→题目 */
[data-theme="day"] .card-item.error { border-left-color: #7c3aed; }  /* 紫色→题目 */
[data-theme="day"] .card-item.teacher_emphasis { border-left-color: #db2777; }  /* 粉紫→老师提示 */
[data-theme="day"] .card-item.example { border-left-color: #7c3aed; }  /* 紫色→题目 */

/* ─── 筛选标签 — 圆角药丸 ─── */
[data-theme="day"] .source-filter-title {
    color: #94A3B8 !important;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

[data-theme="day"] .source-filter-chip {
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    color: #64748B;
    border-radius: 20px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.2s ease;
}
[data-theme="day"] .source-filter-chip:hover,
[data-theme="day"] .source-filter-chip.active {
    background: #EEF1FE !important;
    border-color: var(--accent-purple) !important;
    color: var(--day-primary) !important;
    box-shadow: 0 2px 6px rgba(79,110,246,0.1);
}
[data-theme="day"] .source-filter-chip.active {
    font-weight: 600;
}

/* 分组标题 */
[data-theme="day"] .page-group h4 {
    color: #334155 !important;
    font-weight: 650;
    font-size: 13px;
    letter-spacing: -0.01em;
}

/* 当前页码标记 */
[data-theme="day"] .current-page-highlight {
    background: linear-gradient(135deg, #EEF1FE, #e0e7ff);
    color: var(--day-primary) !important;
    border-radius: 6px;
    padding: 2px 8px;
    font-weight: 600;
    font-size: 11px;
}

/* Source badge — 柔和标签 */
[data-theme="day"] .source-badge {
    background: #f1f5f9 !important;
    border: none !important;
    color: #64748B !important;
    border-radius: 6px !important;
    font-size: 10px;
    opacity: 1;
    padding: 2px 8px;
}

/* ─── Tab 切换按钮 ─── */
[data-theme="day"] .tab-btn {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    color: #64748B !important;
    padding: 7px 16px;
    font-weight: 500;
    font-size: 13px;
    transition: all 0.2s ease;
}
[data-theme="day"] .tab-btn.active {
    color: white !important;
    border-color: transparent;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}
[data-theme="day"] .tab-btn:not(.active):hover {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: #475569 !important;
}

/* ─── 进度条区域 ─── */
[data-theme="day"] #progressArea {
    background: linear-gradient(180deg, #ffffff 0%, #fafbff 100%) !important;
    border-bottom: 1px solid #eef2f7 !important;
    box-shadow:
        0 2px 12px rgba(100,116,139,0.05),
        0 1px 0 rgba(255,255,255,1);
}
[data-theme="day"] #progressBarFill {
    background: var(--day-gradient-3);
    border-radius: 999px;
}
[data-theme="day"] #progressPercent {
    color: var(--day-primary) !important;
    font-weight: 700;
}
[data-theme="day"] #progressText {
    color: #94a3b8 !important;
}
[data-theme="day"] #progressDetail {
    color: var(--day-primary-light) !important;
}
[data-theme="day"] #progressArea span,
[data-theme="day"] #progressArea [id^="stage"] {
    color: #64748B !important;
}

/* ─── Material Header（资料标题栏） ─── */
[data-theme="day"] .material-meta span,
[data-theme="day"] .material-meta {
    color: #94A3B8 !important;
}
/* 日间模式下标题保持靛蓝渐变但更清晰 */
[data-theme="day"] .material-title {
    background: linear-gradient(135deg, #334155 0%, #475569 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ─── Annotation Panel（标注面板） ─── */
[data-theme="day"] .annotation-panel {
    background: #ffffff !important;
    border: 1px solid #eef2f7 !important;
    border-radius: 16px;
    box-shadow: 0 2px 12px rgba(100,116,139,0.05);
}
[data-theme="day"] .panel-header {
    border-bottom: 1px solid #f1f5f9 !important;
}
[data-theme="day"] .panel-title {
    color: #1E293B !important;
}

/* ─── 空状态 ─── */
[data-theme="day"] .card-item.empty {
    background: #fafbfc !important;
    border: 1px dashed #cbd5e1;
    border-left: 3px solid #cbd5e1;
    color: #94A3B8 !important;
}

/* ─── 滚动条（细窄、柔和） ─── */
[data-theme="day"] .cards-list::-webkit-scrollbar { width: 5px; }
[data-theme="day"] .cards-list::-webkit-scrollbar-track { background: transparent; }
[data-theme="day"] .cards-list::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 10px;
}
[data-theme="day"] .cards-list::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* ─── 翻页按钮（底部导航） ─── */
[data-theme="day"] #prevPage,
[data-theme="day"] #nextPage {
    background: var(--day-gradient-primary) !important;
    border: none !important;
    border-radius: 10px !important;
    box-shadow: 0 3px 10px rgba(79,110,246,0.25) !important;
    transition: all 0.25s ease !important;
}
[data-theme="day"] #prevPage:hover,
[data-theme="day"] #nextPage:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(79,110,246,0.35) !important;
}

@media (max-width: 480px) {
    .review-stats-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .review-stat-num { font-size: 16px; }
    .plan-card { padding: 10px 12px; }
    .sg-page-header { padding: 8px 10px; font-size: 13px; }
    .sg-item { padding: 10px 12px; }
}

/* ════════════════════════════════════════
   Phase 2: 视频播放器
   ════════════════════════════════════════ */

.v-tl-marker {
    position: absolute; top: 50%; width: 4px; height: 70%;
    background: rgba(16,185,129,0.6); border-radius: 2px;
    transform: translateY(-50%); cursor: pointer; transition: all 0.2s; z-index: 1;
}
.v-tl-marker:hover { background: #10b981; width: 6px; }

#videoSyncBtn.active {
    background: linear-gradient(135deg,#059669,#10b981) !important;
    color: white !important; border-color: transparent !important;
}

/* ════════════════════════════════════════
   可拖拽分隔条
   ════════════════════════════════════════ */
.divider-handle {
    width: 6px;
    cursor: col-resize;
    background: transparent;
    position: relative;
    flex-shrink: 0;
    z-index: 50;
    margin: 0 -2px;
    transition: background 0.2s;
}
.divider-handle:hover,
.divider-handle.dragging {
    background: rgba(102, 126, 234, 0.3);
}
.divider-handle::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 2px;
    height: 32px;
    background: rgba(255,255,255,0.12);
    border-radius: 2px;
    transition: height 0.2s, background 0.2s;
}
.divider-handle:hover::after,
.divider-handle.dragging::after {
    height: 48px;
    background: rgba(102,126,234,0.5);
}
/* 日间模式分隔条 */
[data-theme="day"] .divider-handle::after {
    background: rgba(148,163,184,0.25);
}
[data-theme="day"] .divider-handle:hover,
[data-theme="day"] .divider-handle.dragging {
    background: rgba(79,110,246,0.1);
}
[data-theme="day"] .divider-handle:hover::after,
[data-theme="day"] .divider-handle.dragging::after {
    background: rgba(79,110,246,0.4);
}

/* ════════════════════════════════════════
   自定义对话框组件（替代系统confirm/alert/prompt）
   ════════════════════════════════════════ */
.custom-dialog-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(4px);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease;
}
.custom-dialog-overlay.show { opacity: 1; }
.custom-dialog-box {
    background: rgba(20,24,40,0.96);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 16px;
    padding: 0;
    width: 90%;
    max-width: 400px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.4);
    transform: scale(0.95) translateY(10px);
    transition: transform 0.2s ease;
    overflow: hidden;
}
.custom-dialog-overlay.show .custom-dialog-box {
    transform: scale(1) translateY(0);
}
.custom-dialog-header {
    padding: 16px 20px 0;
    font-size: 16px;
    font-weight: 700;
    color: rgba(240,243,255,0.9);
}
.custom-dialog-body {
    padding: 14px 20px;
    font-size: 14px;
    color: rgba(240,243,255,0.65);
    line-height: 1.6;
}
.custom-dialog-actions {
    display: flex;
    gap: 10px;
    padding: 0 20px 16px;
    justify-content: flex-end;
}
.custom-dialog-input {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 10px;
    font-size: 14px;
    background: rgba(255,255,255,0.06);
    color: var(--text-primary);
    outline: none;
    font-family: inherit;
    box-sizing: border-box;
}
.custom-dialog-input:focus {
    border-color: rgba(102,126,234,0.4);
    box-shadow: 0 0 0 2px rgba(102,126,234,0.1);
}

/* 日间模式自定义对话框 */
[data-theme="day"] .custom-dialog-box {
    background: #ffffff;
    border-color: #e2e8f0;
    box-shadow: 0 20px 60px rgba(15,23,42,0.12);
}
[data-theme="day"] .custom-dialog-header { color: #1e293b; }
[data-theme="day"] .custom-dialog-body { color: #64748b; }
[data-theme="day"] .custom-dialog-input {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #1e293b;
}
[data-theme="day"] .custom-dialog-input:focus {
    border-color: rgba(79,110,246,0.3);
}

/* ════════════════════════════════════════
   对话列表样式
   ════════════════════════════════════════ */
.conv-item {
    display: flex;
    flex-direction: column;
    padding: 8px 14px;
    cursor: pointer;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    position: relative;
    transition: background 0.15s;
}
.conv-item:hover { background: rgba(255,255,255,0.05); }
.conv-item.active {
    background: rgba(102,126,234,0.1);
    border-left: 3px solid #667eea;
}
.conv-item-title {
    font-size: 13px;
    font-weight: 600;
    color: rgba(240,243,255,0.85);
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 20px;
}
.conv-item-meta {
    font-size: 10px;
    color: rgba(240,243,255,0.3);
    display: flex;
    gap: 10px;
}
.conv-item-del {
    position: absolute;
    top: 8px;
    right: 8px;
    background: none;
    border: none;
    color: rgba(240,243,255,0.2);
    font-size: 11px;
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 4px;
    opacity: 0;
    transition: opacity 0.15s, color 0.15s;
}
.conv-item:hover .conv-item-del { opacity: 1; }
.conv-item-del:hover { color: #ef4444; background: rgba(239,68,68,0.1); }
#aiConvList::-webkit-scrollbar { width: 3px; }
#aiConvList::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 3px; }

[data-theme="day"] .conv-item { border-bottom-color: rgba(0,0,0,0.04); }
[data-theme="day"] .conv-item:hover { background: rgba(79,110,246,0.03); }
[data-theme="day"] .conv-item.active { background: rgba(79,110,246,0.06); }
[data-theme="day"] .conv-item-title { color: #334155; }
[data-theme="day"] .conv-item-meta { color: #94a3b8; }
[data-theme="day"] .conv-item-del { color: #cbd5e1; }

/* ════════════════════════════════════════
   AI 聊天助教面板样式
   ════════════════════════════════════════ */
.ai-chat-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}
.ai-chat-messages {
    flex: 1;
    overflow-y: auto;
    padding: 8px 4px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.ai-chat-messages::-webkit-scrollbar { width: 4px; }
.ai-chat-messages::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 4px; }

.message {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    animation: messageSlideIn 0.25s ease;
}
@keyframes messageSlideIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
.message-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
}
.user-message .message-avatar { background: rgba(102,126,234,0.2); color: #667eea; }
.ai-message .message-avatar { background: rgba(16,185,129,0.2); color: #34d399; }
.message-bubble {
    flex: 1;
    min-width: 0;
    position: relative;
}

/* 气泡尖尖 — AI消息左侧 */
.ai-message .message-bubble {
    background: rgba(255,255,255,0.05);
    border-radius: 8px 8px 8px 3px;
    padding: 6px 10px;
    border: 1px solid rgba(255,255,255,0.06);
    margin-left: 6px;
}
.ai-message .message-bubble::before {
    content: '';
    position: absolute;
    left: -5px; top: 10px;
    border: 5px solid transparent;
    border-right-color: rgba(255,255,255,0.05);
    border-left: 0;
}

/* 气泡尖尖 — 用户消息右侧 */
.user-message .message-bubble {
    background: rgba(102,126,234,0.12);
    border-radius: 8px 8px 3px 8px;
    padding: 6px 10px;
    margin-right: 6px;
}
.user-message .message-bubble::after {
    content: '';
    position: absolute;
    right: -5px; top: 10px;
    border: 5px solid transparent;
    border-left-color: rgba(102,126,234,0.12);
    border-right: 0;
}
.message-content {
    font-size: 10px;
    line-height: 1.45;
    color: rgba(240,243,255,0.85);
    word-break: break-word;
    white-space: pre-wrap;
}
.message-content p { margin: 0 0 2px; }
.message-content p:last-child { margin-bottom: 0; }
.message-content br + br { display: none; } /* 折叠连续换行 */
.user-message .message-content { color: rgba(240,243,255,0.9); }

/* 打字指示器 */
.ai-chat-loading {
    display: flex;
    align-items: center;
    padding: 4px 12px 8px;
    flex-shrink: 0;
}
.typing-indicator {
    display: flex;
    align-items: center;
    gap: 3px;
}
.typing-indicator span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(102,126,234,0.5);
    animation: typingDot 1.2s ease-in-out infinite;
}
.typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
.typing-indicator span:nth-child(3) { animation-delay: 0.4s; }
@keyframes typingDot {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }
    30% { transform: translateY(-6px); opacity: 1; }
}

/* 聊天输入区 */
.ai-chat-input-area {
    display: flex;
    gap: 6px;
    padding: 8px 4px;
    border-top: 1px solid rgba(255,255,255,0.06);
    flex-shrink: 0;
    align-items: flex-end;
}
.ai-chat-input {
    flex: 1;
    padding: 6px 10px;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 8px;
    font-size: 11px;
    background: rgba(255,255,255,0.06);
    color: var(--text-primary);
    outline: none;
    resize: none;
    font-family: inherit;
    min-height: 32px;
    max-height: 70px;
    line-height: 1.4;
}
.ai-chat-input:focus {
    border-color: rgba(102,126,234,0.4);
    box-shadow: 0 0 0 2px rgba(102,126,234,0.1);
}
.ai-chat-input::placeholder { color: rgba(240,243,255,0.3); }
.ai-chat-send-btn {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: white;
    cursor: pointer;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: opacity 0.2s, transform 0.2s;
}
.ai-chat-send-btn:hover { opacity: 0.85; transform: scale(1.05); }
.ai-chat-send-btn:active { transform: scale(0.95); }

/* 日间模式 AI 聊天面板 */
[data-theme="day"] .ai-message .message-bubble {
    background: #f8fafc;
    border-color: #e2e8f0;
}
[data-theme="day"] .ai-message .message-bubble::before {
    border-right-color: #f8fafc;
}
[data-theme="day"] .user-message .message-bubble::after {
    border-left-color: rgba(79,110,246,0.08);
}
[data-theme="day"] .message-content {
    color: #334155;
}
[data-theme="day"] .user-message .message-content { color: #fff; }
[data-theme="day"] .user-message .message-bubble {
    background: rgba(79,110,246,0.08);
}
[data-theme="day"] .ai-chat-input {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #334155;
}
[data-theme="day"] .ai-chat-input::placeholder { color: #94a3b8; }
[data-theme="day"] .ai-chat-input:focus {
    border-color: rgba(79,110,246,0.3);
}
[data-theme="day"] .ai-chat-input-area {
    border-top-color: #e2e8f0;
}
[data-theme="day"] .ai-chat-messages::-webkit-scrollbar-thumb {
    background: rgba(148,163,184,0.3);
}

/* ════════════════════════════════════════
   AI 助手浮动底栏样式（保留兼容）
   ════════════════════════════════════════ */
#aiAssistantBar {
    animation: aiBarSlideUp 0.3s ease;
}
#aiAssistantBar[style*="display: none"] {
    animation: none;
}
@keyframes aiBarSlideUp {
    from { transform: translateY(100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}
#aiExplanation::-webkit-scrollbar,
#aiQuestions::-webkit-scrollbar { width: 4px; }
#aiExplanation::-webkit-scrollbar-thumb,
#aiQuestions::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.15);
    border-radius: 4px;
}
/* 日间模式AI底栏 */
[data-theme="day"] #aiAssistantBar {
    background: rgba(255,255,255,0.96) !important;
    border-top-color: #e2e8f0 !important;
    box-shadow: 0 -4px 24px rgba(100,116,139,0.08) !important;
}
[data-theme="day"] #aiExplanation {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    color: #334155 !important;
}
[data-theme="day"] #aiAssistantBar span[style*="background:linear-gradient"] {
    background: var(--day-gradient-primary) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
[data-theme="day"] #aiAssistantBar span[style*="rgba(102,126,234"] {
    background: rgba(79,110,246,0.06) !important;
}

/* ════════════════════════════════════════
   视频侧边栏面板样式
   ════════════════════════════════════════ */
#videoSidebarPanel {
    flex-direction: column;
    overflow: hidden;
}
#videoSidebarPanel .cards-header {
    flex-shrink: 0;
}
/* 日间模式 */
[data-theme="day"] #videoSidebarPanel .cards-header h3 {
    color: #334155 !important;
}



/* --- 视频时间轴标记 --- */
[data-theme="day"] .v-tl-marker {
    background: rgba(16,185,129,0.45);
}
[data-theme="day"] .v-tl-marker:hover { background: #059669; width: 6px; }

/* --- 视频激活状态 --- */
[data-theme="day"] .video-active {
    animation: videoPulseDay 1.5s ease-in-out infinite;
    box-shadow: 0 0 16px rgba(236,72,153,0.35) !important;
    border-color: #db2777 !important;
}
@keyframes videoPulseDay {
    0%,100% { box-shadow: 0 0 8px rgba(236,72,153,0.2); }
    50% { box-shadow: 0 0 20px rgba(236,72,153,0.45); }
}

/* ═══ 视频合集分P列表 ═══ */
.video-playlist-header {
    display:flex;justify-content:space-between;align-items:center;
    padding:8px 4px;font-size:12px;color:rgba(240,243,255,0.7);font-weight:600;
    border-bottom:1px solid rgba(255,255,255,0.06);margin-bottom:4px;
}
.video-playlist-item {
    display:flex;align-items:center;gap:8px;
    padding:6px 8px;border-radius:8px;cursor:pointer;
    transition:background 0.2s;margin-bottom:2px;
}
.video-playlist-item:hover { background:rgba(255,255,255,0.06); }
.video-playlist-item.active { background:rgba(16,185,129,0.1);border:1px solid rgba(16,185,129,0.2); }
.playlist-index {
    width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,0.1);
    display:flex;align-items:center;justify-content:center;
    font-size:10px;color:rgba(240,243,255,0.6);flex-shrink:0;
}
.video-playlist-item.active .playlist-index { background:#10b981;color:white; }
.playlist-info { flex:1;min-width:0; }
.playlist-title { font-size:12px;color:rgba(240,243,255,0.8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.playlist-duration { font-size:10px;color:rgba(240,243,255,0.35);margin-top:2px; }
.playlist-playing { color:#10b981;font-size:12px; }
[data-theme="day"] .video-playlist-header { color:#475569;border-bottom-color:#e2e8f0; }
[data-theme="day"] .video-playlist-item:hover { background:rgba(148,163,184,0.08); }
[data-theme="day"] .video-playlist-item.active { background:rgba(16,185,129,0.08);border-color:rgba(16,185,129,0.25); }
[data-theme="day"] .playlist-index { background:rgba(148,163,184,0.15);color:#64748b; }
[data-theme="day"] .video-playlist-item.active .playlist-index { background:#059669;color:white; }
[data-theme="day"] .playlist-title { color:#334155; }
[data-theme="day"] .playlist-duration { color:#94a3b8; }

/* ════════════════════════════════════════
   日间模式覆盖 — 模态框 / 弹窗 / 表单（核心！）
   ════════════════════════════════════════ */

/* --- 标注编辑模态框 (.modal 系列) --- */
[data-theme="day"] .modal-content {
    background: #ffffff;
    box-shadow: 0 20px 60px rgba(15,23,42,0.12), 0 4px 20px rgba(0,0,0,0.06);
}
[data-theme="day"] .modal-close { color: #94a3b8; }
[data-theme="day"] .modal-close:hover { background: rgba(148,163,184,0.1); color: #64748b; }

/* --- 表单元素 --- */
[data-theme="day"] .form-label { color: #334155; }
[data-theme="day"] .form-input,
[data-theme="day"] .form-select,
[data-theme="day"] .form-textarea {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #1e293b;
}
[data-theme="day"] .form-input:focus,
[data-theme="day"] .form-select:focus,
[data-theme="day"] .form-textarea:focus {
    border-color: var(--day-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(79,110,246,0.1);
}

/* --- 按钮 --- */
[data-theme="day"] .btn-secondary {
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
}
[data-theme="day"] .btn-secondary:hover { background: #e2e8f0; }

/* --- 空状态 --- */
[data-theme="day"] .empty-state { color: #94a3b8; }
[data-theme="day"] .empty-state i { color: #cbd5e1; }

/* --- 面板标题 & 添加按钮 --- */
[data-theme="day"] .panel-title { color: #1e293b; font-weight:700; }
[data-theme="day"] .add-annotation-btn {
    border-color: #cbd5e1;
    background: transparent;
    color: var(--day-primary);
    border-style: dashed;
}
[data-theme="day"] .add-annotation-btn:hover {
    border-color: var(--day-primary);
    background: rgba(79,110,246,0.04);
}

/* --- 自动保存提示条 --- */
[data-theme="day"] .autosave-status {
    background: white;
    box-shadow: 0 4px 20px rgba(15,23,42,0.08);
    border: 1px solid #e2e8f0;
    color: #334155;
}

/* --- 编辑指南卡片 --- */
[data-theme="day"] .guide-content p { color: #64748b; }

/* --- 项目下拉菜单 --- */
[data-theme="day"] .project-dropdown-header {
    color: #94a3b8;
    background: #f8fafc;
    border-bottom-color: #e2e8f0;
}
[data-theme="day"] .project-item-name { color: #334155; }
[data-theme="day"] .project-item-meta { color: #94a3b8; }

/* --- 通用模态框遮罩 + 内容盒 (.modal-overlay/.modal-box) — 影响导出/复习/考点清单/视频播放器 --- */
[data-theme="day"] .modal-box {
    background: #ffffff;
    border-color: #e2e8f0;
    box-shadow: 0 25px 80px rgba(15,23,42,0.12), 0 4px 25px rgba(0,0,0,0.05);
}
[data-theme="day"] .modal-header h3 {
    background: var(--day-gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* --- 导出选项卡 --- */
[data-theme="day"] .export-option {
    border-color: #e2e8f0;
    background: white;
}
[data-theme="day"] .export-option:hover { border-color: #93c5fd; background: var(--day-surface-2); }
[data-theme="day"] .export-option.selected { border-color: var(--day-primary); background: var(--day-surface-2); }
[data-theme="day"] .export-option h4 { color: #1e293b; }
[data-theme="day"] .export-option p { color: #94a3b8; }

/* 导出卡片(新grid布局) - 日间模式 */
[data-theme="day"] .export-card { background: #ffffff; border-color: #e2e8f0; }
[data-theme="day"] .export-card:hover { border-color: var(--day-primary-light); background: #fafbff; }
[data-theme="day"] .export-card.selected { border-color: var(--day-primary); background: #EEF1FE; box-shadow: 0 0 0 1px rgba(79,110,246,0.1); }
[data-theme="day"] .export-info h4 { color: #1e293b !important; }
[data-theme="day"] .export-info p { color: #94a3b8 !important; }
[data-theme="day"] .export-ext { background: #EEF1FE; color: var(--day-primary); }
[data-theme="day"] .export-tag.recommended { background: var(--day-gradient-primary); color: white; }

/* ════════════════════════════════════════
   日间模式覆盖 — HTML内联样式补救（!important）
   preview.html中的硬编码inline style无法被普通CSS覆盖
   ════════════════════════════════════════ */

/* --- 进度条区域 --- */
[data-theme="day"] #progressTitle { color: #1e293b !important; }
[data-theme="day"] #progressText { color: #475569 !important; }
[data-theme="day"] .progress-bar-wrap { color: #94a3b8 !important; }

/* --- 页码信息 --- */
[data-theme="day"] #currentPage { color: var(--day-primary) !important; }
[data-theme="day"] #totalPages { color: #334155 !important; }

/* ════════════════════════════════════════
   加载中 - 课粒工坊功能说明卡片动画
   ════════════════════════════════════════ */

/* ─── 容器 ─── */
.feat-loading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px 12px 16px;
    gap: 14px;
    animation: featFadeIn 0.5s ease;
}
@keyframes featFadeIn {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ─── 顶部标题区 ─── */
.feat-loading-header {
    text-align: center;
    margin-bottom: 4px;
}
.feat-loading-orb {
    width: 52px; height: 52px;
    margin: 0 auto 10px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea, #764ba2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: white;
    box-shadow: 0 8px 32px rgba(102,126,234,0.3);
    animation: orbFloat 2.5s ease-in-out infinite;
}
@keyframes orbFloat {
    0%, 100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(-6px) scale(1.05); }
}
.feat-loading-title {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.feat-loading-sub {
    font-size: 11px;
    margin-top: 4px;
    letter-spacing: 0.03em;
}

/* ─── 底部进度条 ─── */
.feat-loading-bar {
    width: 160px;
    height: 3px;
    margin: 10px auto 0;
    background: rgba(255,255,255,0.08);
    border-radius: 4px;
    overflow: hidden;
}
.feat-loading-bar-fill {
    width: 0%;
    height: 100%;
    background: linear-gradient(90deg, #667eea, #a78bfa, #764ba2);
    border-radius: 4px;
    transition: width 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

/* ─── 5张卡片网格 ─── */
.feat-cards-grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

/* ─── 单张卡片 ─── */
.feat-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 14px;
    border-radius: 12px;
    border: 1px solid transparent;
    border-left-width: 3px;
    position: relative;
    overflow: hidden;
    cursor: default;
    animation: featCardSlideIn 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
/* 每张卡片的入场延迟和背景色由JS内联设置 */
.feat-card:hover {
    transform: translateX(4px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
@keyframes featCardSlideIn {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* ─── 卡片图标 ─── */
.feat-card-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    color: white;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
@keyframes featIconPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.08); }
}

/* ─── 卡片文字 ─── */
.feat-card-body {
    flex: 1;
    min-width: 0;
}
.feat-card-title {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 2px;
}
.feat-card-desc {
    font-size: 11px;
    line-height: 1.45;
    opacity: 0.85;
}

/* ─── 卡片边缘光晕 ─── */
.feat-card-shine {
    position: absolute;
    top: 0; right: 0;
    width: 80px;
    height: 100%;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(255,255,255,0.03) 40%,
        rgba(255,255,255,0.06) 60%,
        transparent 100%
    );
    pointer-events: none;
}

/* ─── 日间模式 ─── */
[data-theme="day"] .feat-card {
    box-shadow: 0 1px 3px rgba(100,116,139,0.06);
}
[data-theme="day"] .feat-card:hover {
    box-shadow: 0 4px 16px rgba(100,116,139,0.12);
}
[data-theme="day"] .feat-card-desc {
    opacity: 0.9;
}
[data-theme="day"] .feat-loading-bar {
    background: rgba(148,163,184,0.15);
}

/* ════════════════════════════════════════════
   Unified Button Design System v2
   灵感：Linear / Arc / Notion 克制美学
   — 夜：冷靛半透毛玻璃 + 紫金微光
   — 昼：宣纸白 + 水墨淡影
   ════════════════════════════════════════════ */

/* ---- 公共基类 ---- */
.p-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    border: 1px solid transparent; cursor: pointer; white-space: nowrap;
    font-family: inherit; line-height: 1;
    transition: all 0.22s cubic-bezier(0.25, 0.1, 0.15, 1);
    user-select: none; outline: none;
    letter-spacing: 0.01em;
}
.p-btn i, .p-btn svg { flex-shrink: 0; pointer-events: none; opacity: 0.85; }
.p-btn:hover i, .p-btn:hover svg { opacity: 1; }

/* ---- Tier 1 · Primary（填充 38px）—— 主操作，保持醒目 ---- */
.p-btn-primary {
    height: 38px; padding: 0 18px; border-radius: 10px;
    font-size: 13px; font-weight: 600;
    background: var(--gradient-1);
    color: #fff; border-color: transparent;
    box-shadow: 0 4px 14px rgba(var(--primary-rgb), 0.30);
}
.p-btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(var(--primary-rgb), 0.42);
}
.p-btn-primary:active { transform: translateY(0); }

.p-btn-primary.p-btn-green  { background: var(--success-gradient); box-shadow: 0 4px 14px rgba(var(--success-rgb), 0.30); }
.p-btn-primary.p-btn-green:hover  { box-shadow: 0 6px 20px rgba(var(--success-rgb), 0.42); }
.p-btn-primary.p-btn-red    { background: var(--error-gradient);   box-shadow: 0 4px 14px rgba(239,68,68, 0.30); }
.p-btn-primary.p-btn-red:hover    { box-shadow: 0 6px 20px rgba(239,68,68, 0.42); }
.p-btn-primary.p-btn-amber  { background: var(--warning-gradient); box-shadow: 0 4px 14px rgba(245,158,11,0.30); }
.p-btn-primary.p-btn-amber:hover  { box-shadow: 0 6px 20px rgba(245,158,11,0.42); }

/* ---- Tier 2 · Secondary（半透 32px）—— 次要操作，按功能分色 ---- */
.p-btn-secondary {
    height: 32px; padding: 0 13px; border-radius: 8px;
    font-size: 12px; font-weight: 500;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
    color: #a5b4cf;
    backdrop-filter: blur(8px);
}
.p-btn-secondary:hover {
    background: rgba(255,255,255,0.12);
    border-color: rgba(255,255,255,0.16);
    color: #e8edf5;
    transform: translateY(-1px);
}
.p-btn-secondary:active { transform: translateY(0); }

/* Secondary 功能色变体 — 仅图标+文字微着色，不抢主操作 */
.p-btn-secondary.p-btn-purple  { border-color: rgba(139,124,247,0.18); color: #c4b5fd; }
.p-btn-secondary.p-btn-purple:hover  { background: rgba(139,124,247,0.10); border-color: rgba(139,124,247,0.30); color: #ddd6fe; }
.p-btn-secondary.p-btn-blue    { border-color: rgba(96,165,250,0.18); color: #93c5fd; }
.p-btn-secondary.p-btn-blue:hover    { background: rgba(96,165,250,0.10); border-color: rgba(96,165,250,0.30); color: #bfdbfe; }
.p-btn-secondary.p-btn-green   { border-color: rgba(52,211,153,0.18); color: #6ee7b7; }
.p-btn-secondary.p-btn-green:hover   { background: rgba(52,211,153,0.10); border-color: rgba(52,211,153,0.30); color: #a7f3d0; }
.p-btn-secondary.p-btn-amber   { border-color: rgba(251,191,36,0.18); color: #fcd34d; }
.p-btn-secondary.p-btn-amber:hover   { background: rgba(251,191,36,0.10); border-color: rgba(251,191,36,0.30); color: #fde68a; }
.p-btn-secondary.p-btn-red     { border-color: rgba(248,113,113,0.18); color: #fca5a5; }
.p-btn-secondary.p-btn-red:hover     { background: rgba(248,113,113,0.10); border-color: rgba(248,113,113,0.30); color: #fecaca; }

/* ---- Tier 3 · Tertiary（幽灵/图标 28px） —— 无边框最小干扰 ---- */
.p-btn-tertiary {
    height: 28px; padding: 0 8px; border-radius: 7px;
    font-size: 11px; font-weight: 500;
    background: transparent;
    border-color: transparent;
    color: #7c8aa0;
}
.p-btn-tertiary:hover {
    background: rgba(255,255,255,0.06);
    color: #bcc8dc;
}

.p-btn-icon {
    width: 28px; height: 28px; padding: 0;
    border-radius: 7px;
    font-size: 13px; color: #7c8aa0;
    background: transparent; border-color: transparent;
}
.p-btn-icon:hover { background: rgba(255,255,255,0.08); color: #bcc8dc; }

/* ---- 日间模式 — !important 强制覆盖所有继承/冲突 ---- */
[data-theme="day"] .p-btn-primary {
    box-shadow: 0 3px 12px rgba(var(--day-primary-rgb), 0.20) !important;
}
[data-theme="day"] .p-btn-primary:hover {
    box-shadow: 0 5px 18px rgba(var(--day-primary-rgb), 0.30) !important;
}
[data-theme="day"] .p-btn-primary.p-btn-green {
    box-shadow: 0 3px 12px rgba(34,197,94, 0.20) !important;
}
[data-theme="day"] .p-btn-primary.p-btn-red {
    box-shadow: 0 3px 12px rgba(239,68,68, 0.20) !important;
}
[data-theme="day"] .p-btn-primary.p-btn-amber {
    box-shadow: 0 3px 12px rgba(245,158,11, 0.20) !important;
}

[data-theme="day"] .p-btn-secondary {
    background: #f8f9fb !important;
    border: 1px solid #e4e8ef !important;
    color: #5f6b7a !important;
    box-shadow: none !important;
}
[data-theme="day"] .p-btn-secondary:hover {
    background: #eef1f5 !important;
    border-color: #cfd5e0 !important;
    color: #374151 !important;
}
/* 日间 Secondary 功能色 */
[data-theme="day"] .p-btn-secondary.p-btn-purple  { border-color: #ddd6fe !important; color: #7c3aed !important; }
[data-theme="day"] .p-btn-secondary.p-btn-purple:hover  { background: #f5f3ff !important; border-color: #c4b5fd !important; color: #6d28d9 !important; }
[data-theme="day"] .p-btn-secondary.p-btn-blue    { border-color: #bfdbfe !important; color: #2563eb !important; }
[data-theme="day"] .p-btn-secondary.p-btn-blue:hover    { background: #eff6ff !important; border-color: #93c5fd !important; color: #1d4ed8 !important; }
[data-theme="day"] .p-btn-secondary.p-btn-green   { border-color: #a7f3d0 !important; color: #059669 !important; }
[data-theme="day"] .p-btn-secondary.p-btn-green:hover   { background: #ecfdf5 !important; border-color: #6ee7b7 !important; color: #047857 !important; }
[data-theme="day"] .p-btn-secondary.p-btn-amber   { border-color: #fde68a !important; color: #d97706 !important; }
[data-theme="day"] .p-btn-secondary.p-btn-amber:hover   { background: #fffbeb !important; border-color: #fcd34d !important; color: #b45309 !important; }
[data-theme="day"] .p-btn-secondary.p-btn-red     { border-color: #fecaca !important; color: #dc2626 !important; }
[data-theme="day"] .p-btn-secondary.p-btn-red:hover     { background: #fef2f2 !important; border-color: #fca5a5 !important; color: #b91c1c !important; }

[data-theme="day"] .p-btn-tertiary {
    background: transparent !important;
    border-color: transparent !important;
    color: #78869b !important;
}
[data-theme="day"] .p-btn-tertiary:hover {
    background: #f1f5f9 !important;
    color: #475569 !important;
}
[data-theme="day"] .p-btn-icon {
    background: transparent !important;
    border: 1px solid transparent !important;
    color: #78869b !important;
    box-shadow: none !important;
}
[data-theme="day"] .p-btn-icon:hover {
    background: #f1f5f9 !important;
    border-color: #e4e8ef !important;
    color: #475569 !important;
}
/* ---- 分段控制器容器（iOS/Notion 风格）---- */
.p-btn-toggle-group {
    display: flex; gap: 1px; align-items: center;
    background: rgba(255,255,255,0.04); border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.05);
    padding: 3px; overflow: hidden;
}
[data-theme="day"] .p-btn-toggle-group {
    background: #f1f5f9; border-color: #e4e8ef;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.03);
}

/* ---- Toggle 项 ---- */
.p-btn-toggle {
    height: 32px; padding: 0 14px; border-radius: 8px;
    font-size: 12px; font-weight: 500;
    background: transparent;
    border: none;
    color: #7c8aa0;
    position: relative;
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.15, 1);
}
.p-btn-toggle:hover { background: rgba(255,255,255,0.06); color: #bcc8dc; }
.p-btn-toggle.active {
    background: rgba(255,255,255,0.10); color: #e8edf5;
    font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

/* 网课激活 — 翠绿 */
.p-btn-toggle.p-btn-video.active {
    background: rgba(16,185,129,0.15); color: #34d399;
}
.p-btn-toggle.p-btn-video.active:hover { background: rgba(16,185,129,0.22); }

/* ---- 日间 ---- */
[data-theme="day"] .p-btn-toggle {
    color: #64748b;
}
[data-theme="day"] .p-btn-toggle:hover {
    background: rgba(0,0,0,0.03); color: #475569;
}
[data-theme="day"] .p-btn-toggle.active {
    background: #fff; color: #1e293b;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 0 0 1px rgba(0,0,0,0.04);
}
[data-theme="day"] .p-btn-toggle.p-btn-video.active {
    background: #d1fae5; color: #059669;
}
[data-theme="day"] .p-btn-toggle.p-btn-video.active:hover { background: #a7f3d0; }
[data-theme="day"] .p-btn-toggle.p-btn-review { color: #7c3aed; }
[data-theme="day"] .p-btn-toggle.p-btn-review:hover { background: rgba(124,58,237,0.06); }