
:root{
  --paper:#EDF0F3; --surface:#FFFFFF; --ink:#18222D; --ink2:#4A5866; --ink3:#7B8794;
  --line:#D5DBE2; --line2:#E6EAEE; --accent:#12508C; --accent-soft:#E3ECF6;
  --hi:#B8312F; --hi-soft:#F8E6E5; --rev:#A86A12; --rev-soft:#F7EEDD;
  --mid:#3B6EA8; --low:#6F8FB0; --ref:#98A6B4; --skip:#B3BBC4; --ok:#2F7A4F; --ok-soft:#E2F1E8;
  --r-s:4px; --r-m:8px;
  --font:"PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:var(--font);font-size:14px;line-height:1.55;color:var(--ink);background:var(--paper);font-variant-numeric:tabular-nums}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
a{color:var(--accent)}
.hidden{display:none!important}

/* 顶栏 */
.top{display:flex;align-items:center;gap:20px;height:52px;padding:0 20px;background:var(--ink);color:#E9EEF3}
.brand{font-weight:600;font-size:16px;letter-spacing:.5px;white-space:nowrap}
.brand small{font-weight:400;color:#9FB0C0;margin-left:8px;font-size:12px}
.task-switch{display:flex;background:#24313F;border-radius:var(--r-m);padding:3px}
.task-switch button{border:0;background:transparent;color:#C7D2DC;padding:5px 12px;border-radius:6px;white-space:nowrap}
.task-switch button[aria-pressed=true]{background:#E9EEF3;color:var(--ink);font-weight:600}
.task-switch .badge{display:inline-block;margin-left:6px;font-size:11px;padding:0 6px;border-radius:9px;background:#3A4A5B;color:#E9EEF3}
.task-switch button[aria-pressed=true] .badge{background:var(--accent);color:#fff}
nav.main{display:flex;gap:4px;margin-left:auto}
nav.main a{color:#C7D2DC;text-decoration:none;padding:6px 10px;border-radius:6px}
nav.main a[aria-current=page]{color:#fff;background:#24313F}
.me{display:flex;align-items:center;gap:10px;color:#C7D2DC;font-size:13px;white-space:nowrap}
.me .warn{color:#F2C46D}

/* 运行条 */
.runbar{display:flex;align-items:center;gap:18px;padding:10px 20px;background:var(--surface);border-bottom:1px solid var(--line);font-size:13px;color:var(--ink2);flex-wrap:wrap}
.run-state{display:flex;align-items:center;gap:8px;color:var(--ink)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--ok-soft)}
.dot.off{background:var(--ink3);box-shadow:0 0 0 3px var(--line2)}
.runbar .k{color:var(--ink3);margin-right:4px}
.runbar .spacer{flex:1}
.btn{border:1px solid var(--line);background:var(--surface);padding:5px 12px;border-radius:var(--r-s)}
.btn:hover{border-color:var(--ink3)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{background:#0E4373}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.danger{color:var(--hi);border-color:#E3B9B8}
.btn.small{padding:2px 8px;font-size:12.5px}

/* 筛选台 */
.desk{display:grid;grid-template-columns:232px 1fr;min-height:calc(100vh - 52px - 45px)}
.rail{background:var(--surface);border-right:1px solid var(--line);padding:16px 0}
.rail h3{font-size:12.5px;font-weight:600;color:var(--ink3);margin:0 18px 8px}
.rail h3 + .hint{margin:-6px 18px 10px;font-size:12px;color:var(--ink3)}
.tri{display:block;width:100%;text-align:left;border:0;background:transparent;padding:7px 18px 7px 15px;border-left:3px solid transparent}
.tri:hover{background:var(--paper)}
.tri[aria-pressed=true]{background:var(--accent-soft);border-left-color:var(--accent)}
.tri .row1{display:flex;justify-content:space-between;align-items:baseline}
.tri .name{font-weight:600}
.tri .num{font-size:15px;font-weight:600}
.tri .bar{height:6px;margin-top:5px;background:var(--line2);border-radius:3px;overflow:hidden}
.tri .bar i{display:block;height:100%;border-radius:3px}
.tri .sub{font-size:12px;color:var(--ink3)}
.rail .sep{height:1px;background:var(--line2);margin:12px 18px}
.c-hi{--c:var(--hi)} .c-mid{--c:var(--mid)} .c-low{--c:var(--low)} .c-ref{--c:var(--ref)} .c-skip{--c:var(--skip)} .c-rev{--c:var(--rev)} .c-noise{--c:#8E99A5} .c-rule{--c:#C3CAD1}
.tri .bar i{background:var(--c)}
.tri .name::before{content:"";display:inline-block;width:8px;height:8px;border-radius:2px;background:var(--c);margin-right:8px;vertical-align:1px}

.work{padding:14px 20px 40px;min-width:0}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.filters .lbl{font-size:12.5px;color:var(--ink3);margin-right:2px}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:2px 10px;font-size:12.5px}
.chip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.search{border:1px solid var(--line);border-radius:var(--r-s);padding:4px 10px;width:220px;background:var(--surface)}
.toolbar{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--surface);border:1px solid var(--line);border-bottom:0;border-radius:var(--r-m) var(--r-m) 0 0;font-size:13px}
.toolbar .count{color:var(--ink2)}
.toolbar .spacer{flex:1}
.list{background:var(--surface);border:1px solid var(--line);border-radius:0 0 var(--r-m) var(--r-m)}
.item{display:grid;grid-template-columns:28px 64px 1fr auto;gap:10px;padding:10px 12px;border-top:1px solid var(--line2);align-items:start}
.item:first-child{border-top:0}
.item:hover{background:#F7F9FB}
.item.sel{background:var(--accent-soft)}
.item input{margin-top:4px}
.pri{font-size:12px;font-weight:600;padding:1px 0;border-radius:var(--r-s);text-align:center;color:#fff;background:var(--c)}
.pri.c-ref,.pri.c-skip,.pri.c-noise{color:var(--ink)}
.ttl{font-weight:600;cursor:pointer;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ttl:hover{color:var(--accent)}
.meta{font-size:12.5px;color:var(--ink3);display:flex;gap:12px;flex-wrap:wrap;margin-top:2px}
.tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:5px}
.tag{font-size:12px;padding:0 7px;border-radius:var(--r-s);background:var(--paper);color:var(--ink2);border:1px solid var(--line2)}
.tag.neg{background:var(--hi-soft);color:var(--hi);border-color:#EBC5C4}
.tag.rev{background:var(--rev-soft);color:var(--rev);border-color:#E8D3AE}
.tag.lex{background:#FFF;color:var(--hi);border-color:#EBC5C4;border-style:dashed}
.side{text-align:right;font-size:12.5px;color:var(--ink3);white-space:nowrap}
.grp{display:inline-block;margin-top:4px;border:1px solid var(--line);border-radius:10px;padding:0 8px;font-size:12px;color:var(--ink2);background:var(--surface)}
.grp:hover{border-color:var(--accent);color:var(--accent)}
.groupkids{grid-column:3/5;margin-top:6px;border-left:2px solid var(--line);padding-left:10px;font-size:12.5px;color:var(--ink2)}
.groupkids div{padding:2px 0}
.more{padding:10px 12px;text-align:center;color:var(--ink3);font-size:12.5px;border-top:1px solid var(--line2)}

/* 抽屉 */
.drawer{position:fixed;top:0;right:0;width:min(520px,100%);height:100%;background:var(--surface);border-left:1px solid var(--line);transform:translateX(100%);visibility:hidden;transition:transform .2s ease;z-index:20;display:flex;flex-direction:column}
.drawer.open{transform:none;visibility:visible;box-shadow:-12px 0 32px rgba(24,34,45,.12)}
.drawer header{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:flex-start}
.drawer header h2{font-size:16px;margin:0;line-height:1.45;flex:1}
.drawer .body{padding:14px 18px;overflow:auto;flex:1}
.drawer .body h4{margin:16px 0 6px;font-size:13px;color:var(--ink2)}
.drawer .body p{margin:0 0 8px}
.drawer footer{padding:12px 18px;border-top:1px solid var(--line);display:flex;gap:8px;justify-content:flex-end}
.kv{display:grid;grid-template-columns:96px 1fr;gap:4px 10px;font-size:13px}
.kv dt{color:var(--ink3)}
.kv dd{margin:0}
.prob{display:grid;grid-template-columns:46px 1fr 44px;gap:8px;align-items:center;font-size:12.5px;margin:3px 0}
.prob .b{height:8px;background:var(--line2);border-radius:4px;overflow:hidden}
.prob .b i{display:block;height:100%;background:var(--mid)}
.prob.neg .b i{background:var(--hi)}
.cmp{font-size:12.5px;border-collapse:collapse;width:100%}
.cmp td,.cmp th{border-bottom:1px solid var(--line2);padding:4px 6px;text-align:left}
.cmp th{color:var(--ink3);font-weight:400}

/* 弹窗 */
.scrim{position:fixed;inset:0;background:rgba(24,34,45,.38);display:flex;align-items:center;justify-content:center;z-index:30}
.modal{background:var(--surface);border-radius:var(--r-m);width:min(460px,92%);box-shadow:0 20px 50px rgba(24,34,45,.25)}
.modal h3{margin:0;padding:16px 20px 6px;font-size:16px}
.modal .mb{padding:6px 20px 14px;color:var(--ink2)}
.modal .mb label{display:flex;gap:8px;align-items:center;margin:6px 0;color:var(--ink)}
.modal .mf{padding:12px 20px;border-top:1px solid var(--line2);display:flex;justify-content:flex-end;gap:8px}
.big{font-size:22px;font-weight:600;color:var(--ink)}
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:10px 16px;border-radius:var(--r-m);font-size:13.5px;z-index:40}

/* 通用页面 */
.page{padding:20px 24px 48px;max-width:1180px}
.page h1{font-size:20px;margin:0 0 4px}
.page .lead{color:var(--ink2);margin:0 0 18px;max-width:72ch}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);margin-bottom:16px}
.panel > h2{font-size:15px;margin:0;padding:12px 16px;border-bottom:1px solid var(--line2);display:flex;align-items:center;gap:10px}
.panel > h2 .note{font-weight:400;font-size:12.5px;color:var(--ink3)}
.panel .pb{padding:12px 16px}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:14px}
.tabs button{border:0;background:transparent;padding:8px 14px;border-bottom:2px solid transparent;color:var(--ink2)}
.tabs button[aria-selected=true]{color:var(--ink);font-weight:600;border-bottom-color:var(--accent)}
table.t{width:100%;border-collapse:collapse;font-size:13px}
table.t th{text-align:left;font-weight:400;color:var(--ink3);padding:8px 12px;border-bottom:1px solid var(--line)}
table.t td{padding:8px 12px;border-bottom:1px solid var(--line2);vertical-align:top}
table.t tr:last-child td{border-bottom:0}
code{font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:12.5px;background:var(--paper);padding:1px 5px;border-radius:3px}
.form{display:grid;grid-template-columns:120px 1fr;gap:10px 14px;align-items:center}
.form input[type=text],.form select,.form input[type=number],.form input[type=date],.form textarea{border:1px solid var(--line);border-radius:var(--r-s);padding:5px 9px;background:var(--surface);width:100%;max-width:420px}
.form .help{grid-column:2;font-size:12.5px;color:var(--ink3);margin-top:-6px}
.radio-card{display:flex;gap:10px;flex-wrap:wrap}
.radio-card label{border:1px solid var(--line);border-radius:var(--r-m);padding:10px 12px;width:280px;display:flex;gap:10px;cursor:pointer}
.radio-card label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.radio-card b{display:block}
.radio-card span{font-size:12.5px;color:var(--ink2)}
.switch{position:relative;display:inline-block;width:34px;height:20px}
.switch input{opacity:0;width:0;height:0}
.switch span{position:absolute;inset:0;background:#C7CED6;border-radius:10px;transition:.15s}
.switch span::after{content:"";position:absolute;width:16px;height:16px;left:2px;top:2px;background:#fff;border-radius:50%;transition:.15s}
.switch input:checked + span{background:var(--accent)}
.switch input:checked + span::after{transform:translateX(14px)}
.switch input:focus-visible + span{outline:2px solid var(--accent);outline-offset:2px}
.status-ok{color:var(--ok)} .status-warn{color:var(--rev)} .status-bad{color:var(--hi)}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.stat b{font-size:20px;display:block}
.stat span{color:var(--ink3);font-size:12.5px}

/* 登录 */
.login{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}
.login .l{background:var(--ink);color:#E9EEF3;padding:56px 56px;display:flex;flex-direction:column;justify-content:space-between}
.login .l h1{font-size:30px;line-height:1.35;margin:0 0 14px;font-weight:600;max-width:15em}
.login .l p{color:#A9B8C6;max-width:30em}
.login .flow{display:flex;flex-direction:column;gap:10px;margin-top:32px;font-size:13.5px;color:#C7D2DC}
.login .flow div{display:flex;gap:12px;align-items:center}
.login .flow b{display:inline-flex;width:26px;height:26px;border-radius:50%;border:1px solid #4A5B6C;align-items:center;justify-content:center;font-weight:400;font-size:12.5px}
.login .r{display:flex;align-items:center;justify-content:center;padding:32px}
.login form{width:340px}
.login form h2{margin:0 0 4px;font-size:20px}
.login form .lead{color:var(--ink2);margin:0 0 20px;font-size:13.5px}
.login label{display:block;font-size:13px;color:var(--ink2);margin:12px 0 4px}
.login input{width:100%;border:1px solid var(--line);border-radius:var(--r-s);padding:8px 10px;background:var(--surface)}
.login .row{display:flex;gap:8px}
.login .btn.primary{width:100%;padding:9px;margin-top:20px}
.login .fine{font-size:12.5px;color:var(--ink3);margin-top:14px}

/* 分行筛选 */
.fgrid{display:grid;grid-template-columns:64px 1fr;gap:6px 10px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:10px 12px;margin-bottom:10px}
.fgrid .lbl{font-size:12.5px;color:var(--ink3)}
.fgrid .opts{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.fgrid .sub-lbl{font-size:12px;color:var(--ink3);margin:0 2px 0 6px}
.fgrid .sub-lbl:first-child{margin-left:0}
.fgrid .range{font-size:12.5px;color:var(--ink2);margin-left:6px}
.fgrid .more-f{grid-column:1/3;font-size:12.5px}
.snip{font-size:12.5px;color:var(--ink2);margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.snip mark{background:var(--hi-soft);color:var(--hi);padding:0 1px}
body.no-snip .snip{display:none}
.side .acts{display:flex;gap:6px;justify-content:flex-end;margin-bottom:4px}
.read-flag{font-size:12px;color:var(--ok)}
.pager{display:flex;align-items:center;gap:6px;justify-content:flex-end;padding:10px 12px;border-top:1px solid var(--line2);font-size:12.5px;color:var(--ink2);flex-wrap:wrap}
.pager .spacer{flex:1}
.pager button{border:1px solid var(--line);background:var(--surface);border-radius:var(--r-s);min-width:28px;padding:1px 7px}
.pager button[aria-current=page]{background:var(--ink);border-color:var(--ink);color:#fff}
.pager select{border:1px solid var(--line);border-radius:var(--r-s);background:var(--surface);padding:1px 4px}
.runbar .alert{color:var(--rev)}
.rtag{font-size:12px;padding:0 7px;border-radius:9px;background:var(--accent-soft);color:var(--accent);margin-right:4px;white-space:nowrap}
.rule-note{font-size:12.5px;color:var(--ink2)}
.zero{color:var(--rev)}

@media (max-width:900px){
  .desk{grid-template-columns:1fr}
  .rail{border-right:0;border-bottom:1px solid var(--line);display:flex;overflow:auto;padding:8px}
  .rail h3,.rail .hint,.rail .sep{display:none}
  .tri{min-width:120px}
  nav.main{display:none}
  .cards3{grid-template-columns:1fr}
  .login{grid-template-columns:1fr}
  .login .l{display:none}
  .item{grid-template-columns:24px 52px 1fr}
  .item .side{grid-column:3;text-align:left}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

.top{height:auto;min-height:52px;flex-wrap:wrap;padding:10px 20px;gap:14px}.item{grid-template-columns:24px 1fr auto}.ttl{white-space:normal;text-align:left;border:0;background:none;padding:0}.table-wrap{overflow:auto}table.t td{overflow-wrap:anywhere}td.pattern{max-width:420px;min-width:180px}.toolbar{flex-wrap:wrap}.empty{padding:48px 20px;text-align:center;color:var(--ink3)}.error{color:var(--hi)}.alert{color:var(--rev)}.node-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px;max-height:260px;overflow:auto}.modal.wide{width:min(760px,96%);max-height:92vh;overflow:auto}.modal .form{grid-template-columns:100px 1fr}.modal textarea{min-height:70px}pre{white-space:pre-wrap;overflow-wrap:anywhere}.busy{opacity:.6;pointer-events:none}details>summary{cursor:pointer}nav.main{flex-wrap:wrap}.form select[multiple]{height:116px}.kv dd{overflow-wrap:anywhere}.progress{color:var(--accent)}@media(max-width:900px){nav.main{display:flex;width:100%;order:3}.top{gap:8px}.work{padding:10px}.page{padding:16px}.me{margin-left:auto}.item{grid-template-columns:22px 1fr}.item .side{grid-column:2}.form,.modal .form{grid-template-columns:1fr}.form .help{grid-column:1}.fgrid{grid-template-columns:50px 1fr}.login .r{padding:22px}}
.me a{color:#C7D2DC}
