/* ════════════════════════════════════════════════════════════════════════
   作家舟 · 内页共用样式（灵感库 / 写作素材库 / 拆书 · 2026-10-08）

   目的：让这三页和「首页 static/home.html」「写作页 writer.html」看起来是同一套系统。
   做法：把首页那套令牌别名（--paper/--ink/--line/--qing/--zhu）和组件外观搬过来，
        颜色全部走 tokens.css + themes.css 的皮肤令牌，所以换皮肤三页一起变。

   ⚠️ 为什么每条规则都带 html[data-theme] 前缀：
      这三页自带的旧样式权重都是 (0,1,x) 级别，加一层 html[属性] 才能在不动它们标记、
      不改它们 JS 的前提下稳稳压过去（同一份文件服务三页，谁也不用改结构）。
   ════════════════════════════════════════════════════════════════════════ */

html[data-theme]{
  /* 与首页完全一致的别名：页面自己的 CSS 里凡是用 --paper/--ink/--qing 的，立刻跟着皮肤走 */
  --paper:var(--bg);
  --paper2:var(--panel2);
  --ink:var(--text);
  --ink2:var(--text-dim);
  --line:var(--border-soft);
  --line2:var(--border);
  --qing:var(--accent);
  --qing-d:var(--accent-hover);
  --zhu:#B33A2B;                 /* 朱印：品牌色，刻意不跟皮肤走 */
  --serif:"Source Han Serif SC","Songti SC","Noto Serif SC","SimSun",serif;
  --zz-r:12px;                   /* 卡片圆角 */
  --zz-r-sm:10px;                /* 按钮/输入圆角 */
}
/* ⚠️ 「蓝紫」这套皮肤的定义在 zz-design.css 里（那是写作页专用），这三页没引它 →
   不补这一段的话 --bg/--accent 全是空的，颜色根本不会变（2026-10-08 实测踩到）。
   色值取自蓝湖稿，和 zz-design.css 里的 [data-theme="lanzi"] 完全一致。 */
html[data-theme="lanzi"]{
  --accent:#6C6AFF;        --accent-hover:#748AFF;   --accent-soft:#E6E2FF;
  --bg:#EDF3FF;            --border:#DCE3F6;         --border-soft:#E7ECFA;
  --card:#FFFFFF;          --card-hover:#F5F7FF;     --center-bg:#E4ECFE;
  --editor-bg:#F5F8FF;     --panel:#EDF3FF;          --panel2:#F3F6FF;
  --prompt-bg:#F5F7FF;     --rewrite-bg:#F5F8FF;     --side-bg:#EDF3FF;
  --top-bg:#FFFFFF;        --progress-track:#E6E2FF;
  --text:#0A1030;          --text-dim:#4A5470;       --muted:#666E86;
  --placeholder:#8A93AD;   --scroll:#D5DDEF;         --scroll-hover:#BFC9E4;
  --purple:#7869FF;        --green:#4C7DF0;          --red:#D33A2C;  --hl:#B8860B;
}
html[data-theme] *,html[data-theme] *::before,html[data-theme] *::after{box-sizing:border-box}
html[data-theme] body{
  font-family:"PingFang SC","Source Han Sans SC","Microsoft YaHei",system-ui,sans-serif;
  color:var(--ink);background-color:var(--paper);-webkit-font-smoothing:antialiased;
  /* 极淡纸纹（和首页同一张）：不是线也不是网格，只是让纯色底有点温度 */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
}
/* 图标：与写作页/首页同一套（线宽 1.7、跟随 currentColor） */
html[data-theme] .ic{width:1.15em;height:1.15em;flex:none;display:inline-block;
  fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* ── 顶栏：白底 + 2px 下沿线（跟写作页「所有线加粗」一致）── */
html[data-theme] header{background:var(--card);border-bottom:2px solid var(--line);
  position:sticky;top:0;z-index:20}
html[data-theme] header .brand{color:var(--ink)}
html[data-theme] header .zz-seal{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
  height:32px;width:17px;font-family:var(--serif);font-size:7.5px;font-weight:400;line-height:1;
  color:var(--zhu);border:1.2px solid var(--zhu);border-radius:50%;flex:none;margin-left:2px;letter-spacing:0}
html[data-theme] header .zz-seal i{font-style:normal;display:block;width:100%;text-align:center;line-height:1.06}
html[data-theme] header .zz-domain{font-size:10.5px;font-weight:400;letter-spacing:.05em;opacity:.45;line-height:1;
  white-space:nowrap;padding-left:8px;margin-left:2px;border-left:1px solid currentColor}
html[data-theme] header nav{display:flex;align-items:center;gap:6px}
html[data-theme] header nav a{color:var(--ink2);text-decoration:none;font-size:13px;line-height:1;
  padding:7px 11px;border-radius:var(--zz-r-sm);transition:background .15s ease,color .15s ease}
html[data-theme] header nav a:hover{color:var(--qing);background:var(--accent-soft)}
html[data-theme] header nav a.on,html[data-theme] header nav a.here{color:var(--qing);background:var(--accent-soft);font-weight:600}

/* ── 按钮 ── */
html[data-theme] button{font-family:inherit}
html[data-theme] .btn-main,html[data-theme] .btn-primary,html[data-theme] button.primary,html[data-theme] .go{
  background:var(--qing);color:#fff;border:0;border-radius:var(--zz-r-sm);
  padding:9px 18px;font-size:13.5px;font-weight:600;cursor:pointer;transition:background .15s ease}
html[data-theme] .btn-main:hover,html[data-theme] .btn-primary:hover,html[data-theme] button.primary:hover,html[data-theme] .go:hover{background:var(--qing-d)}
html[data-theme] .quiet,html[data-theme] button.ghost,html[data-theme] .btn-ghost{
  background:var(--card);color:var(--ink2);border:1px solid var(--line2);border-radius:var(--zz-r-sm);
  padding:8px 14px;font-size:13px;cursor:pointer;transition:color .15s ease,border-color .15s ease}
html[data-theme] .quiet:hover,html[data-theme] button.ghost:hover,html[data-theme] .btn-ghost:hover{color:var(--qing);border-color:var(--qing)}
html[data-theme] .mini,html[data-theme] .sm{font-size:12.5px;padding:6px 12px;border-radius:8px}

/* ── 卡片 / 面板 ── */
html[data-theme] .card,html[data-theme] article.card,html[data-theme] .panel{
  background:var(--card);border:1px solid var(--line2);border-radius:var(--zz-r)}
html[data-theme] .card:hover{border-color:var(--qing)}
html[data-theme] .card h2,html[data-theme] .card h3,html[data-theme] .card h4{color:var(--ink)}

/* ── 胶囊 / 标签 ── */
html[data-theme] .chip,html[data-theme] .tag,html[data-theme] .pill{
  border:1px solid var(--line2);background:var(--card);color:var(--ink2);
  border-radius:999px;font-size:12.5px;transition:color .15s ease,border-color .15s ease,background .15s ease}
html[data-theme] .chip:hover,html[data-theme] .tag:hover{border-color:var(--qing);color:var(--qing)}
html[data-theme] .chip.on,html[data-theme] .tag.on,html[data-theme] .pill.on,
html[data-theme] .chip.active,html[data-theme] .tag.active{
  background:var(--accent-soft);border-color:var(--qing);color:var(--qing);font-weight:600}

/* ── 输入 ── */
html[data-theme] input[type=text],html[data-theme] input[type=search],html[data-theme] input[type=number],
html[data-theme] input:not([type]),html[data-theme] textarea,html[data-theme] select{
  background:var(--card);color:var(--ink);border:1px solid var(--line2);
  border-radius:var(--zz-r-sm);font-family:inherit}
html[data-theme] input::placeholder,html[data-theme] textarea::placeholder{color:var(--placeholder)}
html[data-theme] input:focus,html[data-theme] textarea:focus,html[data-theme] select:focus{
  outline:none;border-color:var(--qing);box-shadow:0 0 0 3px var(--accent-soft)}

/* ── 文字 / 链接 ── */
html[data-theme] a{color:var(--qing)}
html[data-theme] h1{color:var(--ink);font-weight:700;letter-spacing:.01em}
html[data-theme] h2,html[data-theme] h3,html[data-theme] h4{color:var(--ink)}
html[data-theme] .muted,html[data-theme] .sub,html[data-theme] .desc,html[data-theme] .hint{color:var(--muted)}
html[data-theme] mark,html[data-theme] .hl{background:var(--accent-soft);color:var(--ink);border-radius:3px}

/* ── 页脚：跟写作页一样贴底一条白带，上沿 2px ── */
html[data-theme] footer{background:var(--card);border-top:2px solid var(--line);color:var(--muted);font-size:12px}
html[data-theme] footer a{color:var(--muted);text-decoration:none}
html[data-theme] footer a:hover{color:var(--qing)}

/* ── 分隔线统一 2px（作者要求「所有线加粗」）── */
html[data-theme] hr{border:0;border-top:2px solid var(--line)}

/* ══ 灵感库（/lingshi）自己的类名 ══════════════════════════════════════
   它不叫 .card/.chip，而是 .idea / .cat / .use…，所以上面那套通用规则没命中，
   这里按它的类名补一遍，让卡片、标签、按钮长得和首页/写作页一样。 */
html[data-theme] .hero h1{font-size:30px;font-weight:700;color:var(--ink);letter-spacing:.01em}
html[data-theme] .hero .sub,html[data-theme] .hero p{color:var(--muted)}
html[data-theme] .grid{gap:16px}
html[data-theme] .idea{background:var(--card);border:1px solid var(--line2);border-radius:var(--zz-r);
  padding:16px 18px;transition:border-color .15s ease,box-shadow .15s ease}
html[data-theme] .idea:hover{border-color:var(--qing);box-shadow:0 6px 20px rgba(15,23,42,.06)}
html[data-theme] .idea .meta{color:var(--muted);font-size:12px}
html[data-theme] .idea .kind,html[data-theme] .idea .cat{display:inline-block;border-radius:999px;
  padding:2px 9px;font-size:11.5px;line-height:1.6;
  background:var(--accent-soft);border:1px solid var(--qing);color:var(--qing)}
html[data-theme] .idea .pm{color:var(--ink2);line-height:1.75}
html[data-theme] .idea .more{color:var(--qing);cursor:pointer}
/* 卡片上那三颗按钮：直接开写=主按钮，用这句/用梗概=次按钮 */
html[data-theme] .idea .write{background:var(--qing);border:0;color:#fff;border-radius:var(--zz-r-sm);
  padding:7px 14px;font-size:13px;font-weight:600;cursor:pointer}
html[data-theme] .idea .write:hover{background:var(--qing-d)}
html[data-theme] .idea .use,html[data-theme] .idea .use2{background:var(--card);color:var(--ink2);
  border:1px solid var(--line2);border-radius:var(--zz-r-sm);padding:6px 13px;font-size:13px;cursor:pointer}
html[data-theme] .idea .use:hover,html[data-theme] .idea .use2:hover{color:var(--qing);border-color:var(--qing)}
/* 方向/分类 tab */
html[data-theme] .tabs a,html[data-theme] .dtabs a{border-radius:999px;border:1px solid var(--line2);
  background:var(--card);color:var(--ink2);padding:6px 14px;font-size:13px;text-decoration:none}
html[data-theme] .tabs a:hover,html[data-theme] .dtabs a:hover{border-color:var(--qing);color:var(--qing)}
html[data-theme] .tabs a.on,html[data-theme] .dtabs a.on,html[data-theme] .seg .on{
  background:var(--accent-soft);border-color:var(--qing);color:var(--qing);font-weight:600}
html[data-theme] .search input{border-radius:var(--zz-r-sm)}
html[data-theme] .fwrap,html[data-theme] .fco,html[data-theme] .flinks{color:var(--ink2)}
html[data-theme] .fwrap{border-color:var(--line2)}
html[data-theme] .empty{color:var(--muted);text-align:center}
html[data-theme] .field .lab{color:var(--ink2);font-size:13px}
html[data-theme] .fgrid{border-color:var(--line2)}