/* =========================================================================
 * 产品数据库 · 开发部门 · 站点外壳
 * 左侧导航 + 顶部筛选条 + 独立页面专做各自内容
 * 配色：浅色墨蓝灰 / 深色黑粉（沿用原站 token，不换风格）
 * ========================================================================= */

/* ========== 主题变量 ========== */
:root,
[data-theme="light"]{
  --bg:#F4F6FA; --bg-elev:#FFFFFF; --bg-grid:#E8ECF3;
  --panel:#FFFFFF; --panel-soft:#EEF1F7; --panel-deep:#DDE3EC;
  --ink:#0F1822; --ink2:#4A5566; --ink3:#8A95A5;
  --line:#DCE0E8; --line-soft:#E8ECF2;
  --accent:#0F1822; --accent-deep:#060D17; --accent-soft:#DCE3EC;
  --grad-main:linear-gradient(135deg,#2A3140 0%,#0F1822 100%);
  --good:#3F8A5B; --warn:#B07A30; --bad:#B05050; --purple:#6B5AA5;
  --shadow-sm:0 1px 2px rgba(15,24,34,.04),0 2px 6px rgba(15,24,34,.06);
  --shadow:0 2px 8px rgba(15,24,34,.08),0 8px 22px rgba(15,24,34,.10);
  --shadow-lg:0 2px 6px rgba(15,24,34,.06),0 16px 38px rgba(15,24,34,.16);
  --t-hot-bg:rgba(176,122,48,.12); --t-hot-fg:#8A6323; --t-hot-bd:rgba(176,122,48,.28);
  --t-rival-bg:#E8ECF3; --t-rival-fg:#2A3140; --t-rival-bd:#D2D8E2;
  --t-own-bg:#EEF1F7; --t-own-fg:#0F1822; --t-own-bd:#D8DDE6;
  --t-issue-bg:rgba(176,80,80,.10); --t-issue-fg:#B05050; --t-issue-bd:rgba(176,80,80,.26);
  --t-demand-bg:rgba(63,138,91,.12); --t-demand-fg:#3F8A5B; --t-demand-bd:rgba(63,138,91,.26);
  --t-review-bg:rgba(107,90,165,.12); --t-review-fg:#6B5AA5; --t-review-bd:rgba(107,90,165,.26);
  --radius:14px; --radius-sm:10px; --pill:999px;
}
[data-theme="dark"]{
  --bg:#1F1F25; --bg-elev:#262630; --bg-grid:#161619;
  --panel:#272730; --panel-soft:#2E2E38; --panel-deep:#36363F;
  --ink:#F0F0F2; --ink2:#B5B5BD; --ink3:#75757F;
  --line:#2F2F38; --line-soft:#282830;
  --accent:#D4859A; --accent-deep:#B86A82; --accent-soft:#2A2128;
  --grad-main:linear-gradient(135deg,#E5A0B0 0%,#D4859A 50%,#B86A82 100%);
  --good:#7DD49C; --warn:#E8B07A; --bad:#E89090; --purple:#AA96E6;
  --shadow-sm:0 1px 2px rgba(0,0,0,.35),0 2px 6px rgba(0,0,0,.40);
  --shadow:0 2px 8px rgba(0,0,0,.42),0 8px 22px rgba(0,0,0,.48);
  --shadow-lg:0 2px 6px rgba(0,0,0,.45),0 16px 38px rgba(0,0,0,.55);
  --t-hot-bg:rgba(232,176,122,.14); --t-hot-fg:#E8B07A; --t-hot-bd:rgba(232,176,122,.30);
  --t-rival-bg:#2D2D36; --t-rival-fg:#B5B5BD; --t-rival-bd:#353540;
  --t-own-bg:rgba(212,133,154,.14); --t-own-fg:#E5A0B0; --t-own-bd:rgba(212,133,154,.30);
  --t-issue-bg:rgba(232,144,144,.14); --t-issue-fg:#E89090; --t-issue-bd:rgba(232,144,144,.30);
  --t-demand-bg:rgba(125,212,156,.14); --t-demand-fg:#7DD49C; --t-demand-bd:rgba(125,212,156,.30);
  --t-review-bg:rgba(170,150,230,.14); --t-review-fg:#AA96E6; --t-review-bd:rgba(170,150,230,.30);
}

/* ========== 基础 ========== */
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{
  font-family:"Source Han Sans CN","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  font-weight:500;font-size:14px;line-height:1.5;color:var(--ink);
  background:var(--bg);background-image:radial-gradient(120% 120% at 0% 0%,rgba(15,24,34,.05) 0%,transparent 55%);
  background-attachment:fixed;transition:background-color .3s,color .3s;
}
[data-theme="dark"] body{background-image:radial-gradient(120% 120% at 0% 0%,rgba(212,133,154,.10) 0%,transparent 55%)}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit}
a{text-decoration:none;color:inherit}
.hidden{display:none !important}

/* ========== 外壳 ========== */
.app-shell{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:100vh}

/* ---------- 左侧导航 ---------- */
.sidenav{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;overflow-y:auto}
.sn-brand{display:flex;align-items:center;gap:11px;padding:17px 16px 15px;border-bottom:1px solid var(--line-soft)}
.sn-logo{width:34px;height:34px;border-radius:10px;background:var(--grad-main);color:#fff;display:flex;
  align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 12px rgba(15,24,34,.20)}
[data-theme="dark"] .sn-logo{color:#241a20}
.sn-name{font-size:15px;font-weight:700;line-height:1.2;letter-spacing:.2px}
.sn-sub{font-size:10.5px;color:var(--ink3);margin-top:3px;letter-spacing:.3px}
.sn-grp{padding:14px 10px 4px}
.sn-grp-t{font-size:10px;font-weight:700;color:var(--ink3);letter-spacing:1.5px;padding:0 8px 8px}
.sn-list{display:flex;flex-direction:column;gap:3px}
.sn-item{display:flex;align-items:center;gap:10px;border:0;background:transparent;color:var(--ink2);
  font-size:13.5px;font-weight:600;padding:10px 11px;border-radius:10px;text-align:left;
  transition:background .16s,color .16s,box-shadow .16s;position:relative;width:100%}
.sn-item:hover{background:var(--panel-soft);color:var(--ink)}
.sn-item.on{background:var(--grad-main);color:#fff;box-shadow:0 5px 14px rgba(15,24,34,.18)}
[data-theme="dark"] .sn-item.on{color:#241a20}
.sn-item.on .sn-n{background:rgba(255,255,255,.20);color:inherit;border-color:transparent}
.sn-ic{width:18px;height:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.92}
.sn-tx{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sn-n{font-size:10.5px;font-weight:700;font-variant-numeric:tabular-nums;padding:1px 7px;border-radius:var(--pill);
  background:var(--panel-soft);color:var(--ink3);border:1px solid var(--line-soft);flex-shrink:0}
.sn-foot{margin-top:auto;padding:12px 10px 14px;border-top:1px solid var(--line-soft);display:flex;flex-direction:column;gap:8px}
.sn-theme{display:flex;background:var(--panel-soft);border:1px solid var(--line);border-radius:var(--pill);padding:3px}
.sn-theme button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:5px;border:0;background:transparent;color:var(--ink3);font-size:11.5px;font-weight:600;padding:5px 0;border-radius:var(--pill);transition:all .16s;white-space:nowrap}
.sn-theme button svg{flex-shrink:0;display:block}
.sn-theme button.on{background:var(--panel);color:var(--ink);box-shadow:var(--shadow-sm)}

/* 左下角账号按钮 + 可收起面板 */
.sn-account{position:relative}
.acct-btn{display:flex;align-items:center;gap:7px;width:100%;border:1px solid var(--line);background:var(--panel-soft);
  color:var(--ink2);border-radius:10px;padding:8px 9px;font-size:12px;font-weight:600;text-align:left;transition:all .16s}
.acct-btn:hover{border-color:var(--ink3);color:var(--ink)}
.sn-account.open .acct-btn{border-color:var(--ink3);color:var(--ink);background:var(--panel)}
.acct-ic{display:flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.9}
.acct-dot{width:6px;height:6px;border-radius:50%;background:var(--ink3);flex-shrink:0;opacity:.7}
.acct-dot.on{background:var(--good);opacity:1}
.acct-tx{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11.5px}
.acct-cv{display:flex;align-items:center;flex-shrink:0;color:var(--ink3);transition:transform .18s}
.sn-account.open .acct-cv{transform:rotate(180deg)}
.acct-pop{position:absolute;left:0;right:0;bottom:calc(100% + 7px);background:var(--panel);border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--shadow-lg);padding:11px;opacity:0;transform:translateY(6px);
  pointer-events:none;transition:opacity .18s,transform .18s;z-index:6}
.sn-account.open .acct-pop{opacity:1;transform:translateY(0);pointer-events:auto}
.ap-h{font-size:10px;font-weight:700;color:var(--ink3);letter-spacing:1px;margin-bottom:5px}
.ap-mail{font-size:11.5px;color:var(--ink2);line-height:1.55;margin-bottom:9px;word-break:break-all}
.ap-btn{display:block;width:100%;border:0;background:var(--grad-main);color:#fff;font-size:12px;font-weight:700;padding:8px;border-radius:8px}
[data-theme="dark"] .ap-btn{color:#241a20}
.ap-btn.ghost{background:transparent;border:1px solid var(--line);color:var(--ink2);margin-top:6px}
.ap-btn.ghost:hover{border-color:var(--ink3);color:var(--ink)}

/* ---------- 页面区 ---------- */
.page{min-width:0;display:flex;flex-direction:column;padding-bottom:40px}

.pg-head{padding:20px 26px 0}
.pg-crumb{font-size:11px;color:var(--ink3);letter-spacing:.3px;margin-bottom:7px}
.pg-crumb b{color:var(--ink2);font-weight:600}
.pg-title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.pg-title{font-size:23px;font-weight:800;letter-spacing:-.3px;display:flex;align-items:center;gap:9px}
.pg-title .dot{width:7px;height:7px;border-radius:50%;background:var(--ink);display:inline-block;flex-shrink:0}
.pg-desc{font-size:12.5px;color:var(--ink2);margin-top:6px;max-width:660px;line-height:1.6}
.pg-head-acts{display:flex;align-items:center;gap:9px}

/* ---------- 顶部筛选条 ---------- */
.filterbar{position:sticky;top:0;z-index:20;margin-top:14px;padding:11px 26px;
  background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);
  border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
@supports not (background:color-mix(in srgb,#fff 50%,transparent)){
  .filterbar{background:var(--bg)}
}
.fb-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sbox{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius-sm);padding:7px 11px;width:268px;color:var(--ink3);box-shadow:var(--shadow-sm);flex-shrink:0}
.sbox input{border:0;background:transparent;outline:none;color:var(--ink);font-size:13px;width:100%}
.fb-hint{font-size:11.5px;color:var(--ink3);white-space:nowrap}
.fb-clear{margin-left:auto;border:1px solid var(--line);background:var(--panel);color:var(--ink3);
  font-size:11.5px;font-weight:600;padding:6px 12px;border-radius:var(--pill);white-space:nowrap}
.fb-clear:hover{border-color:var(--bad);color:var(--bad)}
.fb-clear:disabled{opacity:.4;cursor:default}
.fb-clear:disabled:hover{border-color:var(--line);color:var(--ink3)}

.fb-groups{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-top:9px}
.fb-g{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.fb-g-t{font-size:10.5px;font-weight:700;color:var(--ink3);letter-spacing:.5px;padding-right:1px}
.chip{border:1px solid var(--line);background:var(--panel);color:var(--ink2);font-size:11.5px;font-weight:600;
  padding:3px 9px;border-radius:var(--pill);display:inline-flex;align-items:center;gap:5px;transition:all .15s;white-space:nowrap}
.chip i{font-style:normal;font-size:9.5px;font-weight:700;color:var(--ink3);opacity:.9}
.chip:hover{border-color:var(--ink3)}
.chip.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.chip.on i{color:inherit;opacity:.75}
[data-theme="dark"] .chip.on{color:#241a20}

/* ---------- 视角切换（板块内二级分类） ---------- */
.views{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:14px 26px 0}
.views .vw-cap{font-size:10.5px;font-weight:700;color:var(--ink3);letter-spacing:1px;margin-right:2px}
.vw{border:1px solid var(--line);background:var(--panel);color:var(--ink2);font-size:12px;font-weight:600;
  padding:5px 12px;border-radius:var(--pill);display:inline-flex;align-items:center;gap:6px;transition:all .15s}
.vw i{font-style:normal;font-size:10px;font-weight:700;color:var(--ink3)}
.vw:hover{border-color:var(--ink3);color:var(--ink)}
.vw.on{background:var(--grad-main);color:#fff;border-color:transparent;box-shadow:0 3px 10px rgba(15,24,34,.16)}
.vw.on i{color:inherit;opacity:.75}
[data-theme="dark"] .vw.on{color:#241a20}

/* ---------- 排序下拉 ---------- */
.sel{border:1px solid var(--line);background:var(--panel);color:var(--ink2);font-size:12px;font-weight:600;
  padding:8px 10px;border-radius:var(--radius-sm);outline:none;cursor:pointer}
.sel:hover{border-color:var(--ink3);color:var(--ink)}
.sel:focus{border-color:var(--ink3)}

/* ---------- 页脚板块流转 ---------- */
.pgnext{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:26px 0 6px}
.pgnext a{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);
  border-radius:12px;padding:12px 14px;box-shadow:var(--shadow-sm);transition:all .16s}
.pgnext a:hover{border-color:var(--ink3);box-shadow:var(--shadow);transform:translateY(-1px)}
.pgnext a.next{justify-content:flex-end;text-align:right}
.pgnext .nx-k{font-size:10px;color:var(--ink3);letter-spacing:.6px}
.pgnext .nx-n{font-size:13px;font-weight:700;color:var(--ink)}
.pgnext .nx-a{color:var(--ink3);font-size:14px;flex-shrink:0}
.pgnext a.only{grid-column:1/-1}
@media(max-width:640px){.pgnext{grid-template-columns:1fr}.pgnext a.next{justify-content:flex-start;text-align:left}}

/* ---------- 专属区容器：每个页面自己设计，这里是统一的外框 ---------- */
.extra{padding:16px 26px 0;display:grid;gap:12px}
.ex-cell{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:14px 16px;min-width:0}
.ex-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:11px}
.ex-t{font-size:12.5px;font-weight:700;color:var(--ink);letter-spacing:.2px}
.ex-s{font-size:10.5px;color:var(--ink3)}

/* 通用迷你条形 */
.bars{display:flex;flex-direction:column;gap:9px}
.bar-row{display:grid;grid-template-columns:110px 1fr 42px;align-items:center;gap:10px;font-size:11.5px}
.bar-row .bl{color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-track{height:7px;background:var(--panel-soft);border-radius:var(--pill);overflow:hidden}
.bar-fill{height:100%;border-radius:var(--pill);background:var(--accent);min-width:2px;transition:width .4s}
.bar-row .bv{color:var(--ink3);font-variant-numeric:tabular-nums;text-align:right;font-weight:600}
[data-theme="dark"] .bar-fill{background:var(--accent)}
.bar-fill.warn{background:var(--warn)}
.bar-fill.bad{background:var(--bad)}
.bar-fill.good{background:var(--good)}
.bar-fill.purple{background:var(--purple)}

/* 覆盖对照（热销 × 自有） */
.cov{display:flex;flex-direction:column;gap:6px}
.cov-row{display:grid;grid-template-columns:1fr 78px 78px 56px;align-items:center;gap:8px;font-size:11.5px;
  padding:7px 10px;background:var(--panel-soft);border:1px solid var(--line-soft);border-radius:8px}
.cov-row .cn{font-weight:700;color:var(--ink)}
.cov-row .cv{color:var(--ink3);text-align:right;font-variant-numeric:tabular-nums}
.cov-row .cb{font-size:10px;font-weight:700;text-align:center;padding:2px 0;border-radius:5px}
.cov-row .cb.ok{background:rgba(63,138,91,.14);color:var(--good)}
.cov-row .cb.gap{background:rgba(176,80,80,.12);color:var(--bad)}

/* 双色对照条（竞品 vs 自有） */
.duo{display:flex;flex-direction:column;gap:8px}
.duo-row{display:grid;grid-template-columns:78px 1fr 90px;align-items:center;gap:10px;font-size:11.5px}
.duo-row .bl{color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.duo-row .bv{color:var(--ink3);text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.duo-bars{display:flex;flex-direction:column;gap:3px;min-width:0}
.duo-track{height:6px;border-radius:3px;overflow:hidden;background:var(--panel-deep);
  box-shadow:inset 0 0 0 1px var(--line-soft)}
.duo-a{height:100%;border-radius:3px;background:var(--accent);min-width:2px}
.duo-b{height:100%;border-radius:3px;min-width:2px;
  background:repeating-linear-gradient(135deg,var(--ink2) 0 3px,transparent 3px 7px)}
.duo-legend{display:flex;gap:16px;font-size:10.5px;color:var(--ink3);margin-top:10px}
.duo-legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.duo-legend i.stripe{background:repeating-linear-gradient(135deg,var(--ink2) 0 3px,transparent 3px 7px)}

/* 试穿结论簿 */
.tcase{display:flex;flex-direction:column;gap:7px}
.tc{background:var(--panel-soft);border:1px solid var(--line-soft);border-radius:9px;padding:9px 11px;cursor:pointer}
.tc:hover{border-color:var(--ink3)}
.tc-h{display:flex;align-items:center;gap:8px;font-size:12.5px}
.tc-h b{color:var(--ink)}
.tc-m{font-size:10.5px;color:var(--ink3);margin-top:3px}
.tc-n{font-size:11.5px;color:var(--ink2);margin-top:5px;line-height:1.6;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* 两栏分析（品控） */
.is-two{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
@media(max-width:1080px){.is-two{grid-template-columns:1fr}}

/* 好坏分开看（复盘） */
.rk2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rk2-col{background:var(--panel-soft);border:1px solid var(--line-soft);border-radius:10px;padding:11px 12px}
.rk2-t{font-size:11px;font-weight:700;margin-bottom:4px;letter-spacing:.3px}
.rk2-t.good{color:var(--good)}
.rk2-t.bad{color:var(--bad)}
.rk2 ul{list-style:none}
.rk2 li{font-size:11.5px;color:var(--ink2);padding:7px 0;border-top:1px dashed var(--line-soft);line-height:1.6;cursor:pointer}
.rk2 li:first-child{border-top:0;padding-top:2px}
.rk2 li b{color:var(--ink)}
.rk2 li:hover b{text-decoration:underline}
@media(max-width:760px){.rk2{grid-template-columns:1fr}}

/* 通用引导空态 */
.ex-empty{font-size:11.5px;color:var(--ink3);line-height:1.85;padding:10px 0 4px}
.ex-empty b{display:block;color:var(--ink2);font-size:12.5px;margin-bottom:3px;font-weight:700}

/* ---------- 工具条 ---------- */
.toolbar{display:flex;align-items:center;gap:10px;padding:16px 26px 0;flex-wrap:wrap}
.seg{display:inline-flex;background:var(--panel-soft);border:1px solid var(--line);border-radius:var(--radius-sm);padding:3px;gap:2px}
.seg button{border:0;background:transparent;color:var(--ink2);font-size:12px;font-weight:600;padding:5px 12px;border-radius:7px;white-space:nowrap}
.seg button.on{background:var(--panel);color:var(--ink);box-shadow:var(--shadow-sm)}
.tb-r{margin-left:auto;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.cnt{font-size:12px;color:var(--ink3);white-space:nowrap;font-variant-numeric:tabular-nums}
.btn-p{border:0;background:var(--grad-main);color:#fff;font-size:12.5px;font-weight:700;padding:9px 15px;border-radius:var(--radius-sm);box-shadow:0 4px 12px rgba(15,24,34,.20)}
[data-theme="dark"] .btn-p{color:#241a20}
.btn-p:hover{box-shadow:0 6px 18px rgba(15,24,34,.28)}
.btn-g{border:1px solid var(--line);background:var(--panel);color:var(--ink2);font-size:12.5px;font-weight:600;padding:8px 13px;border-radius:var(--radius-sm)}
.btn-g:hover{border-color:var(--ink3);color:var(--ink)}

/* ---------- 内容区 ---------- */
.pg-body{padding:14px 26px 0;flex:1}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(216px,1fr));gap:12px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-sm);
  overflow:hidden;transition:transform .16s,box-shadow .16s,border-color .16s;cursor:pointer;display:flex;flex-direction:column}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--ink3)}
.card .cimg{aspect-ratio:4/3;background:linear-gradient(135deg,var(--panel-soft),var(--panel-deep));
  display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:10.5px;position:relative;overflow:hidden}
.card .cimg img{width:100%;height:100%;object-fit:cover;display:block}
.card .cno{position:absolute;top:8px;left:8px;font-size:10px;font-weight:700;padding:2px 7px;border-radius:var(--pill);
  background:rgba(255,255,255,.92);color:var(--ink2);max-width:calc(100% - 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
[data-theme="dark"] .card .cno{background:rgba(20,20,24,.78);color:var(--ink2)}
.card .cb{padding:10px 12px 12px;display:flex;flex-direction:column;gap:6px;flex:1}
.card .cn{font-size:13.5px;font-weight:700;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}
.card .cm{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--ink3);flex-wrap:wrap;margin-top:auto}
.tag{font-size:10px;font-weight:700;padding:1px 7px;border-radius:5px;border:1px solid transparent}
.tag.hot{background:var(--t-hot-bg);color:var(--t-hot-fg);border-color:var(--t-hot-bd)}
.tag.rival{background:var(--t-rival-bg);color:var(--t-rival-fg);border-color:var(--t-rival-bd)}
.tag.own{background:var(--t-own-bg);color:var(--t-own-fg);border-color:var(--t-own-bd)}
.tag.issue{background:var(--t-issue-bg);color:var(--t-issue-fg);border-color:var(--t-issue-bd)}
.tag.demand{background:var(--t-demand-bg);color:var(--t-demand-fg);border-color:var(--t-demand-bd)}
.tag.review{background:var(--t-review-bg);color:var(--t-review-fg);border-color:var(--t-review-bd)}
.sc{font-size:10.5px;font-weight:700;padding:1px 7px;border-radius:var(--pill)}
.sc.good{color:var(--good);background:rgba(63,138,91,.13)}
.sc.mid{color:var(--warn);background:rgba(176,122,48,.13)}
.sc.bad{color:var(--bad);background:rgba(176,80,80,.13)}

.tw{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:auto}
table.wt{width:100%;border-collapse:collapse;font-size:12.5px;min-width:760px}
.wt th{text-align:left;font-size:11px;color:var(--ink3);font-weight:700;padding:11px 12px;
  border-bottom:1px solid var(--line);background:var(--panel-soft);position:sticky;top:0;white-space:nowrap}
.wt td{padding:10px 12px;border-bottom:1px solid var(--line-soft);color:var(--ink2);vertical-align:middle}
.wt tr:hover td{background:var(--panel-soft);cursor:pointer}
.wt td.s{color:var(--ink);font-weight:600}
.wt .tw-img{width:34px;height:34px;border-radius:7px;background:var(--panel-deep);overflow:hidden;display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:9px}
.wt .tw-img img{width:100%;height:100%;object-fit:cover}

.empty{text-align:center;color:var(--ink3);font-size:12.5px;padding:58px 20px;line-height:1.9;
  background:var(--panel);border:1px dashed var(--line);border-radius:var(--radius)}
.empty b{display:block;color:var(--ink2);font-size:14px;margin-bottom:5px;font-weight:700}

/* ---------- 分页 ---------- */
.pager{display:flex;align-items:center;justify-content:center;gap:6px;padding:18px 0 0;font-size:12px;color:var(--ink3);flex-wrap:wrap}
.pager button{border:1px solid var(--line);background:var(--panel);color:var(--ink2);min-width:30px;height:30px;padding:0 8px;
  border-radius:8px;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums}
.pager button:hover:not(:disabled):not(.on){border-color:var(--ink3);color:var(--ink)}
.pager button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
[data-theme="dark"] .pager button.on{color:#241a20}
.pager button:disabled{opacity:.35;cursor:default}
.pager .pinfo{margin-left:8px;font-size:11.5px}

/* ---------- 详情抽屉 ---------- */
.drawer{position:fixed;inset:0;z-index:60;pointer-events:none}
.drawer[aria-hidden="false"]{pointer-events:auto}
.drawer-mask{position:absolute;inset:0;background:rgba(10,12,18,.42);opacity:0;transition:opacity .25s}
.drawer[aria-hidden="false"] .drawer-mask{opacity:1}
.drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(470px,94vw);background:var(--panel);
  border-left:1px solid var(--line);box-shadow:var(--shadow-lg);transform:translateX(100%);
  transition:transform .28s ease;display:flex;flex-direction:column}
.drawer[aria-hidden="false"] .drawer-panel{transform:translateX(0)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line)}
.drawer-title{font-size:15px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drawer-acts{display:flex;align-items:center;gap:7px;flex-shrink:0}
.icon-btn{border:0;background:var(--panel-soft);color:var(--ink2);width:30px;height:30px;border-radius:8px;font-size:13px;line-height:1;display:flex;align-items:center;justify-content:center}
.btn-danger{border:1px solid rgba(176,80,80,.35);background:transparent;color:var(--bad);font-size:12.5px;font-weight:600;padding:7px 13px;border-radius:8px}
.drawer-body{padding:16px 18px 40px;overflow:auto}
.d-block{margin-bottom:18px}
.d-h{font-size:11px;color:var(--ink3);font-weight:700;letter-spacing:.4px;margin-bottom:8px}
.d-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.d-meta .mi{background:var(--panel-soft);border:1px solid var(--line-soft);border-radius:9px;padding:9px 11px}
.d-meta .mk{font-size:10.5px;color:var(--ink3)}
.d-meta .mv{font-size:13px;font-weight:600;color:var(--ink);margin-top:2px;word-break:break-all}
.d-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.d-gallery .gitem{aspect-ratio:1;border-radius:9px;background:var(--panel-deep);overflow:hidden;display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:10px}
.d-gallery .gitem img{width:100%;height:100%;object-fit:cover}
.d-table{width:100%;border-collapse:collapse;font-size:12px}
.d-table th,.d-table td{padding:7px 8px;border-bottom:1px solid var(--line-soft);text-align:left;color:var(--ink2)}
.d-table th{color:var(--ink3);font-weight:700;font-size:10.5px}
.d-note{font-size:12.5px;color:var(--ink2);background:var(--panel-soft);border-radius:9px;padding:10px 12px;line-height:1.65;white-space:pre-wrap}
.d-empty{color:var(--ink3);font-size:12px}
.d-tryon{display:flex;flex-direction:column;gap:8px}
.d-tryon .tr{background:var(--panel-soft);border:1px solid var(--line-soft);border-radius:9px;padding:9px 11px;font-size:12px;color:var(--ink2)}
.d-tryon .tr b{color:var(--ink)}

/* ---------- 弹窗 ---------- */
.modal{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;padding:20px}
.modal-mask{position:absolute;inset:0;background:rgba(10,12,18,.5)}
.modal-panel{position:relative;width:min(620px,96vw);max-height:90vh;overflow:auto;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg)}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;
  border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--panel);z-index:1}
.modal-title{font-size:15px;font-weight:700}
.p-form{padding:16px 18px 20px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.p-form label{display:flex;flex-direction:column;gap:5px;font-size:11.5px;color:var(--ink3);font-weight:600}
.p-form label.full{grid-column:1/-1;margin-top:4px}
.p-form input,.p-form select,.p-form textarea{border:1px solid var(--line);background:var(--panel-soft);color:var(--ink);
  border-radius:8px;padding:8px 10px;font-size:13px;outline:none}
.p-form input:focus,.p-form select:focus,.p-form textarea:focus{border-color:var(--ink3);box-shadow:0 0 0 3px rgba(15,24,34,.08)}
.form-foot{display:flex;justify-content:flex-end;gap:9px;margin-top:16px}
.dropzone{border:1.5px dashed var(--line);border-radius:10px;background:var(--panel-soft);padding:14px;text-align:center;cursor:pointer}
.dropzone:hover,.dropzone.over{border-color:var(--ink3);background:var(--panel)}
.dz-hint{font-size:11.5px;color:var(--ink3)}
.dz-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:8px;margin-top:10px}
.dz-thumb{position:relative;aspect-ratio:1;border-radius:8px;overflow:hidden;border:1px solid var(--line);background:var(--panel-deep)}
.dz-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.dz-del{position:absolute;top:3px;right:3px;width:19px;height:19px;border:0;border-radius:50%;
  background:rgba(10,12,18,.62);color:#fff;font-size:10px;line-height:1;display:flex;align-items:center;justify-content:center}

/* ---------- Toast ---------- */
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);background:var(--accent);color:#fff;
  font-size:12.5px;font-weight:600;padding:9px 18px;border-radius:var(--pill);box-shadow:var(--shadow-lg);
  opacity:0;pointer-events:none;transition:all .25s;z-index:90}
[data-theme="dark"] .toast{color:#241a20}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- 登录提示条 ---------- */
.rolebar{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;color:var(--ink3);
  background:var(--panel-soft);border:1px solid var(--line-soft);border-radius:var(--pill);padding:4px 11px}
.rolebar b{color:var(--ink2);font-weight:700}
.rolebar button{border:0;background:transparent;color:var(--ink2);font-size:11.5px;font-weight:700;text-decoration:underline;padding:0}

/* ---------- 响应式 ---------- */
@media(max-width:940px){
  body{overflow-x:hidden}
  .app-shell{grid-template-columns:1fr;min-width:0}
  .page{min-width:0;max-width:100vw}
  .sidenav{position:static;height:auto;min-width:0;max-width:100vw;overflow:hidden;border-right:0;border-bottom:1px solid var(--line)}
  .sn-brand{padding:12px 14px 11px}
  .sn-grp{padding:6px 10px 0}
  .sn-grp-t{display:none}
  .sn-grp-other{display:none}
  .sn-list{flex-direction:row;width:100%;min-width:0;overflow-x:auto;padding-bottom:10px;gap:6px;scrollbar-width:none}
  .sn-list::-webkit-scrollbar{display:none}
  .sn-item{width:auto;flex:0 0 auto;padding:8px 12px;font-size:13px}
  .sn-n{display:none}
  .sn-foot{flex-direction:row;align-items:center;justify-content:space-between;padding:10px 14px;min-width:0}
  .sn-account{flex:0 0 auto}
  .acct-btn{width:auto;padding:6px 10px}
  .acct-tx{max-width:104px}
  .acct-pop{left:auto;right:0;width:224px}
  .sn-foot .sn-theme{width:150px}
  .pg-head,.filterbar,.extra,.toolbar,.pg-body,.views{padding-left:14px;padding-right:14px}
  .views{gap:5px}
  .vw{padding:4px 10px;font-size:11.5px}
  .pg-title{font-size:20px}
  .pg-desc{font-size:12px}
  .sbox{width:100%}
  .fb-clear{margin-left:0}
  .fb-groups{gap:6px 12px}
  .bar-row{grid-template-columns:84px 1fr 38px}
  .cards{grid-template-columns:repeat(auto-fill,minmax(148px,1fr))}
  .form-grid{grid-template-columns:1fr}
  .d-meta{grid-template-columns:1fr}
  .pager .pinfo{margin-left:0;width:100%}
}