/* ============ 设计令牌（v2.17 苹果毛玻璃设计系统；v2.17.1 起支持亮/暗双主题） ============ */
:root {
  color-scheme: light;
  --bg: #edf1f8;
  --card-bg: rgba(255, 255, 255, .86);          /* 卡片实底（移动端/不支持 blur 时） */
  --card-bg-glass: rgba(255, 255, 255, .66);    /* 卡片玻璃底（@supports blur） */
  --card-border: rgba(255, 255, 255, .65);
  --input-bg: rgba(255, 255, 255, .85);
  --side-bg: rgba(255, 255, 255, .92);          /* 侧栏/顶栏实底 */
  --side-bg-glass: rgba(255, 255, 255, .62);    /* 侧栏/顶栏玻璃底 */
  --chip-bg: rgba(255, 255, 255, .9);           /* 胶囊/白底按钮 */
  --pane-bg: rgba(255, 255, 255, .7);           /* 面板/日历/渠道等次级底 */
  --soft: rgba(105, 113, 138, .10);             /* 中性软填充（点位/胶囊/条） */
  --modal-bg: rgba(255, 255, 255, .96);
  --doc-quote: #46506b;
  --line: rgba(23, 32, 58, .08);
  --line-strong: rgba(23, 32, 58, .14);
  --text: #1b2233; --muted: #69718a;
  --accent: #3478f6; --accent-deep: #2a63d0; --accent-weak: rgba(52, 120, 246, .10);
  --ok: #16a34a; --ok-weak: rgba(22, 163, 74, .11);
  --warn: #e88a0c; --warn-weak: rgba(232, 138, 12, .13);
  --bad: #e5484d; --bad-weak: rgba(229, 72, 77, .11);
  --sidebar-text: #55607a;
  --radius: 18px; --radius-sm: 12px;
  --shadow: 0 8px 30px rgba(30, 42, 80, .08);
  --shadow-sm: 0 2px 10px rgba(30, 42, 80, .06);
  --glass-blur: blur(20px) saturate(170%);
}
/* 暗色主题：html[data-theme="dark"]（v2.17.1 亮/暗切换，localStorage aw-theme 持久化） */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0e1422;
  --card-bg: rgba(24, 31, 50, .84);
  --card-bg-glass: rgba(24, 31, 50, .55);
  --card-border: rgba(255, 255, 255, .08);
  --input-bg: rgba(14, 20, 36, .72);
  --side-bg: rgba(17, 23, 39, .94);
  --side-bg-glass: rgba(17, 23, 39, .6);
  --chip-bg: rgba(24, 31, 50, .85);
  --pane-bg: rgba(20, 27, 45, .6);
  --soft: rgba(255, 255, 255, .08);
  --modal-bg: rgba(22, 28, 46, .97);
  --doc-quote: #a8b3cc;
  --line: rgba(255, 255, 255, .09);
  --line-strong: rgba(255, 255, 255, .17);
  --text: #e7ebf6; --muted: #9aa3bd;
  --accent: #5b93ff; --accent-deep: #3478f6; --accent-weak: rgba(91, 147, 255, .17);
  --ok: #34d399; --ok-weak: rgba(52, 211, 153, .14);
  --warn: #f5a623; --warn-weak: rgba(245, 166, 35, .16);
  --bad: #f2666b; --bad-weak: rgba(242, 102, 107, .15);
  --sidebar-text: #9aa3bd;
  --shadow: 0 8px 30px rgba(0, 0, 0, .42);
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, .3);
}
* { box-sizing: border-box; }
body {
  margin: 0; color: var(--text); font-family: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif; font-size: 14px;
  background: radial-gradient(1100px 560px at 6% -6%, rgba(122, 162, 255, .18), transparent 58%),
              radial-gradient(950px 540px at 104% 6%, rgba(167, 139, 250, .13), transparent 55%),
              linear-gradient(180deg, #f4f7fd, #e9eef8);
  background-attachment: fixed;
}
[data-theme="dark"] body {
  background: radial-gradient(1100px 560px at 6% -6%, rgba(70, 110, 220, .20), transparent 58%),
              radial-gradient(950px 540px at 104% 6%, rgba(130, 100, 230, .14), transparent 55%),
              linear-gradient(180deg, #10162a, #0d1220);
  background-attachment: fixed;
}
a { color: var(--accent); text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; border-radius: var(--radius-sm); touch-action: manipulation; }
input, textarea, select { font-family: inherit; font-size: 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); padding: 9px 12px; background: var(--input-bg); color: var(--text); transition: border-color .15s, box-shadow .15s; }
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-weak); }
input, textarea { -webkit-user-select: text; user-select: text; } /* v2.4.4 显式允许选择/粘贴（部分内核继承 none 时长按不出粘贴菜单） */

/* ============ 布局骨架：玻璃侧栏 + 主区 ============ */
#app { display: flex; min-height: 100vh; }
#sidebar {
  width: 232px; flex: none; color: var(--sidebar-text);
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
  background: var(--side-bg); border-right: 1px solid var(--card-border);
}
@supports (backdrop-filter: blur(1px)) {
  #sidebar { background: var(--side-bg-glass); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); }
}
.brand { color: var(--text); font-size: 17px; font-weight: 700; padding: 22px 20px 6px; display: flex; align-items: center; gap: 10px; }
.brand-logo { width: 38px; height: 38px; border-radius: 10px; object-fit: cover; flex: none; box-shadow: 0 2px 10px rgba(30, 42, 80, .16); }
.brand span { display: block; font-size: 11px; font-weight: 400; color: var(--muted); margin-top: 4px; }
#sidebar nav { padding: 14px 12px; display: flex; flex-direction: column; gap: 4px; }
#sidebar nav a { color: var(--sidebar-text); padding: 10px 13px; border-radius: 12px; font-size: 14px; transition: background .15s, color .15s; }
#sidebar nav a:hover { background: var(--accent-weak); color: var(--text); }
#sidebar nav a.active { background: linear-gradient(135deg, #4b8bff, var(--accent)); color: #fff; box-shadow: 0 4px 14px rgba(52, 120, 246, .32); }
.side-block { margin: auto 14px 14px; background: var(--accent-weak); border: 1px solid rgba(52, 120, 246, .18); border-radius: 14px; padding: 12px 14px; font-size: 12.5px; line-height: 2; }
.side-block b { color: var(--text); font-weight: 600; }
.side-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; }
.side-foot { padding: 0 20px 18px; font-size: 12px; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.side-foot a { color: var(--sidebar-text); cursor: pointer; }
.side-foot a:hover { color: var(--accent); }
#server-hint { opacity: .55; }
#main { flex: 1; min-width: 0; padding: 26px 30px 60px; }
.loading { color: var(--muted); padding: 40px; }

/* 亮/暗切换按钮（v2.17.1）：侧栏底部 chip，移动端与授权徽章同行 */
.theme-toggle { background: var(--soft); color: var(--muted); border: none; border-radius: 999px; padding: 4px 11px; font-size: 12px; cursor: pointer; transition: color .15s, background .15s; }
.theme-toggle:hover { color: var(--accent); }

/* ============ 通用组件 ============ */
.card {
  background: var(--card-bg); border: 1px solid var(--card-border);
  border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px 22px;
}
@supports (backdrop-filter: blur(1px)) {
  .card { background: var(--card-bg-glass); backdrop-filter: blur(16px) saturate(150%); -webkit-backdrop-filter: blur(16px) saturate(150%); }
}
.btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; font-size: 13.5px; background: linear-gradient(135deg, #4b8bff, var(--accent)); color: #fff; border-radius: var(--radius-sm); box-shadow: 0 3px 12px rgba(52, 120, 246, .26); transition: transform .12s, box-shadow .12s, filter .12s; }
.btn:hover { filter: brightness(1.05); transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
/* v2.6.3 禁用态需压过 .btn.ok/.btn.warn（同等优先级时源序靠后的 .btn.ok 会把灰底盖回绿色，禁用看起来仍亮——恒1 实录） */
.btn:disabled, .btn.ok:disabled, .btn.warn:disabled { background: #c3ccdf; box-shadow: none; cursor: not-allowed; transform: none; }
[data-theme="dark"] .btn:disabled, [data-theme="dark"] .btn.ok:disabled, [data-theme="dark"] .btn.warn:disabled { background: #39415a; }
.btn.ghost { background: var(--accent-weak); color: var(--accent); box-shadow: none; }
.btn.ok { background: linear-gradient(135deg, #2fbf6b, var(--ok)); box-shadow: 0 3px 12px rgba(22, 163, 74, .24); }
.btn.warn { background: linear-gradient(135deg, #f5a623, var(--warn)); box-shadow: 0 3px 12px rgba(232, 138, 12, .26); }
.btn.sm { padding: 6px 13px; font-size: 12.5px; }
.btn.plain { background: var(--chip-bg); color: var(--text); border: 1px solid var(--line-strong); box-shadow: none; }
h1.page-title { font-size: 21px; margin: 0 0 4px; font-weight: 700; letter-spacing: .2px; }
.page-sub { color: var(--muted); font-size: 13px; margin: 0 0 20px; }
.row { display: flex; gap: 14px; align-items: center; }
.grid { display: grid; gap: 16px; }
.badge { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; background: var(--accent-weak); color: var(--accent); }
.badge.ok { background: var(--ok-weak); color: var(--ok); }
.badge.warn { background: var(--warn-weak); color: var(--warn); }
.badge.bad { background: var(--bad-weak); color: var(--bad); }
.badge.gray { background: var(--soft); color: var(--muted); }
.muted { color: var(--muted); }

/* ============ 首页：向导 + 文章墙 ============ */
.wizard input { margin-right: 10px; }
.wizard input[name="niche"] { width: 260px; }
.wizard input[name="keywords"] { width: 320px; }
.topic-grid { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); margin-top: 16px; }
.topic-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; background: var(--card-bg); display: flex; flex-direction: column; gap: 8px; box-shadow: var(--shadow-sm); }
.topic-card .t { font-size: 15px; font-weight: 700; line-height: 1.5; }
.score-ring { flex: none; width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; color: #fff; font-size: 15px; }
.article-grid { grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); }
.article-card { display: flex; flex-direction: column; gap: 10px; cursor: pointer; transition: transform .15s, box-shadow .15s; }
.article-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(30, 42, 80, .16); }
.article-card .t { font-weight: 700; font-size: 15px; line-height: 1.5; }

/* ============ 流水线步骤条 ============ */
.stepper { display: flex; align-items: center; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 14px 18px; gap: 0; overflow-x: auto; }
.step { display: flex; align-items: center; gap: 7px; flex: none; }
.step .dot { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; background: var(--soft); color: var(--muted); }
.step.done .dot { background: var(--ok-weak); color: var(--ok); }
.step.active .dot { background: var(--accent); color: #fff; box-shadow: 0 0 0 4px var(--accent-weak); }
.step.running .dot { background: var(--accent-weak); color: var(--accent); }
.step.skip .dot { background: var(--soft); color: #8b93a8; }
.step .lbl { font-size: 13px; color: var(--muted); white-space: nowrap; }
.step.done .lbl, .step.active .lbl { color: var(--text); font-weight: 600; }
.step-arrow { color: #c3cad9; margin: 0 10px; flex: none; }
[data-theme="dark"] .step-arrow { color: #4a5470; }
.stepper::-webkit-scrollbar { height: 4px; }
.stepper::-webkit-scrollbar-thumb { background: var(--soft); border-radius: 999px; }
.stepper::-webkit-scrollbar-track { background: transparent; }
@keyframes spin { to { transform: rotate(360deg); } }
.spin { display: inline-block; animation: spin 1s linear infinite; }

/* ============ 详情页双栏 ============ */
.detail-cols { display: flex; gap: 18px; margin-top: 18px; align-items: flex-start; }
.tabs { display: flex; gap: 6px; background: var(--card-bg); border: 1px solid var(--card-border); border-bottom: none; border-radius: var(--radius) var(--radius) 0 0; box-shadow: var(--shadow-sm); padding: 9px 10px 0; flex-wrap: wrap; }
.tabs button { background: none; color: var(--muted); padding: 9px 15px; font-size: 14px; border-radius: 11px; transition: background .15s, color .15s; }
.tabs button:hover { color: var(--text); }
.tabs button.active { color: #fff; background: linear-gradient(135deg, #4b8bff, var(--accent)); font-weight: 600; box-shadow: 0 3px 10px rgba(52, 120, 246, .28); }
.tab-body { background: var(--card-bg); border: 1px solid var(--card-border); border-top: none; border-radius: 0 var(--radius) var(--radius) var(--radius); box-shadow: var(--shadow-sm); padding: 22px 26px; min-height: 300px; }
.detail-left { flex: 1; min-width: 0; }
.detail-right { width: 300px; flex: none; display: flex; flex-direction: column; gap: 14px; }
.action-card .btn { width: 100%; justify-content: center; margin-bottom: 9px; }
.log-box { background: #121828; color: #c7d0e0; border: 1px solid rgba(255, 255, 255, .07); border-radius: 14px; padding: 12px 14px; font-size: 12.5px; line-height: 1.8; max-height: 260px; overflow-y: auto; font-family: Consolas, monospace; }
.log-box .ok { color: #7ee2a0; }
.log-box .err { color: #ff9c9c; }

/* ============ 文档渲染 / 表格 / 图片 ============ */
.doc { line-height: 2; font-size: 15px; }
.doc h1 { font-size: 21px; } .doc h2 { font-size: 17px; margin-top: 26px; border-left: 3px solid var(--accent); padding-left: 10px; } .doc h3 { font-size: 15.5px; }
.doc blockquote { margin: 10px 0; padding: 10px 16px; background: var(--accent-weak); border-left: 3px solid var(--accent); border-radius: 0 12px 12px 0; color: var(--doc-quote); }
.doc img { max-width: 100%; border-radius: 12px; }
.doc pre { background: #121828; color: #e7ecf5; padding: 14px; border-radius: 12px; overflow-x: auto; font-size: 13px; }
table.data { width: 100%; border-collapse: collapse; font-size: 13.5px; }
table.data th, table.data td { text-align: left; padding: 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
table.data th { color: var(--muted); font-weight: 600; white-space: nowrap; }
table.data tr:last-child td { border-bottom: none; }
.img-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.img-grid figure { margin: 0; }
.img-grid img { width: 100%; border-radius: 14px; display: block; box-shadow: var(--shadow-sm); }
.img-grid figcaption { font-size: 12px; color: var(--muted); margin-top: 6px; }
.preview-frame { width: 100%; height: 640px; border: 1px solid var(--line); border-radius: 14px; background: var(--pane-bg); }
textarea.editor { width: 100%; min-height: 380px; font-family: Consolas, monospace; font-size: 13px; line-height: 1.8; }

/* ============ 发布渠道卡 ============ */
.channel-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.channel { border: 1px solid var(--line); border-radius: 16px; padding: 16px 18px; background: var(--pane-bg); }
.channel .name { font-weight: 700; font-size: 15px; margin-bottom: 6px; }
.channel p { margin: 6px 0 12px; font-size: 12.5px; color: var(--muted); line-height: 1.7; }

/* ============ 标题候选 chips ============ */
.title-opts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.title-chip { border: 1px solid var(--line-strong); background: var(--chip-bg); border-radius: 999px; padding: 6px 14px; font-size: 13px; cursor: pointer; transition: border-color .15s, color .15s, background .15s; }
.title-chip:hover { border-color: var(--accent); color: var(--accent); }
.title-chip.current { background: var(--accent-weak); border-color: var(--accent); color: var(--accent); }

/* ============ v2.18.0 对话改大纲气泡（纯令牌，暗色自适应） ============ */
.oc-log { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow-y: auto; }
.oc-line { display: flex; }
.oc-line.me { justify-content: flex-end; }
.oc-bubble { max-width: 86%; padding: 8px 13px; border-radius: 14px; font-size: 13px; line-height: 1.65; white-space: pre-wrap; word-break: break-word; }
.oc-line.me .oc-bubble { background: linear-gradient(135deg, #4b8bff, var(--accent)); color: #fff; border-bottom-right-radius: 5px; }
.oc-line.ai .oc-bubble { background: var(--pane-bg); border: 1px solid var(--line); color: var(--text); border-bottom-left-radius: 5px; }

/* ============ 设置中心 ============ */
.settings-grid { grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); }
.set-card { display: flex; flex-direction: column; }
.set-head { font-weight: 700; font-size: 15px; margin-bottom: 12px; }
.form-row { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.form-row label { width: 90px; flex: none; font-size: 13px; color: var(--muted); }
.form-row input:not([type="checkbox"]), .form-row select, .form-row textarea { flex: 1; width: auto; }
.form-row input[type="checkbox"] { width: 18px; height: 18px; }
.set-card .hint { font-size: 12px; color: var(--muted); margin: 4px 0 0 100px; line-height: 1.6; }
.set-card .btns { display: flex; gap: 10px; margin-top: 14px; align-items: center; }
.test-out { font-size: 12.5px; margin-top: 8px; min-height: 18px; }
.test-out.ok { color: var(--ok); }
.test-out.err { color: var(--bad); }
.btn-space { width: 8px; }
.sel { padding: 9px 12px; }
.rev-item { border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; margin: 10px 0; background: var(--pane-bg); }
.rev-orig, .rev-new { margin: 4px 0; font-size: 13.5px; line-height: 1.7; }
.split-editor { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.prev-pane { border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; min-height: 480px; max-height: 720px; overflow-y: auto; background: var(--pane-bg); }
@media (max-width: 1100px) { .split-editor { grid-template-columns: 1fr; } }

/* ============ v1.0 激活 / 日历 / 体检 ============ */
.activate-wrap { display: flex; justify-content: center; padding-top: 6vh; }
.activate-card { width: 560px; max-width: 94vw; }
.activate-card textarea { font-family: Consolas, monospace; font-size: 12px; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-top: 12px; }
.cal-h { text-align: center; color: var(--muted); font-size: 12px; }
.cal-day { min-height: 56px; border: 1px solid var(--line); border-radius: 12px; padding: 6px; font-size: 12px; background: var(--pane-bg); }
.cal-day.has { background: var(--accent-weak); border-color: rgba(52, 120, 246, .45); }
.cal-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); display: inline-block; margin: 2px 2px 0 0; }

/* ============ Toast / Modal / 任务面板 ============ */
#toast-box { position: fixed; top: 18px; right: 18px; z-index: 60; display: flex; flex-direction: column; gap: 8px; }
.toast { background: rgba(28, 33, 50, .92); color: #fff; padding: 11px 18px; border-radius: 14px; font-size: 13.5px; box-shadow: 0 8px 26px rgba(10, 15, 30, .3); }
.toast.err { background: rgba(206, 60, 64, .95); }
/* v2.17.2 全屏遮罩禁用 backdrop-filter：X5 对「全屏 fixed+blur」有合成层 bug——弹窗整层不渲染（用户视角=点了没反应）
   且 z-50 全屏拦截后续所有点击（周燕「自动完成剩余点不动」实录）。纯色压暗即可，毛玻璃观感由弹窗本体保持 */
#modal-box { position: fixed; inset: 0; z-index: 50; display: none; align-items: center; justify-content: center; background: rgba(15, 22, 40, .5); }
#modal-box.show { display: flex; }
[data-theme="dark"] #modal-box { background: rgba(2, 6, 16, .6); }
/* 内容可能很长（完整方法论等）：限制高度并可滚动，否则上下溢出显示不全 */
.modal { background: var(--modal-bg); border: 1px solid var(--card-border); border-radius: 20px; padding: 24px 26px; width: 460px; max-width: 92vw; max-height: 86vh; overflow-y: auto; box-shadow: 0 18px 50px rgba(5, 10, 25, .3); }
.modal h3 { margin: 0 0 10px; }
.modal .btns { display: flex; gap: 10px; justify-content: flex-end; margin-top: 20px; }
#job-panel { position: fixed; right: 18px; bottom: 18px; z-index: 40; width: 360px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 18px; box-shadow: 0 14px 40px rgba(10, 18, 40, .24); padding: 16px 18px; }
#job-panel.hidden { display: none; }
#job-panel .stage { font-weight: 700; margin-bottom: 6px; }
#job-panel .bar { height: 6px; border-radius: 999px; background: var(--soft); overflow: hidden; margin: 10px 0; }
#job-panel .bar i { display: block; height: 100%; width: 40%; background: linear-gradient(90deg, #4b8bff, var(--accent)); border-radius: 999px; animation: slide 1.2s ease-in-out infinite alternate; }
/* v2.6.3 任务浮层「收起/隐藏」小按钮 */
.job-mini { background: var(--soft); color: var(--muted); border: none; border-radius: 8px; padding: 5px 10px; font-size: 12px; cursor: pointer; flex: none; font-weight: 400; }
.job-mini:active { background: var(--line-strong); }
/* v2.6.4 文章卡片删除按钮（低调文案式，误触有二次确认兜底） */
.art-del { background: none; border: none; color: var(--muted); font-size: 12px; padding: 4px 8px; cursor: pointer; }
.art-del:active { color: var(--bad); }
@keyframes slide { from { margin-left: 0; } to { margin-left: 60%; } }
@media (max-width: 1080px) { .detail-cols { flex-direction: column; } .detail-right { width: 100%; } }

/* v2.2.1 风格包选择行：label 横排不挤压 */
.form-row.col { flex-direction: column; align-items: flex-start; width: 100%; }
.form-row.col label { width: 100%; white-space: normal; }
.form-row.col select { width: 100%; max-width: 520px; }

/* ============ v2.4 手机适配（微信内打开为主场景；v2.17 玻璃化重排） ============ */
@media (max-width: 760px) {
  /* 布局：侧栏变玻璃顶栏（品牌行+胶囊导航+账号徽章），主区满宽 */
  #app { flex-direction: column; }
  #sidebar { position: sticky; top: 0; z-index: 30; width: 100%; height: auto; flex-direction: column; background: var(--side-bg); border-right: none; box-shadow: 0 2px 14px rgba(10, 18, 40, .12); }
  @supports (backdrop-filter: blur(1px)) {
    #sidebar { background: var(--side-bg-glass); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); }
  }
  .brand { padding: 10px 14px 2px; font-size: 19px; } /* v2.9.1 center 对齐与大字号保留 */
  .brand span { display: none; } /* v2.17 手机收起副标题，顶栏更清爽 */
  .brand-logo { width: 30px; height: 30px; }
  #sidebar nav { flex-direction: row; overflow-x: auto; padding: 7px 10px; gap: 6px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  #sidebar nav::-webkit-scrollbar { display: none; }
  #sidebar nav a { white-space: nowrap; padding: 7px 13px; font-size: 13px; flex: none; border-radius: 999px; background: var(--soft); color: var(--sidebar-text); box-shadow: none; }
  #sidebar nav a.active { background: linear-gradient(135deg, #4b8bff, var(--accent)); color: #fff; box-shadow: 0 2px 8px rgba(52, 120, 246, .3); }
  .side-block, #server-hint, .side-foot a#open-workspace { display: none; } /* 侧栏底部信息块手机上收起 */
  .side-foot { display: block; padding: 0 14px 9px; } /* 账号/积分徽章保留（入口在主区之上） */
  .side-foot a#license-badge { display: inline-block; color: var(--text); font-size: 12px; background: var(--soft); border-radius: 999px; padding: 4px 11px; }
  .side-foot .theme-toggle { display: inline-block; margin-left: 6px; }
  #main { padding: 13px 12px 80px; }
  /* v2.17 手机卡片：高不透明度玻璃（不开 blur——低端机大量卡片 blur 会掉帧），统一圆角与间距 */
  .card { padding: 15px 15px; border-radius: 16px; background: var(--card-bg); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .page-title, h1.page-title { font-size: 19px; }
  h1 { font-size: 18px; }

  /* 表单与按钮：满宽、可点面积大 */
  .form-row { flex-direction: column !important; align-items: stretch !important; gap: 4px !important; }
  .form-row label { width: 100% !important; margin: 0; }
  .form-row input, .form-row select, .form-row textarea { width: 100% !important; }
  .btns { flex-wrap: wrap; }
  .btn { padding: 10px 14px; font-size: 13px; }
  .btn.sm { padding: 9px 12px; }
  .row { flex-wrap: wrap; }

  /* 数据表格：横向滚动（保留结构，避免压扁） */
  .card { overflow-x: auto; }
  .set-card { overflow-x: visible; } /* v2.4.4 设置卡只有表单，不做横向滚动容器——微信 X5 内核下滚动容器会吞掉输入框的点按（用户实测：AppID/Secret 点不弹键盘） */
  table.data { min-width: 560px; }

  /* 网格全部单列 */
  .grid, .settings-grid { grid-template-columns: 1fr !important; gap: 12px; }
  .detail-cols { flex-direction: column !important; }
  .detail-left { min-width: 0; max-width: 100%; } /* flex 子项默认 min-width:auto，会被 560px 大纲表格撑破整页（2026-10-01 用户截图实录） */
  .tab-body { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 0 0 16px 16px; } /* 宽表格在产物区内横向滚动，不再顶破页面 */
  .tabs { border-radius: 16px 16px 0 0; }
  .tabs button.active { color: #fff; }
  .detail-right { width: 100% !important; }
  .split-editor { grid-template-columns: 1fr; }

  /* 登录/激活卡满宽 */
  .activate-wrap { padding-top: 3vh; }
  .activate-card { width: 100%; max-width: 100%; }

  /* 任务面板/弹窗满宽 */
  #job-panel { right: 10px; left: 10px; width: auto; bottom: 10px; }
  #toast-box { left: 12px; right: 12px; top: 10px; }
  .modal { width: 94vw; padding: 18px 16px; }

  /* 日历格子收缩 */
  .cal-day { min-height: 44px; padding: 4px; font-size: 11px; }

  /* 文章页 tabs 横向滚动 */
  .tabs { overflow-x: auto; scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs button, .tabs a { white-space: nowrap; flex: none; }
}
/* 超窄屏（<380px）：导航字号再收 */
@media (max-width: 380px) {
  #sidebar nav a { padding: 6px 11px; font-size: 12.5px; }
  .brand { font-size: 17px; }
}

/* ============ v2.9 主页（#/dash）+ 导航计数徽章 ============ */
.nav-n { display: inline-block; min-width: 17px; padding: 0 5px; margin-left: 6px; border-radius: 999px; background: var(--accent-weak); color: var(--accent); font-size: 11px; line-height: 17px; text-align: center; vertical-align: 1px; font-weight: 600; }
#sidebar nav a.active .nav-n { background: rgba(255, 255, 255, .28); color: #fff; }
.nav-dot { display: none; width: 8px; height: 8px; border-radius: 50%; background: #f59e0b; margin-left: 5px; vertical-align: 2px; }
.nav-dot.on { display: inline-block; animation: navdot 1.2s ease-in-out infinite; }
@keyframes navdot { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.side-stats { padding: 10px 14px 2px; font-size: 12.5px; color: var(--sidebar-text); opacity: .92; }
.side-stats b { color: var(--text); font-size: 15px; }
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; margin: 14px 0 4px; }
.stat-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 16px; padding: 15px 17px; min-width: 0; box-shadow: var(--shadow-sm); }
.stat-card .n { font-size: 26px; font-weight: 700; line-height: 1.25; }
.stat-card .l { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.stat-card .s { font-size: 12px; color: var(--muted); margin-top: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stat-card.vip { background: linear-gradient(135deg, #fff8ea, #ffefd0); border-color: #f3e0ac; }
[data-theme="dark"] .stat-card.vip { background: linear-gradient(135deg, #2b2416, #221b0e); border-color: #4a3d1e; }
[data-theme="dark"] .stat-card.vip .n { color: #ffd98a; }
.qa-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.qa { display: inline-block; padding: 8px 15px; border-radius: 999px; background: var(--chip-bg); border: 1px solid var(--line); font-size: 13px; text-decoration: none; cursor: pointer; color: inherit; box-shadow: var(--shadow-sm); transition: border-color .15s, color .15s, transform .12s; }
.qa:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-1px); }
.todo-list { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.todo-row { display: flex; align-items: center; gap: 10px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 14px; cursor: pointer; background: var(--pane-bg); transition: border-color .15s; }
.todo-row:hover { border-color: rgba(52, 120, 246, .5); }
.todo-row .t { flex: 1; min-width: 0; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.todo-row .btn { flex: none; }
.todo-row .badge { flex: none; }
@media (max-width: 760px) {
  .side-stats { display: none; } /* 手机顶栏不放统计（积分徽章已在顶栏） */
  .stat-grid { grid-template-columns: repeat(2, 1fr); gap: 9px; }
  .stat-card { padding: 11px 13px; border-radius: 14px; }
  .stat-card .n { font-size: 20px; }
  .stat-card .s { white-space: normal; }
  .qa { padding: 7px 12px; font-size: 12.5px; }
}


/* v2.9.6 排版主题选择卡：缩略图+名字并排点选 */
.theme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 10px; }
.theme-card { border: 1px solid var(--line-strong); border-radius: 14px; background: var(--chip-bg); padding: 6px 6px 5px; cursor: pointer; display: flex; flex-direction: column; gap: 5px; align-items: stretch; font: inherit; color: inherit; }
.theme-card:hover { border-color: var(--accent); }
.theme-card.active { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-weak); }
.theme-card svg { width: 100%; height: auto; display: block; border-radius: 8px; border: 1px solid var(--line); background: #fff; }
.theme-card .tn { font-size: 12px; text-align: center; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* v2.10.1 主页"进行中任务"卡可点击直达文章详情 */
.stat-card.clickable { cursor: pointer; transition: transform .12s ease, box-shadow .12s ease; }
.stat-card.clickable:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(30, 42, 80, .16); }