/* 大纲阅读站 · 配色主题（金秋 / 樱粉 变量 + 「视图 ▾」里的四个配色按钮）
   v3.340：删掉右下角悬浮球那套样式（#dzkThemeBtn / #dzkThemePop），配色入口搬进「视图 ▾」菜单。 */
[data-theme=autumn]{--bg:#fffaf3;--panel:#fffdf9;--side:#fdf1e3;--tx:#5c3a1a;--sub:#a87b4d;--line:#f0e0cc;--gl:#e3cdb0;--tgl:#ecdcc4;--acc:#e07f2e;--acc2:#fce6d2;--sel:#fbe3cd;--hov:#fbeadb;--mark:#ffd591;--danger:#c0532f}
[data-theme=sakura]{--bg:#fffafc;--panel:#fffdfe;--side:#fdeef3;--tx:#6b3547;--sub:#b97e91;--line:#f5dde6;--gl:#ecc9d6;--tgl:#f3dde6;--acc:#e0608f;--acc2:#fce4ee;--sel:#fbe2ec;--hov:#fce8ef;--mark:#ffd6e6;--danger:#cf3d6b}

/* v3.342：新增三套扁平配色（业主选的：莫兰迪灰蓝 / 墨·亮黄 / 青绿极简）
   和上面两套同一套变量，浅色系；点「深色」时统一走 dark，点回来回到上次这套。 */
[data-theme=morandi]{--bg:#fbfaf8;--panel:#fff;--side:#f5f4f1;--tx:#1f2933;--sub:#767f88;--line:#e7e5e0;--gl:#c4c0b8;--tgl:#dbd7cf;--acc:#42627e;--acc2:#e9eff4;--sel:#dfe8ef;--hov:#f1efea;--mark:#f0e2b4;--danger:#b4534f}
[data-theme=ink]{--bg:#fff;--panel:#fff;--side:#fafaf9;--tx:#141414;--sub:#86868b;--line:#ececec;--gl:#c6c6c6;--tgl:#dedede;--acc:#141414;--acc2:#fff7e0;--sel:#fff1c4;--hov:#f5f5f4;--mark:#ffe066;--danger:#d0503c}
[data-theme=forest]{--bg:#f6f9f8;--panel:#fff;--side:#f0f5f3;--tx:#1b2b26;--sub:#6e8078;--line:#e2ece8;--gl:#bccbc5;--tgl:#d5e2dc;--acc:#2e9e85;--acc2:#e6f4f0;--sel:#dcf0ea;--hov:#ecf3f0;--mark:#cdebd9;--danger:#c2543f}

/* 墨·亮黄的主色是近黑，按钮上的白字没问题；
   但「会员」那类金色渐变按钮在白底上太跳，统一压成纯色（扁平） */
[data-theme=ink] #vipBtn.vip-cta,
[data-theme=morandi] #vipBtn.vip-cta,
[data-theme=forest] #vipBtn.vip-cta{background:#e8a700!important;border-color:transparent!important;color:#fff!important}
[data-theme=morandi] #vipBtn.vip-cta{background:#c29a4e!important}
[data-theme=forest] #vipBtn.vip-cta{background:#d9a441!important}

/* v3.343：再补三套扁平配色（石板灰 / 靛紫 / 陶土橘），与上面同变量、均浅色系 */
[data-theme=slate]{--bg:#f2f3f5;--panel:#fff;--side:#e9ecef;--tx:#17191c;--sub:#6b7280;--line:#dde2e8;--gl:#c3c9d1;--tgl:#dde1e6;--acc:#4b5563;--acc2:#e6eaee;--sel:#e2e6eb;--hov:#eef0f3;--mark:#dbe2ea;--danger:#b4453f}
[data-theme=indigo]{--bg:#f7f7fc;--panel:#fff;--side:#ececf8;--tx:#1a1b2e;--sub:#6e6f8a;--line:#e0e1ef;--gl:#c6c7dd;--tgl:#dfe0ee;--acc:#5b5bd6;--acc2:#eaeafa;--sel:#e9e9fa;--hov:#f3f3fc;--mark:#dcdcf6;--danger:#c0392b}
[data-theme=clay]{--bg:#fdfaf7;--panel:#fff;--side:#f8f1eb;--tx:#2b1d15;--sub:#8a6f5f;--line:#ede2d8;--gl:#d6c5b7;--tgl:#eaddd3;--acc:#c0562b;--acc2:#f8e8de;--sel:#f8e8de;--hov:#fbf1ea;--mark:#f5dfd0;--danger:#a83226}

/* 会员按钮跟着各自主色走（比主色再深一档，保证白字对比度够） */
[data-theme=slate] #vipBtn.vip-cta,
[data-theme=indigo] #vipBtn.vip-cta,
[data-theme=clay] #vipBtn.vip-cta{background:var(--acc)!important;border-color:transparent!important;color:#fff!important}
[data-theme=slate] #vipBtn.vip-cta{background:#3f4854!important}
[data-theme=clay] #vipBtn.vip-cta{background:#a8491f!important}

/* 视图菜单里的配色按钮：小色块 + 名字，和面板里其他按钮同款 */
.mpanel button .dzkdot{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14)}
[data-theme=dark] .mpanel button .dzkdot{box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}


/* ===== v3.405 方案A 试穿版 · 蓝白（Pixso 同源） =====
   色值全部取自 pixso.cn 首页实测：主蓝 #3866ee、深蓝 #3155d9、正文 #171717、
   次要 #6c6f7c、分割线 #eaebee、浅底 #f9f9fa / #f5f6f8。
   ★ 只换这一组变量，不动任何布局 / 字号 / 结构 —— 所以随时能一键切回任意旧主题。 */
[data-theme=pixso]{--bg:#ffffff;--panel:#ffffff;--side:#f9f9fa;--tx:#171717;--sub:#6c6f7c;--line:#eaebee;--gl:#d9dbe1;--tgl:#eceef2;--acc:#3866ee;--acc2:#eef2fe;--sel:#eef2fe;--hov:#f5f6f8;--mark:#dbe4ff;--danger:#e5484d}

/* 会员按钮跟随主色（和 morandi / forest 那几套一个做法），压成纯色不跳 */
[data-theme=pixso] #vipBtn.vip-cta{background:#3155d9!important;border-color:transparent!important;color:#fff!important}

/* ===== v3.409 · 方案B 第1项：卡片体系（只在 [data-theme=pixso] 生效，旧主题一动不动） =====
   1) 圆角 12 -> 8，内边距 14/16 -> 12/14（更紧、更"工具感"）；
   2) 悬停不再把边框描成主色，改"淡灰底 + 边框略深"—— 这是 Pixso 列表项的做法；
   3) 卡片右上「编辑」按钮：圆角 6、细灰线、灰字，悬停才上主色。 */
[data-theme=pixso] .card{border-radius:8px;padding:12px 14px;margin-bottom:8px}
[data-theme=pixso] .card:hover{border-color:#e3e5ea;background:var(--hov)}
[data-theme=pixso] .card .cedit{border-radius:6px;border-color:var(--line);color:var(--sub)}
[data-theme=pixso] .card .cedit:hover{background:var(--acc);border-color:var(--acc);color:#fff}
[data-theme=pixso] .contsec{border-radius:8px}

/* ===== v3.413 第12套主题「玻璃」· Glassmorphism =====
   交付前定的三条纪律，一条不让：
   1) 玻璃只上"浮层"：左目录栏、顶栏、聚焦退出条、菜单弹层、AI 面板。
      正文区 #cbody 保持实底白，长文不看透 —— 这是从 v3.403「按钮看不见」那次保下来的底线。
   2) 每层 blur <= 20px，同屏叠放不超过 3 层（手机 GPU 扛不住更多）。
   3) 不支持 backdrop-filter 的浏览器降级成 97% 不透明白，不退化成透明玻璃块。
   配色取自 A 方案「冰川白」：#f0f9ff -> #e8f4fd -> #dceffb，左上蓝光斑 + 左下紫光斑。 */
[data-theme=glass]{--bg:#ffffff;--panel:#ffffff;--side:#f6fafd;--tx:#0f172a;--sub:#566174;--line:rgba(15,23,42,.10);--gl:#cfd6e0;--tgl:#e7ecf3;--acc:#2563eb;--acc2:#eaf1ff;--sel:#eaf1ff;--hov:#eef3fa;--mark:#dbe7ff;--danger:#e5484d;--glFill:rgba(255,255,255,.34);--glLine:rgba(255,255,255,.75);--glBlur:18px}

/* 底：极浅冷蓝渐变 + 两团柔光，fixed 不随滚动；这才是玻璃能"透"的东西 */
[data-theme=glass] body{background:radial-gradient(720px 560px at 2% 0%,rgba(59,130,246,.42) 0%,rgba(59,130,246,0) 66%),radial-gradient(680px 520px at -4% 100%,rgba(139,92,246,.38) 0%,rgba(139,92,246,0) 68%),radial-gradient(560px 460px at 14% 58%,rgba(34,211,238,.26) 0%,rgba(34,211,238,0) 70%),linear-gradient(135deg,#d8e9ff 0%,#dfdcfb 52%,#cfe7fb 100%);background-attachment:fixed}

/* 内容区透明让出渐变；正文白纸不动 */
[data-theme=glass] #content{background:transparent}
[data-theme=glass] #cbody{background:#fff}
[data-theme=glass] #dtabs{background:transparent}

/* 左目录栏：整块玻璃（移动端抽屉同样生效） */
[data-theme=glass] #tree{background:var(--glFill);backdrop-filter:blur(var(--glBlur)) saturate(1.6);-webkit-backdrop-filter:blur(var(--glBlur)) saturate(1.6);border-right:1px solid var(--glLine);box-shadow:inset -1px 0 0 rgba(255,255,255,.55),2px 0 18px rgba(23,42,77,.05)}

/* 顶栏：玻璃 */
[data-theme=glass] #chead{background:rgba(255,255,255,.42);backdrop-filter:blur(var(--glBlur)) saturate(1.6);-webkit-backdrop-filter:blur(var(--glBlur)) saturate(1.6);border-bottom:1px solid var(--glLine);box-shadow:0 1px 0 rgba(255,255,255,.6)}

/* 浮在最上面的三块：聚焦退出条 / 下拉菜单 / AI 面板 —— 最适合玻璃的地方 */
[data-theme=glass] #fexit{background:rgba(255,255,255,.72);backdrop-filter:blur(16px) saturate(1.6);-webkit-backdrop-filter:blur(16px) saturate(1.6);border-color:var(--glLine);box-shadow:0 6px 22px rgba(23,42,77,.12)}
[data-theme=glass] #mp-main,[data-theme=glass] #mp-v,[data-theme=glass] #mp-x,[data-theme=glass] #mp-m,[data-theme=glass] #nbPal{background:rgba(255,255,255,.80);backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);border:1px solid rgba(255,255,255,.8);box-shadow:0 12px 34px rgba(23,42,77,.14)}
[data-theme=glass] #aipane{background:rgba(255,255,255,.82);backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6);border-left:1px solid var(--glLine)}

/* 树行悬停：垫一层白，玻璃不被灰块打断 */
[data-theme=glass] .tnode:hover{background:rgba(255,255,255,.55)}
[data-theme=glass] .tnode.on{background:#eaf1ff}

/* 会员按钮跟随主色（和其他深色系一个做法） */
[data-theme=glass] #vipBtn.vip-cta{background:#1d4ed8!important;border-color:transparent!important;color:#fff!important}

/* 没有 backdrop-filter：退成 97% 白，绝不透明 */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){[data-theme=glass] #tree,[data-theme=glass] #chead{background:rgba(255,255,255,.97)}}

/* ===== v3.415 玻璃第三版 =====
   为什么加这两条：v3.414 的树栏只剩"一层淡蓝"，因为底色是平滑渐变，模糊它等于什么都没模糊。
   玻璃的"霜感"其实靠两件事：① 表面颗粒 ② 面板边缘的亮线；模糊只是让背后内容变柔。
   所以：给树栏/顶栏铺一层 5% 的颗粒 + 一道纵向冷色洗；再让阅读区变成"浮在玻璃上的白纸"。 */

/* 树栏：冷色洗 + 颗粒（颗粒在表面，不被模糊糊掉，这才是磨砂的手感） */
[data-theme=glass] #tree::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;
  background-image:linear-gradient(180deg,rgba(96,165,250,.10) 0%,rgba(255,255,255,0) 46%,rgba(167,139,250,.10) 100%),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='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
  background-size:auto,140px 140px;opacity:.9}

[data-theme=glass] #tree{box-shadow:inset -1px 0 0 rgba(255,255,255,.65),6px 0 26px rgba(23,42,77,.055)}

/* 顶栏：只加颗粒 + 一条更亮的底边 */
[data-theme=glass] #chead::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;
  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='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");background-size:140px 140px;opacity:.55}


/* 桌面：阅读区是浮在玻璃上的一张白纸（手机不加，屏幕小、别浪费宽度） */
@media (min-width:901px){
  [data-theme=glass] #cbody{margin:0 12px 12px 0;border-radius:12px;
    box-shadow:0 1px 0 rgba(255,255,255,.9),0 14px 40px rgba(23,42,77,.10)}
}

/* v3.416：建层叠上下文，让 z-index:-1 的颗粒只垫在面板背景与内容之间；绝不再去动 #tree 的子元素（v3.415 就是动子元素把目录树压成了 14px）。 */
[data-theme=glass] #tree,[data-theme=glass] #chead{isolation:isolate}

/* ===== v3.418 收尾 =====
   手机端抽屉是整屏覆盖，背后就是正文；34% 白 + 模糊会把正文糊成灰雾（实测能看到残影）。
   手机上把填充提到 88%，只留一点霜感；桌面保持通透。 */
@media (max-width:900px){
  [data-theme=glass] #tree{background:rgba(255,255,255,.88);backdrop-filter:blur(24px) saturate(1.35);-webkit-backdrop-filter:blur(24px) saturate(1.35)}
}

/* 顶部亮边：玻璃被打光的那一道高光 */
[data-theme=glass] #tree{box-shadow:inset -1px 0 0 rgba(255,255,255,.7),inset 0 1px 0 rgba(255,255,255,.9),6px 0 26px rgba(23,42,77,.06)}

/* ===== v3.426 修复：玻璃主题下顶栏菜单被正文压住（字叠字、点不准） =====
   现象：选「玻璃」后点「视图 ▾ / 导出 ▾ / 更多 ▾ / 分享」，菜单里能看到正文大标题、
        搜索框、"Recounted by…" 之类的行压在菜单上面，选项既看不准也点不准。
   原因：#chead 上的 backdrop-filter（和 v3.416 加的 isolation）会给顶栏建立层叠上下文。
        菜单 z-index 虽然写的是 10040，却被锁在顶栏这一层里面；正文区那些普通定位元素
        （相对定位的列表行、搜索框等）在 DOM 里排在顶栏后面，绘制时自然压到了菜单上面。
        这也是为什么把菜单临时挪到 <body> 下就立刻正常。
   做法（只动 glass，其余 11 套主题一字不改）：
        1) 顶栏不再用 backdrop-filter / isolation，恢复成普通相对定位元素，菜单 z-index 重新生效；
        2) 底色从 42% 白提到 78% 白补回"霜感"——顶栏背后是 body 的淡蓝渐变、没有文字，
           少这一层模糊肉眼看不出来；
        3) 顶栏那层颗粒（#chead::after）一起去掉：没有层叠上下文之后，它的 z-index:-1
           会漏到页面背景上去，不如不做。
   其余玻璃规则（左目录栏、阅读区白纸、菜单自身 18px 模糊）全部原样保留。 */
[data-theme=glass] #chead{
  background:rgba(255,255,255,.78)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  isolation:auto!important;
}
[data-theme=glass] #chead::after{display:none!important;content:none!important}

/* ===== v3.426 附带：顶栏下拉菜单不再顶出屏幕 =====
   视图 ▾ 那个面板列完 12 套配色 + 4 组字体一共 884px 高，从顶栏下方（top:36px）往下排，
   1080p 的窗口也就 900~950px 高，底部「常用字体」最后一排会被切在屏幕外，而且面板不能滚——
   选项既看不到也点不到。这里给所有下拉面板一个视口上限 + 内部滚动，滚到哪算哪。
   只作用在桌面（≥901px），手机端是居中的整屏弹层，另有自己的一套，不受影响。 */
@media (min-width:901px){
  .mpanel{
    max-height:calc(100vh - 108px);
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  /* 滚动条细一点，不抢视线；不支持 scrollbar-width 的浏览器走 ::-webkit 那条 */
  .mpanel{scrollbar-width:thin;scrollbar-color:rgba(15,23,42,.28) transparent}
  .mpanel::-webkit-scrollbar{width:8px}
  .mpanel::-webkit-scrollbar-thumb{background:rgba(15,23,42,.22);border-radius:8px}
  .mpanel::-webkit-scrollbar-track{background:transparent}
}