* {
    box-sizing: border-box;
}


body {

    margin: 0;

    font-family:
        Arial,
        "Microsoft YaHei",
        sans-serif;

    background: #f5f6f8;

    color: #20242a;
}


/* =========================
   导航栏
   ========================= */

.navbar {

    height: 72px;

    background: white;

    border-bottom: 1px solid #e5e7eb;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0 60px;
}


.logo {

    font-size: 20px;

    font-weight: 700;

    letter-spacing: 0.5px;
}


nav {

    display: flex;

    gap: 32px;
}


nav a {

    color: #555;

    text-decoration: none;

    font-size: 14px;
}


nav a:hover {

    color: #111;
}



/* =========================
   页面主体
   ========================= */

.container {

    width: 1100px;

    max-width: calc(100% - 40px);

    margin: 50px auto;
}



/* =========================
   欢迎区域
   ========================= */

.hero {

    background: white;

    border: 1px solid #e5e7eb;

    border-radius: 16px;

    padding: 50px;

    display: flex;

    justify-content: space-between;

    align-items: center;
}


.hero h1 {

    font-size: 36px;

    margin: 0 0 16px 0;
}


.hero p {

    color: #666;

    line-height: 1.8;
}


button {

    margin-top: 18px;

    padding: 12px 24px;

    border: none;

    border-radius: 8px;

    background: #20242a;

    color: white;

    font-size: 14px;

    cursor: pointer;
}


button:hover {

    opacity: 0.85;
}



/* =========================
   今日复习数字
   ========================= */

.review-number {

    width: 180px;

    height: 180px;

    border: 1px solid #ddd;

    border-radius: 50%;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;
}


.review-number span {

    font-size: 13px;

    color: #777;
}


.review-number strong {

    font-size: 56px;

    line-height: 1.2;

    margin: 4px 0;
}



/* =========================
   标题
   ========================= */

section {

    margin-top: 50px;
}


h2 {

    font-size: 20px;

    margin-bottom: 20px;
}



/* =========================
   数据卡片
   ========================= */

.stats {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 16px;
}


.stat-card {

    background: white;

    border: 1px solid #e5e7eb;

    border-radius: 12px;

    padding: 24px;
}


.stat-card span {

    display: block;

    color: #777;

    font-size: 13px;

    margin-bottom: 12px;
}


.stat-card strong {

    font-size: 28px;
}



/* =========================
   薄弱知识
   ========================= */

.weak-list {

    background: white;

    border: 1px solid #e5e7eb;

    border-radius: 12px;

    overflow: hidden;
}


.weak-item {

    padding: 20px 24px;

    display: flex;

    justify-content: space-between;

    align-items: center;

    border-bottom: 1px solid #eee;
}


.weak-item:last-child {

    border-bottom: none;
}


.weak-item strong {

    font-size: 15px;
}


.weak-item p {

    margin: 6px 0 0 0;

    font-size: 13px;

    color: #888;
}


.weak-item > span {

    font-size: 14px;

    color: #777;
}


/* =========================
   复习页面
   ========================= */

.review-page {

    max-width: 800px;

    margin: 0 auto;

}


.review-page > h1 {

    font-size: 36px;

    margin-bottom: 30px;

}


.review-card {

    background: white;

    border: 1px solid #e5e7eb;

    border-radius: 16px;

    padding: 50px;

}


.category {

    color: #888;

    font-size: 14px;

}


.review-card h2 {

    font-size: 28px;

    margin: 20px 0 40px;

}


.question {

    background: #f5f6f8;

    border-radius: 10px;

    padding: 30px;

    margin-bottom: 25px;

}


.question p {

    margin: 0;

    font-size: 20px;

    line-height: 1.7;

}


.answer {

    margin-top: 30px;

    padding-top: 30px;

    border-top: 1px solid #eee;

}


.answer h3 {

    margin-bottom: 10px;

}


.answer p {

    line-height: 1.8;

    color: #555;

}


.hidden {

    display: none;

}


button:disabled {

    opacity: 0.5;

    cursor: default;

}


.primary-button {

    display: inline-block;

    margin-top: 18px;

    padding: 12px 24px;

    border-radius: 8px;

    background: #20242a;

    color: white;

    text-decoration: none;

    font-size: 14px;

}


.primary-button:hover {

    opacity: 0.85;

}


/* =========================
   我的学习页面
   ========================= */

.study-page {

    width: 1100px;

    max-width: calc(100% - 40px);

    margin: 50px auto 80px;
}


/* 页面主标题 */

.study-page > h1 {

    font-size: 36px;

    margin: 0 0 40px 0;
}


/* =========================
   学习概览
   ========================= */

.study-overview {

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 20px;

    margin-top: 0;
}


.study-overview .stat-card {

    min-height: 140px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    padding: 28px;
}


.study-overview .stat-card span {

    margin-bottom: 12px;

    color: #777;

    font-size: 14px;
}


.study-overview .stat-card strong {

    font-size: 36px;

    line-height: 1;
}


/* =========================
   学习记录
   ========================= */

.study-records {

    margin-top: 50px;
}


.study-records h2 {

    font-size: 22px;

    margin-bottom: 20px;
}


/* =========================
   单条学习记录
   ========================= */

.record-card {

    background: white;

    border: 1px solid #e5e7eb;

    border-radius: 12px;

    padding: 24px;

    margin-bottom: 16px;
}


.record-card h3 {

    margin: 0 0 16px 0;

    font-size: 18px;
}


.record-card p {

    margin: 8px 0;

    font-size: 14px;

    color: #666;
}


/* =========================
   移动端适配
   ========================= */

@media (max-width: 700px) {

    .navbar {

        padding: 0 20px;

    }


    nav {

        gap: 14px;

    }


    .study-page {

        max-width: calc(100% - 30px);

        margin-top: 35px;

    }


    .study-page > h1 {

        font-size: 30px;

    }


    .study-overview {

        grid-template-columns: 1fr;

    }

}


/* =========================
   知识库页面
   ========================= */

.page-header {
    text-align: center;
    margin-bottom: 30px;
}

.page-header h2 {
    margin-bottom: 10px;
}

#knowledgeList {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.knowledge-card {
    background: white;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.knowledge-card h3 {
    margin-top: 0;
    margin-bottom: 8px;
}

.knowledge-category {
    font-size: 14px;
    color: #666;
    margin-bottom: 16px;
}

.knowledge-answer {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #eee;
    line-height: 1.6;
}

.knowledge-category-section {
    width: 100%;
}

.knowledge-section-title {
    margin-bottom: 16px;
}

.knowledge-category-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

/* 手机屏幕 */

@media (max-width: 700px) {

    #knowledgeList {
        gap: 24px;
    }

    .knowledge-card {
        padding: 20px;
    }

    .knowledge-category-list {
    grid-template-columns: 1fr;
    }
}


.knowledge-source {
    margin-top: 30px;
    padding: 20px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #f8fafc;
}

.knowledge-source h3 {
    margin-top: 0;
    margin-bottom: 16px;
}

.knowledge-source p {
    margin: 8px 0;
    line-height: 1.7;
}

.knowledge-source strong {
    margin-right: 6px;
}


/* ==========================================================================
   V1.1 视觉基础（Stage 1）：Liquid Glass / Medical Futuristic
   --------------------------------------------------------------------------
   本区块**只追加**，不删除、不改写上方任何既有规则（业务结构 / 类名 / 布局不动）：
     - 深色空间背景 + 半透明玻璃面板（backdrop-filter blur）
     - 统一圆角 / 阴影 / 文字层级 / 按钮 / 输入框 / Badge / Progress
     - 克制的 Hover / Focus / Active 微动效 + 页面进入淡入
     - 移动端基础响应式

   覆盖策略（重要）：
     - 各页面另有在 <link> 之后的内联 <style>，同优先级下会覆盖本文件；
       因此本区块凡需覆盖页面既有浅色主题处，统一用 `html body …` / `body …`
       提高一级特异性（见文末「对比度保障层」）。
     - 业务 JS 生成的内联样式（例如测验选项按钮）优先级最高，本阶段不动。
     - 本阶段不做页面重排：只改颜色 / 表面 / 描边 / 圆角 / 阴影 / 动效。
   ========================================================================== */

:root {

    /* 背景与表面 */
    --v11-bg-deep: #04070d;
    --v11-bg: #070b14;

    /* 描边 / 分割线 */
    --v11-border: rgba(255, 255, 255, 0.12);
    --v11-border-soft: rgba(255, 255, 255, 0.08);

    /* 文字层级 */
    --v11-text: #e8eef7;
    --v11-text-2: #b3c0d4;
    --v11-text-3: #8494ab;

    /* 强调色（Cyan / Blue，克制使用） */
    --v11-accent: #7fd7ff;
    --v11-accent-2: #7aa8ff;
    --v11-accent-line: rgba(127, 215, 255, 0.34);

    /* 圆角体系 */
    --v11-radius-lg: 22px;
    --v11-radius: 16px;
    --v11-radius-sm: 10px;
    --v11-radius-pill: 999px;

    /* 阴影 / 光晕体系 */
    --v11-shadow-1: 0 10px 30px rgba(2, 6, 14, 0.45);
    --v11-shadow-2: 0 24px 70px rgba(2, 6, 14, 0.55);
    --v11-glow: 0 0 42px rgba(74, 148, 255, 0.10);
    --v11-inset: inset 0 1px 0 rgba(255, 255, 255, 0.07);

    /* 玻璃参数 */
    --v11-blur: 18px;
    --v11-saturate: 140%;

    /* 动效参数 */
    --v11-dur: 180ms;
    --v11-ease: cubic-bezier(0.22, 1, 0.36, 1);
}


/* ---------- 深色空间背景 ---------- */

html {
    background: var(--v11-bg-deep);
    scrollbar-color: rgba(127, 215, 255, 0.22) rgba(255, 255, 255, 0.04);
}

html body {

    min-height: 100vh;

    background:
        radial-gradient(1100px 760px at 10% -12%, rgba(58, 118, 255, 0.22), transparent 62%),
        radial-gradient(920px 700px at 92% -6%, rgba(86, 214, 255, 0.14), transparent 58%),
        radial-gradient(1100px 900px at 50% 118%, rgba(112, 96, 255, 0.12), transparent 62%),
        linear-gradient(180deg, #080d18 0%, #060a13 52%, #04060c 100%);

    background-attachment: fixed;

    color: var(--v11-text);

    -webkit-font-smoothing: antialiased;
}

::selection {
    background: rgba(127, 215, 255, 0.28);
    color: #ffffff;
}

:focus-visible {
    outline: 2px solid rgba(127, 215, 255, 0.65);
    outline-offset: 2px;
}


/* ---------- 文字层级 ---------- */

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--v11-text);
    letter-spacing: 0.2px;
}

strong,
b {
    color: var(--v11-text);
}

.category,
.hero p,
.answer p,
.record-card p,
.stat-card span,
.knowledge-category {
    color: var(--v11-text-2);
}

.weak-item p,
.weak-item > span,
.review-number span,
.study-overview .stat-card span {
    color: var(--v11-text-3);
}


/* ---------- 导航（入口 / 顺序 / URL 一律不变，仅换肤） ---------- */

.navbar {

    position: sticky;
    top: 0;
    z-index: 50;

    height: 72px;

    background:
        linear-gradient(180deg, rgba(14, 21, 36, 0.72), rgba(8, 13, 24, 0.52));

    border-bottom: 1px solid var(--v11-border-soft);

    box-shadow: 0 12px 40px rgba(2, 6, 14, 0.45), var(--v11-inset);

    -webkit-backdrop-filter: blur(var(--v11-blur)) saturate(var(--v11-saturate));
    backdrop-filter: blur(var(--v11-blur)) saturate(var(--v11-saturate));
}

.logo {
    color: var(--v11-text);
    letter-spacing: 0.6px;
    text-shadow: 0 0 24px rgba(127, 215, 255, 0.20);
}

header.navbar nav {
    align-items: center;
}

header.navbar nav a,
header.navbar nav a:nth-child(n) {

    color: var(--v11-text-2);

    padding: 8px 12px;

    border: 1px solid transparent;
    border-radius: var(--v11-radius-pill);

    transition:
        color var(--v11-dur) var(--v11-ease),
        background var(--v11-dur) var(--v11-ease),
        border-color var(--v11-dur) var(--v11-ease),
        box-shadow var(--v11-dur) var(--v11-ease);
}

header.navbar nav a:hover,
header.navbar nav a:nth-child(n):hover {

    color: var(--v11-text);

    background: rgba(255, 255, 255, 0.06);

    border-color: var(--v11-border-soft);

    box-shadow: 0 0 18px rgba(127, 215, 255, 0.10);
}

/* knowledge.html 的顶栏是 <header>（无 .navbar 类）：
   这里给同一套玻璃顶栏与导航换肤，保证全站顶栏一致 */
body > header:not(.navbar) {

    height: 72px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 60px;

    background:
        linear-gradient(180deg, rgba(14, 21, 36, 0.72), rgba(8, 13, 24, 0.52));

    border-bottom: 1px solid var(--v11-border-soft);

    box-shadow: 0 12px 40px rgba(2, 6, 14, 0.45), var(--v11-inset);

    -webkit-backdrop-filter: blur(var(--v11-blur)) saturate(var(--v11-saturate));
    backdrop-filter: blur(var(--v11-blur)) saturate(var(--v11-saturate));
}

body > header:not(.navbar) nav {
    align-items: center;
}

body > header:not(.navbar) nav a,
body > header:not(.navbar) nav a:nth-child(n) {

    color: var(--v11-text-2);

    padding: 8px 12px;

    border: 1px solid transparent;
    border-radius: var(--v11-radius-pill);

    transition:
        color var(--v11-dur) var(--v11-ease),
        background var(--v11-dur) var(--v11-ease),
        border-color var(--v11-dur) var(--v11-ease),
        box-shadow var(--v11-dur) var(--v11-ease);
}

body > header:not(.navbar) nav a:hover,
body > header:not(.navbar) nav a:nth-child(n):hover {

    color: var(--v11-text);

    background: rgba(255, 255, 255, 0.06);

    border-color: var(--v11-border-soft);
}


/* ---------- 玻璃面板（统一 Card） ---------- */

.hero,
.review-card,
.stat-card,
.study-overview .stat-card,
.weak-list,
.record-card,
.knowledge-card,
.knowledge-source {

    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.035));

    border: 1px solid var(--v11-border);

    border-radius: var(--v11-radius-lg);

    box-shadow: var(--v11-shadow-1), var(--v11-inset), var(--v11-glow);

    -webkit-backdrop-filter: blur(var(--v11-blur)) saturate(var(--v11-saturate));
    backdrop-filter: blur(var(--v11-blur)) saturate(var(--v11-saturate));
}

.knowledge-card,
.record-card,
.stat-card,
.weak-list,
.hero,
.review-card {

    transition:
        transform var(--v11-dur) var(--v11-ease),
        box-shadow var(--v11-dur) var(--v11-ease),
        border-color var(--v11-dur) var(--v11-ease);
}

.knowledge-card:hover,
.record-card:hover {

    transform: translateY(-2px);

    border-color: var(--v11-accent-line);

    box-shadow: var(--v11-shadow-2), var(--v11-inset), 0 0 34px rgba(127, 215, 255, 0.12);
}

.question {

    background: rgba(255, 255, 255, 0.045);

    border: 1px solid var(--v11-border-soft);

    border-radius: var(--v11-radius);
}

.weak-item {
    border-bottom: 1px solid var(--v11-border-soft);
}

.answer,
.knowledge-answer {
    border-top-color: var(--v11-border-soft);
}

.review-number {
    border-color: var(--v11-border);
    box-shadow: var(--v11-inset), 0 0 34px rgba(74, 148, 255, 0.10);
}


/* ---------- 按钮 ---------- */

button,
.primary-button {

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    margin-top: 18px;
    padding: 12px 22px;

    border: 1px solid var(--v11-border);
    border-radius: var(--v11-radius-pill);

    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.05));

    color: var(--v11-text);

    font-size: 14px;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;

    box-shadow: 0 8px 22px rgba(2, 6, 14, 0.40), var(--v11-inset);

    -webkit-backdrop-filter: blur(12px) saturate(140%);
    backdrop-filter: blur(12px) saturate(140%);

    transition:
        transform var(--v11-dur) var(--v11-ease),
        box-shadow var(--v11-dur) var(--v11-ease),
        border-color var(--v11-dur) var(--v11-ease),
        background var(--v11-dur) var(--v11-ease);
}

.primary-button {

    border-color: var(--v11-accent-line);

    background:
        linear-gradient(180deg, rgba(127, 215, 255, 0.24), rgba(122, 168, 255, 0.12));

    color: #f2fbff;

    box-shadow: 0 10px 26px rgba(2, 10, 20, 0.45), var(--v11-inset), 0 0 26px rgba(127, 215, 255, 0.14);
}

button:hover,
.primary-button:hover {

    opacity: 1;

    transform: translateY(-1px);

    border-color: var(--v11-accent-line);

    box-shadow: 0 14px 30px rgba(2, 10, 20, 0.50), var(--v11-inset), 0 0 30px rgba(127, 215, 255, 0.18);
}

button:active,
.primary-button:active {

    transform: translateY(0);

    box-shadow: 0 6px 16px rgba(2, 6, 14, 0.45), var(--v11-inset);
}

button:disabled {
    opacity: 0.5;
    cursor: default;
    transform: none;
}


/* ---------- 输入框 / 下拉框 ---------- */

input[type="text"],
input[type="search"],
input[type="number"],
input[type="file"],
select,
textarea {

    background: rgba(255, 255, 255, 0.05);

    border: 1px solid var(--v11-border);
    border-radius: var(--v11-radius-sm);

    color: var(--v11-text);

    box-shadow: var(--v11-inset);

    transition:
        border-color var(--v11-dur) var(--v11-ease),
        box-shadow var(--v11-dur) var(--v11-ease),
        background var(--v11-dur) var(--v11-ease);
}

input::placeholder,
textarea::placeholder {
    color: rgba(179, 192, 212, 0.55);
}

input:focus,
select:focus,
textarea:focus {

    outline: none;

    border-color: var(--v11-accent-line);

    background: rgba(127, 215, 255, 0.06);

    box-shadow: 0 0 0 3px rgba(127, 215, 255, 0.14), var(--v11-inset);
}

select option {
    background: #0b1220;
    color: var(--v11-text);
}


/* ---------- Badge / Progress（统一体系，供各页面复用） ---------- */

.badge,
.import-badge {

    display: inline-flex;
    align-items: center;
    gap: 6px;

    padding: 3px 10px;

    border: 1px solid var(--v11-border);
    border-radius: var(--v11-radius-pill);

    background: rgba(255, 255, 255, 0.07);

    color: var(--v11-text-2);

    font-size: 12px;
    line-height: 1.6;
}

progress {

    -webkit-appearance: none;
    appearance: none;

    width: 100%;
    height: 8px;

    border: 1px solid var(--v11-border-soft);
    border-radius: var(--v11-radius-pill);

    background: rgba(255, 255, 255, 0.06);

    overflow: hidden;
}

progress::-webkit-progress-bar {
    background: rgba(255, 255, 255, 0.06);
    border-radius: inherit;
}

progress::-webkit-progress-value {
    background: linear-gradient(90deg, var(--v11-accent-2), var(--v11-accent));
    border-radius: inherit;
}

progress::-moz-progress-bar {
    background: linear-gradient(90deg, var(--v11-accent-2), var(--v11-accent));
    border-radius: inherit;
}


/* ---------- 页面进入动效（克制，可被系统「减少动态效果」关闭） ---------- */

@keyframes v11-enter {

    from {
        transform: translateY(10px);
    }

    to {
        transform: translateY(0);
    }
}

main {
    animation: v11-enter 460ms var(--v11-ease);
}

/* 首页主标题「今天也来复习一下」的最终文字色（固定值，不随状态变化）
   - 修正前：该元素没有任何自己的颜色规则，颜色完全靠祖先继承；
     且页面进入动画对 <main> 做 opacity 0 → 1，动画期间整块内容半透明，
     标题亮度会随截图时机 / 系统"减少动态效果"设置而不同（忽明忽暗）。
   - 现在：动画只做位移，不再改变不透明度；并在此显式钉住颜色，
     正常加载 / hover / focus / active 一律同一颜色，不再受层叠与动画影响。
   只设置 color，不动字体 / 字号 / 字重 / 位置 / 间距 / 布局。 */

.hero h1,
.hero h1:link,
.hero h1:visited,
.hero h1:hover,
.hero h1:focus,
.hero h1:active {
    color: var(--v11-text);
}

@media (prefers-reduced-motion: reduce) {

    main {
        animation: none;
    }

    * {
        transition-duration: 1ms !important;
    }
}


/* ---------- 对比度保障层（覆盖各页面内联的浅色主题规则） ----------
   这些页面内联规则原本是「浅底 + 深字」；换成深色空间背景后，
   若不放宽颜色就会出现深字压深底。此处只调整颜色 / 表面，
   不改尺寸、间距与布局；后续页面改造阶段可逐条移除。
   ------------------------------------------------------------------ */

/* index / knowledge.html */
body .page-desc,
body .knowledge-section-title {
    color: var(--v11-text-2);
}

body .page-count {
    border: 1px solid var(--v11-border-soft);
    background: rgba(255, 255, 255, 0.06);
    color: var(--v11-text-2);
}

body .page-count #knowledgeCount {
    color: var(--v11-text);
}

body .knowledge-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.035));
    border: 1px solid var(--v11-border);
    box-shadow: var(--v11-shadow-1), var(--v11-inset);
}

body .knowledge-card h3 {
    color: var(--v11-text);
}

body .knowledge-card > p {
    color: var(--v11-text-2);
}

body .knowledge-answer {
    background: rgba(255, 255, 255, 0.045);
    border-top: 1px solid var(--v11-border-soft);
    color: var(--v11-text-2);
}

body .knowledge-answer strong {
    color: var(--v11-text);
}

body .no-results {
    border: 1px solid var(--v11-border-soft);
    background: rgba(255, 255, 255, 0.05);
    color: var(--v11-text-3);
}

body #knowledgeSearch,
body #knowledgeCategoryFilter {
    border: 1px solid var(--v11-border);
    background: rgba(255, 255, 255, 0.05);
    color: var(--v11-text);
}

body #knowledgeSearch:focus {
    color: var(--v11-text);
}

/* knowledge-detail.html */
body .knowledge-courses h3,
body .knowledge-courses .knowledge-courses-empty {
    color: var(--v11-text-3);
}

body .knowledge-courses .course-relation {
    border: 1px solid var(--v11-border-soft);
    background: rgba(255, 255, 255, 0.05);
}

body .knowledge-courses .course-relation-course {
    color: var(--v11-text);
}

body .knowledge-courses .course-relation-chapter {
    color: var(--v11-text-2);
}

body .knowledge-courses .course-relation-meta {
    color: var(--v11-text-3);
}

body .knowledge-navigation a {
    color: var(--v11-text-2);
}

body .knowledge-navigation a:hover {
    color: var(--v11-accent);
}

/* quiz.html */
body #quizStats > div {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.035));
    border: 1px solid var(--v11-border);
    box-shadow: var(--v11-shadow-1), var(--v11-inset);
}

body #quizStats span {
    color: var(--v11-text-3);
}

body #quizStats strong {
    color: var(--v11-text);
}

/* review.html */
body .review-scope label {
    color: var(--v11-text-3);
}

body #reviewScope {
    border: 1px solid var(--v11-border);
    background: rgba(255, 255, 255, 0.05);
    color: var(--v11-text);
}

body .review-course-back a {
    color: var(--v11-text-2);
}

body .review-course-back a:hover {
    color: var(--v11-accent);
}

/* wrong-questions.html */
body .wrong-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.035));
    border: 1px solid var(--v11-border);
    box-shadow: var(--v11-shadow-1), var(--v11-inset);
}

body .wrong-card .wrong-category,
body .wrong-card .wrong-meta {
    color: var(--v11-text-3);
}

body .wrong-card .wrong-question {
    color: var(--v11-text);
}

body .wrong-card .wrong-explanation {
    background: rgba(255, 255, 255, 0.045);
    color: var(--v11-text-2);
}

body .wrong-empty {
    border: 1px solid var(--v11-border-soft);
    background: rgba(255, 255, 255, 0.05);
    color: var(--v11-text-3);
}

body #wrongCategoryFilter {
    border: 1px solid var(--v11-border);
    background: rgba(255, 255, 255, 0.05);
    color: var(--v11-text);
}

/* study.html */
body .study-category-title {
    color: var(--v11-text);
}

body .study-category-stats {
    color: var(--v11-text-3);
}

/* content-admin.html */
body .course-desc,
body .course-message,
body .content-admin-status,
body .admin-item-tag,
body .admin-field {
    color: var(--v11-text-2);
}

body .course-hint,
body .admin-empty,
body .admin-item-meta,
body .admin-hint {
    color: var(--v11-text-3);
}

body .admin-form-title {
    color: var(--v11-text);
}

body .admin-form {
    border: 1px solid var(--v11-border-soft);
    border-radius: var(--v11-radius);
    background: rgba(255, 255, 255, 0.045);
}

body .admin-field input,
body .admin-field select,
body .admin-field textarea {
    border: 1px solid var(--v11-border);
    border-radius: var(--v11-radius-sm);
    background: rgba(255, 255, 255, 0.05);
    color: var(--v11-text);
}

/* import.html */
body #importFileInput {
    border: 1px solid var(--v11-border);
    background: rgba(255, 255, 255, 0.05);
    color: var(--v11-text-2);
}

body .import-tool-status,
body .import-question-card {
    border: 1px solid var(--v11-border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.035));
    color: var(--v11-text-2);
}

body .import-field-label,
body .import-format-line,
body .import-hint,
body .import-message,
body .import-allow-row,
body .import-confirm-row,
body .import-option {
    color: var(--v11-text-2);
}

body .import-file-meta,
body .import-note,
body .import-check-detail,
body .import-question-index,
body .import-question-id,
body .import-mapping-index,
body .import-mapping-id,
body .import-id-note {
    color: var(--v11-text-3);
}

body .import-format-line strong,
body .import-check-name,
body .import-question-text,
body .import-mapping-question {
    color: var(--v11-text);
}

body .import-question-explanation {
    border: 1px solid var(--v11-border-soft);
    background: rgba(255, 255, 255, 0.045);
    color: var(--v11-text-2);
}

body .import-mapping-select,
body .import-mapping-bulk select {
    border: 1px solid var(--v11-border);
    background: rgba(255, 255, 255, 0.05);
    color: var(--v11-text);
}

/* import.html：语义色在深底上提亮，保持"错误 / 警告 / 正确"可读 */
body .import-error-list li,
body .import-blocked-list li,
body .import-question-errors li,
body .course-message.error {
    color: #ffb3b3;
}

body .import-warning-list li,
body .import-mapping-note {
    color: #f4d79b;
}

body .import-option-answer {
    color: #9ee7b4;
}

body .import-tool-status-error {
    background: rgba(255, 120, 120, 0.10);
    color: #ffc0c0;
}

body .import-check-flag {
    background: rgba(88, 214, 141, 0.16);
    color: #a8f0c4;
}

body .import-check-fail .import-check-flag {
    background: rgba(255, 120, 120, 0.16);
    color: #ffc0c0;
}

body .import-badge-new {
    border-color: rgba(88, 214, 141, 0.32);
    background: rgba(88, 214, 141, 0.16);
    color: #a8f0c4;
}

body .import-badge-keep {
    border-color: rgba(122, 168, 255, 0.32);
    background: rgba(122, 168, 255, 0.16);
    color: #c3d8ff;
}

body .import-badge-warn {
    border-color: rgba(240, 196, 112, 0.32);
    background: rgba(240, 196, 112, 0.16);
    color: #f4d79b;
}


/* ---------- 移动端基础响应式（仅微调，不改结构） ---------- */

@media (max-width: 700px) {

    :root {
        --v11-blur: 14px;
        --v11-radius-lg: 18px;
    }

    .navbar {
        height: auto;
        min-height: 64px;
        padding: 8px 12px;
        flex-wrap: wrap;
        gap: 6px;
    }

    header.navbar nav {
        flex-wrap: wrap;
        gap: 5px;
    }

    /* V1.3.0-02 M4：6 个入口保持两行布局（logo / 入口行），
       链接实际高度 ≥44px，整体高度明显低于原 130px；桌面端不受影响 */
    header.navbar nav a,
    header.navbar nav a:nth-child(n) {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        min-height: 44px;
        padding: 0 8px;

        font-size: 13px;
        line-height: 1.2;
    }

    /* V1.3.0-02 M5：移动端统一「当前页」导航项（Liquid Glass 克制高亮，不影响尺寸） */
    header.navbar nav a.nav-active,
    header.navbar nav a.nav-active:nth-child(n) {
        color: var(--v11-text);
        border-color: var(--v11-accent-line);
        background: rgba(127, 215, 255, 0.08);
        box-shadow: none;
    }

    .hero {
        padding: 30px;
    }

    .review-card {
        padding: 28px;
    }

    main {
        animation-duration: 360ms;
    }
}


/* ---------- 不支持 backdrop-filter 时的降级（保证可读性） ---------- */

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {

    .navbar {
        background: rgba(10, 16, 28, 0.94);
    }

    .hero,
    .review-card,
    .stat-card,
    .study-overview .stat-card,
    .weak-list,
    .record-card,
    .knowledge-card,
    .knowledge-source,
    body .knowledge-card,
    body #quizStats > div,
    body .wrong-card {
        background: rgba(17, 24, 39, 0.92);
    }
}