/* ============================================================
   design-v6.css · 视觉系统 v6（2026-09-23）
   ------------------------------------------------------------
   本文件只做四件事，不动 v1–v5 的业务语义：
     1) 顶部导航改版：一级 5 个主入口 + 「更多 ▾」下拉面板；
        **不再横向滚动**（手机 375px 也要一屏放得下，scrollWidth == clientWidth）；
     2) 链路页 SOP 骨架：每个节点的「标准做法 / 责任人 / 验收标准」+ 实际状态对比；
     3) 「数据标准」常驻小卡片（管理端与客户只读端都可见）；
     4) 生活场景选题 / 待采集（无数据）状态的展示样式。
   约束：不改鉴权、不改客户只读隔离、不动任何数据与接口。
   ============================================================ */

/* ---------- 1 · 顶部导航：一屏放得下，不滑动 ---------- */
.tabs{
  flex-wrap:nowrap;                /* 一级入口一行放完 */
  overflow:visible;                /* 不出现横向滚动条 */
  overflow-x:visible;
  gap:4px;
  align-items:center;
}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:0 0 auto;padding:6px 10px;font-size:12.5px}
.tab-more{display:inline-flex;align-items:center;gap:4px;padding:6px 9px}
.tab-more.active{background:var(--brand-wash);color:var(--brand-deep);border-color:var(--brand-200);font-weight:800}
.morewrap{position:relative;display:inline-flex;flex:0 0 auto}
.moremenu{
  position:absolute;top:calc(100% + 6px);right:0;z-index:60;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;
  padding:6px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-2,10px);box-shadow:var(--sh-3);width:max-content;max-width:min(92vw,420px);
}
.moremenu.hidden{display:none}
/* 打开时菜单被挂到 body 下（脱离导航条的 backdrop-filter/overflow 裁剪），
   位置由 JS 计算，所以这里必须是 fixed + 足够高的层级，且不受任何祖先裁剪。 */
.moremenu.moremenu-portal{position:fixed!important;top:0;z-index:9999!important;max-width:calc(100vw - 16px)}
.moremenu .moreitem{
  padding:7px 12px;font-size:12.5px;font-weight:600;text-align:center;white-space:nowrap;
  border-radius:8px;background:transparent;border:1px solid transparent;color:var(--fg2);
}
.moremenu .moreitem:hover{border-color:var(--brand-200);color:var(--brand-deep)}
.moremenu .moreitem.active{background:var(--brand-wash);color:var(--brand-deep);border-color:var(--brand-200);font-weight:800}
.moremenu .menu-hd{grid-column:1/-1;font-size:11px;color:var(--fg2);padding:2px 6px 4px;border-bottom:1px solid var(--line);margin-bottom:2px}

/* 手机 / 平板：入口尽量一屏放完；遇到系统大字号或入口扩展时只让导航条自身横滑，不能撑宽整页 */
body.is-mobile .tabs,body.is-tablet .tabs{
  width:100%;max-width:100vw;min-width:0;
  flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
  gap:3px;padding:4px 8px;
}
body.is-mobile .tab{padding:6px 7px;font-size:12px;min-height:32px}
body.is-mobile .tab-more{padding:6px 7px;font-size:12px}
body.is-mobile .moremenu{
  position:fixed;left:8px;right:8px;top:auto;transform:translateY(0);
  grid-template-columns:repeat(2,minmax(0,1fr));max-width:none;width:auto;
}
body.is-mobile .moremenu .moreitem{text-align:left;padding:9px 12px}

/* ---------- 2 · 链路页：SOP（标准做法 / 责任人 / 验收标准） ---------- */
.pn-sop{margin:6px 0 4px;padding:6px 8px;border-radius:8px;background:var(--bg2,rgba(0,0,0,.03));border:1px dashed var(--line)}
.pn-sop .sop-line{display:flex;gap:6px;font-size:11.5px;line-height:1.5;margin:2px 0}
.pn-sop .sop-k{flex:0 0 auto;color:var(--fg2);font-weight:700}
.pn-sop .sop-v{min-width:0;color:var(--fg1)}
.pn-sop .sop-owner{max-width:110px;padding:1px 4px;font-size:11.5px;min-height:0;height:auto}
.sop-verdict{display:inline-block;padding:1px 7px;border-radius:999px;font-size:11px;font-weight:700}
.sop-verdict.pass{background:#E7F6EC;color:#15803D}
.sop-verdict.warn{background:#FFF4E0;color:#B45309}
.sop-verdict.fail{background:#FDE8E8;color:#B91C1C}
.sop-verdict.pending{background:#EEF1F5;color:#4B5563}
.sop-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin:6px 0}
.sop-cell{padding:7px 9px;border:1px solid var(--line);border-radius:8px}
.sop-cell h5{margin:0 0 4px;font-size:12px}
.sop-cell p{margin:2px 0;font-size:12px;line-height:1.55}
@media (max-width:768px){.sop-grid{grid-template-columns:1fr}}

/* ---------- 3 · 数据标准常驻小卡片（客户只读端也可见） ---------- */
.std-card{
  margin:8px 0 10px;padding:9px 11px;border:1px solid var(--line);border-left:3px solid var(--brand-200, #8E2BB8);
  border-radius:10px;background:var(--card);
}
.std-card > b{display:block;font-size:12.5px;margin-bottom:4px}
.std-card ol{margin:0;padding-left:18px}
.std-card li{font-size:12px;line-height:1.6;margin:2px 0}

/* ---------- 4 · 生活场景选题 / 待采集（无数据） ---------- */
.scen-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;margin:6px 0}
.scen-card{padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--card)}
.scen-card h4{margin:0 0 4px;font-size:12.5px;line-height:1.45}
.scen-card p{margin:2px 0;font-size:11.5px;line-height:1.55;color:var(--fg2)}
.tag-pending{background:#EEF1F5;color:#4B5563;font-weight:700}
.tier-chip{font-size:11px;padding:1px 6px;border-radius:999px;background:var(--brand-wash);color:var(--brand-deep);font-weight:700}
.pending-card{border-left:3px solid #B7BDC7}

/* ---------- 项目管理页 ---------- */
.projhead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 14px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.projhead h2{font-size:18px;line-height:1.4}
.projhead-actions{display:flex;gap:8px;flex-shrink:0}
.projlist{display:flex;flex-direction:column;gap:8px}
.projrow{display:grid;grid-template-columns:26px 30px minmax(150px,1fr) 72px 108px 100px 76px 214px;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);transition:border-color .15s}
.projrow:hover{border-color:var(--brand, #6E1F91)}
.projrow-check{display:flex;align-items:center;justify-content:center}
.projrow-check input{width:15px;height:15px;cursor:pointer}
.projrow-rank{font-weight:700;color:var(--fg2);text-align:center;font-size:13px}
.projrow-name{min-width:0}
.projrow-name b{display:flex;align-items:center;gap:5px;font-size:13.5px;line-height:1.3;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.projrow-name .small{font-size:11px;color:var(--fg2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tag-current{font-size:10px;background:#E8F5E9;color:#2E7D32;padding:1px 6px;border-radius:8px;font-weight:600;flex-shrink:0}
.projrow-metric{font-size:11px;color:var(--fg2);line-height:1.35;min-width:0}
.projrow-metric b{display:block;font-size:14.5px;font-weight:700;color:var(--fg1);line-height:1.25}
.projrow-metric .muted{font-size:10px;display:block;white-space:nowrap}
.projrow-metric span{white-space:nowrap}
.projrow-actions{display:flex;gap:4px;justify-content:flex-end;align-items:center}
.projrow-actions .btn{padding:4px 6px;font-size:11px;line-height:1.2;white-space:nowrap}
.projrow-actions .proj-up,.projrow-actions .proj-down{padding:4px 7px;font-weight:700}
.projrow-empty{text-align:center;padding:34px 0;color:var(--fg2);font-size:13px}
.projrow-empty .big{font-size:36px;margin-bottom:8px;opacity:.4}

.projcompare{position:relative}
.projcompare-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 12px}
.projcompare-table{overflow-x:auto;margin:0 0 16px}
.projcompare-table table{width:100%;border-collapse:collapse;font-size:13px}
.projcompare-table th,.projcompare-table td{padding:8px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.projcompare-table th{background:var(--card);font-weight:700;font-size:12px;color:var(--fg2);position:sticky;top:0}
.projcompare-table td:first-child{font-weight:700;white-space:nowrap}
.projcompare-table .muted{font-weight:400;font-size:11px;color:var(--fg2)}
.projcompare-chart{width:100%;overflow-x:auto}

.modal-mask{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}
.modal-mask.hidden{display:none}
.modal-card{background:var(--card);border-radius:14px;padding:24px;max-width:480px;width:100%;box-shadow:0 12px 40px rgba(0,0,0,.18);max-height:90vh;overflow-y:auto}
.modal-card h3{font-size:16px}
.formrow{margin-bottom:12px}
.formrow label{display:block;font-size:12.5px;font-weight:600;color:var(--fg2);margin-bottom:4px}
.formrow input[type=text],.formrow textarea{width:100%;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--fg1);font-size:13px;font-family:inherit;box-sizing:border-box}
.formrow input[type=text]:focus,.formrow textarea:focus{outline:none;border-color:var(--brand, #6E1F91)}
.required{color:#C0392B;margin-left:2px}
.formrow-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:18px;margin-bottom:0}
#projNewErr{color:#C0392B;font-size:12px}

/* ============== 4 步 wizard 样式（11-58 新建项目引导） ============== */
.wizard-card{max-width:640px;padding:0}
.wizard-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px 8px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#faf6fc 0%,transparent 100%)}
.wizard-head h3{font-size:16px}
.dialog-close{background:none;border:none;font-size:22px;color:var(--fg2);cursor:pointer;line-height:1;padding:4px 10px}
.dialog-close:hover{color:var(--fg1)}
.wizard-steps{display:flex;gap:0;margin:0;padding:16px 22px 12px;list-style:none}
.wizard-steps li{display:flex;align-items:center;gap:6px;flex:1;color:var(--fg2);font-size:11.5px;position:relative;min-width:0}
.wizard-steps li:not(:last-child)::after{content:"";display:block;flex:1;height:2px;background:var(--line);margin:0 4px;min-width:14px}
.wizard-steps li b{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--line);color:var(--fg2);font-size:11px;font-weight:700;flex-shrink:0}
.wizard-steps li span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wizard-steps li.active{color:var(--brand,#6E1F91);font-weight:600}
.wizard-steps li.active b{background:var(--brand,#6E1F91);color:#fff}
.wizard-steps li.done{color:var(--ok,#2f9e6e)}
.wizard-steps li.done b{background:var(--ok,#2f9e6e);color:#fff}
.wizard-panel{padding:16px 22px}
.wizard-panel.hidden{display:none}
.wizard-h4{margin:14px 0 8px;font-size:13px;color:var(--fg1)}
.wizard-h4 small{font-weight:400;font-size:11.5px;margin-left:6px}

/* 8 类事实卡分组 */
.factcat-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.factcat{border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--bg)}
.factcat-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.factcat-num{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:#f3e8f7;color:#79249d;font-size:10px;font-weight:700;flex-shrink:0}
.factcat-head b{font-size:12.5px;color:var(--fg1)}
.factcat-head small{flex:1;min-width:0}
.factcat textarea{width:100%;padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--fg1);font-size:12px;font-family:inherit;resize:vertical;box-sizing:border-box}

/* 竞品/平台 picker-chip */
.picker-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.picker-filter{flex:1;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);font-size:12.5px;color:var(--fg1)}
.picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px;max-height:260px;overflow-y:auto;padding:6px;border:1px dashed var(--line);border-radius:8px;background:var(--bg)}
.picker-grid-platforms{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.picker-chip{display:flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:var(--card);cursor:pointer;font-size:12.5px;transition:all .12s}
.picker-chip:hover{border-color:var(--brand,#6E1F91)}
.picker-chip.on{background:#f3e8f7;border-color:var(--brand,#6E1F91);color:var(--brand,#6E1F91);font-weight:600}
.picker-chip input[type=checkbox]{margin:0;cursor:pointer}
.picker-chip .picker-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.picker-chip.hidden{display:none}
.chip{display:inline-block;padding:1px 6px;border-radius:999px;font-size:10px;font-weight:600}
.chip.core{background:#fef3c7;color:#a16207}
.chip.ref{background:#e0e7ff;color:#4338ca}
.chip.api{background:#e9f7f2;color:#14765f}
.chip.web{background:#edf1ff;color:#405fb1}

/* 概要 */
.wizard-summary{display:grid;grid-template-columns:90px 1fr;gap:6px 12px;font-size:12.5px;margin:8px 0 16px}
.wizard-summary dt{color:var(--fg2);font-weight:600}
.wizard-summary dd{margin:0;color:var(--fg1)}

/* clipboard 链接 */
.clipboard-box{display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--bg);border:1px dashed var(--line);border-radius:8px;margin:10px 0}
.clipboard-box code{flex:1;font-size:11.5px;color:var(--fg1);overflow-x:auto;word-break:break-all;font-family:ui-monospace,monospace}

/* 操作条 */
.wizard-actions{gap:14px}
.wizard-actions .wizard-progress{flex:1;text-align:center;color:var(--fg2);font-size:12px;line-height:30px}

@media (max-width:720px){
  .wizard-card{max-width:100%}
  .factcat-list{grid-template-columns:1fr}
  .wizard-summary{grid-template-columns:70px 1fr}
  .wizard-steps li{font-size:10.5px}
  .wizard-steps li span{display:none}
  .wizard-steps li.active span{display:inline}
}

/* ============== 子 tab + 题库管理样式（11-58） ============== */
.btn.active{background:var(--brand,#6E1F91);color:#fff;border-color:var(--brand,#6E1F91)}
.projquestions-toolbar{display:flex;gap:8px;align-items:center;margin:10px 0 14px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);flex-wrap:wrap}
.projquestions-toolbar .btn.small{padding:5px 10px;font-size:12px}
.projq-group{margin:14px 0}
.projq-group-h{margin:0 0 8px;font-size:13px;color:var(--fg1)}
.projq-group-h small{font-weight:400;font-size:11.5px;margin-left:6px}
.projq-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--card);margin-bottom:5px;font-size:12.5px}
.projq-row.on{background:#f3e8f7;border-color:var(--brand,#6E1F91)}
.projq-row input[type=checkbox]{margin:0;cursor:pointer;flex-shrink:0}
.projq-text{flex:1;min-width:0}
.projq-row .chip{font-size:10px}

/* 窄屏：项目行改为卡片式两行布局（指标两列、按钮整行） */
@media (max-width:1080px){
  .projrow{grid-template-columns:24px 26px 1fr 1fr;grid-template-areas:"chk rank name name" ". . m1 m2" ". . m3 act";gap:6px 10px;row-gap:4px}
  .projrow-check{grid-area:chk}
  .projrow-rank{grid-area:rank;text-align:left}
  .projrow-name{grid-area:name;padding-bottom:4px;border-bottom:1px dashed var(--line)}
  .m-runs{grid-area:m1}
  .m-open{grid-area:m2}
  .m-brand{grid-area:m3}
  .m-core{display:none}
  .projrow-actions{grid-area:act;justify-content:flex-start}
}
@media (max-width:560px){
  .projhead{flex-direction:column;gap:10px}
  .projhead-actions{width:100%}
  .projhead-actions .btn{flex:1}
  .projrow{grid-template-columns:24px 1fr;grid-template-areas:"chk name" "rank name" "m1 m2" "act act";row-gap:6px}
  .projrow-rank{grid-area:rank;font-size:11px;color:var(--fg2);font-weight:400}
  .m-brand{display:none}
  .projrow-actions{grid-area:act;justify-content:space-between;border-top:1px dashed var(--line);padding-top:6px;margin-top:2px}
  .projrow-actions .btn{flex:1}
}