/* ═══════════════ 基础布局 ═══════════════ */
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
    margin: 0;
    background: #ffffff;
    font-family: -apple-system, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    color: #172033;
    overflow: hidden;
}
.presentation { position: relative; height: 100vh; }

.slide {
    position: absolute; inset: 0;
    display: none;
    padding: 0 0 76px;
    gap: 0;
    justify-content: center;
    align-items: stretch;
    background: #fff;
}
.slide.active { display: flex; animation: slideIn .5s cubic-bezier(.2,.8,.25,1); }
@keyframes slideIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ═══════════════ 左侧讲义区：无外框全屏分栏 ═══════════════ */
.chalkboard {
    flex: 0 0 39%; min-width: 0;
    display: flex; flex-direction: column;
    background: #fbfcfe;
    border-right: 1px solid #e8edf3;
    color: #172033;
    padding: clamp(28px, 3.4vw, 54px) clamp(26px, 3.2vw, 48px);
    overflow: auto;
}
.chalkboard > * { flex: none; }
.chalkboard h3 {
    font-size: clamp(25px, 2.3vw, 36px);
    margin: 0 0 20px; color: #102033; letter-spacing: .08em;
    padding-bottom: 12px; position: relative;
}
.chalkboard h3::after {
    content: ''; position: absolute; left: 0; bottom: 0;
    width: 72px; height: 4px;
    background: #1f6f8b;
}
.chalkboard p, .chalkboard li {
    font-size: clamp(15px, 1.12vw, 17px);
    line-height: 2.0; color: #2a3850;
}
.chalkboard p { margin: 8px 0; }
.chalkboard ul { margin: 10px 0; padding-left: 4px; list-style: none; }
.chalkboard li { margin: 9px 0; padding-left: 22px; position: relative; }
.chalkboard li::before { content: '—'; position: absolute; left: 0; color: #1f6f8b; font-weight: 800; }
.chalkboard b { color: #102033; }
.highlight { color: #b45309; font-weight: 800; }

.math-formula {
    background: #ffffff;
    border-left: 5px solid #1f6f8b;
    padding: 16px 0 16px 18px;
    margin: 18px 0;
    line-height: 2.2;
    font-size: clamp(14.5px, 1.14vw, 16.5px);
}
.def-name {
    display: inline-block;
    color: #1f6f8b;
    font-weight: 900; font-size: 12px; letter-spacing: 3px;
    padding: 0;
    margin-bottom: 8px;
}
.link-note {
    margin-top: auto;
    border-top: 1px solid #e4eaf1;
    padding-top: 13px;
    font-size: clamp(12.5px, .98vw, 14px);
    color: #607086; line-height: 1.85;
}
.link-note b { color: #1f6f8b; }

/* ═══════════════ 章节封面 ═══════════════ */
.section-cover { flex: 0 0 39%; justify-content: center; }
.section-cover-inner { max-width: 540px; }
.section-eyebrow { color: #1f6f8b; letter-spacing: 6px; font-weight: 800; font-size: 14px; }
.section-title {
    font-family: Georgia, 'Times New Roman', 'Noto Serif SC', STSong, serif;
    font-size: clamp(38px, 3.6vw, 54px);
    margin: 16px 0 12px; color: #102033; letter-spacing: 3px;
}
.section-subtitle { color: #516176; font-size: clamp(15px, 1.2vw, 17px); line-height: 1.95; margin: 0 0 28px; }
.section-topics { border-top: 1px solid #e4eaf1; padding-top: 20px; }
.topics-label { color: #607086; font-size: 13px; letter-spacing: 4px; }
.topic-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 0; padding: 0; }
.topic-chips li {
    border: 1px solid #cbd8e4; color: #1f4f69;
    padding: 7px 17px;
    font-size: 14.5px; font-weight: 600;
}
.topic-chips li::before { content: none; }

/* ═══════════════ 右侧可视化区：无外框全屏画布 ═══════════════ */
.visualization {
    flex: 1 1 auto; min-width: 0; position: relative;
    background: #ffffff;
    padding: clamp(18px, 2.6vw, 38px);
}
.visualization.white-bg, .visualization.full-width {
    background: #fff;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
.visualization.full-width { flex: 1 1 100%; padding: clamp(22px, 3vw, 44px); }
.visualization > svg { display: block; width: 100%; height: 100%; }

/* SVG 内部文字类（:not 守卫使代码内联的 font-size / fill 属性仍可生效） */
svg text { font-family: -apple-system, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif; }
text.viz-title { font-weight: 800; }
text.viz-title:not([font-size]) { font-size: 30px; }
text.viz-title:not([fill]) { fill: #16283a; }
text.viz-sub:not([font-size]) { font-size: 15.5px; }
text.viz-sub:not([fill]) { fill: #5c6b7c; }
text.fn-label { font-weight: 700; }
text.fn-label:not([font-size]) { font-size: 18px; }
text.readout { font-weight: 700; }
text.readout:not([font-size]) { font-size: 20px; }
text.readout-sub { font-weight: 600; }
text.readout-sub:not([font-size]) { font-size: 15.5px; }
text.readout-sub:not([fill]) { fill: #3a4b5d; }
/* MathTeX controls are centralized in assets/courseware.css. */

/* ═══════════════ 随堂练习卡片 ═══════════════ */
.practice {
    align-self: stretch;
    width: 100%;
    max-height: 100%;
    overflow: auto;
    background: #fff;
    border-radius: 0;
    border-top: 0;
    box-shadow: none;
    padding: clamp(36px, 5vw, 72px) clamp(44px, 8vw, 120px);
}
.practice-kicker { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.practice-tag {
    background: #1a5276; color: #fff;
    font-weight: 700; font-size: 13.5px; letter-spacing: 2px;
    padding: 6px 15px; border-radius: 999px;
}
.practice-topic { color: #7b8a9a; font-size: 14px; font-weight: 600; letter-spacing: 1px; }
.practice-q { display: flex; gap: 16px; align-items: flex-start; }
.q-badge, .a-badge {
    flex: none; width: 40px; height: 40px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: 17px; color: #fff;
}
.q-badge { background: linear-gradient(135deg, #3498db, #1a5276); box-shadow: 0 6px 14px rgba(26,82,118,.28); }
.a-badge { background: linear-gradient(135deg, #2ecc71, #148f57); box-shadow: 0 6px 14px rgba(20,143,87,.28); }
.q-text { font-size: 19.5px; color: #1f2d3d; line-height: 1.9; margin: 5px 0 0; }
.practice-divider { border: none; border-top: 1.5px dashed #dbe3ec; margin: 24px 0 14px; }
.practice-hintline {
    color: #8795a5; font-size: 14px; cursor: pointer; user-select: none;
    transition: color .2s, opacity .3s;
}
.practice-hintline:hover { color: #1a5276; }
.practice.answered .practice-hintline { opacity: .45; }
.key-cap {
    display: inline-block;
    border: 1px solid #cfd8e2; border-bottom-width: 2.5px;
    border-radius: 6px; background: #f6f8fb;
    padding: 1px 8px; font-size: 12.5px; font-weight: 700; color: #41546b;
    margin: 0 2px;
}
.practice-answer {
    display: grid; grid-template-rows: 0fr; opacity: 0;
    transition: grid-template-rows .6s cubic-bezier(.22,.9,.24,1), opacity .45s ease .05s;
    margin-top: 8px;
}
.practice-answer.revealed { grid-template-rows: 1fr; opacity: 1; }
.answer-clip { overflow: hidden; min-height: 0; }
.answer-flex {
    display: flex; gap: 16px; align-items: flex-start;
    background: #f6fbf8; border-left: 5px solid #2ecc71; border-radius: 0;
    padding: 20px 22px;
    transform: translateY(14px);
    transition: transform .6s cubic-bezier(.22,.9,.24,1);
}
.revealed .answer-flex { transform: none; }
.a-body { flex: 1; min-width: 0; }
.a-body p { margin: 0 0 10px; font-size: 16.5px; color: #22384c; line-height: 2.0; }
.a-conclusion { font-weight: 700; color: #14653f !important; border-left: 4px solid #2ecc71; padding-left: 12px; }
.a-note {
    font-size: 14px !important; color: #62758a !important; line-height: 1.9 !important;
    background: #fff; border-left: 3px solid #cfe3d8; border-radius: 0;
    padding: 10px 14px !important; margin-top: 6px !important;
}
.a-note b { color: #3a5166; }

/* ═══════════════ 底部控制栏 ═══════════════ */
.controls {
    position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%);
    display: flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border: 1px solid #e3e9f0; border-radius: 12px;
    padding: 8px 12px;
    box-shadow: 0 10px 30px rgba(23,43,77,.14);
    z-index: 50; white-space: nowrap;
}
.nav-btn {
    display: inline-flex; align-items: center; gap: 6px;
    border: 1px solid #d7dfe8; background: #fff; color: #33475f;
    border-radius: 10px; padding: 7px 12px;
    font-size: 13.5px; font-weight: 600; font-family: inherit;
    cursor: pointer; transition: all .15s;
}
.nav-btn:hover { border-color: #1a5276; color: #1a5276; background: #f2f8fd; }
.nav-btn:disabled { opacity: .4; cursor: default; pointer-events: none; }
.nav-ico { font-size: 15px; line-height: 1; }
.page-indicator {
    min-width: 66px; text-align: center;
    font-weight: 700; color: #1a2b3c;
    font-variant-numeric: tabular-nums; font-size: 14.5px;
}
.page-jump {
    display: flex; align-items: center; gap: 6px;
    padding: 0 10px; margin: 0 2px;
    border-left: 1px solid #e3e9f0; border-right: 1px solid #e3e9f0;
}
.page-jump-label { font-size: 12.5px; color: #7b8a9a; }
.page-jump-input {
    width: 52px; padding: 6px 6px;
    border: 1px solid #d7dfe8; border-radius: 8px;
    font-size: 13.5px; text-align: center; font-family: inherit; color: #1f2d3d;
}
.page-jump-input:focus { outline: none; border-color: #1a5276; }
.page-jump-input::-webkit-outer-spin-button, .page-jump-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.page-jump-btn {
    border: 1px solid #d7dfe8; background: #f6f9fc; color: #33475f;
    border-radius: 8px; padding: 6px 11px;
    font-size: 12.5px; font-weight: 700; font-family: inherit;
    cursor: pointer; transition: all .15s;
}
.page-jump-btn:hover { border-color: #1a5276; color: #1a5276; }

/* ═══════════════ 二级菜单（目录 / 实验室） ═══════════════ */
.lab-submenu {
    position: fixed; inset: 0; z-index: 90;
    background: rgba(15,23,32,.45);
    backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
    display: flex; align-items: center; justify-content: center;
}
.submenu-content {
    position: relative;
    background: #fff; border-radius: 12px;
    padding: 26px 30px 26px;
    box-shadow: 0 24px 60px rgba(10,25,41,.3);
    width: min(780px, 92vw); max-height: 84vh; overflow: auto;
    animation: popIn .3s cubic-bezier(.2,.8,.3,1.2);
}
@keyframes popIn { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
.submenu-title { font-size: 19px; font-weight: 800; color: #14324c; margin-bottom: 18px; letter-spacing: 1px; }
.submenu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }
.submenu-item {
    display: flex; align-items: center; gap: 12px;
    padding: 11px 14px;
    border: 1px solid #e6ecf2; border-radius: 12px;
    cursor: pointer; transition: all .15s;
    color: #2c3e50; font-size: 14.5px; font-weight: 500;
}
.submenu-item:hover { border-color: #1a5276; background: #f2f8fd; transform: translateY(-1px); }
.submenu-icon {
    flex: none; width: 30px; height: 30px; border-radius: 9px;
    background: #eaf3fb; color: #1a5276;
    display: flex; align-items: center; justify-content: center; font-size: 13px;
}
.submenu-text { min-width: 0; }
.submenu-close {
    position: absolute; top: 12px; right: 18px;
    font-size: 26px; color: #8b9aa9; cursor: pointer; line-height: 1;
    transition: color .15s;
}
.submenu-close:hover { color: #c0392b; }

/* MathJax 输出微调 */
mjx-container { margin: 0 1px; }
mjx-container[display="true"] { margin: 8px 0 !important; }

@media (max-width: 980px) {
    body { overflow: auto; }
    .presentation { height: 100dvh; min-height: 100dvh; }
    .slide {
        min-height: 100dvh;
        padding-bottom: 118px;
        flex-direction: column;
        justify-content: flex-start;
        overflow: auto;
    }
    .chalkboard {
        flex: none;
        min-height: 36dvh;
        border-right: 0;
        border-bottom: 1px solid #e8edf3;
        padding: 26px 24px;
    }
    .visualization {
        flex: 1 0 58dvh;
        min-height: 420px;
        padding: 18px;
    }
    .visualization.full-width { min-height: calc(100dvh - 118px); }
    .controls {
        width: calc(100vw - 16px);
        justify-content: center;
        flex-wrap: wrap;
        bottom: 8px;
        white-space: normal;
    }
    .submenu-grid { grid-template-columns: 1fr; }
}