/* Pilot 审批台 · v5 控制台皮肤
   方向 1b：深色固定侧栏 + 主区表格密度。取代此前的 styles.css + shell.css
   （Industry 设计系统的蓝图线框——那套是给设计稿做标注定位用的，当工作台不对）。

   来源：Claude Design 项目「Pilot 工程流程工作台 · UI 设计」的 v5-console.css。
   改视觉先改那边，再同步过来，别两头分头改。 */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
  --bg:        #f6f7f9;   /* 主区底 */
  --sf:        #ffffff;   /* 卡片面 */
  --sf-2:      #fbfcfd;   /* 表头 / 内嵌面 */
  --tx:        #15181d;
  --mu:        #6b7280;   /* 次级文字 */
  --fa:        #9ca3af;   /* 三级文字 */
  --ln:        #e5e7eb;   /* 分割线 */
  --ln-2:      #f1f3f5;   /* 更淡的行线 */
  --nav:       #15181d;   /* 侧栏底 */
  --nav-tx:    #8f98a5;
  --nav-on:    #ffffff;

  /* 语义状态——四个状态一个色，不再多 */
  --ok:        #16a34a;   /* 已通过 */
  --ok-bg:     #eaf6ee;
  --wait:      #d97706;   /* 待裁决 */
  --wait-bg:   #fdf4e5;
  --run:       #2563eb;   /* 执行中 */
  --run-bg:    #eaf1fe;
  --dead:      #b91c1c;   /* 未完成 / FAIL */
  --dead-bg:   #fdeeee;
  --idle:      #d1d5db;   /* 未开始 */

  --r:   6px;
  --r-2: 8px;
  --sd:  0 1px 2px rgba(21,24,29,.05);
  --fs:  'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --fm:  'IBM Plex Mono', ui-monospace, Menlo, monospace;
}

*, *::before, *::after { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--tx);
       font-family:var(--fs); font-size:13px; line-height:1.55;
       -webkit-font-smoothing:antialiased; }
a { color:var(--run); text-decoration:none; }
a:hover { text-decoration:underline; text-underline-offset:2px; }
:focus-visible { outline:2px solid var(--run); outline-offset:1px; }
h1,h2,h3 { margin:0; font-weight:600; letter-spacing:-.012em; }

/* ────────────── 外壳 ────────────── */
.app     { display:flex; min-height:100vh; }
.sidebar { width:212px; flex:none; background:var(--nav); display:flex;
           flex-direction:column; padding:14px 0 10px; position:sticky; top:0; height:100vh; }
.sb-brand{ display:flex; align-items:center; gap:9px; padding:0 14px 15px; }
.sb-mark { width:19px; height:19px; border-radius:5px; background:var(--run); flex:none; }
.sb-name { font-size:15px; font-weight:600; color:#fff; letter-spacing:-.01em; }
.sb-sec  { padding:15px 14px 5px; font-size:10.5px; letter-spacing:.06em;
           text-transform:uppercase; color:#6d7783; }
.sb-item { display:flex; align-items:center; gap:8px; padding:7px 14px;
           font-size:13.5px; color:var(--nav-tx); text-decoration:none; }
.sb-item:hover { color:#d5dae1; background:rgba(255,255,255,.04); text-decoration:none; }
.sb-item.on    { color:var(--nav-on); background:rgba(255,255,255,.07);
                 box-shadow:inset 2px 0 0 var(--run); }
.sb-item .sb-dot { width:6px; height:6px; border-radius:50%; flex:none; background:var(--idle); }
.sb-item .sb-dot.wait { background:var(--wait); }
.sb-item .sb-dot.run  { background:var(--run); }
.sb-item .sb-lbl { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
                   font-family:var(--fm); font-size:12.5px; }
/* 主线（工作区）可滚，管理段和账号卡钉在底部——Run 多了也不会把设置顶出屏幕 */
.sb-nav  { flex:1; min-height:0; overflow-y:auto; }
.sb-nav::-webkit-scrollbar { width:6px; }
.sb-nav::-webkit-scrollbar-thumb { background:rgba(255,255,255,.1); border-radius:3px; }
/* Run 分组是 Runs 的下级，用缩进 + 一根竖线说清楚，别再和它平级 */
.sb-body { margin:2px 0 4px 20px; padding-left:2px; border-left:1px solid rgba(255,255,255,.08); }
.sb-sub  { padding:10px 8px 3px; font-size:10px; letter-spacing:.05em;
           text-transform:uppercase; color:#69737f; }
.sb-item.nested { padding:6px 10px 6px 8px; }
.sb-item.dim { color:#5c6570; }
.sb-item.dim .sb-lbl { text-decoration:line-through; text-decoration-color:#3d444d; }
.sb-item .sb-dot.dead { background:#3d444d; }
/* 选中的 Run 下面挂它自己的几页 */
.sb-leaf { display:block; padding:4px 10px 4px 22px; font-size:12.5px;
           color:#79828d; text-decoration:none; }
.sb-leaf:hover { color:#c7ccd4; background:rgba(255,255,255,.03); text-decoration:none; }
.sb-leaf.on { color:var(--nav-on); }
.sb-adm  { padding-top:12px; border-top:1px solid rgba(255,255,255,.08); }
.sb-foot { padding:11px 14px 0; margin-top:12px; border-top:1px solid rgba(255,255,255,.08); }
.sb-me   { display:flex; align-items:center; gap:8px; font-size:13px; color:#c7ccd4; }
.sb-av   { width:24px; height:24px; border-radius:50%; flex:none; background:rgba(255,255,255,.12);
           display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:600; color:#fff; }
.sb-out  { background:none; border:0; padding:0; margin-left:auto; cursor:pointer;
           color:#79828d; font:inherit; font-size:12px; }
.sb-out:hover { color:#c7ccd4; }

.main   { flex:1; min-width:0; display:flex; flex-direction:column; }
.topbar { display:flex; align-items:center; gap:10px; height:46px; flex:none;
          padding:0 20px; background:var(--sf); border-bottom:1px solid var(--ln); }
.crumb  { font-size:12.5px; color:var(--mu); }
.crumb b{ color:var(--tx); font-weight:600; }
.crumb .sep { color:#d1d5db; margin:0 5px; }
.tb-r   { margin-left:auto; display:flex; align-items:center; gap:9px; }
.page   { padding:20px 20px 40px; }

/* ────────────── 页头 ────────────── */
.ph     { display:flex; align-items:flex-end; justify-content:space-between;
          gap:20px; margin-bottom:15px; }
.ph h1  { font-size:17px; margin-bottom:3px; }
.ph .sub{ font-size:12px; color:var(--mu); }
.ph-r   { display:flex; gap:8px; flex:none; }

/* ────────────── 表格 ────────────── */
.tbl    { background:var(--sf); border:1px solid var(--ln); border-radius:var(--r);
          box-shadow:var(--sd); overflow:hidden; }
.tbl-h  { display:flex; align-items:center; gap:12px; padding:7px 14px;
          background:var(--sf-2); border-bottom:1px solid var(--ln);
          font-size:9.5px; letter-spacing:.06em; text-transform:uppercase;
          color:var(--mu); font-weight:600; }
.tbl-r  { display:flex; align-items:center; gap:12px; padding:9px 14px;
          border-bottom:1px solid var(--ln-2); position:relative;
          color:inherit; text-decoration:none; }
.tbl-r:last-child { border-bottom:0; }
.tbl-r:hover { background:var(--sf-2); text-decoration:none; }
.tbl-r::before { content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:transparent; }
.tbl-r.s-ok::before   { background:var(--ok); }
.tbl-r.s-wait::before { background:var(--wait); }
.tbl-r.s-run::before  { background:var(--run); }
.tbl-r.s-dead::before { background:var(--dead); }
.tbl-r.sub-r { padding-left:32px; background:var(--sf-2); font-size:12px; }

/* 产出嵌套行 */
.art    { display:flex; align-items:center; gap:10px; padding:7px 14px 7px 32px;
          border-bottom:1px solid var(--ln-2); background:var(--sf-2); }
.art:last-child { border-bottom:0; }
.art-n  { font-family:var(--fm); font-size:11.5px; flex:1; min-width:0;
          overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.art-m  { font-size:10.5px; color:var(--fa); flex:none; }

/* ────────────── 状态 ────────────── */
.st     { display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:500; white-space:nowrap; }
.st-d   { width:6px; height:6px; border-radius:50%; flex:none; background:var(--idle); }
.st.ok   { color:var(--ok);   } .st.ok   .st-d { background:var(--ok); }
.st.wait { color:var(--wait); } .st.wait .st-d { background:var(--wait); }
.st.run  { color:var(--run);  } .st.run  .st-d { background:var(--run); animation:pulse 1.6s ease-in-out infinite; }
.st.dead { color:var(--dead); } .st.dead .st-d { background:var(--dead); }
.st.idle { color:var(--mu);   }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.35} }

.pill   { display:inline-block; font-size:10px; font-weight:500; padding:2px 7px;
          border-radius:20px; white-space:nowrap; background:#f3f4f6; color:var(--mu); }
.pill.ok   { background:var(--ok-bg);   color:var(--ok); }
.pill.wait { background:var(--wait-bg); color:var(--wait); }
.pill.run  { background:var(--run-bg);  color:var(--run); }
.pill.dead { background:var(--dead-bg); color:var(--dead); }
.pill.gh   { background:transparent; color:var(--fa); border:1px solid var(--ln); }

/* ────────────── Gate ────────────── */
.gate   { background:var(--sf); border:1px solid var(--ln); border-left:3px solid var(--wait);
          border-radius:var(--r); box-shadow:var(--sd); padding:14px 16px; margin-top:14px; }
.gate-h { display:flex; align-items:baseline; gap:9px; margin-bottom:2px; }
.gate-t { font-size:14px; font-weight:600; }
.gate-s { font-size:11.5px; color:var(--mu); margin-bottom:12px; }
.roles  { display:flex; gap:26px; flex-wrap:wrap; margin-bottom:12px; }
.role-k { font-size:9.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--fa); margin-bottom:2px; }
.role-v { font-size:12.5px; font-weight:500; }
.role-v .who  { color:var(--mu); font-weight:400; }
.role-v .mine { color:var(--ok); font-weight:500; }
.gate-g { font-size:11.5px; line-height:1.65; color:var(--mu); white-space:pre-line;
          padding-top:11px; margin-top:11px; border-top:1px solid var(--ln-2); }
.acts   { display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; align-items:center; }

/* Gate 里的答题清单。题是在【产出页】上答的（一题一个输入框），这里只负责
   把人送过去——只报一个「12 / 12 题待答」的数字，人找不到答题的地方。 */
.qnav   { border:1px solid var(--ln); border-radius:var(--r); overflow:hidden; margin-bottom:12px; }
.qnav-h { display:flex; align-items:baseline; gap:9px; padding:7px 12px; background:var(--sf-2);
          border-bottom:1px solid var(--ln); font-size:11px; color:var(--mu); }
.qnav-h b { color:var(--tx); font-weight:600; font-size:12px; }
.qnav-h .src { margin-left:auto; font-family:var(--fm); font-size:10.5px; color:var(--fa);
               overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.qrow   { display:flex; align-items:center; gap:10px; padding:6px 12px; font-size:12px;
          color:var(--tx); text-decoration:none; border-bottom:1px solid var(--ln-2); }
.qrow:last-child { border-bottom:0; }
.qrow:hover { background:var(--sf-2); text-decoration:none; }
.qrow .q-id { font-family:var(--fm); font-size:11px; color:var(--run); flex:none; min-width:30px; }
.qrow .q-t  { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.qrow.done  { background:var(--sf-2); }
.qrow.done .q-id, .qrow.done .q-t { color:var(--mu); }
.qrow .q-go { font-size:11px; color:var(--fa); flex:none; }
.qrow:hover .q-go { color:var(--run); }
a.pill:hover { text-decoration:none; filter:brightness(.96); }

/* ────────────── 卡片 / 面板 ────────────── */
.panel  { background:var(--sf); border:1px solid var(--ln); border-radius:var(--r);
          box-shadow:var(--sd); padding:13px 15px; }
.panel-t{ font-size:9.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
          color:var(--fa); margin-bottom:9px; }
.kv     { display:flex; gap:10px; font-size:11.5px; padding:2.5px 0; }
.kv .k  { color:var(--mu); width:58px; flex:none; }
.kv .v  { font-family:var(--fm); font-size:11px; word-break:break-all; }
.cols   { display:grid; grid-template-columns:minmax(0,1fr) 288px; gap:16px; align-items:start; }
.stack  { display:flex; flex-direction:column; gap:12px; }

/* ────────────── 控件 ────────────── */
.btn    { display:inline-flex; align-items:center; justify-content:center; gap:6px;
          font:500 12px var(--fs); padding:5px 12px; border-radius:var(--r);
          border:1px solid var(--ln); background:var(--sf); color:var(--tx);
          cursor:pointer; text-decoration:none; white-space:nowrap; }
.btn:hover  { background:var(--sf-2); border-color:#d8dce1; text-decoration:none; }
.btn:disabled { opacity:.45; cursor:not-allowed; }
.btn-primary{ background:var(--ok); border-color:var(--ok); color:#fff; }
.btn-primary:hover { background:#15903f; border-color:#15903f; }
.btn-danger { color:var(--dead); border-color:#f0cccc; }
.btn-danger:hover { background:var(--dead-bg); border-color:#e5b4b4; }
.btn-sm { padding:3px 9px; font-size:11.5px; }

.input  { width:100%; padding:7px 10px; font:13px var(--fs); color:var(--tx);
          background:var(--sf); border:1px solid var(--ln); border-radius:var(--r); }
.input::placeholder { color:var(--fa); }
.input:focus { border-color:var(--run); outline:none; box-shadow:0 0 0 3px var(--run-bg); }
textarea.input { resize:vertical; min-height:56px; font-size:12.5px; }
.chk    { display:inline-flex; align-items:center; gap:5px; font-size:11.5px;
          color:var(--mu); margin:0 10px 5px 0; cursor:pointer; }

.note   { padding:11px 14px; font-size:12.5px; line-height:1.65; border-radius:var(--r);
          background:var(--run-bg); color:#1e40af; margin-bottom:12px; }
.note.warn { background:var(--wait-bg); color:#92400e; }
.note.bad  { background:var(--dead-bg); color:#991b1b; }
.note.good { background:var(--ok-bg);   color:#14532d; }

.mono  { font-family:var(--fm); font-size:11.5px; }
.muted { color:var(--mu); }
.empty { padding:40px 20px; text-align:center; color:var(--fa); font-size:12.5px; }


/* ══════════ 以下是应用侧补的，设计稿里没有这些屏 ══════════ */

/* 登录 / 初始化：没有侧栏，居中单卡 */
.solo      { min-height:100vh; display:flex; align-items:center; justify-content:center;
             padding:40px 20px; background:var(--bg); }
.solo-box  { width:100%; max-width:400px; }
.solo-box.wide { max-width:520px; }
.solo-brand{ display:flex; align-items:center; gap:9px; margin-bottom:18px; }
.solo-brand .sb-mark { width:22px; height:22px; }
.solo-brand .t { font-size:15px; font-weight:600; letter-spacing:-.01em; }
.solo h1   { font-size:18px; margin-bottom:5px; }
.solo .sub { font-size:12.5px; color:var(--mu); margin-bottom:18px; line-height:1.6; }
.form      { display:flex; flex-direction:column; gap:9px; }

/* 步序链：Run 详情顶部的圈号导航 */
.chips { display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.chip  { font-size:11px; font-family:var(--fm); padding:3px 8px; border-radius:var(--r);
         background:#f3f4f6; color:var(--mu); text-decoration:none; white-space:nowrap; }
.chip.on  { background:var(--ok-bg);   color:var(--ok); }
.chip.cur { background:var(--wait-bg); color:var(--wait); font-weight:500; }
a.chip:hover { text-decoration:none; filter:brightness(.96); }

/* 进度分段条（Run 列表里一行一条） */
.segs { display:flex; gap:3px; }
.seg  { height:3px; flex:1; border-radius:2px; background:var(--ln); }
.seg.ok { background:var(--ok); } .seg.wait { background:var(--wait); }
.seg.run { background:var(--run); } .seg.dead { background:var(--dead); }

/* 产出正文：artifact.html 渲染出来的 markdown */
.doc { background:var(--sf); border:1px solid var(--ln); border-radius:var(--r-2);
       box-shadow:var(--sd); padding:26px 30px; font-size:13.5px; line-height:1.75; color:#26292f; }
.doc > :first-child { margin-top:0; }
.doc h1 { font-size:19px; margin:26px 0 9px; }
.doc h2 { font-size:16px; margin:24px 0 8px; padding-bottom:6px; border-bottom:1px solid var(--ln-2); }
.doc h3 { font-size:14px; margin:20px 0 7px; }
.doc h4 { font-size:13px; margin:16px 0 6px; color:var(--mu); }
.doc p, .doc ul, .doc ol { margin:0 0 11px; }
.doc ul, .doc ol { padding-left:22px; }
.doc li { margin-bottom:4px; }
.doc code { font-family:var(--fm); font-size:11.5px; background:#f3f4f6;
            padding:1.5px 5px; border-radius:4px; }
.doc pre  { background:#f8f9fa; border:1px solid var(--ln); border-radius:var(--r);
            padding:12px 14px; overflow-x:auto; margin:0 0 13px; }
.doc pre code { background:none; padding:0; font-size:11.5px; line-height:1.6; }
.doc table { width:100%; border-collapse:collapse; font-size:12.5px; margin:0 0 14px; display:block; overflow-x:auto; }
.doc th { text-align:left; font-weight:600; background:var(--sf-2);
          padding:6px 10px; border:1px solid var(--ln); white-space:nowrap; }
.doc td { padding:6px 10px; border:1px solid var(--ln-2); vertical-align:top; }
.doc blockquote { margin:0 0 12px; padding:2px 0 2px 14px; border-left:3px solid var(--ln);
                  color:var(--mu); }
.doc hr { border:0; border-top:1px solid var(--ln); margin:22px 0; }
.doc a { color:var(--run); }

/* ────────────── 就地批注：整页一张表单，一题一张卡 ──────────────
   一题一个 <form> 时人分不清哪段文字属于哪题（2026-08-24 人的原话），也被迫
   一题点一次提交。现在整页一张表单，靠三样东西把每题隔开：左侧色条（状态）、
   序号 + qid 的题头、卡片之间明显的空隙。 */
.qa-lead { margin:22px 0 4px; font-size:12px; line-height:1.7; color:var(--mu); }
.qa-lead b { display:block; font-size:14px; color:var(--tx); margin-bottom:3px; }

.qcard { position:relative; background:var(--sf); border:1px solid var(--ln);
         border-radius:var(--r-2); box-shadow:var(--sd);
         margin-top:16px; padding:15px 20px 17px 23px; }
.qcard::before { content:''; position:absolute; left:0; top:0; bottom:0; width:4px;
                 background:var(--wait); border-radius:var(--r-2) 0 0 var(--r-2); }
.qcard.filled::before { background:var(--run); }
.qcard.done::before   { background:var(--ok); }
.qcard.done { background:var(--sf-2); }
.qcard.filled { border-color:#c7d7f7; }

.qcard-h { display:flex; align-items:baseline; gap:10px;
           padding-bottom:9px; margin-bottom:11px; border-bottom:1px solid var(--ln-2); }
.qcard-n { font-family:var(--fm); font-size:15px; font-weight:500; color:var(--tx);
           flex:none; line-height:1; }
.qcard-n i { font-style:normal; font-size:10.5px; color:var(--fa); font-weight:400; }
.qcard-id{ font-family:var(--fm); font-size:11px; color:var(--run); flex:none;
           background:var(--run-bg); padding:2px 6px; border-radius:var(--r); }
.qcard.done .qcard-id { color:var(--mu); background:var(--ln-2); }
.qcard-t { font-size:13.5px; font-weight:600; line-height:1.5; flex:1; min-width:0; }

.qcard-b { border:0; box-shadow:none; padding:0; margin:0 0 11px; font-size:12.5px;
           background:none; }
.qcard-b > :last-child { margin-bottom:0; }
.qcard-a { margin:0; }

/* 可选项：A/B/C 直接点，外加一个「其他」自己写。
   agent 已经在题里给了推荐，让人把整段读完再手打「选 A」是白工。 */
.qopts { display:flex; flex-direction:column; gap:6px; margin:0 0 11px; }
.qopt  { display:flex; align-items:flex-start; gap:9px; padding:9px 12px; cursor:pointer;
         background:var(--sf); border:1px solid var(--ln); border-radius:var(--r); }
.qopt:hover { background:var(--sf-2); border-color:#d8dce1; }
.qopt input[type=radio] { flex:none; margin:3px 0 0; accent-color:var(--run); }
.qopt-l { flex:none; min-width:15px; font-family:var(--fm); font-size:12.5px;
          font-weight:500; color:var(--run); line-height:1.7; }
.qopt-t { flex:1; min-width:0; font-size:12.5px; line-height:1.7; color:var(--tx);
          background:none; border:0; box-shadow:none; padding:0; }
.qopt-t > :last-child { margin-bottom:0; }
.qopt-t ul, .qopt-t ol { margin:5px 0; }
.qopt-rec { flex:none; align-self:center; font-size:9.5px; font-weight:500; color:var(--ok);
            background:var(--ok-bg); padding:2px 6px; border-radius:var(--r); }
.qopt.on { border-color:var(--run); background:var(--run-bg); box-shadow:0 0 0 2px var(--run-bg); }
.qopt.on .qopt-l { font-weight:600; }
.qopt.other .qopt-l { color:var(--mu); }
.qopt.other .qopt-t { color:var(--mu); }
.qopt.other.on .qopt-l, .qopt.other.on .qopt-t { color:var(--tx); }

.qcard-in { background:var(--sf); }
.qcard.restored .qcard-in { border-color:var(--wait); }
.qcard-f { display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin-top:8px; }
.qcard-f input[type=file] { font-size:11.5px; max-width:230px; }
.qcard-f .upl-box { flex-basis:100%; margin-top:2px; }
.qcard-fh { flex:1; min-width:180px; font-size:11px; line-height:1.6; color:var(--mu); }

.qcard-redo { margin-top:10px; }
.qcard-redo > summary { font-size:11.5px; color:var(--run); cursor:pointer; width:max-content; }
.qcard-redo > summary::marker { color:var(--fa); }
.qcard-redo textarea { margin-top:8px; }

/* 底部提交条：整页一次提交，所以它得一直在视野里 */
.qbar { position:sticky; bottom:0; z-index:5; display:flex; align-items:center;
        gap:12px; flex-wrap:wrap; margin-top:16px; padding:12px 18px;
        background:var(--sf); border:1px solid var(--ln); border-radius:var(--r-2);
        box-shadow:0 -3px 14px rgba(21,24,29,.07); }
.qbar-c { font-size:12px; color:var(--mu); }
.qbar-c.on   { color:var(--ok); font-weight:500; }
.qbar-c.busy { color:var(--run); }
.qbar-h { margin-left:auto; font-size:11px; color:var(--fa); }

.chip.fill { background:var(--run-bg); color:var(--run); font-weight:500; }

/* 实时进度：SSE 日志 */
.log { background:#15181d; color:#c9d1d9; border-radius:var(--r-2); padding:15px 17px;
       font-family:var(--fm); font-size:11.5px; line-height:1.7; white-space:pre-wrap;
       word-break:break-word; max-height:66vh; overflow-y:auto; }
.log .ln-cmd { color:#7ee787; }
.log .ln-err { color:#ff7b72; }

/* 窄屏：侧栏收成横条 */
@media (max-width: 900px) {
  .app     { flex-direction:column; }
  .sidebar { width:100%; height:auto; position:static; flex-direction:row;
             align-items:center; gap:4px; overflow-x:auto; padding:8px 12px; }
  .sb-brand, .sb-sec { padding:0 8px 0 0; }
  .sb-foot { margin:0 0 0 auto; padding:0 0 0 10px; border-top:0; border-left:1px solid rgba(255,255,255,.08); }
  .sb-item { padding:5px 9px; border-radius:var(--r); }
  .sb-item.on { box-shadow:none; }
  .cols { grid-template-columns:minmax(0,1fr); }
}

/* 分块预上传：进度条 + 状态行（upload.js） */
.upl-zone { display:block; }
.upl-box { display:flex; flex-direction:column; gap:6px; margin-top:6px; }
.upl-row { display:flex; align-items:center; gap:8px; font-size:11.5px;
           padding:6px 9px; background:var(--sf-2); border:1px solid var(--ln); border-radius:var(--r); }
.upl-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.upl-size { color:var(--fa); flex:none; }
.upl-bar { width:64px; height:5px; flex:none; border-radius:3px; background:var(--ln); overflow:hidden; }
.upl-bar > i { display:block; height:100%; width:0; background:var(--run); transition:width .15s; }
.upl-status { flex:none; width:52px; color:var(--mu); }
.upl-status.ok  { color:var(--ok); }
.upl-status.err { color:var(--dead); }
.upl-x, .upl-retry { flex:none; border:0; background:none; cursor:pointer; color:var(--fa); font-size:13px; padding:0 2px; }
.upl-x:hover { color:var(--dead); }
.upl-retry { font-size:11px; color:var(--run); text-decoration:underline; }

/* 拖拽悬停高亮——附着在文件 input 的父元素上 */
.upl-drag { outline:2px dashed var(--run); outline-offset:2px; border-radius:var(--r); }

/* ────────────── 审批台账（audit.html / v5-audit） ──────────────
   回答两个问题：哪一关是谁批的、批的到底是什么。上半是可扫的总表，
   下半是可查的逐关时间线——事件本身是异构的（答复 / 驳回 / 放行），
   排成表会把「代批」「知情放行」这两种例外压平，而它们恰恰是最该被看见的。 */

.led-h    { display:flex; gap:26px; flex-wrap:wrap; padding:13px 16px; margin-bottom:14px;
            background:var(--sf); border:1px solid var(--ln); border-radius:var(--r); box-shadow:var(--sd); }
.led-h-k  { font-size:9.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--fa); margin-bottom:3px; }
.led-h-v  { font-size:13px; font-weight:500; }
.led-h-v.warn { color:var(--wait); }
.led-h-v.bad  { color:var(--dead); }

/* 总表：一关一行，扫「谁 / 何时 / 第几轮 / 批出了什么」 */
.led-g    { display:grid; grid-template-columns:150px 1fr 120px 96px 88px; gap:0; font-size:12px; }
.led-g > div { padding:8px 10px; border-bottom:1px solid var(--ln-2); min-width:0; }
.led-g > .hd { font-size:9.5px; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
               color:var(--fa); background:var(--sf-2); border-bottom:1px solid var(--ln); }
.led-g .num { text-align:right; font-family:var(--fm); font-size:11px; }
.led-g a { color:var(--tx); }
.led-g .none { color:var(--fa); }

/* 逐关时间线 */
.led-s    { margin-top:18px; }
.led-s-h  { display:flex; align-items:baseline; gap:10px; padding-bottom:8px;
            border-bottom:1px solid var(--ln); margin-bottom:2px; }
.led-s-id { font-family:var(--fm); font-size:11px; color:var(--run);
            background:var(--run-bg); padding:2px 6px; border-radius:var(--r); flex:none; }
.led-s-n  { font-size:14px; font-weight:600; }
.led-s-r  { margin-left:auto; font-size:11px; color:var(--mu); }
.led-s-r b { color:var(--tx); font-weight:500; }

.led-tl   { position:relative; padding:12px 0 4px 20px; }
.led-tl::before { content:''; position:absolute; left:4px; top:0; bottom:14px; width:1px; background:var(--ln); }
.led-ev   { position:relative; padding:0 0 15px; }
.led-ev::before { content:''; position:absolute; left:-19px; top:4px; width:7px; height:7px;
                  border-radius:50%; background:var(--idle); box-shadow:0 0 0 3px var(--bg); }
.led-ev.pass::before   { background:var(--ok); }
.led-ev.reject::before { background:var(--dead); }
.led-ev.answer::before { background:var(--run); }
.led-ev.run::before    { background:var(--wait); }

.led-l    { display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; }
.led-act  { font-size:12.5px; font-weight:600; }
.led-ev.pass   .led-act { color:var(--ok); }
.led-ev.reject .led-act { color:var(--dead); }
.led-at   { font-family:var(--fm); font-size:10.5px; color:var(--fa); }
.led-by   { font-size:12px; }
.led-by b { font-weight:600; }
.led-rd   { font-size:10.5px; color:var(--fa); font-family:var(--fm); }

/* 例外：代批、知情放行。这两条是 ADR-0014 的全部意义——越权可见而不是不可能，
   所以它们不能只是一行小字，得自带底色。 */
.led-x    { margin-top:7px; padding:8px 11px; border-radius:var(--r); font-size:11.5px; line-height:1.65; }
.led-x.proxy { background:var(--wait-bg); color:#92400e; }
.led-x.ovr   { background:var(--dead-bg); color:#991b1b; }
.led-x b  { display:block; font-size:10.5px; letter-spacing:.03em; margin-bottom:2px; }

.led-arts { display:flex; flex-wrap:wrap; gap:6px; margin-top:7px; }
.led-art  { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-family:var(--fm);
            padding:3px 8px; border-radius:var(--r); background:var(--ok-bg); color:#14532d; }
.led-art .v { font-weight:600; }
.led-txt  { margin-top:6px; padding:8px 11px; background:var(--sf-2); border:1px solid var(--ln);
            border-radius:var(--r); font-size:12px; line-height:1.7; white-space:pre-wrap; }

/* 答复成批出现（一关十几二十条），默认折叠成一行 */
.led-fold > summary { cursor:pointer; font-size:12px; color:var(--mu); width:max-content; }
.led-fold > summary::marker { color:var(--fa); }
.led-fold[open] > summary { margin-bottom:8px; }
.led-q    { display:grid; grid-template-columns:52px 1fr; gap:9px; padding:6px 0;
            border-top:1px solid var(--ln-2); font-size:12px; }
.led-q:first-of-type { border-top:0; }
.led-q-id { font-family:var(--fm); font-size:11px; color:var(--run); }
.led-q-t  { min-width:0; line-height:1.65; }
.led-q-t .src { display:block; font-size:10.5px; color:var(--fa); margin-top:2px; }

.led-empty { padding:11px 0 4px; font-size:12px; color:var(--fa); }

/* 过滤条 */
.led-f    { display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin:0 0 12px; }
.led-f .k { font-size:11px; color:var(--mu); margin-right:2px; }
.led-tab  { font-size:11.5px; padding:4px 10px; border-radius:var(--r); cursor:pointer;
            border:1px solid var(--ln); background:var(--sf); color:var(--mu); }
.led-tab:hover { background:var(--sf-2); }
.led-tab.on { background:var(--tx); border-color:var(--tx); color:#fff; }