@charset "UTF-8";
/* ==========================================================================
   editorial.css · 个人刊物（全站统一风格层）
   --------------------------------------------------------------------------
   方向：一个人办的同人志 / 独立刊物。
     · 版面：左对齐、非对称、细线分栏，不用卡片网格与投影
     · 字体：标题衬线（宋体系）+ 正文无衬线 + 元数据等宽
     · 色彩：纸白 / 墨黑，Miku 青只做编号、链接、指示器的小面积强调
     · 层级：靠字号、字重、留白与分隔线建立，不靠阴影和圆角

   用法：旧页面（文章页 / 关于页 / 404）仍需要 style.css 打底，本文件放最后覆盖：
     根目录页面  <link rel="stylesheet" href="./asset/editorial.css">
     子目录页面  <link rel="stylesheet" href="../asset/editorial.css">
   首页、小说目录页、漫画目录页已不再依赖旧样式表，只引用本文件。
   例外：library/read.html 与 manga/read.html 的沉浸阅读体验不引用本文件，
        保持既有全屏实现不变。
   ========================================================================== */

/* ==========================================================================
   1. 设计令牌（覆盖 style.css 的同名变量，使老组件自动换装）
   ========================================================================== */
:root{
  /* ---- 纸面与墨色 ---- */
  --bg:#f7f4ee;
  --bg-alt:#f0ece4;
  --surface:#fffdf9;
  --text:#1a1815;
  --text-secondary:#6b6459;
  --border:#ded6c8;
  --rule:#cfc5b4;

  /* ---- 强调色：Miku 青，克制使用 ---- */
  --primary:#39c5bb;
  --primary-dark:#0e948c;
  --accent:#0b7c74;          /* 浅底可读的青，用于链接与编号 */

  /* ---- 无阴影：改用细线分隔 ---- */
  --shadow-normal:none;
  --shadow-hover:none;
  --radius:0;
  --radius-l:2px;
  --radius-m:2px;

  /* ---- 字体族 ---- */
  --serif:"Songti SC","STSong","Source Han Serif SC","Noto Serif CJK SC","Noto Serif SC","SimSun",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,"SF Mono","Cascadia Mono",Consolas,"Liberation Mono","Courier New",monospace;

  /* ---- 尺度 ---- */
  --ed-max:1120px;
  /* 用 px 而非 ch：ch 会随元素自身字体（等宽/衬线）变化，导致细线宽度对不齐 */
  --ed-measure:640px;
  /* --nav-h 是导航栏的「设计高度」，与测量值 --header-h 分离。
     切勿让 .nav-inner 的高度反过来读 --header-h：
     脚本用 header.offsetHeight（含 1px 下边框）写 --header-h，
     若导航高度又依赖它，每测一次就长 1px，会无限膨胀。 */
  --nav-h:60px;
  --gutter:clamp(20px,5vw,56px);
  --header-h:60px;
  --font-body:clamp(15px,1.05vw,16.5px);
  --font-nav:clamp(12.5px,1vw,13.5px);
  --font-brand:clamp(17px,1.6vw,20px);
  --font-h1:clamp(30px,5.2vw,56px);
  --font-h2:clamp(20px,2.4vw,28px);
  --font-small:clamp(11.5px,1vw,12.5px);
  --speed:.22s;
  --ease:cubic-bezier(.22,.61,.36,1);
}

[data-theme="dark"]{
  --bg:#131211;
  --bg-alt:#191715;
  --surface:#1b1917;
  --text:#ece6dc;
  --text-secondary:#a09889;
  --border:#3b352d;
  --rule:#4a4238;
  --primary:#39c5bb;
  --primary-dark:#2aaea5;
  --accent:#5fd6cd;
  --shadow-normal:none;
  --shadow-hover:none;
}

/* ==========================================================================
   2. 基础（含轻量重置，使首页可只依赖本文件）
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-behavior:smooth; }
html,body{ overflow-x:hidden; max-width:100%; }
img,svg,video,iframe,table{ max-width:100%; height:auto; }

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  font-size:var(--font-body);
  line-height:1.75;
  letter-spacing:.006em;
  min-height:100vh;
  padding-top:var(--header-h,60px);
  -webkit-font-smoothing:antialiased;
  transition:background .35s ease, color .35s ease;
  text-underline-offset:.22em;
  text-decoration-thickness:1px;
}
a{ color:var(--accent); text-decoration:none; }
a:hover{ text-decoration:underline; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:0; }
::selection{ background:color-mix(in srgb, var(--primary) 34%, transparent); }

/* 只给读屏的标签：搜索框等控件必须有可见文案之外的名称 */
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

/* 小号等宽「栏目 / 元数据」文字，是本刊的签名元素 */
.ed-kicker{
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--text-secondary);
}
.ed-meta,
.post-meta,
.date,
.a-meta{
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-secondary);
}

/* ==========================================================================
   3. 顶栏：一条细线，没有毛玻璃、没有圆角
   ========================================================================== */
.header-fixed{
  position:fixed;
  inset:0 0 auto 0;
  z-index:999;
  background:color-mix(in srgb, var(--bg) 94%, transparent);
  -webkit-backdrop-filter:saturate(120%) blur(8px);
  backdrop-filter:saturate(120%) blur(8px);
  border-bottom:1px solid var(--border);
  box-shadow:none;
  transition:background .3s ease, border-color .3s ease;
}
.header-fixed.scroll-down{
  background:color-mix(in srgb, var(--bg) 98%, transparent);
  box-shadow:none;
}
.header-fixed .nav-inner{
  max-width:var(--ed-max);
  margin:0 auto;
  padding:0 var(--gutter);
  /* 高度由内容 + 固定最小值决定，不读 --header-h（避免测量反馈循环） */
  min-height:var(--nav-h);
  height:auto;
  display:flex;
  align-items:center;
  gap:clamp(14px,2.4vw,32px);
  min-width:0;
}
.header-fixed .brand-wrap{ position:relative; flex:0 0 auto; }
.header-fixed .brand{
  font-family:var(--serif);
  font-size:var(--font-brand);
  font-weight:700;
  letter-spacing:.02em;
  color:var(--text);
  text-decoration:none;
}
.header-fixed .brand:hover{ color:var(--accent); text-decoration:none; }
.header-fixed .brand-caret{
  border:0;
  background:transparent;
  color:var(--text-secondary);
  font-size:9px;
  padding:4px 2px;
  cursor:pointer;
  vertical-align:2px;
}
.header-fixed .brand-menu{
  position:absolute;
  top:calc(100% + 14px);
  left:0;
  min-width:190px;
  padding:6px 0;
  background:var(--surface);
  border:1px solid var(--border);
  box-shadow:0 14px 34px rgba(0,0,0,.10);
  border-radius:0;
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:opacity var(--speed) var(--ease), transform var(--speed) var(--ease), visibility var(--speed);
}
.header-fixed .brand-wrap.open .brand-menu,
.header-fixed .brand-wrap:hover .brand-menu,
.header-fixed .brand-wrap:focus-within .brand-menu{
  opacity:1;
  visibility:visible;
  transform:none;
}
.header-fixed .brand-menu a{
  display:block;
  padding:8px 18px;
  font-size:13.5px;
  color:var(--text);
  text-decoration:none;
  border-bottom:0;
}
.header-fixed .brand-menu a:hover{ background:var(--bg-alt); color:var(--accent); text-decoration:none; }
.header-fixed .nav-links{
  display:flex;
  align-items:center;
  gap:clamp(16px,2.2vw,30px);
  margin-left:auto;
  min-width:0;
}
.header-fixed .nav-link{
  font-family:var(--mono);
  font-size:var(--font-nav);
  letter-spacing:.06em;
  color:var(--text-secondary);
  text-decoration:none;
  white-space:nowrap;
  padding:4px 0;
  border-bottom:1px solid transparent;
  transition:color .2s, border-color .2s;
}
.header-fixed .nav-link:hover{ color:var(--text); border-bottom-color:var(--text); text-decoration:none; }
.header-fixed .nav-link[aria-current="page"],
.header-fixed .nav-link.active{ color:var(--text); border-bottom-color:var(--accent); }
.header-fixed .theme-toggle{
  flex:0 0 auto;
  border:1px solid var(--border);
  background:transparent;
  color:var(--text-secondary);
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.06em;
  padding:5px 10px;
  border-radius:0;
  cursor:pointer;
  transition:color .2s, border-color .2s;
}
.header-fixed .theme-toggle:hover{ color:var(--text); border-color:var(--text); }

/* ==========================================================================
   4. 容器与栏目页眉
   ========================================================================== */
.container{
  max-width:960px;
  margin:0 auto;
  padding:clamp(28px,5vw,64px) var(--gutter) 0;
}
/* 栏目标题：等宽英文小标 + 中文大字 + 一条通到右边的细线 */
.ed-section{ margin:clamp(44px,7vw,88px) 0 0; }
.ed-section:first-of-type{ margin-top:clamp(28px,4vw,48px); }
.ed-section-head{
  display:flex;
  align-items:baseline;
  gap:clamp(12px,2vw,22px);
  margin-bottom:clamp(18px,2.4vw,26px);
}
.ed-section-head h2{
  flex:0 0 auto;
  font-family:var(--serif);
  font-size:var(--font-h2);
  font-weight:700;
  letter-spacing:.04em;
  line-height:1.2;
  margin:0;
}
.ed-section-head .ed-caption{
  flex:0 0 auto;
  order:-1;
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent);
}
.ed-section-head::after{
  content:"";
  flex:1 1 auto;
  height:1px;
  background:var(--border);
  transform:translateY(-.42em);
}

/* ==========================================================================
   5. 首页：刊头
   ========================================================================== */
.ed-wrap{
  max-width:var(--ed-max);
  margin:0 auto;
  padding:0 var(--gutter);
}
.ed-masthead{
  padding:clamp(44px,7vw,84px) 0 0;
  border-bottom:1px solid var(--text);
}
.ed-masthead .ed-kicker{
  margin-bottom:clamp(20px,3vw,34px);
}
.ed-masthead h1{
  font-family:var(--serif);
  font-size:clamp(34px,6.4vw,72px);
  font-weight:700;
  line-height:1.16;
  letter-spacing:-.01em;
  margin:0 0 clamp(18px,2.4vw,26px);
}
/* 标题按短句显式分行：中文可任意处断行，交给浏览器会切出「的博客。」这种孤行 */
.ed-masthead h1 .ln{
  display:block;
  white-space:nowrap;
}
.ed-masthead h1 em{
  font-style:normal;
  color:var(--accent);
  border-bottom:2px solid color-mix(in srgb, var(--accent) 34%, transparent);
}
.ed-masthead .ed-lead{
  font-size:clamp(15px,1.35vw,18px);
  color:var(--text-secondary);
  max-width:44ch;
  margin:0 0 clamp(22px,3vw,30px);
}
.ed-masthead .ed-links{
  display:flex;
  flex-wrap:wrap;
  gap:6px clamp(18px,2.4vw,30px);
  margin-bottom:clamp(26px,3.4vw,38px);
}
.ed-masthead .ed-links a{
  font-family:var(--mono);
  font-size:var(--font-nav);
  letter-spacing:.04em;
  color:var(--text);
  border-bottom:1px solid var(--border);
  padding-bottom:2px;
}
.ed-masthead .ed-links a:hover{ color:var(--accent); border-bottom-color:var(--accent); text-decoration:none; }

/* 事实清单：把真实的收藏规模摆到版面上 */
.ed-facts{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:1px;
  background:var(--border);
  border-top:1px solid var(--border);
  /* 底边交给 .ed-masthead 的墨线收口，避免出现两条平行线 */
}
.ed-fact{
  background:var(--bg);
  padding:clamp(12px,1.6vw,18px) clamp(6px,1vw,10px);
}
.ed-fact b{
  display:block;
  font-family:var(--serif);
  font-size:clamp(22px,2.6vw,30px);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-.01em;
  font-variant-numeric:tabular-nums;
}
.ed-fact span{
  display:block;
  margin-top:6px;
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.1em;
  color:var(--text-secondary);
}

/* ==========================================================================
   6. 目录行（取代卡片网格）
   -------------------------------------------------------------------------- */
.ed-index{ list-style:none; border-top:1px solid var(--border); }
/* 行底细线挂在 li 上：悬停放大的 <a> 不把通栏细线一起拽歪 */
.ed-index > li{ border-bottom:1px solid var(--border); }
.ed-entry{
  display:grid;
  grid-template-columns:3.2em minmax(0,1fr) auto;
  align-items:baseline;
  gap:clamp(10px,1.8vw,22px);
  padding:clamp(16px,2vw,22px) 0;
  text-decoration:none;
  color:var(--text);
  transform-origin:left center;
  transition:background .2s ease, transform .25s var(--ease);
}
.ed-entry:hover{
  background:color-mix(in srgb, var(--primary) 6%, transparent);
  transform:scale(1.02);
  text-decoration:none;
}
.ed-entry .ed-no{
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.08em;
  color:var(--text-secondary);
  transition:color .2s;
  font-variant-numeric:tabular-nums;
}
.ed-entry:hover .ed-no{ color:var(--accent); }
.ed-entry .ed-body{ min-width:0; }
.ed-entry .ed-title{
  display:block;
  font-family:var(--serif);
  font-size:clamp(18px,2vw,23px);
  font-weight:700;
  line-height:1.35;
  letter-spacing:.01em;
  margin:0 0 4px;
}
.ed-entry:hover .ed-title{ text-decoration:underline; text-decoration-thickness:1px; }
.ed-entry .ed-sum{
  display:block;
  font-size:14.5px;
  color:var(--text-secondary);
  line-height:1.6;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ed-entry .ed-right{
  display:flex;
  align-items:baseline;
  gap:clamp(10px,1.6vw,20px);
  white-space:nowrap;
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.06em;
  color:var(--text-secondary);
  font-variant-numeric:tabular-nums;
}
.ed-entry .ed-code{
  color:var(--accent);
  letter-spacing:.12em;
}
.ed-entry .ed-arrow{ transition:transform .2s var(--ease); }
.ed-entry:hover .ed-arrow{ transform:translateX(4px); }

/* 站点入口行：中文标题 + 等宽分类号 */
.ed-entry.site .ed-title{
  font-family:var(--sans);
  font-size:clamp(17px,1.8vw,20px);
  font-weight:600;
  letter-spacing:.02em;
}

/* ==========================================================================
   7. 文章页 / 关于页
   ========================================================================== */
.article{ margin:0; max-width:var(--ed-measure); }
.article-head{
  padding-bottom:clamp(18px,2.4vw,26px);
  border-bottom:1px solid var(--text);
  margin-bottom:clamp(24px,3vw,36px);
}
.page-title{
  font-family:var(--serif);
  font-size:var(--font-h1);
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.01em;
  margin:0 0 clamp(12px,1.6vw,18px);
}
.post-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:6px 16px;
}
.post-tag{
  display:inline-block;
  padding:2px 8px;
  border:1px solid var(--border);
  color:var(--accent);
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.06em;
  border-radius:0;
}
.article-body,
.card{
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:0;
}
.article-body{ max-width:var(--ed-measure); }
.article-body:hover{ box-shadow:none; transform:none; }

/* 正文排版 */
.prose{ font-size:var(--font-body); line-height:1.9; }
.prose > :first-child{ margin-top:0; }
.prose h2,
.prose h3,
.prose h4{
  font-family:var(--serif);
  font-weight:700;
  letter-spacing:.01em;
  line-height:1.35;
}
.prose h2{
  font-size:clamp(20px,2.2vw,26px);
  margin:2.2em 0 .7em;
  padding-top:.7em;
  border-top:1px solid var(--border);
}
.prose h3{ font-size:clamp(17px,1.8vw,20px); margin:1.8em 0 .5em; }
.prose p{ margin:0 0 1.15em; }
.prose a{ border-bottom:1px solid color-mix(in srgb, var(--accent) 40%, transparent); }
.prose a:hover{ text-decoration:none; border-bottom-color:var(--accent); }
.prose blockquote{
  margin:1.6em 0;
  padding:2px 0 2px 18px;
  border-left:2px solid var(--accent);
  color:var(--text-secondary);
  font-family:var(--serif);
}
.prose blockquote p:last-child{ margin-bottom:0; }
.prose code{
  font-family:var(--mono);
  font-size:.88em;
  padding:1px 5px;
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:0;
}
.prose pre{
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:0;
  padding:16px 18px;
  overflow:auto;
  line-height:1.6;
}
.prose pre code{ padding:0; border:0; background:none; font-size:13px; }
.prose ul,
.prose ol{ padding-left:1.3em; margin:0 0 1.15em; }
.prose li{ margin:.35em 0; }
.prose hr{ border:0; border-top:1px solid var(--border); margin:2.2em 0; }
.prose img{ display:block; margin:1.6em 0; }

/* 关于页：把卡片压平成带细线的条目 */
.about-cards{
  display:grid;
  gap:clamp(26px,3.6vw,44px);
  max-width:var(--ed-measure);
}
.about-card{
  background:transparent !important;
  border:0 !important;
  border-top:1px solid var(--text) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:clamp(14px,1.8vw,20px) 0 0 !important;
  color:var(--text) !important;
  transition:none;
}
.about-card h2{
  font-family:var(--serif);
  font-size:clamp(17px,1.7vw,20px);
  font-weight:700;
  letter-spacing:.06em;
  margin:0 0 10px;
  color:var(--text) !important;
}
.about-card .about-text,
.about-card .about-desc,
.about-card .md-body{ color:var(--text) !important; }
.about-card .about-desc{ color:var(--text-secondary) !important; }
.about-card .card-link{
  color:var(--accent) !important;
  text-decoration:none;
  border-bottom:1px solid color-mix(in srgb, var(--accent) 40%, transparent);
}
.about-card .card-btn{
  display:inline-block;
  margin-top:14px;
  padding:7px 16px;
  background:transparent !important;
  color:var(--text) !important;
  border:1px solid var(--text) !important;
  border-radius:0;
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.08em;
  text-decoration:none;
}
.about-card .card-btn:hover{ background:var(--text) !important; color:var(--bg) !important; }

/* ==========================================================================
   8. 通用按钮
   ========================================================================== */
.btn{
  display:inline-block;
  padding:9px 18px;
  background:transparent;
  color:var(--text);
  border:1px solid var(--text);
  border-radius:0;
  box-shadow:none;
  font-family:var(--mono);
  font-size:var(--font-nav);
  font-weight:500;
  letter-spacing:.06em;
  text-decoration:none;
  transition:background .2s, color .2s, border-color .2s;
}
.btn:hover{ background:var(--text); color:var(--bg); box-shadow:none; transform:none; }
.btn.ghost{ background:transparent; color:var(--text-secondary); border:1px solid var(--border); }
.btn.ghost:hover{ background:transparent; color:var(--text); border-color:var(--text); }
.btn.small{ padding:6px 13px; font-size:var(--font-small); }

/* ==========================================================================
   9. 书架 / 漫画库
   ========================================================================== */
#libraryMain{ max-width:var(--ed-max); }
.library-head{
  align-items:flex-end;
  padding-bottom:clamp(14px,1.8vw,20px);
  border-bottom:1px solid var(--text);
  margin-bottom:0;
}
.library-head h1{
  font-family:var(--serif);
  font-size:var(--font-h1);
  font-weight:700;
  letter-spacing:-.01em;
  line-height:1.2;
}
.library-head p{
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.08em;
  color:var(--text-secondary);
  margin-top:8px;
}
.search-box{
  background:transparent;
  border:0;
  border-radius:0;
  padding:6px 2px;
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.04em;
  color:var(--text);
  min-width:min(260px,60vw);
}
.search-box:focus{ outline:none; }
.search-box::placeholder{ color:var(--text-secondary); opacity:1; }
/* 栏目刊头：与首页 .ed-masthead 共用排法（踢脚 + 衬线大标题 + 简介 + 墨线收口），
   只把底部留白交给计数行，避免墨线贴在简介上 */
.ed-masthead.ed-pagehead{ padding-bottom:clamp(16px,2vw,24px); }
.ed-masthead.ed-pagehead .ed-lead{ margin-bottom:0; }
/* 栏目页头后面没有事实条，第一节不必留首页那么大的空档 */
.ed-pagehead + .ed-section{ margin-top:clamp(32px,4.4vw,56px); }

/* 栏目标题右侧的计数：等宽、右对齐，排在通栏细线之后 */
.ed-section-head .bk-count{
  order:3;
  flex:0 0 auto;
  margin:0;
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.08em;
  color:var(--text-secondary);
  font-variant-numeric:tabular-nums;
}

/* 搜索行：右对齐，整条细线归它自己，目录不再单独画上边线
   （否则手机上搜索框的下划线会和目录上边线并成两条几乎重合的线） */
.bk-tools{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding-bottom:10px;
  border-bottom:1px solid var(--border);
}
.bk-tools:focus-within{ border-bottom-color:var(--accent); }

/* ---------- 目录行：编号 / 书脊 / 正文 / 元数据，与首页 .ed-entry 同构 ---------- */
.bk-list{
  list-style:none;
  margin:0;
  padding:0;
}
.bk-row{
  position:relative;
  display:grid;
  grid-template-columns:2.6em 64px minmax(0,1fr) auto;
  grid-template-areas:"no cover body right";
  align-items:start;
  gap:clamp(12px,1.6vw,20px);
  padding:clamp(16px,2vw,22px) 0;
  border-bottom:1px solid var(--border);
  transition:background .2s ease;
}
.bk-row:hover,
.bk-row:focus-within{ background:color-mix(in srgb, var(--primary) 5%, transparent); }

.bk-no{
  grid-area:no;
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.08em;
  line-height:1.9;
  color:var(--text-secondary);
  font-variant-numeric:tabular-nums;
  transition:color .2s;
}
.bk-row:hover .bk-no,
.bk-row:focus-within .bk-no{ color:var(--accent); }

.bk-cover{
  grid-area:cover;
  width:64px;
  height:86px;
  display:block;
  object-fit:cover;
  border:1px solid var(--border);
  border-radius:0;
  background:var(--bg-alt);
  /* 网格项默认 min-height:auto，长书名会把封面撑高 */
  min-width:0;
  min-height:0;
}
/* 无封面时把书名竖排当书脊，左侧压一条粗边 */
.bk-cover--blank{
  writing-mode:vertical-rl;
  text-orientation:upright;
  white-space:nowrap;
  overflow:hidden;
  padding:9px 6px 6px;
  border-left:3px solid var(--rule);
  font-family:var(--serif);
  font-size:11px;
  line-height:1.25;
  letter-spacing:.08em;
  color:var(--text-secondary);
}

.bk-body{ grid-area:body; min-width:0; }
.bk-title{
  font-family:var(--serif);
  font-size:clamp(17px,1.8vw,20px);
  font-weight:700;
  line-height:1.35;
  letter-spacing:.01em;
  margin:0 0 4px;
}
.bk-link{ color:var(--text); text-decoration:none; }
.bk-link:hover{ text-decoration:underline; text-decoration-thickness:1px; }
/* 整行可点：把命中区拉到整行，右侧只有下载链接会截住点击
   （比给 <li> 套 <a> 合法，也不会出现两个指向同一本书的重复链接） */
.bk-link::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
}
.bk-author{
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.06em;
  color:var(--text-secondary);
  margin:0 0 6px;
}
.bk-desc{
  font-size:14px;
  line-height:1.65;
  color:var(--text-secondary);
  margin:0 0 8px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.bk-tags{ display:flex; flex-wrap:wrap; gap:6px; margin:0 0 6px; }
/* 标题里的「示例文本」角标 */
.bk-title .bk-tag{ margin-left:8px; vertical-align:2px; }
.bk-tag{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.06em;
  padding:2px 7px;
  border:1px solid var(--border);
  color:var(--text-secondary);
}

.bk-right{
  grid-area:right;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:baseline;
  gap:2px clamp(10px,1.6vw,20px);
  white-space:nowrap;
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.06em;
  color:var(--text-secondary);
  font-variant-numeric:tabular-nums;
  padding-top:2px;
  /* 元数据不该挡住整行命中区，只有下载链接自己吃点击 */
  pointer-events:none;
}
.bk-dl{
  pointer-events:auto;
  position:relative;
  z-index:1;
  color:var(--text-secondary);
  border-bottom:1px solid var(--border);
}
.bk-dl:hover{ color:var(--accent); border-bottom-color:var(--accent); text-decoration:none; }
.bk-arrow{ transition:transform .2s var(--ease); }
.bk-row:hover .bk-arrow{ transform:translateX(4px); }

/* 密码屏：不进库时也保持左对齐的刊物版式（与刊头同一列、同一条墨线） */
.password-screen{ padding:clamp(44px,7vw,84px) 0 0; }
.lock-card{
  max-width:420px;
  margin:0;
  background:transparent;
  border:0;
  border-top:1px solid var(--text);
  border-radius:0;
  box-shadow:none;
  padding:clamp(22px,3vw,32px) 0 0;
}
.lock-card .ed-kicker{ margin:0 0 10px; }
.lock-card h1{
  font-family:var(--serif);
  font-size:clamp(24px,3vw,34px);
  font-weight:700;
  letter-spacing:-.01em;
  line-height:1.2;
  margin:0 0 10px;
}
.lock-card p{
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.04em;
  color:var(--text-secondary);
  margin:0 0 18px;
}
.lock-field{
  width:100%;
  background:transparent;
  border:0;
  border-bottom:1px solid var(--border);
  border-radius:0;
  padding:10px 2px;
  font-family:var(--mono);
  font-size:14px;
  color:var(--text);
  margin-bottom:6px;
}
.lock-field:focus{ outline:none; border-bottom-color:var(--accent); }
.lock-error{
  min-height:20px;
  font-family:var(--mono);
  font-size:var(--font-small);
  color:#b4483c;
}
.lock-card .btn{ margin-top:8px; }
.empty-library{
  padding:clamp(24px,4vw,40px) 0;
  font-family:var(--mono);
  font-size:13px;
  letter-spacing:.04em;
  color:var(--text-secondary);
  border-bottom:1px solid var(--border);
}

/* ==========================================================================
   10. 电台
   ========================================================================== */
.top-bar{
  max-width:var(--ed-max);
  margin:0 auto;
  padding:14px var(--gutter);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border-bottom:1px solid var(--border);
}
.top-bar .back-home,
.top-bar #theme{
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.08em;
  color:var(--text-secondary);
  background:transparent;
  border:0;
  cursor:pointer;
  text-decoration:none;
}
.top-bar .back-home:hover,
.top-bar #theme:hover{ color:var(--text); text-decoration:none; }
.radio-cover{ border-radius:0; border:1px solid var(--border); }

/* ==========================================================================
   11. 页脚
   ========================================================================== */
.a-footer,
footer.card{
  max-width:var(--ed-max);
  margin:clamp(40px,6vw,72px) auto 0;
  padding:18px var(--gutter) clamp(28px,4vw,44px);
  border-top:1px solid var(--border);
  background:transparent;
  border-radius:0;
  box-shadow:none;
  font-family:var(--mono);
  font-size:var(--font-small);
  letter-spacing:.06em;
  color:var(--text-secondary);
  text-align:left;
}
/* 文章页 / 关于页的页脚与正文列对齐，避免出现两条不同宽度的细线 */
.container > footer.card{
  max-width:var(--ed-measure);
  margin:clamp(40px,6vw,72px) 0 0;
  padding-left:0;
  padding-right:0;
}
footer.card a{ color:var(--text-secondary); }
footer.card a:hover{ color:var(--accent); }

/* ==========================================================================
   11.5 电台：保留「随封面取色」的动态背景（该页的核心特征），只统一容器形态
   ========================================================================== */
body.radio-page{
  background:var(--page-bg);
  color:var(--text-color);
  padding-top:0;
}
body.radio-page .card{
  width:min(920px, 100%);
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:0;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
body.radio-page .media-card{
  background:transparent;
  border:0;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  border-radius:0;
  box-shadow:none;
  padding:clamp(18px,3vw,28px) 0;
  gap:clamp(18px,3vw,36px);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
body.radio-page .radio-cover-wrap{ border-radius:0; }
body.radio-page .lyric-box{
  border-radius:0;
  background:transparent;
  border:1px solid var(--border);
}
body.radio-page .btn-icon{
  border-radius:0;
  background:transparent;
  border:1px solid var(--border);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
body.radio-page .btn-play{
  border-radius:0;
  background:var(--accent);
  color:#fff;
  border-color:var(--accent);
}
body.radio-page .btn-icon:hover{ transform:none; }
body.radio-page .song-title,
body.radio-page .song-artist{ text-align:left; }
body.radio-page .song-title:hover,
body.radio-page .song-artist:hover,
body.radio-page .lyric-box:hover{ transform:none; }
body.radio-page .radio-right{ align-items:flex-start; text-align:left; }
body.radio-page .lyric-wrap{ text-align:left; }

/* ==========================================================================
   11.8 404
   ========================================================================== */
.page-404{ text-align:left; }
.page-404 .error-code{
  font-family:var(--mono);
  font-size:clamp(44px,7vw,80px);
  line-height:1;
  letter-spacing:.08em;
  color:var(--accent);
  margin-bottom:14px;
}
.page-404 h1{
  font-family:var(--serif);
  font-size:var(--font-h2);
  letter-spacing:.02em;
  margin-bottom:12px;
}
.page-404 p{ max-width:var(--ed-measure); }

/* ==========================================================================
   12. 响应式
   ========================================================================== */
@media (max-width:820px){
  /* 手机上保留主导航：四个短链接压缩间距即可放下，不要让用户只能靠 ▾ 找路 */
  .header-fixed .nav-inner{ gap:10px; }
  .header-fixed .nav-links{ display:flex; gap:clamp(10px,3vw,16px); }
  .header-fixed .nav-link{ font-size:11.5px; letter-spacing:0; }
  .header-fixed .theme-toggle{ padding:5px 8px; }
  .ed-entry{
    grid-template-columns:2.4em minmax(0,1fr);
    gap:10px;
    padding:14px 0;
  }
  .ed-entry .ed-right{
    grid-column:2;
    margin-top:6px;
    font-size:11.5px;
  }
  .ed-entry .ed-sum{ white-space:normal; }
  .ed-facts{ grid-template-columns:repeat(2,1fr); }
  /* 目录行收到三栏：元数据掉到正文下面一行，编号与封面留空 */
  .bk-row{
    grid-template-columns:2.2em 52px minmax(0,1fr);
    grid-template-areas:"no cover body" ". . right";
    gap:10px 12px;
    padding:14px 0;
  }
  .bk-cover{ width:52px; height:70px; }
  .bk-right{ justify-content:flex-start; padding-top:0; }
  .bk-tools{ justify-content:stretch; }
  .bk-tools .ed-kicker{ display:none; }
  .search-box{ width:100%; min-width:0; }
}
@media (max-width:480px){
  .ed-masthead h1{ font-size:clamp(28px,8.4vw,40px); }
  .ed-entry .ed-right .ed-code{ display:none; }
  .ed-facts{ grid-template-columns:1fr 1fr; }
  .bk-row{ grid-template-columns:1.8em 46px minmax(0,1fr); gap:10px 8px; }
  .bk-cover{ width:46px; height:62px; }
  .bk-cover--blank{ font-size:10px; padding:7px 4px 4px; }
  .bk-right{ font-size:11px; gap:2px 10px; }
}

/* 五项主导航在 360px 以下再收一档，避免两个字的导航名被拆成竖排 */
@media (max-width:360px){
  .header-fixed .nav-inner{ gap:6px; }
  .header-fixed .nav-links{ gap:8px; }
  .header-fixed .nav-link{ font-size:11px; }
  .header-fixed .brand{ font-size:16px; }
  .header-fixed .theme-toggle{ padding:4px 6px; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-name:none !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}
@media print{
  .header-fixed,.theme-toggle{ display:none; }
  body{ padding-top:0; background:#fff; color:#000; }
}