:root{--bg:#f4f6f9;--card:#fff;--ink:#1f2937;--mute:#6b7280;--line:#e5e7eb;--pri:#2563eb;--pri-bg:#eff4ff;--ok:#16a34a;--warn:#d97706;--err:#dc2626;--side:#1e293b;--code:#0f172a}
@media(prefers-color-scheme:dark){:root{--bg:#0f172a;--card:#1e293b;--ink:#e5e7eb;--mute:#94a3b8;--line:#334155;--pri:#60a5fa;--pri-bg:#1e3a5f;--side:#020617;--code:#020617}}
*{box-sizing:border-box}
body{margin:0;font:14px/1.5 -apple-system,"Segoe UI","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--ink)}
[hidden]{display:none!important}
.app{display:flex;min-height:100vh}
aside{width:200px;background:var(--side);color:#cbd5e1;flex:none;display:flex;flex-direction:column}
aside h1{font-size:15px;margin:0;padding:16px;color:#fff;border-bottom:1px solid #334155}
aside nav a{display:flex;justify-content:space-between;padding:11px 16px;color:inherit;text-decoration:none;cursor:pointer;border-left:3px solid transparent}
aside nav a:hover,aside nav a.on{background:#334155}aside nav a.on{color:#fff;border-color:var(--pri)}
aside .foot{margin-top:auto;padding:12px 16px;font-size:12px;color:#94a3b8;border-top:1px solid #334155}
.badge{background:var(--warn);color:#fff;border-radius:9px;padding:0 7px;font-size:12px}
main{flex:1;min-width:0}
header{background:var(--card);border-bottom:1px solid var(--line);padding:10px 20px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.sp{flex:1}
#view{padding:20px;width:100%}
.pill{font-size:12px;padding:2px 9px;border-radius:10px;background:var(--pri-bg);color:var(--pri)}
.pill.ok{background:#dcfce7;color:#166534}.pill.warn{background:#fef3c7;color:#92400e}.pill.err{background:#fee2e2;color:#991b1b}
.card{background:var(--card);border:1px solid var(--line);border-radius:8px;margin-bottom:16px}
.card>h3{margin:0;padding:12px 16px;font-size:14px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.card>h3 small{color:var(--mute);font-weight:400}.card .bd{padding:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px 18px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:16px}
.stats .card{margin:0}
label.f{display:block;font-size:12px;color:var(--mute)}label.f>span{display:block;margin-bottom:3px}label.f b{color:var(--err)}
input,select,textarea{width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);font:inherit}
input[type=checkbox],input[type=radio]{width:auto}
input:focus,select:focus,textarea:focus{outline:2px solid var(--pri);outline-offset:-1px}
textarea{font-family:Consolas,monospace;font-size:12.5px;min-height:110px}
.hint{font-size:12px;color:var(--mute);margin-top:3px}
button{padding:7px 14px;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);cursor:pointer;font:inherit}
button:hover{border-color:var(--pri)}button.p{background:var(--pri);border-color:var(--pri);color:#fff}button.d{color:var(--err)}
button:disabled{opacity:.5;cursor:not-allowed}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden;flex-wrap:wrap}
.seg button{border:0;border-radius:0;border-right:1px solid var(--line)}.seg button:last-child{border:0}.seg button.on{background:var(--pri);color:#fff}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:12px;color:var(--mute);font-weight:500;background:var(--bg)}tr:hover td{background:var(--pri-bg)}
.tag{display:inline-block;padding:1px 8px;border-radius:4px;background:var(--bg);border:1px solid var(--line);font-size:12px;margin:1px}
pre{margin:0;background:var(--code);color:#e2e8f0;padding:12px 14px;border-radius:6px;overflow:auto;font:12.5px/1.6 Consolas,monospace;max-height:320px;white-space:pre-wrap;word-break:break-all}
.split{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;align-items:start}
.sticky{position:sticky;top:12px}
.chips label{display:inline-flex;align-items:center;gap:4px;margin:2px 10px 2px 0;font-size:13px;color:var(--ink)}
.chk{display:flex;gap:6px;align-items:center;font-size:13px}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ck{list-style:none;margin:0;padding:0}.ck li{padding:3px 0;font-size:13px}
.ck li:before{content:"✔ ";color:var(--ok)}.ck li.bad:before{content:"✖ ";color:var(--err)}.ck li.bad{color:var(--err)}
.ck li.warn:before{content:"⚠ ";color:var(--warn)}
.bar{position:sticky;bottom:0;background:var(--card);border-top:1px solid var(--line);padding:10px 20px;display:flex;gap:10px;align-items:center;margin:0 -20px -20px}
.note{background:#fffbeb;border:1px solid #fde68a;color:#92400e;padding:8px 12px;border-radius:6px;font-size:12.5px;margin-bottom:12px}
.err{color:var(--err);font-size:13px;min-height:20px}
.toast{position:fixed;right:20px;top:16px;background:#111827;color:#fff;padding:10px 16px;border-radius:6px;opacity:0;transition:.25s;pointer-events:none;z-index:400;max-width:420px}
.toast.on{opacity:1}.toast.bad{background:#991b1b}
.add{color:#4ade80}.del{color:#f87171}.old{color:var(--mute);text-decoration:line-through}
.ro .w{display:none!important}
.chg{border-bottom:1px solid var(--line);padding:10px 0}.chg:last-child{border:0}
.mono{font-family:Consolas,monospace;font-size:12.5px}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;z-index:5}
.modal.on{display:flex}
.modal .box{background:var(--card);border-radius:10px;width:min(680px,94vw);max-height:90vh;overflow:auto;border:1px solid var(--line)}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px}
.tabs a{padding:8px 16px;cursor:pointer;border-bottom:2px solid transparent;color:var(--mute);text-decoration:none}
.tabs a.on{color:var(--pri);border-color:var(--pri)}
.flow{display:inline-flex;align-items:center;gap:6px}.flow i{color:var(--mute);font-style:normal}
button.s{padding:3px 9px;font-size:12px}
.pill.gray{background:var(--bg);color:var(--mute);border:1px solid var(--line)}
a{color:inherit;text-decoration:none}
.manual{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;align-items:start}
.mtoc{position:sticky;top:12px;display:flex;flex-direction:column;gap:2px;font-size:12.5px;max-height:calc(100vh - 80px);overflow:auto}
.mtoc b{margin-bottom:4px}.mtoc a{color:var(--mute);text-decoration:none;padding:4px 8px;border-radius:5px}.mtoc a:hover{background:var(--pri-bg);color:var(--pri)}
.md{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px 28px 24px;line-height:1.7;font-size:14px;min-width:0}
.md h1{font-size:22px}.md h2{font-size:18px;margin-top:32px;padding-bottom:6px;border-bottom:1px solid var(--line)}.md h3{font-size:15px;margin-top:22px}.md h4{font-size:14px}
.md h1,.md h2,.md h3,.md h4{scroll-margin-top:12px}
.md code{font-family:Consolas,monospace;font-size:12.5px;color:var(--ink);background:var(--pri-bg);padding:1px 5px;border-radius:4px}
.md pre{background:var(--code);color:#e2e8f0;padding:12px 14px;border-radius:6px;overflow:auto}.md pre code{background:none;padding:0;color:inherit}
.md blockquote{margin:12px 0;padding:8px 14px;border-left:3px solid var(--pri);background:var(--pri-bg);color:var(--ink)}
.md .mdt{overflow:auto;margin:10px 0}.md table th{background:var(--pri-bg);white-space:nowrap}.md td,.md th{padding:6px 10px;font-size:13px;vertical-align:top}
.md a{color:var(--pri)}.md hr{border:0;border-top:1px solid var(--line)}
@media(max-width:900px){.manual{grid-template-columns:1fr}.mtoc{position:static;max-height:none}}
.audit tr.exp{cursor:pointer}.audit tr.exp:hover{background:var(--pri-bg)}
.audit .chrow>td{background:var(--bg);padding:8px 16px}
table.chg{background:var(--card)}table.chg td,table.chg th{padding:5px 10px;font-size:12.5px}
.chg .old{color:var(--err)}.chg .new{color:var(--ok)}
.logbox{height:460px;overflow:auto;background:var(--code);color:#e2e8f0;font:12.5px/1.55 Consolas,monospace;padding:8px 0}
.ll{display:flex;gap:10px;padding:1px 14px;white-space:pre-wrap;word-break:break-all}.ll:hover{background:rgba(255,255,255,.06)}
.ll .lt{color:#94a3b8;flex:none}.ll .lv{width:38px;flex:none;font-weight:700}.ll .lm{flex:1;min-width:0}
.ll.error .lv,.ll.error .lm{color:#f87171}.ll.warn .lv{color:#fbbf24}.ll.info .lv{color:#4ade80}.ll.debug .lv{color:#94a3b8}.ll.debug .lm{color:#94a3b8}

/* ---------------- 自适应：随屏幕宽度与系统主题自动调整 ---------------- */
html{color-scheme:light dark}
aside{width:clamp(168px,14vw,232px)}
#view{padding:clamp(10px,1.6vw,28px)}
header{padding:10px clamp(10px,1.6vw,28px)}
.bar{padding:10px clamp(10px,1.6vw,28px);margin:0 calc(-1 * clamp(10px,1.6vw,28px)) calc(-1 * clamp(10px,1.6vw,28px))}
.card{overflow-x:auto}
.card>h3{overflow:visible}
.grid{grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr))}
.nm{margin-left:2px}
@media(max-width:1100px){
  .split{grid-template-columns:1fr}
  aside{width:56px}
  aside h1,aside .foot,aside .nm{display:none}
  aside nav a{justify-content:center;padding:11px 6px;position:relative}
  aside nav a span:first-child{font-size:16px}
  aside nav a .badge{position:absolute;top:2px;right:4px;padding:0 5px;font-size:10px}
}
@media(max-width:700px){
  .app{flex-direction:column}
  aside{width:100%;flex-direction:row;overflow-x:auto;-webkit-overflow-scrolling:touch}
  aside nav{display:flex}
  aside nav a{border-left:0;border-bottom:3px solid transparent;padding:10px 14px;flex:none}
  aside nav a.on{border-color:var(--pri)}
  header{gap:8px}
  .stats{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
  th,td{padding:8px}
  .logbox{height:60vh}
  .toast{left:10px;right:10px;max-width:none}
}
@media(min-width:1800px){#view{font-size:15px}}
@media(prefers-color-scheme:dark){
  .pill.ok{background:#14532d;color:#bbf7d0}.pill.warn{background:#78350f;color:#fde68a}.pill.err{background:#7f1d1d;color:#fecaca}
  .note{background:#3b2f0b;border-color:#6b5513;color:#fde68a}
  th{background:#162033}
}
/* 窄屏：表格保持可读宽度，卡片内横向滚动，而不是把文字挤成竖条 */
.pill,.tag{white-space:nowrap}
@media(max-width:700px){.card>table{min-width:560px}td button,td .s{white-space:nowrap}.md .mdt table{min-width:480px}}

/* 页签窄屏不折行，超出时横向滑动 */
.tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}.tabs a{white-space:nowrap;flex:none}

/* 单选组：每项带鼠标悬停的功能说明 */
.radios{display:flex;flex-wrap:wrap;gap:8px 22px;padding:6px 0}
.rd{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ink);cursor:help}
.rd input{width:auto}
.tipic{font-style:normal;color:var(--pri);font-size:12px;border:1px solid var(--pri);border-radius:50%;width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;opacity:.8}
.rd:hover .tipic{opacity:1;background:var(--pri-bg)}

/* 运行状态页：操作卡片与全量同步进度条 */
.pbar{height:8px;border-radius:4px;background:var(--line);overflow:hidden}.pbar i{display:block;height:100%;background:linear-gradient(90deg,var(--pri),#2563eb);transition:width .35s}
.opsgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(360px,100%),1fr));gap:16px;margin-bottom:16px}.opsgrid>.card{margin:0}
.kv{display:grid;grid-template-columns:96px 1fr;gap:6px 10px;font-size:13px}.kv span:nth-child(odd){color:var(--mute)}

/* 任务架构图 */
a.tl{color:inherit;text-decoration:none}a.tl:hover b{color:var(--pri);text-decoration:underline}
.archbox{position:relative;overflow:auto;color:#e2e8f0;background:var(--bg0)}
.archbox:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(148,163,184,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.06) 1px,transparent 1px);background-size:40px 40px;pointer-events:none}
.archbox svg{position:relative;display:block;width:100%;max-width:960px;min-width:720px;margin:0 auto;height:auto}
.archstat{display:flex;flex-wrap:wrap;gap:8px 18px;padding:12px 16px;border-bottom:1px solid rgba(var(--pri-rgb),.18);font:12px/1.4 Consolas,monospace;color:#94a3b8;background:#020617}
.archstat b{color:#e2e8f0;font-weight:600}.archstat .on{color:#4ade80}.archstat .bad{color:#f87171}
.archleg{display:flex;flex-wrap:wrap;gap:6px 18px;padding:8px 16px 12px;font-size:12px;color:#94a3b8;background:var(--bg0);border-radius:0 0 8px 8px}
.archleg i{display:inline-block;width:22px;border-top:2px dashed var(--pri);vertical-align:middle;margin-right:6px}
.archleg i.cfg{border-color:#64748b}.archleg i.dot{width:8px;height:8px;border:0;border-radius:50%;background:var(--pri);box-shadow:0 0 8px var(--pri)}
.archsvg .ln{fill:none;stroke:var(--pri);stroke-width:2;stroke-dasharray:6 7;animation:adash 1.1s linear infinite}
.archsvg .ln.dim{stroke:#475569;animation:none;opacity:.7}
.archsvg .cfg{fill:none;stroke:#64748b;stroke-width:1.4;stroke-dasharray:3 6;opacity:.8}
@keyframes adash{to{stroke-dashoffset:-26}}
.archsvg text{font-family:-apple-system,"Segoe UI","Microsoft YaHei",sans-serif}.archsvg .m{font-family:Consolas,monospace}
.archsvg .node{transition:filter .2s}.archsvg .node:hover{filter:drop-shadow(0 0 10px rgba(var(--pri-rgb),.55))}
.archsvg .pulse{animation:apulse 2.4s ease-in-out infinite}@keyframes apulse{50%{opacity:.35}}

/* ---------------- 首页大屏：实时同步任务 ---------------- */
.hero{position:relative;overflow:hidden;border-radius:14px;margin-bottom:16px;color:#e2e8f0;border:1px solid rgba(var(--pri-rgb),.25);
  background:radial-gradient(900px 300px at 15% -20%,rgba(var(--pri-rgb),.22),transparent 60%),radial-gradient(700px 320px at 100% 120%,rgba(var(--ac2-rgb),.28),transparent 60%),var(--bg0);
  box-shadow:0 0 0 1px rgba(255,255,255,.03) inset,0 18px 50px rgba(2,6,23,.45),0 0 60px rgba(var(--pri-rgb),.08)}
.hero .hgrid{position:absolute;inset:-40px;background-image:linear-gradient(rgba(148,163,184,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.07) 1px,transparent 1px);background-size:40px 40px;
  mask-image:radial-gradient(circle at 40% 40%,#000,transparent 75%);-webkit-mask-image:radial-gradient(circle at 40% 40%,#000,transparent 75%);animation:drift 24s linear infinite}
.hero:after{content:"";position:absolute;left:0;right:0;height:90px;top:-90px;background:linear-gradient(180deg,transparent,rgba(var(--pri-rgb),.10),transparent);animation:scan 6s linear infinite;pointer-events:none}
@keyframes scan{to{transform:translateY(420px)}}
.hwrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:16px;padding:22px 26px 8px}
.hk{font-size:11px;letter-spacing:4px;color:var(--pri)}
.hbig{display:flex;align-items:baseline;gap:10px;margin:6px 0 4px}
.hbig b{font:700 56px/1 Consolas,"Courier New",monospace;color:#f8fafc;text-shadow:0 0 22px rgba(var(--pri-rgb),.65),0 0 2px var(--pri)}
.hbig span{color:var(--ac-hi);font-size:13px;letter-spacing:2px}
.hs{font-size:12.5px;color:#a3b2c7}.hs b{color:#e2e8f0}
.hwave{width:100%;height:120px;display:block}
.hwave .ar{fill:url(#lvg)}.hwave .ln2{fill:none;stroke:var(--pri);stroke-width:2;filter:drop-shadow(0 0 5px var(--pri))}
.hwave .gl{stroke:rgba(148,163,184,.14);stroke-width:1}
.hkpi{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;padding:10px 26px 22px}
.hkpi div{border:1px solid rgba(var(--pri-rgb),.18);background:rgba(15,23,42,.55);border-radius:10px;padding:10px 14px;backdrop-filter:blur(6px)}
.hkpi small{display:block;font-size:11px;color:#a3b2c7;letter-spacing:1px}.hkpi b{font:600 22px Consolas,monospace;color:#e2e8f0}
.hkpi b.ok{color:#4ade80;text-shadow:0 0 12px rgba(74,222,128,.5)}.hkpi b.bad{color:#f87171}
.live{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:#4ade80;letter-spacing:2px}.live i{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 10px #4ade80;animation:apulse 1.6s ease-in-out infinite}
.sech{display:flex;align-items:center;gap:10px;margin:4px 2px 12px;font-size:13px;color:var(--mute)}.sech b{color:var(--ink);font-size:15px}
.pipes{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:16px;margin-bottom:16px}
.pipe{position:relative;border-radius:14px;padding:16px 18px 14px;cursor:pointer;color:#e2e8f0;border:1px solid rgba(var(--pri-rgb),.28);overflow:hidden;
  background:linear-gradient(160deg,var(--pipe-a),var(--pipe-b));box-shadow:0 10px 30px rgba(2,6,23,.35);transition:transform .2s,box-shadow .2s,border-color .2s}
.pipe:hover{transform:translateY(-3px);border-color:var(--pri);box-shadow:0 14px 40px rgba(2,6,23,.5),0 0 28px rgba(var(--pri-rgb),.22)}
.pipe:before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:linear-gradient(90deg,transparent,var(--pri),var(--ac2),transparent);opacity:.9}
.pipe.off{border-color:rgba(100,116,139,.35);filter:saturate(.35)}.pipe.off:before{opacity:.15}.pipe.err{border-color:rgba(248,113,113,.55)}
.pipe .ph{display:flex;align-items:center;gap:8px;margin-bottom:12px}.pipe .ph b{font-size:15px;color:#f1f5f9}.pipe .ph .sp{flex:1}
.pipe .ph .id{font:11px Consolas,monospace;color:#8a99b0}
.pipe .pp{display:grid;grid-template-columns:116px minmax(0,1fr) 116px;align-items:center;gap:6px}
.pipe .nd{border-radius:10px;padding:8px 10px;font-size:12px;line-height:1.35;min-height:62px;display:flex;flex-direction:column;justify-content:center}
.pipe .nd.u{background:rgba(var(--ac-bg-rgb),.6);border:1px solid rgba(var(--pri-rgb),.5)}.pipe .nd.d{background:rgba(var(--ac2-bg-rgb),.6);border:1px solid rgba(var(--ac2-rgb),.55)}
.pipe .nd b{color:#f1f5f9;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pipe .nd span{color:#94a3b8;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pipe .tube{width:100%;height:30px;display:block}
.pipe .tube .bg{stroke:rgba(var(--pri-rgb),.18);stroke-width:6;stroke-linecap:round;fill:none}
.pipe .tube .fl{stroke:var(--pri);stroke-width:2;stroke-dasharray:5 7;fill:none;animation:adash .9s linear infinite;filter:drop-shadow(0 0 4px var(--pri))}
.pipe.off .tube .fl{animation:none;stroke:#475569;filter:none}
.pipe .rate{display:flex;align-items:baseline;gap:6px;margin:12px 0 2px}
.pipe .rate b{font:700 28px Consolas,monospace;color:#f8fafc;text-shadow:0 0 14px rgba(var(--pri-rgb),.55)}.pipe .rate span{font-size:11px;color:var(--ac-hi);letter-spacing:1px}
.pipe .spk{width:100%;height:46px;display:block}.pipe .spk .ar{fill:rgba(var(--pri-rgb),.12)}.pipe .spk .ln2{fill:none;stroke:var(--pri);stroke-width:1.6}
.pipe .pf{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px;font:11.5px Consolas,monospace;color:#94a3b8}.pipe .pf b{color:#e2e8f0;font-weight:600}
.pipe .pf .g{color:#4ade80}.pipe .pf .r{color:#f87171}
.pipe .iud{display:flex;height:4px;border-radius:2px;overflow:hidden;margin-top:10px;background:rgba(148,163,184,.15)}
.pipe .iud i{display:block}.pipe .iud i:nth-child(1){background:var(--pri)}.pipe .iud i:nth-child(2){background:var(--ac2)}.pipe .iud i:nth-child(3){background:#f472b6}
.tick{border-radius:12px;background:var(--bg0);border:1px solid rgba(var(--pri-rgb),.22);padding:12px 16px;font:12px/1.75 Consolas,monospace;color:#94a3b8;margin-bottom:16px;height:200px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
.tick div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tick .t{color:#7b8aa3}.tick .i{color:var(--pri)}.tick .u{color:var(--ac2-hi)}.tick .x{color:#f472b6}.tick .n{color:#e2e8f0}
@keyframes tin{from{opacity:0;transform:translateY(-6px)}}
@media(max-width:900px){.hwrap{grid-template-columns:1fr}.pipes{grid-template-columns:1fr}.hbig b{font-size:44px}}
/* 任务卡片：整行铺满，高度压低 */
.pipes{grid-template-columns:1fr;gap:12px}
.pipe{display:grid;grid-template-columns:minmax(150px,.9fr) minmax(0,2.4fr) minmax(150px,1.1fr) minmax(130px,.8fr);align-items:center;gap:8px 22px;padding:12px 20px}
.pipe .ph{margin-bottom:4px}.pipe .ph2{display:flex;align-items:center;gap:8px;font-size:11px;color:#94a3b8}
.pipe .pp{grid-template-columns:minmax(0,1fr) minmax(60px,1.2fr) minmax(0,1fr)}
.pipe .nd{min-height:46px;padding:6px 10px}
.pipe .tube{height:26px}
.pipe .pc3{display:flex;align-items:center;gap:12px;min-width:0}.pipe .pc3 .rate{margin:0;flex:none;flex-direction:column;gap:0}.pipe .pc3 .rate b{font-size:24px;line-height:1.1}
.pipe .pc3 .spk{height:36px;flex:1;min-width:60px}
.pipe .pc4{min-width:0}.pipe .pc4 .pf{margin-top:0;flex-direction:column;gap:2px}.pipe .pc4 .iud{margin-top:6px}
.pipe .pc34{grid-column:3 / 5;margin:0}
.more{display:flex;align-items:center;justify-content:center;gap:8px;margin:-2px 0 16px;padding:10px;border:1px dashed rgba(var(--pri-rgb),.4);border-radius:12px;color:var(--pri);background:rgba(var(--ac-bg-rgb),.25);cursor:pointer;font-size:13px;letter-spacing:1px}
.more:hover{background:rgba(var(--ac-bg-rgb),.5);box-shadow:0 0 22px rgba(var(--pri-rgb),.18)}
@media(max-width:1000px){.pipe{grid-template-columns:1fr 1fr}.pipe .pp{grid-column:1 / 3;order:3}.pipe .pc34{grid-column:1 / 3}}

@keyframes drift{to{transform:translate(44px,44px)}}

.hkpi .wide{grid-column:span 2}.hkpi b.iud3{font-size:20px}
button:disabled:hover{border-color:var(--line)}


/* =====================================================================
   全站皮肤：数据库运维中枢风格（参考 DB-TOOL 登录页）——近黑深蓝底 + 青色霓虹 + 等宽小标签 + 角标面板
   放在样式表最后，覆盖前面的浅色/深色双主题；整站固定为深色
   ===================================================================== */
:root,:root{--ok-t:#6ee7b7;--warn-t:#fcd34d;--err-t:#fca5a5;--on-ok:#04140c;--on-warn:#1a1100;--btn2:#17b8d8;--on-pri:#031018;--pri-rgb:34,211,238;--ac-hi:#67e8f9;--ac2:#818cf8;--ac2-hi:#a5b4fc;--ac2-rgb:129,140,248;--ac-bg-rgb:8,47,73;--ac2-bg-rgb:30,27,75;--ink-hi:#e6f4ff;--mono-ink:#a5e7f5;--line2:#17324b;--line3:#1d4561;--mute2:#5c7791;--bg0:#050a12;--panel:#07111d;--input:#050d18;--card-a:rgba(10,22,38,.88);--card-b:rgba(7,15,26,.88);--pipe-a:rgba(15,23,42,.96);--pipe-b:rgba(8,20,45,.96);--bg:#050a12;--card:#08111d;--ink:#cfe3f5;--mute:#7e98b4;--line:#12283d;--pri:#22d3ee;--pri-bg:rgba(34,211,238,.10);--ok:#34d399;--warn:#fbbf24;--err:#f87171;--side:#060d17;--code:#030710;--glow:0 0 18px rgba(34,211,238,.28);--mono:"JetBrains Mono",Consolas,"Courier New",monospace}
@media(prefers-color-scheme:dark){:root{--bg:#050a12;--card:#08111d;--ink:#cfe3f5;--mute:#7e98b4;--line:#12283d;--pri:#22d3ee;--pri-bg:rgba(34,211,238,.10);--side:#060d17;--code:#030710}}
html{color-scheme:dark}
body{background:var(--bg);color:var(--ink);font-family:-apple-system,"Segoe UI","Microsoft YaHei",sans-serif;
  background-image:linear-gradient(rgba(var(--pri-rgb),.035) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--pri-rgb),.035) 1px,transparent 1px),radial-gradient(900px 400px at 85% -10%,rgba(var(--pri-rgb),.07),transparent 60%);background-size:44px 44px,44px 44px,auto;background-attachment:fixed}
::selection{background:rgba(var(--pri-rgb),.3)}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#12283d;border-radius:5px}::-webkit-scrollbar-track{background:transparent}

/* 侧栏 */
aside{background:linear-gradient(180deg,#07101c,var(--bg0));border-right:1px solid var(--line);color:var(--mute)}
aside h1{padding:16px 16px 14px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;font-size:14px;letter-spacing:.12em;color:var(--ink-hi);font-weight:700}
aside h1 svg{flex:none;filter:drop-shadow(0 0 6px rgba(var(--pri-rgb),.5))}
aside h1 small{display:block;font:10px var(--mono);letter-spacing:.14em;color:var(--mute);font-weight:400;margin-top:2px}
aside nav{padding:10px 0}
aside nav a{padding:10px 16px;border-left:2px solid transparent;font-size:13.5px;letter-spacing:.04em;transition:.15s}
aside nav a:hover{background:rgba(var(--pri-rgb),.06);color:var(--ink-hi)}
aside nav a.on{background:linear-gradient(90deg,rgba(var(--pri-rgb),.16),transparent);color:var(--ac-hi);border-color:var(--pri);text-shadow:0 0 12px rgba(var(--pri-rgb),.5)}
aside .foot{border-top:1px solid var(--line);color:var(--mute);font:11px/1.7 var(--mono);letter-spacing:.02em}
.badge{background:transparent;border:1px solid var(--warn);color:var(--warn);border-radius:3px;font:11px var(--mono)}

/* 顶部状态栏 */
header{background:rgba(6,13,23,.86);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding:9px 22px;font:12px var(--mono);letter-spacing:.04em;color:var(--mute);gap:18px;position:sticky;top:0;z-index:4}
header b{color:var(--ink-hi);font-weight:600}
header .st{display:inline-flex;align-items:center;gap:7px}
header .st i{width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 8px #34d399;display:inline-block}
header .st i.warn{background:#fbbf24;box-shadow:0 0 8px #fbbf24}
header #clk{color:var(--ac-hi)}

/* 页面标题条 */
.ptitle{display:flex;align-items:flex-end;gap:14px;margin:2px 0 18px;padding-bottom:12px;border-bottom:1px solid var(--line);position:relative}
.ptitle:after{content:"";position:absolute;left:0;bottom:-1px;width:84px;height:2px;background:var(--pri);box-shadow:0 0 12px var(--pri)}
.ptitle .ey{font:11px var(--mono);letter-spacing:.28em;color:var(--pri);margin-bottom:4px}
.ptitle h2{margin:0;font-size:24px;font-weight:700;letter-spacing:.04em;color:var(--ink-hi)}
.ptitle .ds{color:var(--mute);font-size:12.5px;margin-left:auto;text-align:right;max-width:46%}

/* 面板：细边框 + 左上/右下角标 */
.card{background:linear-gradient(180deg,var(--card-a),var(--card-b));border:1px solid var(--line);border-radius:0;position:relative}
.card:before,.card:after{content:"";position:absolute;width:12px;height:12px;pointer-events:none;border:0 solid var(--pri);opacity:.9}
.card:before{left:-1px;top:-1px;border-width:2px 0 0 2px}.card:after{right:-1px;bottom:-1px;border-width:0 2px 2px 0}
.card>h3{border-bottom:1px solid var(--line);padding:12px 18px;font-size:13.5px;letter-spacing:.06em;color:var(--ink-hi);position:relative}
.card>h3:before{content:"";width:3px;height:14px;background:var(--pri);box-shadow:0 0 8px var(--pri);margin-right:2px}
.card>h3 small{font:11.5px -apple-system,"Microsoft YaHei",sans-serif;letter-spacing:0;color:var(--mute)}
.card .bd{padding:18px}
.hero,.pipe,.tick,.archbox,.logbox{border-radius:0}
.hero{border-color:rgba(var(--pri-rgb),.3)}
.pipe{border-radius:0}.pipe .nd{border-radius:0}.more{border-radius:0}
.hkpi div{border-radius:0;border-color:var(--line);background:rgba(8,17,29,.7)}
.hkpi small,.stats .hint{font-family:var(--mono);letter-spacing:.1em}

/* 表格 */
table{border-collapse:separate;border-spacing:0}
th{background:rgba(var(--pri-rgb),.04);color:var(--mute);font:600 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid #1a3a55}
td{border-bottom:1px solid rgba(18,40,61,.8)}
tbody tr:hover td,tr:hover>td{background:rgba(var(--pri-rgb),.045)}
th,td{padding:10px 14px}
.mono{font-family:var(--mono);color:var(--mono-ink)}

/* 表单 */
input,select,textarea{background:var(--input);border:1px solid var(--line2);border-radius:2px;color:var(--ink);transition:.15s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--pri);box-shadow:0 0 0 3px rgba(var(--pri-rgb),.14),var(--glow)}
input::placeholder,textarea::placeholder{color:#3d5870}
label.f{font-family:var(--mono);letter-spacing:.06em}label.f>span{font-size:11.5px;color:var(--mute)}
.hint{color:var(--mute)}
button{background:transparent;border:1px solid var(--line3);border-radius:2px;color:var(--ink);letter-spacing:.06em;transition:.15s}
button:hover{border-color:var(--pri);color:var(--ac-hi);box-shadow:var(--glow)}
button.p{background:linear-gradient(180deg,var(--ac-hi),var(--btn2));border-color:var(--ac-hi);color:var(--on-pri);font-weight:700;box-shadow:0 0 22px rgba(var(--pri-rgb),.28)}
button.p:hover{color:var(--on-pri);filter:brightness(1.1);box-shadow:0 0 28px rgba(var(--pri-rgb),.5)}
button.d{color:var(--err-t);border-color:#5b2a33}button.d:hover{border-color:#f87171;color:#fecaca;box-shadow:0 0 16px rgba(248,113,113,.25)}
button:disabled,button:disabled:hover{opacity:.38;cursor:not-allowed;border-color:var(--line3);color:var(--ink);box-shadow:none}
.seg{border-radius:2px;border-color:var(--line3)}.seg button{border-radius:0;border-right-color:var(--line3)}.seg button.on{background:rgba(var(--pri-rgb),.18);color:var(--ac-hi);box-shadow:inset 0 -2px 0 var(--pri)}

/* 标签 / 状态 */
.pill{border-radius:2px;font:11.5px var(--mono);letter-spacing:.06em;background:rgba(var(--pri-rgb),.1);color:var(--ac-hi);border:1px solid rgba(var(--pri-rgb),.35)}
.pill.ok{background:rgba(52,211,153,.1);color:var(--ok-t);border-color:rgba(52,211,153,.4)}
.pill.warn{background:rgba(251,191,36,.1);color:var(--warn-t);border-color:rgba(251,191,36,.4)}
.pill.err{background:rgba(248,113,113,.1);color:var(--err-t);border-color:rgba(248,113,113,.45)}
.pill.gray{background:rgba(111,138,166,.1);color:var(--mute);border-color:#1d3a52}
.tag{border-radius:2px;background:rgba(var(--pri-rgb),.06);border:1px solid var(--line2);color:var(--mono-ink);font-family:var(--mono);font-size:11.5px}
.note{background:rgba(251,191,36,.07);border:1px solid rgba(251,191,36,.35);border-radius:0;color:var(--warn-t)}
.flow i{color:var(--pri)}

/* 页签 */
.tabs{border-bottom:1px solid var(--line)}
.tabs a{font-size:13px;letter-spacing:.06em;color:var(--mute);padding:9px 18px}
.tabs a:hover{color:var(--ink-hi)}
.tabs a.on{color:var(--ac-hi);border-color:var(--pri);text-shadow:0 0 12px rgba(var(--pri-rgb),.5);background:linear-gradient(180deg,transparent,rgba(var(--pri-rgb),.08))}

/* 弹窗 / 提示 */
.modal{background:rgba(2,6,12,.72);backdrop-filter:blur(3px)}
.modal .box{background:var(--panel);border:1px solid var(--line3);border-radius:0;position:relative;box-shadow:0 30px 90px rgba(0,0,0,.7),0 0 40px rgba(var(--pri-rgb),.1)}
.modal .box:before,.modal .box:after{content:"";position:absolute;width:14px;height:14px;border:0 solid var(--pri);pointer-events:none}
.modal .box:before{left:-1px;top:-1px;border-width:2px 0 0 2px}.modal .box:after{right:-1px;bottom:-1px;border-width:0 2px 2px 0}
.toast{background:var(--panel);border:1px solid var(--pri);border-radius:0;color:var(--ink);font-family:var(--mono);font-size:12.5px;box-shadow:0 0 24px rgba(var(--pri-rgb),.25)}
.bar{background:rgba(6,13,23,.95);border-top:1px solid var(--line)}
pre{background:var(--code);border:1px solid var(--line);border-radius:0}
.ck li:before{color:#34d399}
.chg{border-color:var(--line)}

/* ---------------- 登录页：左右分屏 ---------------- */
.login{position:fixed;inset:0;z-index:100;display:flex;color:var(--ink);background:#04080f;overflow:hidden}
.login[hidden]{display:none}
.lx-left{position:relative;flex:1.1;min-width:0;overflow:hidden;border-right:1px solid var(--line)}
.lx-bg{position:absolute;inset:0;background:radial-gradient(700px 500px at 50% 38%,rgba(var(--pri-rgb),.10),transparent 65%),linear-gradient(rgba(var(--pri-rgb),.04) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--pri-rgb),.04) 1px,transparent 1px);background-size:auto,40px 40px,40px 40px}
.lx-brand{position:absolute;left:40px;top:34px;display:flex;align-items:center;gap:12px;z-index:2}
.lx-brand b{display:block;font:700 17px var(--mono);letter-spacing:.14em;color:var(--ink-hi)}.lx-brand span{font-size:12px;color:var(--mute);letter-spacing:.1em}
.lx-status{position:absolute;right:34px;top:42px;display:flex;gap:18px;font:12px var(--mono);color:var(--mute);z-index:2}
.lx-status b{color:#34d399;font-weight:600}.lx-status i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#34d399;box-shadow:0 0 8px #34d399;margin:0 3px 1px}
.lx-topo{position:absolute;left:0;right:0;top:56px;height:62%;width:100%}
.lx-topo .ring{fill:none;stroke:rgba(var(--pri-rgb),.1)}
.lx-topo .spoke{stroke:rgba(var(--pri-rgb),.4);stroke-width:1.2}
.lx-topo .spoke.f{stroke-dasharray:5 7;animation:lxdash 1.4s linear infinite}
@keyframes lxdash{to{stroke-dashoffset:-24}}
.lx-topo .dotf{animation:lxtw 3s ease-in-out infinite}@keyframes lxtw{50%{opacity:.15}}
.lx-topo text{font-family:Consolas,monospace;font-size:12px;letter-spacing:.06em}
.lx-copy{position:absolute;left:40px;bottom:176px;max-width:520px;z-index:2}
.lx-eyebrow{font:11.5px var(--mono);letter-spacing:.3em;color:var(--pri);margin-bottom:12px}.lx-eyebrow.dim{color:var(--mute);letter-spacing:.34em;margin-bottom:8px}
.lx-copy h1{margin:0 0 12px;font-size:50px;line-height:1.12;font-weight:800;letter-spacing:.01em;color:var(--ink-hi);text-shadow:0 0 30px rgba(var(--pri-rgb),.18)}
.lx-copy h1 em{font-style:normal;color:var(--ac-hi);text-shadow:0 0 26px rgba(var(--pri-rgb),.7)}
.lx-copy p{margin:0;color:#8aa3bd;font-size:14px;line-height:1.75;max-width:420px}
.lx-stats{position:absolute;left:40px;bottom:36px;display:grid;grid-template-columns:repeat(4,minmax(96px,1fr));border:1px solid var(--line2);background:rgba(6,13,23,.7);z-index:2;width:min(560px,calc(100% - 80px))}
.lx-stats div{padding:12px 18px;border-right:1px solid var(--line2)}.lx-stats div:last-child{border:0}
.lx-stats small{display:block;font-size:11.5px;color:var(--mute);margin-bottom:6px}
.lx-stats b{font:700 24px var(--mono);color:var(--ink-hi)}.lx-stats b.g{color:#34d399}.lx-stats b.c{color:var(--ac-hi)}.lx-stats b.o{color:#fbbf24}.lx-stats u{text-decoration:none;font-size:12px;color:var(--mute);font-weight:400}
.lx-right{position:relative;flex:1;min-width:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#060d17,var(--bg0))}
.lx-demo{position:absolute;left:40px;right:40px;top:22px;border:1px dashed var(--line2);padding:8px 12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;font:11px var(--mono);color:var(--mute2)}
.lx-demo button{padding:4px 10px;font-size:12px;letter-spacing:.04em;background:rgba(10,22,38,.8)}.lx-demo button.on{border-color:#f59e0b;color:#fbbf24;background:rgba(245,158,11,.08)}
.lx-form{position:relative;width:min(400px,calc(100% - 48px));padding:34px 30px 26px;border:1px solid #12425a;background:rgba(7,15,26,.82)}
.lx-form.shake{animation:lxshake .35s}@keyframes lxshake{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}
.lx-form .cn{position:absolute;width:16px;height:16px;border:0 solid var(--pri);pointer-events:none}.lx-form .cn.tl{left:-1px;top:-1px;border-width:3px 0 0 3px}.lx-form .cn.br{right:-1px;bottom:-1px;border-width:0 3px 3px 0}
.lx-form h2{margin:0 0 6px;font-size:26px;font-weight:800;color:var(--ink-hi);letter-spacing:.04em}
.lx-sub{margin:0 0 18px;color:var(--mute);font-size:12.5px;line-height:1.6}
.lx-form label{display:block;margin-bottom:14px;font-size:12px;color:#8aa3bd;letter-spacing:.06em}
.lx-lh{display:flex;justify-content:space-between}.lx-lh a{color:var(--pri);text-decoration:none;font-size:12px}
.lx-in{display:flex;align-items:center;gap:10px;margin-top:6px;padding:0 12px;background:var(--input);border:1px solid var(--line2);color:var(--mute2);transition:.15s}
.lx-in:focus-within{border-color:var(--pri);box-shadow:0 0 0 3px rgba(var(--pri-rgb),.14),var(--glow);color:var(--pri)}
.lx-in input{flex:1;border:0;background:transparent;box-shadow:none;padding:12px 0;margin:0;font-size:14px;color:var(--ink-hi);border-radius:0}
.lx-in input:focus{box-shadow:none}
.lx-eye{color:#6f8aa6;font-size:12px;text-decoration:none;flex:none}
.lx-form label.lx-chk{display:flex;align-items:center;gap:8px;margin:2px 0 14px;font-size:13px;color:#8aa3bd;letter-spacing:0}.lx-chk input{width:auto;accent-color:var(--pri)}
.lx-form .err{min-height:18px;margin:0 0 8px;font-size:12px;color:#f87171}
.lx-btn{width:100%;padding:13px;font-size:15px;letter-spacing:.3em;background:var(--panel);border:1px solid #2a6a86;color:var(--ink-hi)}
.lx-btn:hover{background:rgba(var(--pri-rgb),.14);border-color:var(--pri);color:var(--ac-hi)}
.lx-help{margin-top:16px;text-align:center;font-size:12px;color:#4a6580}
.lx-notice{position:absolute;left:0;right:0;bottom:46px;padding:10px 40px;border-left:3px solid #f59e0b;background:rgba(245,158,11,.08);font-size:12.5px;color:#b88a2e;display:flex;gap:14px}.lx-notice b{color:#fbbf24;font-weight:600;white-space:nowrap}
.lx-foot{position:absolute;left:40px;right:40px;bottom:14px;display:flex;justify-content:space-between;gap:12px;font:11px var(--mono);color:#3f566d;flex-wrap:wrap}
@media(max-width:1000px){.login{flex-direction:column;overflow:auto}.lx-left{min-height:420px;flex:none}.lx-copy{bottom:100px}.lx-copy h1{font-size:34px}.lx-stats{display:none}.lx-right{min-height:560px;flex:none}.lx-topo{height:50%}}

.lerr{min-height:18px;margin:2px 0 8px;font-size:12px;color:#f87171}.lerr.warn{color:#fbbf24}
#ptitle{padding:clamp(10px,1.6vw,28px) clamp(10px,1.6vw,28px) 0}
#ptitle .ptitle{margin:0}
#view{padding-top:18px}
@media(max-width:1100px){aside h1{display:none}}
@media(max-width:700px){.ptitle .ds{display:none}}
.lx-lh a,.lx-eye{cursor:pointer}
.lx-status i.bad{background:#f87171;box-shadow:0 0 8px #f87171}.lx-status b.bad{color:#f87171}
.lx-stats b{white-space:nowrap}.lx-stats div{min-width:0}@media(max-width:1300px){.lx-stats b{font-size:19px}}
aside h1{font-size:13px;letter-spacing:.05em;gap:8px}aside h1 div{white-space:nowrap}aside h1 small{letter-spacing:.08em}

.kv .lag{font-size:12.5px}.kv .lag.ok{color:#4ade80}.kv .lag.warn{color:#fbbf24}.kv .lag.bad{color:#f87171}
/* 对象配置 */
.oc-main{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);margin-bottom:16px;align-items:stretch}
.oc-pane{margin:0;display:flex;flex-direction:column}
.oc-mid{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}
.oc-mid button{width:34px;padding:6px 0;text-align:center}
.oc-tool{display:flex;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line)}.oc-tool input{flex:1}
.oc-tree{height:360px;overflow:auto;padding:6px 0}
.oc-r{display:flex;align-items:center;gap:8px;padding:5px 14px;font-size:13px;flex-wrap:wrap}.oc-r:hover{background:rgba(var(--pri-rgb),.05)}
.oc-r.l2{padding-left:38px}.oc-r.l3{padding-left:62px}.oc-r.dis{opacity:.55}
.oc-ch{width:14px;cursor:pointer;color:var(--mute);font-style:normal}
.oc-ed{color:var(--pri);cursor:pointer;margin-left:2px}.oc-r a{cursor:pointer}
.oc-lk{color:var(--pri);cursor:pointer;font-size:12.5px;margin-left:14px;text-decoration:none;font-weight:400}
.oc-dot{display:inline-block;min-width:16px;height:16px;line-height:16px;border-radius:8px;background:#ef4444;color:#fff;font:10px/16px var(--mono);text-align:center;font-style:normal;margin-left:4px;padding:0 4px}
.oc-box{border:1px solid var(--line);padding:12px 14px;background:rgba(var(--pri-rgb),.03)}
@media(max-width:900px){.oc-main{grid-template-columns:1fr}.oc-mid{flex-direction:row;padding:10px}}

/* ---- 文字溢出：长名称、长地址、长错误信息不能撑破或越出所在的框（SVG 架构图的文字在 app.js 里按像素宽度截断） ---- */
.tag{white-space:normal;overflow-wrap:anywhere;max-width:100%}
.row>*{min-width:0}
.row>b,.row .hint,.row .tag{overflow-wrap:anywhere}
.row .pill{white-space:normal;overflow-wrap:anywhere;max-width:100%}
.chg .mono,.chg .old,.chg .new,.chg .add{overflow-wrap:anywhere;word-break:break-all}
.ck li,.note,.archstat span{overflow-wrap:anywhere}
.archstat span{min-width:0;max-width:100%}
.pipe .ph b,.pipe .ph2 .mono{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pipe .ph{min-width:0}.pipe .ph2{min-width:0}
.pipe .pc34,.pipe .pc34 span,.pipe .pc4 .pf span{min-width:0;overflow-wrap:anywhere;white-space:normal}
.pipe .rate span{white-space:nowrap}
@media(max-width:700px){.pipe{grid-template-columns:minmax(0,1fr)}.pipe .pp,.pipe .pc34{grid-column:1}.pipe .pp{order:0}}
.split>*{min-width:0}
@media(max-width:1100px){.split{grid-template-columns:minmax(0,1fr)}}
.chg>b{overflow-wrap:anywhere;word-break:break-all}
.oc-count{display:flex;flex-wrap:wrap;gap:6px 22px;margin:-4px 0 12px;padding:9px 14px;border:1px solid var(--line);border-left:3px solid var(--pri);background:rgba(var(--pri-rgb),.06);font-size:13px}
.oc-count b{color:var(--pri);font-size:15px;margin:0 2px}.oc-count .hot{color:#fbbf24}.oc-count .hot b{color:#fbbf24}
#mbox td,#mbox th{overflow-wrap:anywhere}#mbox td input.so{max-width:100%}
#mbox td.num{white-space:nowrap;overflow-wrap:normal}

/* ================= 编排任务 ================= */
.chips{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.chip{display:inline-flex;align-items:center;gap:6px;border-radius:18px;padding:5px 14px}
.chip.on{background:var(--pri-bg);border-color:var(--pri);color:var(--pri)}
.odot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--mute);vertical-align:middle}
.odot.success{background:var(--ok)}.odot.failed{background:var(--err)}.odot.running{background:var(--pri);box-shadow:0 0 8px var(--pri)}.odot.queued,.odot.canceled{background:#64748b}
.pill.run{background:rgba(var(--pri-rgb),.14);color:var(--ac-hi)}
.sw{position:relative;display:inline-block;width:36px;height:20px;flex:none}.sw input{display:none}.sw i{position:absolute;inset:0;background:#334155;border-radius:10px;cursor:pointer;transition:.2s}
.sw i:before{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;background:#cbd5e1;border-radius:50%;transition:.2s}.sw input:checked+i{background:var(--pri)}.sw input:checked+i:before{left:18px;background:#fff}
.sw input:disabled+i{opacity:.45;cursor:not-allowed}
a.tl{color:var(--pri);text-decoration:none;cursor:pointer}a.tl:hover{text-decoration:underline}
.ometa{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 20px;padding:12px 16px}.ometa>div>b{display:block;font-size:12px;color:var(--mute);font-weight:500}
.ostats{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}.ostats .card{margin:0;padding:12px 16px;min-width:190px;display:flex;gap:10px;align-items:center}
.onum{display:inline-block;min-width:26px;text-align:center;border-radius:5px;padding:0 6px;font-weight:700;color:var(--on-ok);background:var(--ok)}.onum.bad{background:#dc2626;color:#fff}
.ogn rect{fill:var(--card);stroke:var(--line);stroke-width:1.5}.ogn text{fill:var(--ink);font-size:12px}
.ogn.success rect{stroke:var(--ok)}.ogn.failed rect{stroke:var(--err)}.ogn.running rect{stroke:var(--pri)}.ogn.upstream_failed rect{stroke:var(--warn)}.ogn.queued rect,.ogn.canceled rect{stroke:#64748b}
.oge{stroke:var(--mute);fill:none;stroke-width:1.4}
.ospark{display:flex;align-items:flex-end;gap:3px;height:34px}.ospark i{width:6px;border-radius:2px}
.odur{height:8px;border-radius:4px;display:inline-block;vertical-align:middle;min-width:2px}
.ocal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.ocal>div{border:1px solid var(--line);border-radius:6px;padding:6px 8px;min-height:62px;font-size:12px}
.ocal .ch{border:0;min-height:0;color:var(--mute);text-align:center}.ocal .cn0{border:0;min-height:0}
.ocal .ok{background:rgba(52,211,153,.12);border-color:rgba(52,211,153,.45);color:var(--ok-t)}.ocal .bad{background:rgba(248,113,113,.14);border-color:rgba(248,113,113,.5);color:var(--err-t)}.ocal .none{color:var(--mute)}
.okv{display:grid;grid-template-columns:160px 1fr}.okv>div{padding:9px 14px;border-bottom:1px solid var(--line)}.okv>div:nth-child(odd){color:var(--mute);background:rgba(var(--pri-rgb),.04)}
.opre{margin:0;background:var(--code);color:#e2e8f0;padding:12px 14px;border-radius:6px;overflow:auto;font:12.5px/1.6 Consolas,monospace;max-height:340px;white-space:pre-wrap;word-break:break-all}
.oed{display:flex;border:1px solid var(--line);border-radius:6px;background:var(--code);overflow:hidden;height:600px}
.oed.ro{height:max(320px,calc(100vh - 120px));max-height:none;margin-bottom:-36px;overflow:auto}
.oed.ro pre{max-height:none;overflow:visible;border-radius:0;min-height:max-content}
.ogut{margin:0;padding:12px 8px;color:#8a99b0;text-align:right;font:12.5px/1.6 Consolas,monospace;overflow:hidden;background:#02050b;user-select:none;min-width:42px;white-space:pre}
.oed textarea{flex:1;background:var(--code);color:#e2e8f0;border:0;border-radius:0;padding:12px 14px;font:12.5px/1.6 Consolas,monospace;resize:none;white-space:pre;overflow:auto;min-height:0;outline:0}
.osrc{margin:0;flex:1;padding:12px 14px;font:12.5px/1.6 Consolas,monospace;color:#e2e8f0;white-space:pre}
.ocm{color:#8a99b0}.oky{color:#7dd3fc}
.osplit{grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr)}
@media(max-width:1100px){.osplit{grid-template-columns:1fr}}
.osplit{align-items:stretch}
.osplit>div:first-child{display:flex;flex-direction:column}
.osplit>div:first-child>.card{flex:1;display:flex;flex-direction:column;margin-bottom:0}
.osplit>div:first-child>.card>.bd{flex:1;display:flex;flex-direction:column;min-height:0}
.osplit .oed:not(.ro){flex:1;height:auto;min-height:600px}
.ock{list-style:none;margin:0;padding:0}.ock li{padding:3px 0;font-size:13px}.ock li:before{content:"✔ ";color:var(--ok)}
.ock li.error{color:var(--err);cursor:pointer}.ock li.error:before{content:"✖ ";color:var(--err)}.ock li.warn{color:var(--warn);cursor:pointer}.ock li.warn:before{content:"⚠ ";color:var(--warn)}

/* ================= 分区维护 ================= */
.na{opacity:.45}
.ptbl th{white-space:nowrap}.ptbl .tag{white-space:nowrap;overflow-wrap:normal}.ptbl td{min-width:56px}
.pbar{display:flex;height:24px;border:1px solid var(--line);border-radius:5px;overflow:hidden;margin:6px 0}
.pbar i{display:block;font-style:normal;font-size:11px;color:#fff;text-align:center;line-height:22px;white-space:nowrap;overflow:hidden}
.pbar .pb-drop,.legend .pb-drop:before{background:#64748b}.pbar .pb-hist,.legend .pb-hist:before{background:#2f6fb5}
.pbar .pb-cur,.legend .pb-cur:before{background:var(--ok)}.pbar .pb-pre,.legend .pb-pre:before{background:#d9a21b}
.pbar .pb-pre,.pbar .pb-cur{color:var(--on-ok)}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--mute);margin:0 0 14px}
.legend span:before{content:"";display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.opre .pa{color:#86efac}.opre .pd{color:#fca5a5}.opre .pc{color:#8a99b0}
.crow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) 34px;gap:8px;margin-bottom:6px;align-items:center}

/* ================= 运行概览：只用 CSS 变量，换皮肤自动跟着变 ================= */
.ovtop{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,2fr) auto;margin-bottom:16px;border:1px solid var(--line);background:linear-gradient(180deg,var(--card-a),var(--card-b));position:relative}
.ovtop:before,.ovtop:after{content:"";position:absolute;width:12px;height:12px;border:0 solid var(--pri);pointer-events:none}.ovtop:before{left:-1px;top:-1px;border-width:2px 0 0 2px}.ovtop:after{right:-1px;bottom:-1px;border-width:0 2px 2px 0}
.ovtop>div{padding:14px 20px}.ovtop>div+div{border-left:1px solid var(--line)}
.ovstate{display:flex;align-items:center;gap:14px}
.ovstate .lamp{width:46px;height:46px;border-radius:50%;border:2px solid var(--warn);display:grid;place-items:center;font:700 20px var(--mono);color:var(--warn);box-shadow:0 0 22px rgba(251,191,36,.35),inset 0 0 14px rgba(251,191,36,.15);flex:none}
.ovstate b{display:block;font-size:17px;color:var(--ink-hi);letter-spacing:.04em}.ovstate span{font-size:12px;color:var(--mute)}
.ovmods{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;align-items:stretch}
.ovmod{display:block;padding:8px 12px;border:1px solid var(--line);background:var(--panel);cursor:pointer;text-align:left;transition:.15s;position:relative}
.ovmod:hover{border-color:var(--pri);box-shadow:var(--glow)}
.ovmod small{display:block;font:11px var(--mono);letter-spacing:.12em;color:var(--mute)}
.ovmod b{font:600 17px var(--mono);color:var(--ink-hi)}.ovmod b em{font-style:normal;font-size:12px;color:var(--mute);margin-left:4px}
.ovmod i.d{position:absolute;right:10px;top:10px;width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px var(--ok)}
.ovmod i.d.warn{background:var(--warn);box-shadow:0 0 8px var(--warn)}.ovmod i.d.bad{background:var(--err);box-shadow:0 0 8px var(--err)}
.ovctl{display:flex;flex-direction:column;justify-content:center;gap:8px;font:11.5px var(--mono);color:var(--mute);min-width:200px}
.ovctl .seg button{padding:4px 11px;font-size:12px}
@media(max-width:1250px){.ovtop{grid-template-columns:minmax(0,1fr)}.ovtop>div+div{border-left:0;border-top:1px solid var(--line)}.ovmods{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}}
/* 需要处理 */
.ovatt{list-style:none;margin:0;padding:0}
.ovatt li{display:grid;grid-template-columns:44px 92px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 18px;border-bottom:1px solid var(--line)}
.ovatt li:last-child{border:0}.ovatt li:hover{background:rgba(var(--pri-rgb),.045)}
.ovatt .t b{display:block;color:var(--ink-hi);font-size:13.5px;overflow-wrap:anywhere}.ovatt .t span{font-size:12px;color:var(--mute);overflow-wrap:anywhere}
.ovatt .when{font:11.5px var(--mono);color:var(--mute);text-align:right;white-space:nowrap}
.ovempty{padding:26px;text-align:center;color:var(--ok);font-size:14px}
.sev{display:inline-block;min-width:34px;text-align:center;padding:1px 6px;border:1px solid;font:700 11.5px var(--mono);letter-spacing:.06em}
.sev.P1{color:var(--err);border-color:var(--err);background:rgba(248,113,113,.1)}.sev.P2{color:var(--warn);border-color:var(--warn);background:rgba(251,191,36,.09)}.sev.P3{color:var(--pri);border-color:var(--pri);background:rgba(var(--pri-rgb),.08)}
.mt{display:inline-block;padding:1px 8px;font:11px var(--mono);letter-spacing:.06em;border:1px solid;white-space:nowrap}
.mt.sync{color:var(--ac-hi);border-color:rgba(var(--pri-rgb),.45)}.mt.orch{color:var(--ac2-hi);border-color:rgba(var(--ac2-rgb),.5)}.mt.part{color:var(--ok);border-color:rgba(52,211,153,.5)}.mt.alert{color:var(--warn);border-color:rgba(251,191,36,.5)}.mt.cfg{color:var(--mute);border-color:var(--line3)}
/* 模块指标卡 */
.ovcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:16px}
@media(max-width:1250px){.ovcards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.ovcards{grid-template-columns:1fr}}
.ovc{padding:14px 16px 12px;cursor:pointer;transition:.15s;margin:0}.ovc:hover{box-shadow:0 0 28px rgba(var(--pri-rgb),.14)}
.ovc .h{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--mute);letter-spacing:.06em}.ovc .h b{color:var(--ink-hi);font-size:14px}.ovc .h .sp{flex:1}
.ovc .big{display:flex;align-items:baseline;gap:8px;margin:8px 0 2px}.ovc .big b{font:700 32px/1 var(--mono);color:var(--ink-hi);text-shadow:0 0 16px rgba(var(--pri-rgb),.35)}.ovc .big span{font-size:12px;color:var(--mute)}
.ovc .row2{display:flex;flex-wrap:wrap;gap:4px 14px;font:11.5px var(--mono);color:var(--mute);margin-top:4px}.ovc .row2 b{color:var(--ink-hi)}.ovc .row2 .g{color:var(--ok)}.ovc .row2 .r{color:var(--err)}.ovc .row2 .y{color:var(--warn)}
.ovc svg.sp2{width:100%;height:40px;display:block;margin-top:8px}.ovc svg .ar{fill:rgba(var(--pri-rgb),.12)}.ovc svg .ln2{fill:none;stroke:var(--pri);stroke-width:1.6}
/* 下面六个模块：大小一致（固定高度），内容放不下的直接不显示 */
.ovgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:376px;gap:16px;margin-bottom:16px}
@media(max-width:1500px){.ovgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:900px){.ovgrid{grid-template-columns:minmax(0,1fr)}}
.ovcell{margin:0;display:flex;flex-direction:column;overflow:hidden;min-height:0}
.ovcell>h3{flex:none;white-space:nowrap}.ovcell>h3 small{overflow:hidden;text-overflow:ellipsis}
.ovcell>.bd{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:12px 16px 10px}
.ovcell .fixed{flex:none}
.ovcell .half{flex:1;min-height:0;display:flex;flex-direction:column}
.ovcell .sub{flex:none;font-size:12px;color:var(--mute);letter-spacing:.06em;margin:8px 0 2px;display:flex;gap:8px;align-items:center}.ovcell .sub b{color:var(--ink-hi);font-size:12.5px}
.fit{flex:1;min-height:0;overflow:hidden;position:relative}
.ovbars{display:flex;align-items:flex-end;gap:3px;height:54px}
.ovbars div{flex:1;display:flex;flex-direction:column-reverse;min-width:3px}
.ovbars i{display:block;width:100%}.ovbars .s{background:var(--ok)}.ovbars .f{background:var(--err)}.ovbars .r{background:var(--pri)}
.ovaxis{display:flex;justify-content:space-between;font:10.5px var(--mono);color:var(--mute2);margin-top:2px}
.ovlist{list-style:none;margin:0;padding:0}.ovlist li{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px;min-height:33px}
.ovlist .tm{font:12px var(--mono);color:var(--mono-ink)}.ovlist .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ovlist .nm small{color:var(--mute);margin-left:6px}.ovlist .hint{margin:0;white-space:nowrap}
.ovcov{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(70px,1fr) 58px;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line);font-size:13px}
.ovcov .nm{overflow:hidden}.ovcov .nm b{display:block;color:var(--ink-hi);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ovcov .nm small{color:var(--mute);font-size:11.5px;white-space:nowrap}
.ovcov .bar{height:8px;background:rgba(148,163,184,.18);position:relative}.ovcov .bar i{position:absolute;left:0;top:0;bottom:0}
.ovcov .v{font:600 12.5px var(--mono);text-align:right}
.ovcov.ok .bar i{background:var(--ok)}.ovcov.warn .bar i{background:var(--warn)}.ovcov.bad .bar i{background:var(--err)}.ovcov.auto .bar i{background:#64748b}
.ovcov.ok .v{color:var(--ok)}.ovcov.warn .v{color:var(--warn)}.ovcov.bad .v{color:var(--err)}.ovcov.auto .v{color:var(--mute)}
.ovalr{display:grid;grid-template-columns:40px 54px minmax(0,1fr) auto;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line);font-size:12.5px;min-height:36px}
.ovalr .tx{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ovnode{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13px}
.ovnode b{color:var(--ink-hi)}.ovnode .m{font:11.5px var(--mono);color:var(--mute)}.ovnode .m:last-child{grid-column:1/-1}.ovnode .m:nth-child(2){text-align:right}
.ovtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));grid-auto-rows:54px;gap:8px;align-content:start}
.ovtile{border:1px solid var(--line);background:var(--panel);padding:7px 10px;font-size:12px;cursor:pointer;overflow:hidden}.ovtile:hover{border-color:var(--pri)}.ovtile b{display:block;font-size:13px;color:var(--ink-hi);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ovtile span{color:var(--mute);font:11px var(--mono);white-space:nowrap}
.ovtile.bad{border-color:var(--err)}.ovtile.bad span{color:var(--err)}
.ovtl .e{display:grid;grid-template-columns:64px 76px minmax(0,1fr);gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line);font-size:12.5px;min-height:34px}
.ovtl .e .tm{font:11.5px var(--mono);color:var(--mute)}.ovtl .e.bad .tx{color:var(--err)}.ovtl .e .tx{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ovnote{font-size:12.5px;line-height:1.9;color:var(--mute)}.ovnote b{color:var(--ink)}
.ovnote table td,.ovnote table th{padding:7px 12px;font-size:12.5px}

.ovstate.ok .lamp{border-color:var(--ok);color:var(--ok);box-shadow:0 0 22px rgba(52,211,153,.35),inset 0 0 14px rgba(52,211,153,.15)}
.ovstate.bad .lamp{border-color:var(--err);color:var(--err);box-shadow:0 0 22px rgba(248,113,113,.4),inset 0 0 14px rgba(248,113,113,.15);animation:apulse 1.8s ease-in-out infinite}
.ovatt .t em{font-style:normal;color:var(--mute);font-size:11.5px;margin-left:6px}
.ovatt .act{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.ovack{border-top:1px solid var(--line)}.ovack summary{padding:8px 18px;cursor:pointer;color:var(--mute);font-size:12.5px}
.ovack .a{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 18px;border-top:1px solid var(--line);font-size:12.5px}
.ovack .a b{color:var(--ink-hi);font-weight:500;overflow-wrap:anywhere}.ovack .a span{color:var(--mute);font-size:11.5px}
.ovmod.off{opacity:.55}
.ovcell .lagtxt{font:11.5px var(--mono);color:var(--mute)}
.pf .lg.g{color:#4ade80}.pf .lg.y{color:#fbbf24}.pf .lg.r{color:#f87171}
.ovdot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ok);margin-right:6px}
@media(max-width:700px){.ovatt li{grid-template-columns:44px minmax(0,1fr)}.ovatt li .mt,.ovatt li .act{grid-column:2}}

/* ---- 登录页跟随皮肤：背景、卡片、文字、按钮、拓扑图都走变量（以前写死了深色，切到亮色皮肤会很难看） ---- */
:root{--n0:#22d3ee;--n1:#fb923c;--n2:#f87171;--n3:#fbbf24;--n4:#34d399;--n5:#a78bfa}
[data-skin="ice"],[data-skin="eye"]{--n0:#0b5f75;--n1:#a8330a;--n2:#a31919;--n3:#854d0e;--n4:#046c4e;--n5:#5b21b6}
[data-skin="mono"]{--n0:#7c83ff;--n1:#f59e0b;--n2:#fb7185;--n3:#facc15;--n4:#34d399;--n5:#c084fc}
.login{background:var(--bg0)}
.lx-left{border-right-color:var(--line2)}
.lx-right{background:linear-gradient(180deg,var(--bg),var(--bg0))}
.lx-copy p{color:var(--mute)}
.lx-stats{background:var(--card-a)}
.lx-form{border-color:var(--line3);background:var(--card-a)}
.lx-form label,.lx-form label.lx-chk{color:var(--mute)}
.lx-eye{color:var(--mute)}
.lx-btn{border-color:var(--line3)}
.lx-help{color:var(--mute)}
.lx-foot{color:var(--mute)}.lx-topo{height:57%}
.lx-form .err{color:var(--err-t)}
.lx-status b{color:var(--ok)}.lx-status i{background:var(--ok);box-shadow:0 0 8px var(--ok)}
.lx-status b.bad{color:var(--err)}.lx-status i.bad{background:var(--err);box-shadow:0 0 8px var(--err)}
.lx-stats b.g{color:var(--ok)}.lx-stats b.o{color:var(--warn)}
.lx-notice{color:var(--warn-t)}
.lx-brand svg polygon{fill:rgba(var(--pri-rgb),.08);stroke:var(--pri)}.lx-brand svg text{fill:var(--pri)}
.lx-skin{position:absolute;right:24px;top:20px;z-index:3}
.modal{z-index:150}

/* 可搜索的下拉框：输入字符模糊匹配，只能选列表里的项，不能填别的值 */
.cb{position:relative;width:100%}
.cb .cb-in{cursor:pointer;padding-right:26px;text-overflow:ellipsis;background-image:linear-gradient(45deg,transparent 50%,var(--mute) 50%),linear-gradient(135deg,var(--mute) 50%,transparent 50%);background-position:calc(100% - 15px) 55%,calc(100% - 10px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.cb .cb-in:disabled{cursor:not-allowed;opacity:.6}
.cb .cb-pn{display:none;position:absolute;z-index:60;left:0;right:0;top:calc(100% + 2px);max-height:260px;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:6px;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.cb.open .cb-pn{display:block}
/* 卡片为了小屏横向滚动设了 overflow-x:auto，会把 overflow-y 也变成 auto：卡片里的下拉列表被裁掉并出现竖向滚动条。含下拉框的卡片不裁切 */
.card:has(.cb),html[data-skin] .card:has(.cb){overflow:visible}
.cb .cb-it{padding:6px 10px;font-size:13px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb .cb-it.on{background:var(--pri-bg);color:var(--pri)}
.cb .cb-it.cur{font-weight:600}
.cb .cb-it mark{background:transparent;color:var(--pri);font-weight:700;text-decoration:underline}
.cb .cb-it.none,.cb .cb-no{color:var(--mute)}
.cb .cb-no{padding:8px 10px;font-size:12.5px}
.cb .cb-ft{padding:4px 10px;font-size:11.5px;color:var(--mute);border-top:1px solid var(--line);position:sticky;bottom:0;background:var(--card)}


/* 没有权限的按钮直接隐藏（按钮以 disabled + title="没有权限" 渲染；因业务原因置灰的按钮，title 是别的原因，不受影响） */
button[disabled][title="没有权限"]{display:none}
/* 侧栏分组标题 */
aside nav .ngrp{font-size:11px;letter-spacing:.08em;padding:12px 16px 4px;color:inherit;opacity:.5;pointer-events:none}

/* 皮肤切换条：三个按钮直接点（参考 starrocks_ops 的主题切换） */
.skin-sw{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--card)}
.skin-sw button{border:0;border-radius:0;background:transparent;padding:4px 11px;font-size:12px;color:var(--mute)}
.skin-sw button+button{border-left:1px solid var(--line)}
.skin-sw button:hover{border-color:var(--line);color:var(--ink)}
.skin-sw button.on{background:var(--pri-bg);color:var(--pri);font-weight:600}
.tick>div{flex:none}
/* 编排总览：左右两张卡片等高，内容在卡片里居中；图表按自身尺寸显示，不随卡片拉伸 */
.ovsplit{align-items:stretch}.ovsplit>.card{display:flex;flex-direction:column;margin-bottom:0}.ovsplit>.card>.bd{flex:1;display:flex;align-items:center;justify-content:center}.ovsplit>.card>.bd>svg{flex:0 1 auto}
/* 对象配置：下游附加列（编辑表里的附加行、批量编辑里的附加列行） */
tr.ocx td{background:rgba(var(--pri-rgb),.06)}
.ocx input,.ocx select{width:100%;box-sizing:border-box}
.ocx .xk{display:flex;gap:8px;align-items:center;white-space:nowrap}.ocx .xk input[type=checkbox]{width:auto}
.ocbx{border:1px solid var(--line);padding:10px 12px;margin:8px 0;background:rgba(var(--pri-rgb),.03)}
.ocbx .rw{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.ocbx .rw select,.ocbx .rw input[type=text]{width:auto;min-width:130px}
.ocbx .smp{font-size:12px;color:var(--mute);margin-top:6px;overflow-wrap:anywhere}

/* 系统设置：页面水印（开关、定义、预览） */
.wmsw{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.wmsw input{position:absolute;opacity:0;width:0;height:0}
.wmsw i{position:relative;flex:none;width:42px;height:22px;border-radius:11px;background:var(--bg);border:1px solid var(--line);transition:.15s}
.wmsw i:after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:var(--mute);transition:.15s}
.wmsw input:checked+i{background:var(--pri);border-color:var(--pri)}
.wmsw input:checked+i:after{left:22px;background:#fff}
.wmsw input:focus-visible+i{outline:2px solid var(--pri);outline-offset:2px}
.wmsw input:disabled+i{opacity:.5}
.wmrow{display:grid;grid-template-columns:78px minmax(0,1fr) 96px;gap:10px;align-items:center;margin:8px 0}
.wmrow>span{font-size:12.5px;color:var(--mute)}
.wmrow input[type=range]{padding:0;accent-color:var(--pri)}
.wmprev{position:relative;height:320px;overflow:hidden;border:1px solid var(--line);border-radius:6px;background:var(--bg)}
.wmprev .wmmock{padding:18px 20px;display:grid;gap:12px}
.wmprev .wmmock b{font-size:15px;color:var(--ink)}
.wmprev .wmmock i{display:block;height:10px;border-radius:5px;background:var(--line)}
.wmprev .wmov{position:absolute;inset:0;pointer-events:none;background-repeat:repeat}
.wmprev .wmnone{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12.5px;color:var(--mute)}