/* 站点视觉样式 v9（多套门户风格 · 全端响应式）
   ------------------------------------------------------------------
   设计：一套结构、六套皮肤。皮肤通过 <body data-theme="xxx"> 切换，
   由后台「网站设置 → 站点风格」选择，生成静态页时写进 HTML。
   未标注 data-theme 的旧页面自动落到默认皮肤（parchment），不会变样。

   六套皮肤：
     parchment 羊皮纸·暖金   linen 素麻·晨白     forest 松柏·深绿
     ocean    静水·靛蓝      crimson 朱红·宣纸   dusk   夜读·墨黛
   差异不只是颜色：字体族、圆角、背景纹理、书脊、图标形状、
   标题对齐与分隔装饰都各自不同，避免几家门户看起来出自同一模板。

   仅依赖现有 HTML 结构（.top-fixed / .breadcrumb / .grid-container /
   .folder-book / .audio-item / .file-card / footer / #searchResults /
   .to-top / .empty-state），不改动任何生成逻辑。
   v9 重点：多皮肤、搜索结果真实排版、空目录提示、回到顶部按钮、
   文件卡与音频条信息层级重整。 */

/* ============ 设计变量（默认 = 羊皮纸·暖金） ============ */
:root {
    --ink:        #3b2f27;   /* 正文近咖棕，提升可读性 */
    --ink-soft:   #6f5f52;   /* 弱化文字 */
    --title:      #4a382b;   /* 标题棕 */
    --accent:     #b08d3e;   /* 古金（主强调） */
    --accent-deep:#8a6d2c;   /* 深金 */
    --accent-soft:#c9ad6a;   /* 浅金细线 */
    --bg:         #f7efe1;   /* 页面奶油 */
    --bg2:        #f1e6d4;   /* 次奶油 */
    --paper:      #fffefb;   /* 卡片纸白 */
    --line:       rgba(176,141,62,0.22);
    --line-soft:  rgba(176,141,62,0.14);
    --shadow-sm:  0 2px 10px rgba(74,56,43,0.08);
    --shadow-md:  0 12px 32px rgba(74,56,43,0.14);
    --shadow-lg:  0 18px 48px rgba(74,56,43,0.20);
    --radius:     16px;
    --card-grad:  linear-gradient(160deg, var(--paper), var(--bg2));
    --card-edge:  1px solid var(--line);
    --spine:      block;      /* 书脊显隐 */
    --icon-radius:50%;        /* 图标徽章形状 */
    --icon-bg:    radial-gradient(circle at 50% 35%, #ffffff, var(--bg2));
    --head-align: center;
    --head-bg:    linear-gradient(to bottom, rgba(247,239,225,0.90), rgba(247,239,225,0.10));
    --bg-img:     url('bg/parchment.jpg');
    --bg-repeat:  repeat;
    --bg-size:    760px 760px;
    --bg-tint:    rgba(247, 239, 225, 0.20);
    --glow-top:   rgba(255,250,240,0.10);
    --font-body:  Georgia, 'Times New Roman', 'Noto Serif SC', 'Songti SC',
                  'STSong', 'SimSun', serif;
    --font-display:'Cinzel', 'Playfair Display', Georgia, 'Songti SC', serif;
    --title-ls:   clamp(6px, 2vw, 10px);
    --mark-bg:    #f3e3b0;
    --maxw:       1380px;
    --tap:        44px;       /* 最小触屏点击区域 */
}

/* ---------- 皮肤 2：素麻·晨白（干净、方正、无纹理） ---------- */
[data-theme="linen"] {
    --ink: #2f3129; --ink-soft: #77796f; --title: #1f211c;
    --accent: #6f7d5f; --accent-deep: #556349; --accent-soft: #a9b39a;
    --bg: #fafaf7; --bg2: #f2f2ec; --paper: #ffffff;
    --line: rgba(60,64,52,0.14); --line-soft: rgba(60,64,52,0.08);
    --shadow-sm: 0 1px 3px rgba(40,44,36,0.06);
    --shadow-md: 0 8px 22px rgba(40,44,36,0.10);
    --shadow-lg: 0 16px 40px rgba(40,44,36,0.14);
    --radius: 6px;
    --card-grad: #ffffff;
    --card-edge: 1px solid rgba(60,64,52,0.12);
    --spine: none;
    --icon-radius: 8px;
    --icon-bg: #f4f4ee;
    --head-align: left;
    --head-bg: none;
    --bg-img: none; --bg-tint: rgba(255,255,255,0.5); --glow-top: transparent;
    --font-body: system-ui, -apple-system, 'Segoe UI', 'PingFang SC',
                 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', sans-serif;
    --font-display: system-ui, -apple-system, 'Segoe UI', 'PingFang SC',
                 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    --title-ls: 1px;
    --mark-bg: #e6ecdf;
}

/* ---------- 皮肤 3：松柏·深绿 ---------- */
[data-theme="forest"] {
    --ink: #26332c; --ink-soft: #5d6f63; --title: #1d3128;
    --accent: #2f5d50; --accent-deep: #1f463b; --accent-soft: #7fa294;
    --bg: #f2f5f0; --bg2: #e6ece2; --paper: #ffffff;
    --line: rgba(47,93,80,0.20); --line-soft: rgba(47,93,80,0.12);
    --shadow-sm: 0 2px 8px rgba(29,49,40,0.08);
    --shadow-md: 0 10px 26px rgba(29,49,40,0.14);
    --shadow-lg: 0 18px 44px rgba(29,49,40,0.20);
    --radius: 14px;
    --card-grad: linear-gradient(165deg, #ffffff, #f1f6ee);
    --card-edge: 1px solid rgba(47,93,80,0.16);
    --spine: block;
    --icon-radius: 50%;
    --icon-bg: radial-gradient(circle at 50% 35%, #ffffff, #e2ebdd);
    --head-align: center;
    --head-bg: linear-gradient(to bottom, rgba(242,245,240,0.92), rgba(242,245,240,0.10));
    --bg-img: none; --bg-tint: rgba(255,255,255,0.35); --glow-top: rgba(255,255,255,0.14);
    --font-body: Georgia, 'Times New Roman', 'Noto Serif SC', 'Songti SC', serif;
    --font-display: Georgia, 'Songti SC', 'Noto Serif SC', serif;
    --title-ls: clamp(4px, 1.6vw, 8px);
    --mark-bg: #d8e6d5;
}

/* ---------- 皮肤 4：静水·靛蓝 ---------- */
[data-theme="ocean"] {
    --ink: #22303f; --ink-soft: #6b7c8f; --title: #1b2c3d;
    --accent: #2b4c7e; --accent-deep: #1d3860; --accent-soft: #8fa8c8;
    --bg: #eef2f6; --bg2: #e2e9f0; --paper: #ffffff;
    --line: rgba(43,76,126,0.18); --line-soft: rgba(43,76,126,0.10);
    --shadow-sm: 0 1px 4px rgba(27,44,61,0.08);
    --shadow-md: 0 10px 24px rgba(27,44,61,0.12);
    --shadow-lg: 0 18px 42px rgba(27,44,61,0.18);
    --radius: 10px;
    --card-grad: #ffffff;
    --card-edge: 1px solid rgba(43,76,126,0.14);
    --spine: none;
    --icon-radius: 10px;
    --icon-bg: #eaf0f7;
    --head-align: left;
    --head-bg: linear-gradient(to bottom, rgba(238,242,246,0.95), rgba(238,242,246,0.20));
    --bg-img: none; --bg-tint: rgba(255,255,255,0.45); --glow-top: transparent;
    --font-body: system-ui, -apple-system, 'Segoe UI', 'PingFang SC',
                 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', sans-serif;
    --font-display: system-ui, -apple-system, 'Segoe UI', 'PingFang SC',
                 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    --title-ls: 0.5px;
    --mark-bg: #d9e4f2;
}

/* ---------- 皮肤 5：朱红·宣纸（中式、方正、宽字距） ---------- */
[data-theme="crimson"] {
    --ink: #26211d; --ink-soft: #6d6259; --title: #1c1714;
    --accent: #9e2b25; --accent-deep: #7a1f1a; --accent-soft: #c98b84;
    --bg: #fbf6ef; --bg2: #f3ebdf; --paper: #fffdf8;
    --line: rgba(120,40,34,0.22); --line-soft: rgba(120,40,34,0.12);
    --shadow-sm: 0 1px 3px rgba(60,30,25,0.08);
    --shadow-md: 0 8px 20px rgba(60,30,25,0.14);
    --shadow-lg: 0 16px 38px rgba(60,30,25,0.20);
    --radius: 2px;
    --card-grad: linear-gradient(180deg, #fffdf8, #f7f0e5);
    --card-edge: 1px solid rgba(120,40,34,0.18);
    --spine: none;
    --icon-radius: 2px;
    --icon-bg: #f6efe4;
    --head-align: center;
    --head-bg: linear-gradient(to bottom, rgba(251,246,239,0.94), rgba(251,246,239,0.12));
    --bg-img: none; --bg-tint: rgba(255,255,255,0.30); --glow-top: transparent;
    --font-body: 'Songti SC', 'STSong', 'Noto Serif SC', 'SimSun', Georgia, serif;
    --font-display: 'Songti SC', 'STSong', 'Noto Serif SC', 'SimSun', serif;
    --title-ls: clamp(8px, 3vw, 16px);
    --mark-bg: #f2d9d4;
}

/* ---------- 皮肤 6：夜读·墨黛（深色，弱光友好） ---------- */
[data-theme="dusk"] {
    --ink: #ded8cd; --ink-soft: #9b948a; --title: #f0e7d6;
    --accent: #d8b26a; --accent-deep: #b8944f; --accent-soft: #6d5c3c;
    --bg: #1c1b19; --bg2: #232120; --paper: #26241f;
    --line: rgba(216,178,106,0.22); --line-soft: rgba(216,178,106,0.12);
    --shadow-sm: 0 2px 10px rgba(0,0,0,0.35);
    --shadow-md: 0 12px 30px rgba(0,0,0,0.45);
    --shadow-lg: 0 20px 48px rgba(0,0,0,0.55);
    --radius: 12px;
    --card-grad: linear-gradient(160deg, #2a2723, #221f1c);
    --card-edge: 1px solid rgba(216,178,106,0.16);
    --spine: block;
    --icon-radius: 50%;
    --icon-bg: radial-gradient(circle at 50% 35%, #33302a, #232120);
    --head-align: center;
    --head-bg: linear-gradient(to bottom, rgba(28,27,25,0.92), rgba(28,27,25,0.10));
    --bg-img: none; --bg-tint: rgba(12,11,10,0.35); --glow-top: rgba(216,178,106,0.05);
    --font-body: Georgia, 'Times New Roman', 'Noto Serif SC', 'Songti SC', serif;
    --font-display: Georgia, 'Songti SC', 'Noto Serif SC', serif;
    --title-ls: clamp(5px, 1.8vw, 9px);
    --mark-bg: #4a3f27;
}

/* ---------- 皮肤 7：恩典 · 墨金（主推：纸白 + 墨绿 + 金线书脊） ----------
   60-30-10：60% 纸米白 / 30% 墨绿 / 10% 金。
   全中文衬线（书卷气），标题大字距，卡片一律是「立着的书」，
   悬停有一道金光扫过封面——这是本站唯一记住的那一件事。 */
[data-theme="grace"] {
    --ink: #2f3a33; --ink-soft: #5c6760; --title: #14342c;
    --accent: #c9a227; --accent-deep: #7a5e0e; --accent-soft: #e2ca77;
    --bg: #f2ece0; --bg2: #e6ded0; --paper: #fbf7ef;
    --line: rgba(201,162,39,0.30); --line-soft: rgba(143,112,21,0.16);
    --shadow-sm: 0 1px 3px rgba(20,52,44,0.08);
    --shadow-md: 0 10px 26px rgba(20,52,44,0.16);
    --shadow-lg: 0 20px 48px rgba(20,52,44,0.22);
    --radius: 10px;
    --card-grad: linear-gradient(168deg, #fdfbf6, #f3ede1);
    --card-edge: 1px solid rgba(143,112,21,0.20);
    --spine: block;
    --icon-radius: 4px;
    --icon-bg: linear-gradient(160deg, #ffffff, #f0e8d8);
    --head-align: center;
    --head-bg: linear-gradient(to bottom, rgba(242,236,224,0.96), rgba(242,236,224,0.20));
    --bg-img:
        radial-gradient(circle at 16% 10%, rgba(201,162,39,0.10), transparent 44%),
        radial-gradient(circle at 84% 82%, rgba(20,52,44,0.07), transparent 46%);
    --bg-repeat: no-repeat;
    --bg-size: cover;
    --bg-tint: rgba(255,255,255,0);
    --glow-top: rgba(255,252,242,0.55);
    --font-body: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --font-display: 'Source Han Serif SC', 'Noto Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --title-ls: clamp(10px, 3.4vw, 22px);
    --mark-bg: #f0e0a8;
    --maxw: 1240px;
}

/* ---------- 皮肤 8：彩窗 · 光（深色，夜间阅读友好） ----------
   深靛蓝底 + 锥形渐变模拟的彩窗光斑 + 暖金字，弱光下不刺眼。 */
[data-theme="stained"] {
    --ink: #d9d3c6; --ink-soft: #948d80; --title: #f2e6c8;
    --accent: #d9b45a; --accent-deep: #b08f38; --accent-soft: #6d5a2c;
    --bg: #0f1826; --bg2: #16202f; --paper: #1a2434;
    --line: rgba(217,180,90,0.24); --line-soft: rgba(217,180,90,0.13);
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.40);
    --shadow-md: 0 12px 30px rgba(0,0,0,0.50);
    --shadow-lg: 0 22px 52px rgba(0,0,0,0.62);
    --radius: 12px;
    --card-grad: linear-gradient(168deg, #1d2839, #151e2b);
    --card-edge: 1px solid rgba(217,180,90,0.18);
    --spine: block;
    --icon-radius: 4px;
    --icon-bg: linear-gradient(160deg, #263247, #1a2331);
    --head-align: center;
    --head-bg: linear-gradient(to bottom, rgba(15,24,38,0.94), rgba(15,24,38,0.10));
    --bg-img:
        conic-gradient(from 210deg at 22% 8%,
            rgba(122,58,58,0.26), rgba(58,96,122,0.24), rgba(126,104,58,0.22),
            rgba(64,102,74,0.22), rgba(96,66,110,0.24), rgba(122,58,58,0.26));
    --bg-repeat: no-repeat;
    --bg-size: cover;
    --bg-tint: rgba(8,12,20,0.52);
    --glow-top: rgba(217,180,90,0.06);
    --font-body: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --font-display: 'Source Han Serif SC', 'Noto Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --title-ls: clamp(10px, 3.4vw, 22px);
    --mark-bg: #4a3c1c;
    --maxw: 1240px;
}

/* ---------- 皮肤 9：晨雾 · 青灰（冷灰青水墨，书卷静气） ---------- */
[data-theme="mist"] {
    --ink: #2f3a3f; --ink-soft: #5b6b70; --title: #1d2b30;
    --accent: #4f7e84; --accent-deep: #3a6268; --accent-soft: #9cbcbf;
    --bg: #eef1f0; --bg2: #e2e7e6; --paper: #fbfcfc;
    --line: rgba(79,126,132,0.26); --line-soft: rgba(79,126,132,0.15);
    --shadow-sm: 0 1px 3px rgba(29,43,48,0.08);
    --shadow-md: 0 10px 26px rgba(29,43,48,0.14);
    --shadow-lg: 0 20px 48px rgba(29,43,48,0.20);
    --radius: 4px;
    --card-grad: linear-gradient(168deg, #ffffff, #eef2f1);
    --card-edge: 1px solid rgba(79,126,132,0.20);
    --spine: block;
    --icon-radius: 4px;
    --icon-bg: linear-gradient(160deg, #ffffff, #e6eeed);
    --head-align: center;
    --head-bg: linear-gradient(to bottom, rgba(238,241,240,0.96), rgba(238,241,240,0.20));
    --bg-img:
        radial-gradient(circle at 18% 12%, rgba(79,126,132,0.08), transparent 42%),
        radial-gradient(circle at 82% 84%, rgba(29,43,48,0.05), transparent 46%);
    --bg-repeat: no-repeat;
    --bg-size: cover;
    --bg-tint: rgba(255,255,255,0);
    --glow-top: rgba(255,255,255,0.45);
    --font-body: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --font-display: 'Source Han Serif SC', 'Noto Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --title-ls: clamp(8px, 3vw, 20px);
    --mark-bg: #d9e6e7;
    --maxw: 1240px;
}

/* ---------- 皮肤 10：赤陶 · 暖橙（陶土大地，质朴温暖） ---------- */
[data-theme="terracotta"] {
    --ink: #3a2c25; --ink-soft: #6b564a; --title: #281a13;
    --accent: #c0603a; --accent-deep: #9a4322; --accent-soft: #e0a07f;
    --bg: #f3ece4; --bg2: #ebe0d4; --paper: #fdf8f2;
    --line: rgba(192,96,58,0.26); --line-soft: rgba(192,96,58,0.15);
    --shadow-sm: 0 1px 3px rgba(40,24,16,0.08);
    --shadow-md: 0 10px 26px rgba(40,24,16,0.14);
    --shadow-lg: 0 20px 48px rgba(40,24,16,0.20);
    --radius: 8px;
    --card-grad: linear-gradient(168deg, #fffaf4, #f5ebe0);
    --card-edge: 1px solid rgba(192,96,58,0.20);
    --spine: block;
    --icon-radius: 6px;
    --icon-bg: linear-gradient(160deg, #ffffff, #f2e6da);
    --head-align: center;
    --head-bg: linear-gradient(to bottom, rgba(243,236,228,0.96), rgba(243,236,228,0.20));
    --bg-img:
        radial-gradient(circle at 16% 10%, rgba(192,96,58,0.09), transparent 44%),
        radial-gradient(circle at 84% 82%, rgba(40,24,16,0.05), transparent 46%);
    --bg-repeat: no-repeat;
    --bg-size: cover;
    --bg-tint: rgba(255,255,255,0);
    --glow-top: rgba(255,250,244,0.5);
    --font-body: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --font-display: 'Source Han Serif SC', 'Noto Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --title-ls: clamp(8px, 3vw, 20px);
    --mark-bg: #efd9c9;
    --maxw: 1240px;
}

/* ---------- 皮肤 11：暮山 · 黛紫（黛紫黄昏，圆润优雅） ---------- */
[data-theme="twilight"] {
    --ink: #322a3a; --ink-soft: #6a5f70; --title: #211829;
    --accent: #7a5fa3; --accent-deep: #5a3f80; --accent-soft: #b29ccb;
    --bg: #efeaf2; --bg2: #e4dcec; --paper: #faf7fd;
    --line: rgba(122,95,163,0.26); --line-soft: rgba(122,95,163,0.15);
    --shadow-sm: 0 1px 3px rgba(33,24,41,0.08);
    --shadow-md: 0 10px 26px rgba(33,24,41,0.14);
    --shadow-lg: 0 20px 48px rgba(33,24,41,0.20);
    --radius: 14px;
    --card-grad: linear-gradient(168deg, #fdfafe, #f0eaf6);
    --card-edge: 1px solid rgba(122,95,163,0.20);
    --spine: block;
    --icon-radius: 50%;
    --icon-bg: radial-gradient(circle at 50% 35%, #ffffff, #ece4f4);
    --head-align: center;
    --head-bg: linear-gradient(to bottom, rgba(239,234,242,0.96), rgba(239,234,242,0.20));
    --bg-img:
        radial-gradient(circle at 18% 12%, rgba(122,95,163,0.09), transparent 44%),
        radial-gradient(circle at 82% 84%, rgba(33,24,41,0.05), transparent 46%);
    --bg-repeat: no-repeat;
    --bg-size: cover;
    --bg-tint: rgba(255,255,255,0);
    --glow-top: rgba(255,250,255,0.45);
    --font-body: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --font-display: 'Source Han Serif SC', 'Noto Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --title-ls: clamp(9px, 3.2vw, 21px);
    --mark-bg: #e5dcf0;
    --maxw: 1240px;
}

/* ---------- 皮肤 12：雪夜 · 靛蓝（深靛月白，静夜读经） ---------- */
[data-theme="indigo"] {
    --ink: #cdd6e6; --ink-soft: #8b97ad; --title: #e8eefb;
    --accent: #7c9cd6; --accent-deep: #5a7cb8; --accent-soft: #3a4a6b;
    --bg: #0e1626; --bg2: #14203a; --paper: #16223c;
    --line: rgba(124,156,214,0.24); --line-soft: rgba(124,156,214,0.13);
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.40);
    --shadow-md: 0 12px 30px rgba(0,0,0,0.50);
    --shadow-lg: 0 22px 52px rgba(0,0,0,0.62);
    --radius: 12px;
    --card-grad: linear-gradient(168deg, #1b2a4a, #121d36);
    --card-edge: 1px solid rgba(124,156,214,0.18);
    --spine: block;
    --icon-radius: 4px;
    --icon-bg: linear-gradient(160deg, #243456, #16223c);
    --head-align: center;
    --head-bg: linear-gradient(to bottom, rgba(14,22,38,0.94), rgba(14,22,38,0.10));
    --bg-img:
        radial-gradient(circle at 20% 12%, rgba(124,156,214,0.10), transparent 46%),
        radial-gradient(circle at 80% 82%, rgba(124,156,214,0.06), transparent 48%);
    --bg-repeat: no-repeat;
    --bg-size: cover;
    --bg-tint: rgba(8,12,20,0.5);
    --glow-top: rgba(124,156,214,0.06);
    --font-body: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --font-display: 'Source Han Serif SC', 'Noto Serif SC', 'Songti SC', 'STSong',
                 'SimSun', Georgia, serif;
    --title-ls: clamp(10px, 3.4vw, 22px);
    --mark-bg: #2a3a5c;
    --maxw: 1240px;
}

/* ================================================================
   新皮肤书卷细节（晨雾/赤陶/暮山/雪夜）：复用恩典皮的「金线书脊 + 金光扫过」
   视觉语言，颜色全部走各皮肤自己的 token，自动适配。
   ================================================================ */
[data-theme="mist"] .top-fixed,
[data-theme="terracotta"] .top-fixed,
[data-theme="twilight"] .top-fixed,
[data-theme="indigo"] .top-fixed {
    border-bottom: none;
    box-shadow: 0 1px 0 0 color-mix(in srgb, var(--accent) 12%, transparent),
                0 14px 26px -22px rgba(0,0,0,0.4);
}
[data-theme="mist"] .search-bar,
[data-theme="terracotta"] .search-bar,
[data-theme="twilight"] .search-bar,
[data-theme="indigo"] .search-bar {
    border-color: color-mix(in srgb, var(--accent) 42%, transparent);
    box-shadow: 0 2px 10px color-mix(in srgb, var(--ink) 8%, transparent);
}
[data-theme="mist"] .top-fixed .tagline,
[data-theme="terracotta"] .top-fixed .tagline,
[data-theme="twilight"] .top-fixed .tagline,
[data-theme="indigo"] .top-fixed .tagline {
    margin: 14px auto 0;
    max-width: 30em;
    padding: 0 12px;
    font-size: clamp(12.5px, 2.4vw, 15px);
    line-height: 1.9;
    letter-spacing: 1.5px;
    color: var(--ink-soft);
}
[data-theme="mist"] .top-fixed .tagline em,
[data-theme="terracotta"] .top-fixed .tagline em,
[data-theme="twilight"] .top-fixed .tagline em,
[data-theme="indigo"] .top-fixed .tagline em {
    display: block;
    font-style: normal;
    color: var(--accent-deep);
    letter-spacing: 3px;
}
/* 深色皮肤：深底上强调色要更亮才够对比度（indigo 的 accent-deep 偏暗，换 accent） */
[data-theme="indigo"] .top-fixed .tagline em { color: var(--accent); }
[data-theme="mist"] ::selection,
[data-theme="terracotta"] ::selection,
[data-theme="twilight"] ::selection,
[data-theme="indigo"] ::selection { background: color-mix(in srgb, var(--accent) 30%, transparent); color: var(--title); }

/* 金光扫过 */
[data-theme="mist"] .folder-book .book-cover::after,
[data-theme="terracotta"] .folder-book .book-cover::after,
[data-theme="twilight"] .folder-book .book-cover::after,
[data-theme="indigo"] .folder-book .book-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg,
        transparent 32%,
        rgba(255,255,255,0.40) 47%,
        color-mix(in srgb, var(--accent) 34%, transparent) 52%,
        transparent 68%);
    transform: translateX(-115%);
    transition: transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
    pointer-events: none;
}
[data-theme="mist"] .folder-book:hover .book-cover::after,
[data-theme="terracotta"] .folder-book:hover .book-cover::after,
[data-theme="twilight"] .folder-book:hover .book-cover::after,
[data-theme="indigo"] .folder-book:hover .book-cover::after,
[data-theme="mist"] .folder-book:focus-visible .book-cover::after,
[data-theme="terracotta"] .folder-book:focus-visible .book-cover::after,
[data-theme="twilight"] .folder-book:focus-visible .book-cover::after,
[data-theme="indigo"] .folder-book:focus-visible .book-cover::after {
    transform: translateX(115%);
}

/* 卡片高度 + 圆角 */
[data-theme="mist"] .folder-book .book-cover,
[data-theme="terracotta"] .folder-book .book-cover,
[data-theme="twilight"] .folder-book .book-cover,
[data-theme="indigo"] .folder-book .book-cover {
    height: 236px;
    border-radius: 3px 12px 12px 3px;
}
/* 书脊 */
[data-theme="mist"] .folder-book::before,
[data-theme="terracotta"] .folder-book::before,
[data-theme="twilight"] .folder-book::before,
[data-theme="indigo"] .folder-book::before {
    width: 8px; left: 8px; top: 8%; bottom: 8%;
    border-radius: 4px 0 0 4px;
    background: linear-gradient(180deg, var(--accent-soft), var(--accent), var(--accent-deep));
    box-shadow: inset -2px 0 4px rgba(0,0,0,0.26);
}
/* 书脊占位 */
[data-theme="mist"] .folder-book .book-cover,
[data-theme="terracotta"] .folder-book .book-cover,
[data-theme="twilight"] .folder-book .book-cover,
[data-theme="indigo"] .folder-book .book-cover { margin-left: 26px; }

/* 音频条 */
[data-theme="mist"] .audio-item,
[data-theme="terracotta"] .audio-item,
[data-theme="twilight"] .audio-item,
[data-theme="indigo"] .audio-item {
    background: var(--card-grad);
    border-left: 4px solid var(--accent);
    padding: 22px 26px;
    gap: 14px;
}
[data-theme="mist"] .audio-item .filename,
[data-theme="terracotta"] .audio-item .filename,
[data-theme="twilight"] .audio-item .filename,
[data-theme="indigo"] .audio-item .filename {
    font-family: var(--font-display);
    font-size: 1.14em;
    letter-spacing: 0.5px;
}
[data-theme="mist"] .audio-item .filename::before,
[data-theme="terracotta"] .audio-item .filename::before,
[data-theme="twilight"] .audio-item .filename::before,
[data-theme="indigo"] .audio-item .filename::before {
    width: 8px; height: 8px;
    border-radius: 2px;
    transform: rotate(45deg);
    background: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}
[data-theme="mist"] .audio-item audio,
[data-theme="terracotta"] .audio-item audio,
[data-theme="twilight"] .audio-item audio,
[data-theme="indigo"] .audio-item audio {
    height: 46px;
    border-radius: 6px;
}
/* 文件卡 */
[data-theme="mist"] .file-card,
[data-theme="terracotta"] .file-card,
[data-theme="twilight"] .file-card,
[data-theme="indigo"] .file-card { border-left: 3px solid var(--accent-soft); }

/* 页脚金十字 */
[data-theme="mist"] footer p::before,
[data-theme="terracotta"] footer p::before,
[data-theme="twilight"] footer p::before,
[data-theme="indigo"] footer p::before {
    content: "✦";
    width: auto; height: auto;
    background: none;
    transform: none;
    box-shadow: none;
    font-size: 15px;
    color: var(--accent);
    margin: 0 auto 14px;
}
[data-theme="mist"] footer,
[data-theme="terracotta"] footer,
[data-theme="twilight"] footer,
[data-theme="indigo"] footer {
    padding-top: 46px;
    letter-spacing: 1px;
}
/* 顶部导航 */
[data-theme="mist"] .top-nav a,
[data-theme="terracotta"] .top-nav a,
[data-theme="twilight"] .top-nav a,
[data-theme="indigo"] .top-nav a { letter-spacing: 3px; }
[data-theme="mist"] .top-nav a::after,
[data-theme="terracotta"] .top-nav a::after,
[data-theme="twilight"] .top-nav a::after,
[data-theme="indigo"] .top-nav a::after { height: 2px; bottom: 6px; }
/* 回到顶部 */
[data-theme="mist"] .to-top,
[data-theme="terracotta"] .to-top,
[data-theme="twilight"] .to-top,
[data-theme="indigo"] .to-top { border-radius: 6px; }

/* 深色皮（雪夜/彩窗/夜读）：栏目卡的语义色是给浅色皮设计的深色，
   在深底上几乎看不见，统一提亮——书脊/徽章/文字都跟着亮起来。 */
[data-theme="indigo"] .cat-card[data-c="0"],
[data-theme="stained"] .cat-card[data-c="0"],
[data-theme="dusk"] .cat-card[data-c="0"] { --cat:#3f8f7a; --cat-mid:#5fb39b; --cat-soft:#9fd9c5; }
[data-theme="indigo"] .cat-card[data-c="1"],
[data-theme="stained"] .cat-card[data-c="1"],
[data-theme="dusk"] .cat-card[data-c="1"] { --cat:#d9b45a; --cat-mid:#e6c878; --cat-soft:#f2dc9a; }
[data-theme="indigo"] .cat-card[data-c="2"],
[data-theme="stained"] .cat-card[data-c="2"],
[data-theme="dusk"] .cat-card[data-c="2"] { --cat:#6f9fd6; --cat-mid:#8fb6e6; --cat-soft:#bcd8f4; }
[data-theme="indigo"] .cat-card[data-c="3"],
[data-theme="stained"] .cat-card[data-c="3"],
[data-theme="dusk"] .cat-card[data-c="3"] { --cat:#cf7a6a; --cat-mid:#e0988a; --cat-soft:#f2c0b4; }

/* ============ 基础 ============ */
* { box-sizing: border-box; }

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;   /* 防止 iOS 横竖屏字体被放大 */
    text-size-adjust: 100%;
}

/* 极速淡入：页面/区块出场时轻轻浮现，去掉「硬闪」，不拖慢加载 */
@keyframes nhFade { from { opacity: 0; } to { opacity: 1; } }
body { animation: nhFade .26s ease both; }
/* 首页页签切换（首页↔讲道等）时给区块加的淡入类 */
.sec-in { animation: nhFade .22s ease both; }

body {
    font-family: var(--font-body);
    background-color: var(--bg);
    background-image: var(--bg-img);
    background-repeat: var(--bg-repeat);
    background-size: var(--bg-size);
    background-attachment: scroll;     /* 移动端用 scroll，避免 fixed 背景掉帧 */
    color: var(--ink);
    margin: 0;
    padding: 0;
    line-height: 1.78;
    min-height: 100vh;
    position: relative;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* 柔光罩：统一色调、压低背景噪点、增加纵深 */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    background:
        radial-gradient(130% 90% at 50% -10%, var(--glow-top), transparent 55%),
        var(--bg-tint);
    pointer-events: none;
    z-index: -1;
}

a { text-decoration: none !important; color: inherit !important; }

/* 选区高亮 */
::selection { background: rgba(176,141,62,0.28); color: var(--title); }
::selection { background: color-mix(in srgb, var(--accent) 28%, transparent); color: var(--title); }

/* 键盘焦点可见性（无障碍） */
a:focus-visible,
#globalSearch:focus-visible,
.to-top:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
    border-radius: 6px;
}

/* ============ 顶部标题区（随页面滚动，非粘性） ============ */
.top-fixed {
    position: relative;
    text-align: var(--head-align);
    padding: clamp(28px, 5vw, 48px) 16px clamp(20px, 3vw, 30px);
    padding-top: calc(clamp(28px, 5vw, 48px) + env(safe-area-inset-top, 0px));
    background: var(--head-bg);
    border-bottom: 1px solid var(--line-soft);
}

.top-fixed h1 {
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(28px, 6vw, 42px);
    line-height: 1.05;
    color: var(--title);
    font-weight: 700;
    letter-spacing: var(--title-ls);
    text-indent: var(--title-ls);   /* 抵消末位字距，视觉居中 */
    text-shadow: 0 1px 0 rgba(255,255,255,0.25);
}

/* 标题下：菱形 + 两侧细点的优雅分隔（各皮肤形状不同，见「皮肤结构差异」） */
.top-fixed h1::after {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    margin: 16px auto 0;
    background: var(--accent-soft);
    transform: rotate(45deg);
    border-radius: 1px;
    box-shadow: -26px 0 0 -1px var(--accent-soft), 26px 0 0 -1px var(--accent-soft);
}

/* ---------- 搜索框（药丸形） ---------- */
.search-container {
    position: relative;
    max-width: min(440px, 100%);
    margin: 26px auto 4px;
}

[data-theme="linen"] .search-container,
[data-theme="ocean"] .search-container { margin-left: 0; margin-right: auto; }

.search-bar {
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: 999px;
    height: var(--tap);
    min-height: var(--tap);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.search-bar:focus-within {
    border-color: var(--accent-soft);
    box-shadow: 0 0 0 4px rgba(176,141,62,0.12), var(--shadow-sm);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent), var(--shadow-sm);
}

#globalSearch {
    width: 100%;
    height: 100%;
    border: none;
    padding: 12px 20px 12px 46px;
    font-size: 1.02em;
    color: var(--ink);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%238a6d2c" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>');
    background-repeat: no-repeat;
    background-position: 16px center;
    background-size: 18px;
    background-color: transparent;
    outline: none;
    font-family: var(--font-body);
}
#globalSearch::placeholder { color: var(--ink-soft); }

/* ---------- 搜索结果（真实排版：徽章 + 名称 + 路径） ---------- */
#searchResults {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    right: 0;
    background: var(--paper);
    border: 1px solid var(--accent-soft);
    border-radius: var(--radius);
    max-height: min(60vh, 340px);
    overflow-y: auto;
    display: none;
    z-index: 1000;
    box-shadow: var(--shadow-lg);
    text-align: left;
    padding: 6px;
    -webkit-overflow-scrolling: touch;
}

#searchResults .result-count {
    position: sticky;
    top: 0;
    background: var(--paper);
    padding: 8px 12px 6px;
    font-size: 12px;
    color: var(--ink-soft);
    border-bottom: 1px dashed var(--accent-soft);
    z-index: 2;
}

#searchResults .result-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-radius: calc(var(--radius) - 4px);
    border-bottom: 1px dashed var(--line-soft);
    cursor: pointer;
    transition: background 0.22s ease, transform 0.22s ease;
    text-decoration: none !important;
}
#searchResults .result-item:last-child { border-bottom: none; }

#searchResults .result-item:hover,
#searchResults .result-item.active {
    background: var(--bg2);
    transform: translateX(3px);
}

#searchResults .result-badge {
    flex: 0 0 auto;
    font-size: 11px;
    line-height: 1;
    padding: 4px 7px;
    border-radius: 999px;
    color: var(--accent-deep);
    background: rgba(176,141,62,0.14);
    background: color-mix(in srgb, var(--accent) 14%, transparent);
    border: 1px solid var(--line);
    white-space: nowrap;
}
#searchResults .result-text { flex: 1 1 auto; min-width: 0; }
#searchResults .result-text .r-section {
    display: block;
    font-size: 12px;
    color: var(--ink-soft);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#searchResults .result-text .r-name {
    display: block;
    font-weight: 600;
    color: var(--title);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#searchResults .no-result {
    padding: 14px;
    text-align: center;
    color: var(--ink-soft);
    font-size: 0.95em;
}

mark {
    background: var(--mark-bg);
    color: var(--title);
    padding: 0 2px;
    border-radius: 3px;
    font-weight: 600;
}

/* ---------- 分类导航（细字 + 悬停生长线） ---------- */
.top-nav {
    margin-top: 22px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px 6px;
    padding: 0 8px;
}
[data-theme="linen"] .top-nav,
[data-theme="ocean"] .top-nav { justify-content: flex-start; }

.top-nav a {
    position: relative;
    color: var(--ink-soft);
    font-size: 16px;
    font-family: var(--font-body);
    letter-spacing: 2px;
    padding: 10px 16px;        /* 触屏友好：点击区 ≥ 44px 高 */
    min-height: var(--tap);
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    transition: color 0.25s ease;
}

.top-nav a::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 4px;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--accent), transparent);
    transform: translateX(-50%);
    transition: width 0.3s ease;
    border-radius: 2px;
}

.top-nav a:hover { color: var(--accent-deep); }
.top-nav a:hover::after,
.top-nav a.active::after { width: 64%; }
.top-nav a.active { color: var(--accent-deep); font-weight: 600; }

/* ============ 面包屑 ============ */
.breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 2px;
    width: fit-content;
    max-width: calc(100% - 24px);
    margin: 18px auto 8px;
    padding: 9px 18px;
    font-size: 13.5px;
    color: var(--ink-soft);
    white-space: nowrap;
    overflow-x: auto;
    background: rgba(255,255,255,0.50);
    background: color-mix(in srgb, var(--paper) 55%, transparent);
    border: 1px solid var(--line-soft);
    border-radius: 999px;
    box-shadow: var(--shadow-sm);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
[data-theme="linen"] .breadcrumb,
[data-theme="ocean"] .breadcrumb,
[data-theme="crimson"] .breadcrumb { border-radius: var(--radius); }
.breadcrumb:empty { display: none; }
.breadcrumb::-webkit-scrollbar { display: none; }

.breadcrumb a { transition: color 0.2s ease; padding: 0 2px; }
.breadcrumb a:hover { color: var(--accent-deep); }

/* 首页快捷卡（如「最新信息」）：金书脊 + 金徽章，跟四色栏目卡分开，
   徽章同样用宋体首字，跟栏目卡说同一种视觉语言（不用 emoji，彩色字形会打架） */
.feature-card .folder-book::before {
    display: block;
    width: 10px; left: 10px; top: 10%; bottom: 10%;
    border-radius: 5px;
    background: linear-gradient(180deg, var(--accent-soft), var(--accent), var(--accent-deep));
    box-shadow: inset -2px 0 4px rgba(0,0,0,0.20);
}
.feature-card .book-cover {
    margin-left: 26px;
    border-color: color-mix(in srgb, var(--accent) 38%, transparent);
    box-shadow: 0 8px 20px color-mix(in srgb, var(--accent) 12%, transparent),
                var(--shadow-sm);
}
.feature-card .folder-icon {
    width: 62px; height: 62px; margin-bottom: 14px;
    font-family: var(--font-display);
    font-size: 33px; font-weight: 600; line-height: 1;
    color: var(--accent-deep);
    background: color-mix(in srgb, var(--accent) 13%, var(--paper));
    border-color: color-mix(in srgb, var(--accent) 42%, transparent);
}
.feature-card .folder-name {
    font-size: 1.18em; letter-spacing: 3px; color: var(--accent-deep);
}
.feature-card .cat-meta {
    display: block; margin: 10px auto 0; max-width: 90%;
    font-size: 13px; letter-spacing: 1px;
    color: var(--accent-deep);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    z-index: 1; position: relative;
}

/* ============ 网格（流式响应式） ============ */
.grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 232px), 1fr));
    gap: clamp(18px, 2.6vw, 32px);
    padding: clamp(20px, 3.2vw, 38px);
    max-width: var(--maxw);
    margin: 0 auto;
}

.grid-container > a { display: block; color: inherit; }

/* 卡片入场微动效（克制） */
.grid-container > * { animation: rise 0.5s ease both; }
.grid-container > *:nth-child(2) { animation-delay: 0.04s; }
.grid-container > *:nth-child(3) { animation-delay: 0.08s; }
.grid-container > *:nth-child(4) { animation-delay: 0.12s; }
.grid-container > *:nth-child(5) { animation-delay: 0.16s; }
.grid-container > *:nth-child(6) { animation-delay: 0.20s; }
.grid-container > *:nth-child(7) { animation-delay: 0.24s; }
.grid-container > *:nth-child(8) { animation-delay: 0.28s; }
@keyframes rise {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: none; }
}

/* ============ 书本卡片 ============ */
.folder-book {
    position: relative;
    cursor: pointer;
    display: block;
    height: 100%;
    transition: transform 0.3s ease;
}

/* 书脊：左侧透出的细条，似装订（部分皮肤隐藏） */
.folder-book::before {
    content: "";
    display: var(--spine);
    position: absolute;
    left: 9px;
    top: 9%;
    bottom: 9%;
    width: 7px;
    background: linear-gradient(180deg, var(--accent-soft), var(--accent), var(--accent-deep));
    border-radius: 5px;
    box-shadow: inset -2px 0 4px rgba(0,0,0,0.22);
    z-index: 0;
}

.folder-book .book-spine { display: none; }

.folder-book .book-cover {
    position: relative;
    z-index: 1;
    margin-left: 20px;
    height: 232px;
    background: var(--card-grad);
    border-radius: var(--radius);
    border: var(--card-edge);
    box-shadow: var(--shadow-sm), inset 0 1px 2px rgba(255,255,255,0.55);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: box-shadow 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}

.folder-book .book-cover::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 30%, rgba(255,255,255,0.35), transparent 55%);
    pointer-events: none;
}

/* 图标徽章 */
.folder-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 76px;
    height: 76px;
    border-radius: var(--icon-radius);
    background: var(--icon-bg);
    border: 1px solid var(--line);
    font-size: 34px;
    margin-bottom: 18px;
    box-shadow: var(--shadow-sm), inset 0 1px 2px rgba(255,255,255,0.6);
    transition: transform 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
    z-index: 1;
}

.folder-name {
    position: relative;
    font-weight: 600;
    color: var(--title);
    font-size: 1.12em;
    padding: 0 6px;
    text-align: center;
    z-index: 1;
    word-break: break-word;
}

/* 标题下生长的细线（悬停显现） */
.folder-name::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -7px;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--accent), transparent);
    transform: translateX(-50%);
    transition: width 0.3s ease;
    border-radius: 2px;
}

/* 悬停：克制抬升 + 描边转强调色 + 徽章微亮 + 标题细线 */
.folder-book:hover { transform: translateY(-5px); }
.folder-book:hover .book-cover {
    box-shadow: var(--shadow-md), inset 0 1px 2px rgba(255,255,255,0.55);
    border-color: var(--accent-soft);
}
.folder-book:hover .folder-icon {
    transform: scale(1.08);
    box-shadow: 0 6px 16px rgba(176,141,62,0.25), inset 0 1px 2px rgba(255,255,255,0.6);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--accent) 25%, transparent),
                inset 0 1px 2px rgba(255,255,255,0.6);
}
.folder-book:hover .folder-name::after { width: 56%; }

/* 触屏点按反馈 */
.folder-book:active { transform: scale(0.985); }

/* ============ 音频条目（左对齐标题 + 全宽播放器） ============ */
.audio-item {
    grid-column: 1 / -1;
    background: var(--card-grad);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    margin: 16px 18px;
    padding: 20px 26px;
    border: var(--card-edge);
    border-left: 4px solid var(--accent);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
}

.audio-item:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-3px);
}

.audio-item .filename {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    color: var(--title);
    font-size: 1.08em;
    word-break: break-word;
    font-family: var(--font-body);
    line-height: 1.5;
}
.audio-item .filename::before {
    content: "";
    flex: none;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 4px rgba(176,141,62,0.16);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent);
}

.audio-item audio {
    width: 100%;
    height: 52px;
    background: var(--bg2);
    border-radius: calc(var(--radius) - 2px);
    border: 1px solid var(--line);
    outline: none;
}

.audio-item audio::-webkit-media-controls-panel {
    background: var(--bg2);
    border-radius: calc(var(--radius) - 2px);
}

/* ============ 文件卡片（图标 + 名称，左对齐，层级清楚） ============ */
.file-card {
    background: var(--card-grad);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    padding: 20px 22px;
    border: var(--card-edge);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    height: 100%;
    display: flex;
    align-items: center;
}

.file-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: var(--accent-soft);
}

.file-card a {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    font-size: 1.02em;
    color: var(--ink);
    word-break: break-word;
    line-height: 1.5;
}

.file-card a::before {
    content: "";
    flex: none;
    width: 34px;
    height: 34px;
    border-radius: var(--icon-radius);
    background: var(--icon-bg);
    border: 1px solid var(--line);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.file-card a::after {
    content: "↗";
    margin-left: auto;
    font-size: 0.85em;
    opacity: 0.55;
    color: var(--accent-deep);
    flex: none;
}

.file-card a:hover { color: var(--accent-deep); }
.file-card a:hover::after { opacity: 1; }

/* ============ 空目录提示 ============ */
.empty-state {
    grid-column: 1 / -1;
    text-align: center;
    padding: clamp(28px, 6vw, 56px) 20px;
    color: var(--ink-soft);
    background: rgba(255,255,255,0.60);
    background: color-mix(in srgb, var(--paper) 60%, transparent);
    border: 1px dashed var(--line);
    border-radius: var(--radius);
    font-size: 0.98em;
}
.empty-state .empty-mark {
    display: block;
    font-size: 26px;
    margin-bottom: 10px;
    opacity: 0.7;
}

/* ============ 通用媒体防御 ============ */
img, video { max-width: 100%; height: auto; }

/* ============ 回到顶部按钮 ============ */
.to-top {
    position: fixed;
    right: clamp(16px, 4vw, 28px);
    bottom: calc(clamp(16px, 4vw, 28px) + env(safe-area-inset-bottom, 0px));
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid var(--accent-soft);
    background: rgba(255,254,251,0.92);
    background: color-mix(in srgb, var(--paper) 92%, transparent);
    color: var(--accent-deep);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--shadow-md);
    z-index: 900;
    opacity: 0;
    transform: translateY(12px) scale(0.9);
    pointer-events: none;
    transition: opacity 0.3s ease, transform 0.3s ease, background 0.25s ease;
    backdrop-filter: blur(4px);
}
.to-top.show { opacity: 1; transform: none; pointer-events: auto; }
.to-top:hover { background: var(--paper); color: var(--accent); }
.to-top:active { transform: scale(0.94); }

/* ============ 页脚 ============ */
footer {
    margin-top: 44px;
    padding: 42px 20px calc(50px + env(safe-area-inset-bottom, 0px));
    text-align: center;
    font-size: 0.95em;
    line-height: 2;
    color: var(--ink-soft);
    background: linear-gradient(to bottom, transparent, rgba(247,239,225,0.70));
    background: linear-gradient(to bottom, transparent,
                color-mix(in srgb, var(--bg2) 70%, transparent));
    border-top: 1px solid var(--line-soft);
}

footer p { margin: 0; position: relative; }

/* 页脚上方分隔（各皮肤形状不同） */
footer p::before {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    margin: 0 auto 18px;
    background: var(--accent-soft);
    transform: rotate(45deg);
    border-radius: 1px;
    box-shadow: -26px 0 0 -1px var(--accent-soft), 26px 0 0 -1px var(--accent-soft);
}

/* ================================================================
   恩典 / 彩窗专用结构：纸纹、副标题、栏目卡、金光扫过、音频条
   旧皮肤不受以下任何一条影响（全部以 [data-theme] 限定，默认不生效）。
   ================================================================ */

/* 纸质细纹理（纯 CSS，零图片请求） */
[data-theme="grace"] body::after,
[data-theme="stained"] body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    background-image:
        repeating-linear-gradient(0deg, rgba(20,52,44,0.022) 0 1px, transparent 1px 3px),
        repeating-linear-gradient(90deg, rgba(20,52,44,0.016) 0 1px, transparent 1px 4px);
}
[data-theme="stained"] body::after {
    background-image:
        repeating-linear-gradient(0deg, rgba(255,255,255,0.016) 0 1px, transparent 1px 3px);
}

/* 顶部：去掉生硬的 1px 分隔线，改成向下渐隐，让标题区自然融进纸面 */
[data-theme="grace"] .top-fixed,
[data-theme="stained"] .top-fixed {
    border-bottom: none;
    box-shadow: 0 1px 0 0 color-mix(in srgb, var(--accent) 12%, transparent),
                0 14px 26px -22px rgba(20,52,44,0.5);
}

/* 搜索框：核心功能，边框与投影都要比默认更实一点 */
[data-theme="grace"] .search-bar,
[data-theme="stained"] .search-bar {
    border-color: color-mix(in srgb, var(--accent) 42%, transparent);
    box-shadow: 0 2px 10px color-mix(in srgb, var(--ink) 8%, transparent);
}

/* 顶部副标题（经文/标语） */
[data-theme="grace"] .top-fixed .tagline,
[data-theme="stained"] .top-fixed .tagline {
    margin: 14px auto 0;
    max-width: 30em;
    padding: 0 12px;
    font-size: clamp(12.5px, 2.4vw, 15px);
    line-height: 1.9;
    letter-spacing: 1.5px;
    color: var(--ink-soft);
}
[data-theme="grace"] .top-fixed .tagline em,
[data-theme="stained"] .top-fixed .tagline em {
    display: block;
    font-style: normal;
    color: var(--accent-deep);
    letter-spacing: 3px;
}

/* 选中态：金线 + 更实的心 */
[data-theme="grace"] ::selection { background: rgba(201,162,39,0.32); color: #14342c; }
[data-theme="stained"] ::selection { background: rgba(217,180,90,0.30); color: #f2e6c8; }

/* ---------- 栏目卡（首页四大入口，各带一色，点击进入对应栏目） ---------- */
/* 高度不单独设：与同排普通卡片等高，避免 2×2 / 一行时高低错落 */
.cat-card .folder-icon { width: 62px; height: 62px; font-size: 33px; margin-bottom: 14px; }
.cat-card .folder-name { font-size: 1.18em; letter-spacing: 3px; }

/* 四个栏目各自一色：书脊 + 图标徽章描边 */
.cat-card[data-c="0"] { --cat: #14342c; --cat-mid: #1f4a3d; --cat-soft: #5f8a79; }
.cat-card[data-c="1"] { --cat: #8f7015; --cat-mid: #c9a227; --cat-soft: #e2ca77; }
.cat-card[data-c="2"] { --cat: #22406b; --cat-mid: #355f9b; --cat-soft: #8aa8cd; }
.cat-card[data-c="3"] { --cat: #7c3a30; --cat-mid: #a9584a; --cat-soft: #d3a094; }

/* 图标徽章：宋体首字，随栏目色（emoji 多彩字形会冲掉整套配色，故不用） */
.cat-card .folder-icon {
    font-family: var(--font-display);
    font-size: 33px;
    font-weight: 600;
    line-height: 1;
    color: var(--cat);
    background: color-mix(in srgb, var(--cat) 13%, var(--paper));
    border-color: color-mix(in srgb, var(--cat) 42%, transparent);
}
.cat-card .book-cover {
    margin-left: 24px;
    border-color: color-mix(in srgb, var(--cat) 24%, transparent);
}
.cat-card .folder-name { color: var(--cat); }

/* 卡片底部计数条：一律单行，超长打省略号（文件名可能很长，不能挤成两行） */
.cat-card .cat-meta {
    display: block;
    margin: 10px auto 0;
    max-width: 90%;
    font-size: 13px;
    letter-spacing: 1px;
    color: color-mix(in srgb, var(--cat) 82%, var(--ink-soft));
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    z-index: 1;
    position: relative;
}
/* 空栏目：连书脊也撤掉，虚线边已经把「留位待上架」说清楚了，
   再挂一根色条反而跟整体的淡雅冲突。 */
.grid-container .cat-card[data-empty="1"] .folder-book::before { display: none; }
.grid-container .cat-card[data-empty="1"] .folder-book .book-cover { margin-left: 0; }
/* 空栏目：保留自己的色相，只降饱和——抹成一片灰就分不清是哪个栏目了 */
.cat-card[data-empty="1"] .folder-icon {
    filter: saturate(0.45);
    background: color-mix(in srgb, var(--cat) 6%, var(--paper));
    border-color: color-mix(in srgb, var(--cat) 20%, transparent);
}
.cat-card[data-empty="1"] .folder-book::before { filter: saturate(0.40) opacity(0.66); }
/* 空栏目：虚线边 + 更淡的纸面，一眼看出是「留位待上架」，视觉重量让给有内容的卡 */
.grid-container .cat-card[data-empty="1"] .folder-book .book-cover {
    border-color: color-mix(in srgb, var(--cat) 30%, transparent);
    border-style: dashed;
    background: color-mix(in srgb, var(--cat) 3%, var(--paper));
    box-shadow: var(--shadow-sm);   /* 留一点投影，免得空卡看着像凹下去 */
}
.grid-container .cat-card[data-empty="1"] .folder-name {
    color: color-mix(in srgb, var(--cat) 52%, var(--ink-soft));
}
.cat-card[data-empty="1"] .cat-meta { color: var(--ink-soft); }

/* ---------- 金光扫过（恩典 / 彩窗） ---------- */
[data-theme="grace"] .folder-book .book-cover::after,
[data-theme="stained"] .folder-book .book-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg,
        transparent 32%,
        rgba(255,255,255,0.40) 47%,
        color-mix(in srgb, var(--accent) 34%, transparent) 52%,
        transparent 68%);
    transform: translateX(-115%);
    transition: transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
    pointer-events: none;
}
[data-theme="grace"] .folder-book:hover .book-cover::after,
[data-theme="stained"] .folder-book:hover .book-cover::after,
[data-theme="grace"] .folder-book:focus-visible .book-cover::after,
[data-theme="stained"] .folder-book:focus-visible .book-cover::after {
    transform: translateX(115%);
}

/* ---------- 恩典皮的卡片 / 音频条 / 文件卡 ---------- */
[data-theme="grace"] .folder-book .book-cover,
[data-theme="stained"] .folder-book .book-cover {
    height: 236px;
    border-radius: 3px 12px 12px 3px;
}
[data-theme="grace"] .folder-book::before,
[data-theme="stained"] .folder-book::before {
    width: 8px; left: 8px; top: 8%; bottom: 8%;
    border-radius: 4px 0 0 4px;
    background: linear-gradient(180deg, var(--accent-soft), var(--accent), var(--accent-deep));
    box-shadow: inset -2px 0 4px rgba(0,0,0,0.26);
}

/* 首页四卡盖过金书脊，各自用自己的颜色（选择器更重、位置更靠后 → 生效） */
.grid-container .cat-card .folder-book::before {
    display: block;
    left: 10px; top: 10%; bottom: 10%; width: 10px;
    border-radius: 5px;
    background: linear-gradient(180deg, var(--cat-soft), var(--cat-mid), var(--cat));
    box-shadow: inset -2px 0 4px rgba(0,0,0,0.18);
}
.grid-container .cat-card .folder-book .book-cover {
    border-color: color-mix(in srgb, var(--cat) 26%, transparent);
}
.grid-container .cat-card .folder-name { color: var(--cat); }
.grid-container .cat-card:hover .book-cover { border-color: var(--cat-mid); }
.grid-container .cat-card:hover .folder-icon {
    background: color-mix(in srgb, var(--cat) 14%, var(--paper));
    box-shadow: 0 6px 16px color-mix(in srgb, var(--cat) 22%, transparent);
}
[data-theme="grace"] .folder-book .book-cover,
[data-theme="stained"] .folder-book .book-cover { margin-left: 26px; }

/* 音频条：深色卡 + 金色左侧光条 */
[data-theme="grace"] .audio-item,
[data-theme="stained"] .audio-item {
    background: var(--card-grad);
    border-left: 4px solid var(--accent);
    padding: 22px 26px;
    gap: 14px;
}
[data-theme="grace"] .audio-item .filename,
[data-theme="stained"] .audio-item .filename {
    font-family: var(--font-display);
    font-size: 1.14em;
    letter-spacing: 0.5px;
}
[data-theme="grace"] .audio-item .filename::before,
[data-theme="stained"] .audio-item .filename::before {
    width: 8px; height: 8px;
    border-radius: 2px;
    transform: rotate(45deg);
    background: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}
[data-theme="grace"] .audio-item audio,
[data-theme="stained"] .audio-item audio {
    height: 46px;
    border-radius: 6px;
}

/* 文件卡：左色条 */
[data-theme="grace"] .file-card,
[data-theme="stained"] .file-card { border-left: 3px solid var(--accent-soft); }

/* 页脚：金十字分隔 */
[data-theme="grace"] footer p::before,
[data-theme="stained"] footer p::before {
    content: "✦";
    width: auto; height: auto;
    background: none;
    transform: none;
    box-shadow: none;
    font-size: 15px;
    color: var(--accent);
    margin: 0 auto 14px;
}
[data-theme="grace"] footer,
[data-theme="stained"] footer {
    padding-top: 46px;
    letter-spacing: 1px;
}

/* 顶部导航：更厚的下划线 + 金 */
[data-theme="grace"] .top-nav a,
[data-theme="stained"] .top-nav a { letter-spacing: 3px; }
[data-theme="grace"] .top-nav a::after,
[data-theme="stained"] .top-nav a::after { height: 2px; bottom: 6px; }

/* 回到顶部：方形金边 */
[data-theme="grace"] .to-top,
[data-theme="stained"] .to-top { border-radius: 6px; }

/* ================================================================
   皮肤结构差异：让六套门户不只是换个颜色
   ================================================================ */

/* 素麻·晨白：无书脊、无纹理、左对齐、标题下一道细横线 */
[data-theme="linen"] .folder-book .book-cover { margin-left: 0; }
[data-theme="linen"] .top-fixed h1::after,
[data-theme="linen"] footer p::before {
    width: 64px; height: 1px; border-radius: 0; transform: none;
    background: var(--line); box-shadow: none; margin-left: 0;
}
[data-theme="linen"] .top-fixed h1 { text-indent: 0; }
[data-theme="linen"] .folder-name::after { height: 1px; }
[data-theme="linen"] .audio-item { border-left-width: 3px; }

/* 松柏·深绿：书脊保留但更细，图标圆形描边更柔 */
[data-theme="forest"] .folder-book::before { width: 6px; left: 8px; border-radius: 3px; }
[data-theme="forest"] .top-fixed h1::after,
[data-theme="forest"] footer p::before {
    width: 10px; height: 10px; transform: rotate(45deg);
    box-shadow: -30px 0 0 -2px var(--accent-soft), 30px 0 0 -2px var(--accent-soft);
}
[data-theme="forest"] .file-card a::before { width: 38px; height: 38px; }

/* 静水·靛蓝：无书脊，卡片顶部一道细条，左对齐 */
[data-theme="ocean"] .folder-book .book-cover {
    margin-left: 0;
    border-top: 3px solid var(--accent-soft);
}
[data-theme="ocean"] .top-fixed h1::after,
[data-theme="ocean"] footer p::before {
    width: 48px; height: 3px; border-radius: 2px; transform: none;
    background: var(--accent); box-shadow: none; margin-left: 0;
}
[data-theme="ocean"] .top-fixed h1 { text-indent: 0; }
[data-theme="ocean"] .folder-name::after { height: 2px; background: var(--accent); }
[data-theme="ocean"] .audio-item { border-left-width: 3px; }
[data-theme="ocean"] .file-card a::before { width: 36px; height: 36px; }

/* 朱红·宣纸：方正、双细线分隔、宽字距、居中 */
[data-theme="crimson"] .folder-book .book-cover { margin-left: 0; }
[data-theme="crimson"] .top-fixed h1::after,
[data-theme="crimson"] footer p::before {
    width: 120px; height: 3px; border-radius: 0; transform: none;
    background: var(--accent);
    box-shadow: 0 5px 0 0 rgba(158,43,37,0.35);
    box-shadow: 0 5px 0 0 color-mix(in srgb, var(--accent) 35%, transparent);
}
[data-theme="crimson"] .top-fixed h1 { font-weight: 600; }
[data-theme="crimson"] .search-bar { border-radius: 2px; }
[data-theme="crimson"] .folder-name { letter-spacing: 1px; }
[data-theme="crimson"] .folder-icon { border-width: 1px; }
[data-theme="crimson"] .audio-item { border-left-width: 3px; }
[data-theme="crimson"] .file-card a::before { width: 32px; height: 32px; }
[data-theme="crimson"] .to-top { border-radius: 2px; }

/* 夜读·墨黛：深色播放器、金线分隔、去掉白色内阴影 */
[data-theme="dusk"] .folder-book .book-cover { box-shadow: var(--shadow-sm); }
[data-theme="dusk"] .folder-icon { box-shadow: 0 2px 8px rgba(0,0,0,0.4); }
[data-theme="dusk"] .top-fixed h1 { text-shadow: 0 1px 0 rgba(0,0,0,0.5); }
[data-theme="dusk"] .top-fixed h1::after,
[data-theme="dusk"] footer p::before {
    width: 40px; height: 1px; border-radius: 0; transform: none;
    background: var(--accent); box-shadow: none;
}
[data-theme="dusk"] .audio-item audio { background: #1a1917; border-color: var(--line); }
[data-theme="dusk"] .audio-item audio::-webkit-media-controls-panel { background: #1a1917; filter: invert(0.9) hue-rotate(180deg); }
[data-theme="dusk"] .to-top { background: rgba(38,36,31,0.92); }
[data-theme="dusk"] .empty-state { background: rgba(255,255,255,0.03); }
[data-theme="dusk"] .breadcrumb { background: rgba(255,255,255,0.04); }
[data-theme="dusk"] .to-top { background: rgba(38,36,31,0.92); }
[data-theme="dusk"] .search-bar { background: #26241f; }
[data-theme="dusk"] #globalSearch { color: var(--ink); }

/* ============ 无障碍：减少动态 ============ */
@media (prefers-reduced-motion: reduce) {
    * {
        transition: none !important;
        animation: none !important;
        scroll-behavior: auto !important;
    }
    .folder-book:hover,
    .folder-book:hover .book-cover { transform: none; }
    .grid-container > * { animation: none !important; }
}

/* 首页卡片少（快捷卡 + 四张栏目卡 = 5 张），宽屏直接排满一整排，
   否则按 4 列算会漏一张孤零零地掉到第二行。窄屏仍走自适应网格。 */
@media (min-width: 1200px) {
    #homePageContent .grid-container {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

/* ============ 平板（≤1024px） ============ */
@media (max-width: 1024px) {
    .grid-container {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr));
    }
}

/* ============ 手机（≤640px） ============ */
@media (max-width: 640px) {
    .top-fixed { padding-left: 12px; padding-right: 12px; }
    .search-container { max-width: calc(100% - 24px); margin: 20px 12px 2px; }
    .top-nav { gap: 2px 2px; padding: 0 6px; }
    .top-nav a { font-size: 14px; padding: 9px 11px; letter-spacing: 1px; }

    /* 手机双列网格，卡片更紧凑 */
    .grid-container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
        padding: 16px;
    }
    .folder-book .book-cover { height: 166px; margin-left: 16px; }
    [data-theme="linen"] .folder-book .book-cover,
    [data-theme="ocean"] .folder-book .book-cover,
    [data-theme="crimson"] .folder-book .book-cover { margin-left: 0; }
    .folder-icon { width: 56px; height: 56px; font-size: 26px; margin-bottom: 12px; }
    .folder-name { font-size: 0.98em; }

    /* 恩典 / 彩窗在手机上同样要缩到紧凑高度（否则被桌面高度规则压住） */
    [data-theme="grace"] .folder-book .book-cover,
    [data-theme="stained"] .folder-book .book-cover { height: 172px; margin-left: 20px; }
    .cat-card .folder-icon { width: 46px; height: 46px; font-size: 25px; margin-bottom: 8px; }
    .feature-card .folder-icon { width: 46px; height: 46px; font-size: 25px; margin-bottom: 8px; }
    .feature-card .folder-name { font-size: 1.02em; letter-spacing: 2px; }
    .feature-card .book-cover { margin-left: 18px; }
    .cat-card .folder-name { font-size: 1.02em; letter-spacing: 2px; }
    .cat-card .folder-book::before { width: 6px; left: 7px; }
    .cat-card .book-cover { margin-left: 18px; }
    [data-theme="grace"] .top-fixed .tagline,
    [data-theme="stained"] .top-fixed .tagline { letter-spacing: 1.5px; margin-top: 10px; }

    .audio-item { padding: 16px 14px; margin: 12px 10px; }
    .audio-item audio { height: 48px; }
    .audio-item .filename { font-size: 1.02em; }

    .file-card { padding: 16px; }
    .file-card a { font-size: 0.95em; }
    .file-card a::before { width: 28px; height: 28px; }

    /* 结果下拉在手机上贴底展开，避免被键盘/视口裁切 */
    #searchResults {
        max-height: min(50vh, 300px);
        left: -12px;
        right: -12px;
        border-radius: calc(var(--radius) - 2px);
    }
}

/* ============ 小屏手机（≤380px） ============ */
@media (max-width: 380px) {
    .grid-container { gap: 12px; padding: 12px; }
    .folder-book .book-cover { height: 150px; }
    .top-nav a { font-size: 13px; padding: 8px 9px; }
}