/* ============================================================
   CT-HWCORE-1000 — Huawei Core Optimization
   reactflow.dev skin: #ff0071 · Space Grotesk · dot-grid · node cards · wire edges
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root{
  --pink:#ff0071; --pink-dim:#ffa8cd; --pink-glow:rgba(255,0,113,.16);
  --pink-ink:#c2004f;
  --bg:#ffffff; --bg2:#f7f7fa; --panel:#ffffff; --panel2:#f4f4f8;
  --line:#e9e9f0; --line2:#d7d7e2;
  --tx:#15151f; --tx2:#54546b; --tx3:#8a8aa0;
  --ok:#00915e; --warn:#a86800; --bad:#d32626; --info:#1668d1; --violet:#7c3aed;
  --dot:#dcdce6;
  --codebg:#f7f7fb; --codetx:#2c2c3d;
  /* SVG diagram theme (read by arch.js / arch5g.js / app.js via cssv()) */
  --wire:#cfcfdd; --wire-strong:#a6a6bd; --wire-off:#e6e6ee;
  --nodefill:#ffffff; --nodetx:#15151f; --nodesub:#8a8aa0;
  --r:14px; --r2:10px;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --sans:'Space Grotesk',system-ui,sans-serif;
  --sb:310px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--tx); font-family:var(--sans);
  font-size:15px; line-height:1.62; -webkit-font-smoothing:antialiased;
}
/* ---------- dot grid canvas ---------- */
.dotgrid{
  background-color:var(--bg);
  background-image:radial-gradient(var(--dot) 1px, transparent 1px);
  background-size:22px 22px; background-position:-11px -11px;
}
/* ============ LAYOUT ============ */
.app{display:flex; min-height:100vh}

/* ---------- LEFT SIDEBAR : ALL CHAPTERS ---------- */
.sidebar{
  width:var(--sb); flex:0 0 var(--sb); position:sticky; top:0; height:100vh;
  overflow-y:auto; background:var(--bg2);
  border-right:1px solid var(--line); padding:0 0 60px; z-index:40;
}
.sidebar::-webkit-scrollbar{width:8px}
.sidebar::-webkit-scrollbar-thumb{background:var(--line2);border-radius:8px}
.sidebar::-webkit-scrollbar-track{background:transparent}

.sb-head{padding:22px 20px 16px; border-bottom:1px solid var(--line); position:sticky; top:0;
  background:var(--bg2); backdrop-filter:blur(8px); z-index:2}
.sb-badge{display:inline-flex; align-items:center; gap:7px; font-size:10.5px; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--pink);
  border:1px solid var(--pink); border-radius:999px; padding:4px 10px; margin-bottom:11px}
.sb-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--pink);
  box-shadow:0 0 8px var(--pink); animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}
.sb-title{font-size:17px; font-weight:700; letter-spacing:-.02em; line-height:1.28}
.sb-sub{font-size:11.5px; color:var(--tx3); margin-top:5px; font-family:var(--mono)}

.sb-switch{display:flex; gap:6px; padding:14px 16px 4px}
.sb-switch a{
  flex:1; text-align:center; font-size:11.5px; font-weight:600; padding:8px 6px; border-radius:9px;
  text-decoration:none; color:var(--tx2); border:1px solid var(--line2); background:var(--panel);
  transition:.16s; letter-spacing:.02em;
}
.sb-switch a:hover{color:var(--tx); border-color:var(--pink-dim)}
.sb-switch a.on{background:var(--pink); border-color:var(--pink); color:#fff;
  box-shadow:0 4px 16px var(--pink-glow)}
.sb-switch.three a{font-size:10.5px; padding:8px 4px; letter-spacing:0}

.sb-filter{padding:12px 16px 8px}
.sb-filter input{
  width:100%; background:var(--panel); border:1px solid var(--line2); border-radius:9px;
  padding:8px 11px; color:var(--tx); font-family:var(--sans); font-size:12.5px; outline:none;
}
.sb-filter input:focus{border-color:var(--pink); box-shadow:0 0 0 3px var(--pink-glow)}
.sb-filter input::placeholder{color:var(--tx3)}

.sb-nav{padding:8px 10px 0}
.sb-part{
  font-size:9.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--tx3); padding:16px 10px 7px; display:flex; align-items:center; gap:8px;
}
.sb-part::after{content:'';flex:1;height:1px;background:var(--line)}
.sb-link{
  display:flex; align-items:flex-start; gap:9px; padding:7px 10px; border-radius:8px;
  color:var(--tx2); text-decoration:none; font-size:12.8px; line-height:1.42;
  border-left:2px solid transparent; transition:.14s; position:relative;
}
.sb-link:hover{background:var(--panel); color:var(--tx)}
.sb-link.on{background:linear-gradient(90deg,rgba(255,0,113,.10),transparent);
  color:var(--pink-ink); border-left-color:var(--pink); font-weight:600}
.sb-num{
  font-family:var(--mono); font-size:9.5px; color:var(--tx3); min-width:22px;
  padding-top:2px; letter-spacing:-.03em;
}
.sb-link.on .sb-num{color:var(--pink)}
.sb-tag{
  margin-left:auto; font-size:8.5px; font-family:var(--mono); padding:1px 5px; border-radius:4px;
  background:var(--panel2); color:var(--tx3); border:1px solid var(--line2); align-self:center;
}
.sb-tag.cfg{color:var(--info);border-color:#b9d2f5}
.sb-tag.opt{color:var(--pink);border-color:var(--pink-dim)}
.sb-tag.kpi{color:var(--ok);border-color:#a8dcc6}

/* ---------- MAIN ---------- */
main{flex:1; min-width:0; padding:0 0 120px}
.wrap{max-width:1180px; margin:0 auto; padding:0 44px}

.hero{padding:64px 0 44px; border-bottom:1px solid var(--line); margin-bottom:8px; position:relative; overflow:hidden}
.hero::before{content:'';position:absolute;top:-140px;right:-90px;width:440px;height:440px;
  background:radial-gradient(circle,var(--pink-glow),transparent 68%);filter:blur(52px);pointer-events:none}
.h-kicker{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;
  color:var(--pink-ink);border:1px solid var(--pink-dim);border-radius:999px;padding:5px 12px;margin-bottom:18px}
h1{font-size:44px;line-height:1.08;font-weight:700;letter-spacing:-.035em;margin-bottom:16px}
h1 em{font-style:normal;color:var(--pink)}
.h-lede{font-size:16.5px;color:var(--tx2);max-width:750px;line-height:1.66}
.h-stats{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.stat{background:var(--panel);border:1px solid var(--line2);border-radius:var(--r2);padding:11px 15px;min-width:104px}
.stat b{display:block;font-size:21px;color:var(--pink);font-weight:700;letter-spacing:-.02em;line-height:1.2}
.stat span{font-size:10px;color:var(--tx3);text-transform:uppercase;letter-spacing:.09em;font-weight:600}

/* ---------- router: one chapter per page ---------- */
body.router section.ch{display:none}
body.router section.ch.show{display:block; animation:chin .26s ease}
@keyframes chin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
body.router .hero{display:none}
body.router .hero.show{display:block}

.pager{display:flex;gap:12px;margin:52px 0 0;padding-top:26px;border-top:1px solid var(--line)}
.pg{flex:1;display:flex;flex-direction:column;gap:3px;text-decoration:none;padding:14px 16px;
  border:1px solid var(--line2);border-radius:var(--r);background:var(--panel);transition:.16s;min-width:0}
.pg:hover{border-color:var(--pink);transform:translateY(-2px);
  box-shadow:0 10px 26px -14px var(--pink-glow)}
.pg span{font-family:var(--mono);font-size:9.5px;color:var(--tx3);letter-spacing:.08em;text-transform:uppercase}
.pg b{font-size:13.5px;color:var(--tx);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg.next{text-align:right}
.pg.ghost{visibility:hidden}
.crumb{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:10.5px;
  color:var(--tx3);padding:26px 0 0}
.crumb b{color:var(--pink-ink);font-weight:600}
.crumb .home{color:var(--tx3);text-decoration:none;border:1px solid var(--line2);border-radius:6px;
  padding:2px 7px;transition:.14s}
.crumb .home:hover{border-color:var(--pink);color:var(--pink-ink)}

/* ---------- chapter ---------- */
.ch{padding:52px 0 12px; scroll-margin-top:16px}
.ch-head{display:flex;align-items:flex-start;gap:15px;margin-bottom:10px}
.ch-n{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--pink-ink);
  border:1px solid var(--pink-dim);border-radius:7px;padding:5px 9px;background:rgba(255,0,113,.08);
  white-space:nowrap;margin-top:5px}
h2{font-size:29px;font-weight:700;letter-spacing:-.028em;line-height:1.2}
.ch-sub{color:var(--tx2);font-size:14.5px;margin:4px 0 24px;max-width:840px}
h3{font-size:18px;font-weight:600;letter-spacing:-.015em;margin:30px 0 12px;display:flex;align-items:center;gap:9px}
h3::before{content:'';width:3px;height:16px;background:var(--pink);border-radius:2px}
h4{font-size:14.5px;font-weight:600;margin:20px 0 9px;color:var(--tx)}
p{margin:9px 0;color:var(--tx2)}
main a{color:var(--pink)}

/* ============ NODE CARD (react-flow) ============ */
.node{
  background:var(--panel); border:1px solid var(--line2); border-radius:var(--r);
  padding:15px 17px; position:relative; transition:.18s;
  box-shadow:0 1px 2px rgba(20,20,40,.05),0 6px 20px -12px rgba(20,20,40,.18);
}
.node:hover{border-color:var(--pink-dim); transform:translateY(-2px);
  box-shadow:0 1px 2px rgba(20,20,40,.05),0 14px 34px -14px rgba(255,0,113,.32)}
.node.sel{border-color:var(--pink); box-shadow:0 0 0 3px var(--pink-glow)}
.node-t{font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:8px;letter-spacing:-.01em}
.node-d{font-size:11.8px;color:var(--tx3);margin-top:5px;line-height:1.5}
.node-ico{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;
  font-size:11px;font-weight:700;background:var(--pink);color:#fff;flex:0 0 24px}
.node-ico.b{background:var(--info)} .node-ico.g{background:var(--ok)}
.node-ico.o{background:var(--warn);color:#221800} .node-ico.v{background:var(--violet)}
.node-ico.r{background:var(--bad)}
/* handles */
.hdl{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--bg2);
  border:1.5px solid var(--pink);top:50%;transform:translateY(-50%);z-index:2}
.hdl.l{left:-5px} .hdl.r{right:-5px}
.hdl.t{top:-5px;left:50%;transform:translateX(-50%)}
.hdl.bm{top:auto;bottom:-5px;left:50%;transform:translateX(-50%)}

/* ============ WIRE / EDGE ============ */
.flow{position:relative; margin:22px 0}
.flow svg.wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible}
.wire{fill:none;stroke:var(--wire-strong);stroke-width:1.6}
.wire.anim{stroke:var(--pink);stroke-dasharray:5 5;animation:dash 1s linear infinite}
.wire.dim{stroke:var(--wire-strong);stroke-dasharray:4 4;opacity:.75}
.wire.ok{stroke:var(--ok);stroke-dasharray:5 5;animation:dash 1s linear infinite}
.wire.warn{stroke:var(--warn);stroke-dasharray:5 5;animation:dash 1s linear infinite}
@keyframes dash{to{stroke-dashoffset:-20}}
.wire-lbl{font-family:var(--mono);font-size:9.5px;fill:var(--tx2)}

/* grid of nodes */
.ngrid{display:grid;gap:14px;position:relative;z-index:2}
.ngrid.c2{grid-template-columns:repeat(2,1fr)}
.ngrid.c3{grid-template-columns:repeat(3,1fr)}
.ngrid.c4{grid-template-columns:repeat(4,1fr)}

/* ============ PANEL / CARD ============ */
.panel{background:var(--panel);border:1px solid var(--line2);border-radius:var(--r);padding:20px;margin:18px 0}
.panel.flush{padding:0;overflow:hidden}

/* ============ TABLE ============ */
.tw{overflow-x:auto;border:1px solid var(--line2);border-radius:var(--r);margin:16px 0;background:var(--panel)}
table{width:100%;border-collapse:collapse;font-size:12.8px;min-width:520px}
th{background:var(--panel2);color:var(--tx);text-align:left;padding:10px 13px;font-weight:600;
  font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--line2);
  position:sticky;top:0;white-space:nowrap}
td{padding:10px 13px;border-bottom:1px solid var(--line);color:var(--tx2);vertical-align:top}
tr:last-child td{border-bottom:none}
tbody tr:hover td{background:rgba(255,0,113,.035)}
td code,th code{font-family:var(--mono);font-size:11.5px;color:var(--pink)}

/* ============ CODE / MML ============ */
.code{
  background:var(--codebg);border:1px solid var(--line2);border-radius:var(--r2);padding:14px 16px;
  font-family:var(--mono);font-size:12.2px;line-height:1.72;overflow-x:auto;margin:12px 0;
  color:var(--codetx);white-space:pre;position:relative;
}
.code .cmd{color:var(--pink);font-weight:600}
.code .par{color:var(--info)}
.code .val{color:var(--ok)}
.code .cmt{color:var(--tx3);font-style:italic}
.code-h{display:flex;align-items:center;gap:9px;padding:8px 14px;background:var(--panel2);
  border:1px solid var(--line2);border-bottom:none;border-radius:var(--r2) var(--r2) 0 0;
  font-family:var(--mono);font-size:10.5px;color:var(--tx3);letter-spacing:.05em}
.code-h+.code{border-radius:0 0 var(--r2) var(--r2);margin-top:0}
.code-h b{color:var(--pink);font-weight:600}
.dot3{display:flex;gap:4px}.dot3 i{width:8px;height:8px;border-radius:50%;background:var(--line2)}
.dot3 i:first-child{background:#ff5f57}.dot3 i:nth-child(2){background:#febc2e}.dot3 i:last-child{background:#28c840}

/* ============ CHIP / PILL ============ */
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0}
.chip{font-family:var(--mono);font-size:10.5px;padding:4px 9px;border-radius:6px;
  background:var(--panel2);border:1px solid var(--line2);color:var(--tx2);cursor:pointer;transition:.14s}
.chip:hover{border-color:var(--pink-dim);color:var(--tx)}
.chip.on{background:var(--pink);border-color:var(--pink);color:#fff}
.pill{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:10px;
  padding:2px 7px;border-radius:5px;background:var(--panel2);border:1px solid var(--line2);color:var(--tx3)}
.pill.pink{color:var(--pink-ink);border-color:var(--pink-dim);background:rgba(255,0,113,.06)}
.pill.ok{color:var(--ok);border-color:#a8dcc6;background:rgba(0,145,94,.07)}
.pill.warn{color:var(--warn);border-color:#e8cf9c;background:rgba(168,104,0,.07)}
.pill.bad{color:var(--bad);border-color:#f2b8b8;background:rgba(211,38,38,.06)}
.pill.info{color:var(--info);border-color:#b9d2f5;background:rgba(22,104,209,.06)}

/* ============ NOTE ============ */
.note{border-left:3px solid var(--info);background:rgba(77,159,255,.06);padding:12px 15px;
  border-radius:0 var(--r2) var(--r2) 0;margin:14px 0;font-size:13.2px;color:var(--tx2)}
.note.warn{border-color:var(--warn);background:rgba(255,176,32,.06)}
.note.bad{border-color:var(--bad);background:rgba(255,77,77,.06)}
.note.ok{border-color:var(--ok);background:rgba(0,214,143,.06)}
.note b{color:var(--tx)}

/* ============ SOURCE CITE ============ */
.cite{font-family:var(--mono);font-size:9.5px;color:var(--tx3);margin-top:9px;
  display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cite::before{content:'⌘';color:var(--pink)}
.cite b{color:var(--tx2);font-weight:500}

/* ============ KPI CARD ============ */
.kcard{background:var(--panel);border:1px solid var(--line2);border-radius:var(--r);padding:15px 17px;transition:.18s}
.kcard:hover{border-color:var(--pink-dim);transform:translateY(-2px)}
.kpi-h{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.kpi-id{font-family:var(--mono);font-size:10px;color:var(--pink-ink);background:rgba(255,0,113,.07);
  border:1px solid var(--pink-dim);border-radius:5px;padding:2px 6px;white-space:nowrap}
.kpi-n{font-size:13.4px;font-weight:600;line-height:1.4;letter-spacing:-.01em}
.kpi-f{font-family:var(--mono);font-size:11px;background:var(--codebg);border:1px solid var(--line);
  border-radius:8px;padding:10px 12px;margin-top:11px;color:var(--tx2);line-height:1.68;
  overflow-x:auto;white-space:pre-wrap;word-break:break-word}
.kpi-f .cid{color:var(--pink);font-weight:600}
.kpi-f .op{color:var(--warn)}
.kpi-m{display:flex;gap:7px;margin-top:10px;flex-wrap:wrap}

/* ============ CALL FLOW (MSC) ============ */
.msc{background:var(--panel);border:1px solid var(--line2);border-radius:var(--r);padding:0;overflow:hidden}
.msc-bar{display:flex;align-items:center;gap:10px;padding:11px 15px;background:var(--panel2);
  border-bottom:1px solid var(--line2);flex-wrap:wrap}
.msc-body{overflow-x:auto;padding:16px 10px}
.btn{background:var(--pink);color:#fff;border:none;border-radius:8px;padding:7px 14px;
  font-family:var(--sans);font-size:12px;font-weight:600;cursor:pointer;transition:.15s;
  display:inline-flex;align-items:center;gap:6px}
.btn:hover{background:#e60066;box-shadow:0 4px 16px var(--pink-glow)}
.btn.ghost{background:transparent;border:1px solid var(--line2);color:var(--tx2)}
.btn.ghost:hover{border-color:var(--pink);color:var(--tx);background:transparent;box-shadow:none}
.btn:disabled{opacity:.4;cursor:not-allowed}
.msc-step{font-family:var(--mono);font-size:11px;color:var(--tx3);margin-left:auto}
.msc-desc{padding:13px 16px;border-top:1px solid var(--line2);background:var(--bg2);
  font-size:13px;color:var(--tx2);min-height:66px;line-height:1.6}
.msc-desc b{color:var(--pink)}
.lifeline{stroke:var(--line2);stroke-width:1.2;stroke-dasharray:3 4}
.actor-box{fill:var(--panel2);stroke:var(--line2);stroke-width:1}
.actor-box.hot{stroke:var(--pink);stroke-width:1.6}

.actor-t{fill:var(--tx);font-family:var(--sans);font-size:11.5px;font-weight:600;text-anchor:middle}
.msg-l{stroke:var(--wire-strong);stroke-width:1.6;marker-end:url(#ar)}
.msg-l.on{stroke:var(--pink);stroke-width:2.2;marker-end:url(#arp);filter:drop-shadow(0 0 5px var(--pink-glow))}
.msg-l.done{stroke:var(--ok);opacity:.7;marker-end:url(#arg)}
.msg-t{font-family:var(--mono);font-size:9.6px;fill:var(--tx2);text-anchor:middle}
.msg-t.on{fill:var(--pink);font-weight:600}
.msg-t.done{fill:var(--tx3)}
.msg-n{font-family:var(--mono);font-size:8.5px;fill:var(--tx3)}

/* ============ ACCORDION ============ */
.acc{border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;margin:12px 0;background:var(--panel)}
.acc-h{padding:13px 16px;cursor:pointer;display:flex;align-items:center;gap:11px;
  font-size:13.5px;font-weight:600;transition:.14s;user-select:none}
.acc-h:hover{background:var(--panel2)}
.acc-h .cv{margin-left:auto;color:var(--tx3);transition:.22s;font-size:11px}
.acc.open .acc-h .cv{transform:rotate(90deg);color:var(--pink)}
.acc-b{display:none;padding:0 16px 16px;border-top:1px solid var(--line)}
.acc.open .acc-b{display:block;animation:fade .22s}
@keyframes fade{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}

/* ============ CONFIG PIPELINE (rail + detail) ============ */
.cfgwrap{display:grid;grid-template-columns:236px 1fr;gap:0;align-items:stretch}
.cfgrail{background:var(--bg2);border-right:1px solid var(--line2);padding:10px 4px 16px;
  border-radius:0 0 0 var(--r);overflow:visible}
.cfgrail svg{width:100%;height:auto;display:block}
.cfgdet{padding:16px 20px 20px;min-width:0;max-height:720px;overflow-y:auto}
.cfgdet::-webkit-scrollbar{width:7px}
.cfgdet::-webkit-scrollbar-thumb{background:var(--line2);border-radius:7px}
.cfg-head{display:flex;align-items:center;gap:11px;padding-bottom:13px;border-bottom:1px solid var(--line);
  margin-bottom:4px}
.cfg-title{font-size:17px;font-weight:700;letter-spacing:-.02em;line-height:1.25}
.cfg-feat{font-family:var(--mono);font-size:9.6px;color:var(--pink-ink);margin-top:3px}
.cfg-sec{padding:13px 0;border-bottom:1px solid var(--line)}
.cfg-sec:last-child{border-bottom:none}
.cfg-sec>div{font-size:13px;color:var(--tx2);line-height:1.6;margin-top:6px}
.cfg-sec>div b{color:var(--tx)}
.cfg-tag{display:inline-block;font-family:var(--mono);font-size:8.8px;font-weight:600;letter-spacing:.11em;
  text-transform:uppercase;padding:2.5px 8px;border-radius:5px;background:var(--panel2);
  border:1px solid var(--line2);color:var(--tx3)}
.cfg-tag.pinky{color:var(--pink-ink);border-color:var(--pink-dim);background:rgba(255,0,113,.06)}
.cfg-tag.ok{color:var(--ok);border-color:#a8dcc6;background:rgba(0,145,94,.07)}
.cfg-tag.bad{color:var(--bad);border-color:#f2b8b8;background:rgba(211,38,38,.06)}
.cfgdet .code{font-size:11.6px}
@media(max-width:900px){
  .cfgwrap{grid-template-columns:1fr}
  .cfgrail{border-right:none;border-bottom:1px solid var(--line2);max-height:270px;overflow-y:auto}
}

/* ============ TASK RUNNER RAIL ============ */
.tu-rail{display:flex;gap:14px;padding:12px 14px;background:var(--bg2);
  border-bottom:1px solid var(--line2);overflow-x:auto}
.tu-ph{flex:0 0 auto;min-width:0}
.tu-ph-n{font-family:var(--mono);font-size:8.6px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--tx3);margin-bottom:6px;padding-left:2px}
.tu-ph-s{display:flex;gap:5px}
.tu-seg{display:flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:8px;
  border:1px solid var(--line2);background:var(--panel);cursor:pointer;transition:.15s;
  font-family:var(--mono);font-size:10px;font-weight:700;color:var(--tx3);white-space:nowrap}
.tu-seg span{font-weight:500;font-size:8.6px;color:var(--tx3)}
.tu-seg:hover{border-color:var(--pink-dim)}
.tu-seg.done{border-color:#a8dcc6;color:var(--ok);background:rgba(0,145,94,.05)}
.tu-seg.done span{color:var(--ok)}
.tu-seg.on{box-shadow:0 0 0 3px var(--pink-glow)}
.tu-seg.on span{color:inherit}

/* ============ FEATURE LIFECYCLE CONSOLE ============ */
.act-rocker{position:relative;display:flex;background:var(--panel2);border:1px solid var(--line2);
  border-radius:11px;padding:3px;gap:0}
.act-rocker button{position:relative;z-index:2;border:none;background:transparent;cursor:pointer;
  font-family:var(--sans);font-size:12px;font-weight:700;padding:7px 16px;border-radius:8px;
  color:var(--tx3);transition:color .25s;letter-spacing:.02em}
.act-thumb{position:absolute;z-index:1;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);
  border-radius:8px;background:var(--ok);transition:all .3s cubic-bezier(.4,0,.2,1);
  box-shadow:0 2px 10px rgba(0,145,94,.35)}
.act-rocker[data-mode=act] button[data-m=act]{color:#fff}
.act-rocker[data-mode=deact] .act-thumb{left:50%;background:var(--bad);
  box-shadow:0 2px 10px rgba(211,38,38,.3)}
.act-rocker[data-mode=deact] button[data-m=deact]{color:#fff}
.act-cp{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--line2);
  border-radius:10px;background:var(--panel);margin-top:8px;transition:.2s}
.act-cp.hot{border-color:var(--acmc,var(--pink));box-shadow:0 0 0 3px var(--pink-glow)}
.act-cp .tog{transition:background .35s}
.act-cp-n{font-size:11.8px;font-weight:600;line-height:1.3}
.act-cp-c{font-family:var(--mono);font-size:9px;color:var(--tx3);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:960px){.act-grid{grid-template-columns:1fr !important}
  .act-grid>[data-r=cps]{border-left:none;border-top:1px solid var(--line2)}}

/* ============ DEPLOYMENT COCKPIT ============ */
.dcstrip{display:flex;gap:5px;padding:10px 14px;background:var(--bg2);border-bottom:1px solid var(--line2);
  overflow-x:auto}
.dc-seg{flex:1;min-width:64px;height:27px;border-radius:7px;border:1px solid var(--line2);
  background:var(--panel);cursor:pointer;display:grid;place-items:center;
  font-family:var(--mono);font-size:9px;color:var(--tx3);transition:.15s;white-space:nowrap;padding:0 6px}
.dc-seg:hover{border-color:var(--pink-dim);color:var(--tx)}
.dc-seg.done{border-color:#a8dcc6;color:var(--ok);background:rgba(0,145,94,.04)}
.dc-seg.on{box-shadow:0 0 0 3px var(--pink-glow);font-weight:700}
.dc-checks{display:flex;flex-direction:column}
.dc-check{display:flex;gap:10px;padding:8px 0;opacity:0;animation:dcin .5s forwards;
  border-bottom:1px dashed var(--line)}
.dc-check:last-child{border-bottom:none}
@keyframes dcin{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
.dc-tick{width:20px;height:20px;border-radius:50%;background:rgba(0,145,94,.1);color:var(--ok);
  border:1px solid #a8dcc6;display:grid;place-items:center;font-size:11px;font-weight:700;flex:0 0 20px;margin-top:1px}
.dc-check>div{font-size:12.6px;color:var(--tx2);line-height:1.58}

/* ============ TUNING SIM ============ */
.sim{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.sim-ctl label{display:block;font-size:11.5px;color:var(--tx2);margin:14px 0 5px;font-weight:500;
  display:flex;justify-content:space-between;align-items:center}
.sim-ctl label b{font-family:var(--mono);color:var(--pink);font-size:11.5px}
input[type=range]{width:100%;-webkit-appearance:none;height:4px;border-radius:3px;
  background:var(--line2);outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;
  background:var(--pink);cursor:pointer;box-shadow:0 0 0 3px var(--pink-glow);transition:.12s}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.16)}
.sw{display:flex;align-items:center;justify-content:space-between;padding:9px 0;
  font-size:12.2px;color:var(--tx2);border-bottom:1px solid var(--line)}
.tog{width:38px;height:21px;border-radius:11px;background:var(--line2);position:relative;
  cursor:pointer;transition:.2s;flex:0 0 38px}
.tog::after{content:'';position:absolute;width:15px;height:15px;border-radius:50%;background:#fff;
  top:3px;left:3px;transition:.2s}
.tog.on{background:var(--pink)} .tog.on::after{left:20px}
.gauge{text-align:center;padding:8px}
.gauge svg{transform:rotate(-90deg)}
.gauge-v{font-family:var(--mono);font-size:20px;font-weight:700;fill:var(--tx)}
.gauge-l{font-size:10.5px;color:var(--tx3);text-transform:uppercase;letter-spacing:.08em;
  font-weight:600;margin-top:4px}
.gauges{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}

/* ============ FAILURE TREE ============ */
.ftree{font-family:var(--mono);font-size:12px;line-height:2}
.ftree .n{padding:2px 0;color:var(--tx2)}
.ftree .n b{color:var(--tx)}
.ftree .br{color:var(--line2)}
.ftree .cause{color:var(--bad)}
.ftree .fix{color:var(--ok)}
.ftree .ck{color:var(--warn)}

/* ============ STEPPER ============ */
.step{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.step:last-child{border-bottom:none}
.step-n{width:26px;height:26px;border-radius:8px;background:var(--panel2);border:1px solid var(--line2);
  display:grid;place-items:center;font-family:var(--mono);font-size:11px;font-weight:600;
  color:var(--pink);flex:0 0 26px}
.step-c b{display:block;font-size:13.5px;margin-bottom:3px}
.step-c p{margin:0;font-size:12.8px}

/* ============ MECHCARD (flip) ============ */
.mechs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.mech{perspective:1100px;height:196px;cursor:pointer}
.mech-in{position:relative;width:100%;height:100%;transition:transform .62s cubic-bezier(.4,0,.2,1);
  transform-style:preserve-3d}
.mech.flip .mech-in{transform:rotateY(180deg)}
.mech-f,.mech-b{position:absolute;inset:0;backface-visibility:hidden;border-radius:var(--r);
  border:1px solid var(--line2);background:var(--panel);padding:15px;overflow:hidden}
.mech-b{transform:rotateY(180deg);background:var(--panel2);overflow-y:auto}
.mech:hover .mech-f{border-color:var(--pink-dim)}
.mech-t{font-size:13px;font-weight:600;margin-bottom:7px;display:flex;align-items:center;gap:7px}
.mech-d{font-size:11.5px;color:var(--tx3);line-height:1.55}
.mech-hint{position:absolute;bottom:9px;right:12px;font-family:var(--mono);font-size:8.5px;color:var(--tx3)}

/* ============ MISC ============ */
.split{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.split3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.muted{color:var(--tx3);font-size:12px}
.mono{font-family:var(--mono)}
.hr{height:1px;background:var(--line);margin:34px 0;border:none}
.scroller{max-height:520px;overflow-y:auto;padding-right:6px}
.scroller::-webkit-scrollbar{width:7px}
.scroller::-webkit-scrollbar-thumb{background:var(--line2);border-radius:7px}
.topbtn{position:fixed;bottom:26px;right:26px;width:42px;height:42px;border-radius:50%;
  background:var(--pink);color:#fff;border:none;cursor:pointer;font-size:17px;z-index:60;
  box-shadow:0 6px 22px var(--pink-glow);opacity:0;pointer-events:none;transition:.24s}
.topbtn.show{opacity:1;pointer-events:auto}
.sb-toggle{display:none}

/* ============ RESPONSIVE ============ */
@media(max-width:1100px){
  .mechs,.split3,.ngrid.c4{grid-template-columns:repeat(2,1fr)}
  .wrap{padding:0 26px}
  h1{font-size:35px}
}
@media(max-width:860px){
  .sidebar{position:fixed;left:0;top:0;transform:translateX(-100%);transition:.26s;box-shadow:0 0 40px #000}
  .sidebar.open{transform:none}
  .sb-toggle{display:grid;place-items:center;position:fixed;top:14px;left:14px;z-index:70;
    width:40px;height:40px;border-radius:10px;background:var(--pink);color:#fff;border:none;
    cursor:pointer;font-size:17px;box-shadow:0 4px 16px var(--pink-glow)}
  main{padding-top:64px}
  .sim,.split,.split3,.mechs,.ngrid.c2,.ngrid.c3,.ngrid.c4,.gauges{grid-template-columns:1fr}
  .wrap{padding:0 16px}
  h1{font-size:28px} h2{font-size:23px}
}

/* ═══════════ 1.5 WSFD Feature Control Room ═══════════ */
.froom{margin:26px 0 8px}
.fr-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:16px}
.fr-title{font-size:19px;font-weight:700;letter-spacing:-.02em}
.fr-title::before{content:'⚙';margin-right:8px;color:var(--pink)}
.fr-sub{font-size:12.8px;color:var(--tx2);margin-top:5px;max-width:640px;line-height:1.55}
.fr-meter{flex:none;font-size:11.5px;color:var(--tx2);border:1px solid var(--line2);border-radius:10px;
  padding:9px 13px;background:var(--panel2);text-align:right;line-height:1.5}
.fr-meter b{color:var(--pink)}

/* hero */
.fr-hero{border:1px solid var(--line2);border-radius:var(--r,14px);background:var(--panel);padding:16px 18px;margin-bottom:18px}
.fr-hero-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;margin-bottom:6px}
.fr-hero-tag{font-size:11.5px;color:var(--tx3);flex-basis:100%;margin-top:2px}
#frhero{width:100%;max-height:440px;display:block}
#frhero .frn-box{fill:var(--panel);stroke:var(--line2);stroke-width:1.2}
.froom svg text{font-family:var(--sans)}
.froom .frn-t{font-size:13px;font-weight:600;fill:var(--tx)}
.froom .frn-s{font-size:10.5px;fill:var(--tx3)}
.froom .fw{fill:none;stroke:var(--line2);stroke-width:1.6}
.froom .fw.ctl{stroke:var(--info);stroke-dasharray:5 5;animation:frFlow 1.1s linear infinite}
.froom .fw.rad{stroke:var(--warn)}
.froom .fw.x2{stroke:var(--line2);stroke-dasharray:3 5}
.froom .fw.up{stroke:var(--violet);stroke-width:2.4}
.froom .fw.ghost,.froom .ghostpath{stroke:none;fill:none}
.froom .fw-l{font-size:10px;fill:var(--tx3);font-family:var(--mono,monospace)}
.froom .fw-l.vio{fill:var(--violet)}
@keyframes frFlow{to{stroke-dashoffset:-20}}
/* pre/post path switch */
#frhero:not(.post) .dots-post{display:none}
#frhero.post .dots-pre{display:none}
#frhero.post .fw.old{stroke:var(--line2);stroke-width:1.4;stroke-dasharray:3 6}
#frhero.post .old-l{fill:var(--tx3)}
#frhero:not(.post) .fw.new{stroke:var(--line2);stroke-width:1.4;stroke-dasharray:3 6}
#frhero:not(.post) .new-l{fill:var(--tx3)}
#frhero:not(.post) .fw.nr{stroke:var(--line2);stroke-dasharray:3 6}
#frhero .hdone{opacity:0;transition:.4s}
#frhero.done .hdone{opacity:1}
#frhero .hdone-t{font-size:12px;font-weight:600;fill:#fff}
#frhero .hsgw-pulse{fill:none;stroke:var(--pink);stroke-width:2;opacity:0}
#frhero.pulse .hsgw-pulse{animation:frPulse 1.2s ease-out 2}
@keyframes frPulse{0%{opacity:.9;r:26}100%{opacity:0;r:52}}
.frchip-box{fill:var(--panel);stroke:var(--info);stroke-width:1.2;filter:drop-shadow(0 2px 5px rgba(22,104,209,.25))}
.frchip-t{font-size:10.5px;fill:var(--info);text-anchor:middle;font-family:var(--mono,monospace);font-weight:600}
/* transport */
.fr-ctl{display:flex;align-items:center;gap:7px;margin:10px 0 4px}
.fr-ctl button{border:1px solid var(--line2);background:var(--panel);color:var(--tx);border-radius:9px;
  min-width:36px;height:32px;font-size:14px;cursor:pointer;transition:.15s;padding:0 9px}
.fr-ctl button:hover{border-color:var(--pink-dim);color:var(--pink)}
.fr-ctl .frh-main{background:var(--pink);border-color:var(--pink);color:#fff;min-width:46px}
.fr-dots{display:flex;gap:5px;margin-left:auto}
.fr-dots button{min-width:26px;height:26px;border-radius:50%;font-size:11px;color:var(--tx3)}
.fr-dots button.on{background:var(--pink);border-color:var(--pink);color:#fff}
.fr-cap{font-size:13px;line-height:1.65;color:var(--tx2);border-left:3px solid var(--pink);
  background:var(--panel2);border-radius:0 10px 10px 0;padding:11px 14px;min-height:58px;margin:8px 0}
.fr-led{margin:6px 0 4px}
.fr-led-row{font-size:11.8px;color:var(--tx2);padding:3px 0;font-family:var(--mono,monospace)}
.fr-led-row.muted{color:var(--tx3);font-family:var(--sans)}
.fr-led-ok{color:var(--ok);margin-right:7px;font-weight:700}

/* filter chips */
.fr-chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.fr-chips button{border:1px solid var(--line2);background:var(--panel);color:var(--tx2);border-radius:999px;
  padding:6px 14px;font-size:12px;cursor:pointer;transition:.15s}
.fr-chips button:hover{border-color:var(--pink-dim);color:var(--tx)}
.fr-chips button.on{background:var(--pink);border-color:var(--pink);color:#fff;box-shadow:0 4px 14px var(--pink-glow)}

/* cards */
.fr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}
.fcard{border:1px solid var(--line2);border-radius:14px;background:var(--panel);padding:14px 15px 12px;
  transition:.2s;display:flex;flex-direction:column;gap:8px}
.fcard:hover{border-color:var(--pink-dim);transform:translateY(-2px);box-shadow:0 10px 26px rgba(21,21,31,.07)}
.fcard.off{background:var(--bg2)}
.fc-top{display:flex;gap:6px;flex-wrap:wrap}
.fc-name{font-size:14.5px;font-weight:650;letter-spacing:-.01em}
.fc-fn{font-size:11.8px;color:var(--tx3);line-height:1.5;min-height:34px}
.fc-scene{border:1px solid var(--line);border-radius:11px;background:
  radial-gradient(circle,var(--line) 1px,transparent 1px) 0 0/14px 14px,var(--bg);overflow:hidden}
.fc-scene svg{width:100%;display:block}
.fc-scene .frn-box{fill:var(--panel);stroke:var(--line2)}
.fcard .lyr-off{display:none}
.fcard.off .lyr-on{display:none}
.fcard.off .lyr-off{display:block}
.fcard.off .fc-scene{filter:saturate(.55)}
.frzone{fill:var(--panel2);stroke:var(--line);stroke-dasharray:4 4}
.frzone.nr{stroke:var(--violet)}
.frlock-t{font-size:13px}
.frpipe{fill:none;stroke:var(--violet);stroke-linecap:round;stroke-dasharray:10 7;animation:frFlow .7s linear infinite}
.frpipe.on1{stroke-width:7}
.frpipe.on2{stroke-width:12;animation-duration:.45s}
.frpipe.thin{stroke:var(--line2);stroke-width:2.5;animation:none}
.frbig{font-weight:700;fill:var(--violet);font-size:13px}
.fc-cap{font-size:11.8px;line-height:1.55;color:var(--tx2);border-top:1px dashed var(--line);padding-top:8px;min-height:52px}
.fcard:not(.off) .fc-cap-off{display:none}
.fcard.off .fc-cap-on{display:none}
.fcard.off .fc-cap-off{color:var(--warn)}
.fc-foot{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.fsw{display:inline-flex;align-items:center;gap:7px;cursor:pointer;user-select:none}
.fsw input{display:none}
.fsw-t{width:38px;height:21px;border-radius:999px;background:var(--line2);position:relative;transition:.2s;flex:none}
.fsw-t::after{content:'';position:absolute;top:2.5px;left:3px;width:16px;height:16px;border-radius:50%;
  background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.fsw input:checked+.fsw-t{background:var(--ok)}
.fsw input:checked+.fsw-t::after{left:19px}
.fsw em{font-style:normal;font-size:11px;color:var(--tx3);font-family:var(--mono,monospace);text-transform:uppercase;letter-spacing:.06em}
.fc-more{margin-left:auto;border:1px solid var(--line2);background:var(--panel);border-radius:8px;
  padding:5px 11px;font-size:11.5px;color:var(--tx2);cursor:pointer;transition:.15s}
.fc-more:hover{border-color:var(--pink);color:var(--pink)}

/* anatomy drawer */
.fr-detail{margin-top:18px;border:1px solid var(--pink-dim);border-radius:14px;background:var(--panel);padding:15px 17px}
.fr-det-h{display:flex;align-items:center;gap:9px;margin-bottom:11px;font-size:14.5px}
#frd-close{margin-left:auto;border:1px solid var(--line2);background:var(--panel);border-radius:8px;
  width:28px;height:28px;cursor:pointer;color:var(--tx3)}
#frd-close:hover{color:var(--bad);border-color:var(--bad)}
.fr-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.fr-tabs button{border:1px solid var(--line2);background:var(--panel2);border-radius:8px;padding:5px 10px;
  font-size:11.3px;color:var(--tx2);cursor:pointer;transition:.15s}
.fr-tabs button.on{background:var(--pink);border-color:var(--pink);color:#fff}
.fr-det-b{font-size:13px;line-height:1.65;color:var(--tx2)}
.fr-det-b p{margin:0 0 8px}
.fr-det-b .frd-hd td{font-weight:650;color:var(--tx);background:var(--panel2)}
.frd-cells{display:grid;grid-template-columns:1fr;gap:8px}
.frd-cells div{border:1px solid var(--line);border-radius:9px;padding:8px 11px;font-size:12.3px}
.frd-none{color:var(--tx3);font-style:italic}
@media(max-width:760px){
  .fr-head{flex-direction:column}
  .fr-grid{grid-template-columns:1fr}
  .fr-dots{display:none}
  .frd-cells{grid-template-columns:1fr}
}

/* ═══════════ Feature Dossier reader (1.5 verbatim descriptions) ═══════════ */
.fdoss{display:grid;grid-template-columns:264px 1fr;gap:16px;align-items:start}
.fd-rail{border:1px solid var(--line2);border-radius:14px;background:var(--panel);padding:10px;
  position:sticky;top:14px;max-height:calc(100vh - 28px);overflow-y:auto}
.fd-rail::-webkit-scrollbar{width:5px}
.fd-rail::-webkit-scrollbar-thumb{background:var(--line2);border-radius:8px}
.fd-filter{width:100%;border:1px solid var(--line2);border-radius:9px;background:var(--bg2);
  padding:7px 11px;font-size:12px;margin-bottom:8px;font-family:var(--sans);color:var(--tx)}
.fd-filter:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 3px var(--pink-glow)}
.fd-g{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tx3);
  padding:10px 6px 5px;display:flex;align-items:center;gap:8px}
.fd-g::after{content:'';flex:1;height:1px;background:var(--line)}
.fd-item{display:block;width:100%;text-align:left;border:1px solid transparent;background:none;
  border-radius:9px;padding:7px 9px;cursor:pointer;transition:.15s;margin-bottom:2px}
.fd-item:hover{background:var(--panel2)}
.fd-item.on{border-color:var(--pink);background:rgba(255,0,113,.05)}
.fd-item-id{display:block;font-family:var(--mono);font-size:10px;color:var(--pink-ink)}
.fd-item-n{display:block;font-size:12.2px;color:var(--tx);line-height:1.35;margin-top:2px}
.fd-count{font-size:10.5px;color:var(--tx3);padding:10px 6px 4px;font-family:var(--mono)}
.fd-pane{border:1px solid var(--line2);border-radius:14px;background:var(--panel);padding:16px 18px;min-width:0}
.fd-h{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.fd-h-l{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:15.5px;min-width:0}
.fd-h-r{margin-left:auto;display:flex;gap:6px}
.fd-h-r button{border:1px solid var(--line2);background:var(--panel);border-radius:8px;width:30px;height:30px;
  cursor:pointer;color:var(--tx2);transition:.15s}
.fd-h-r button:hover{border-color:var(--pink);color:var(--pink)}
.fd-ne{font-size:11.8px;color:var(--tx3);margin-bottom:12px}
.fd-ne b{color:var(--tx2);font-family:var(--mono);font-size:11px}
.fd-lede{border-left:3px solid var(--pink);background:var(--panel2);border-radius:0 10px 10px 0;
  padding:12px 15px;margin-bottom:6px}
.fd-lede p{margin:0 0 7px;font-size:13.3px;line-height:1.7;color:var(--tx)}
.fd-lede p:last-child{margin:0}
.fd-fig{font-size:11px;color:var(--tx3);font-family:var(--mono);margin:9px 0 7px}
.fd-who-w{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin-top:4px}
.fd-who{border:1px solid var(--line2);border-radius:11px;padding:11px 14px;font-size:12.6px;line-height:1.6}
.fd-who-h{font-weight:700;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--pink-ink);
  margin-bottom:6px;display:flex;align-items:center;gap:7px}
.fd-who-h::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--pink)}
.fd-lic{border-radius:11px;padding:11px 14px;font-size:12.6px;line-height:1.6;margin-top:10px}
.fd-lic b{display:block;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;margin-bottom:4px}
.fd-lic.ok{background:rgba(0,145,94,.07);border:1px solid #a8dcc6;color:var(--ok)}
.fd-lic.warn{background:rgba(168,104,0,.07);border:1px solid #e8cf9c;color:var(--warn)}
.fd-spec-w{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px}
.fd-spec{border:1px solid var(--line2);border-radius:11px;padding:11px 13px}
.fd-spec>div:first-child{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.fd-spec b{font-family:var(--mono);font-size:13px}
.fd-spec-n{font-size:11.8px;color:var(--tx2);line-height:1.55}
.fd-watch{display:block;margin-top:12px;border:1px solid var(--pink);background:rgba(255,0,113,.05);
  color:var(--pink-ink);border-radius:10px;padding:9px 14px;font-size:12.5px;cursor:pointer;transition:.15s}
.fd-watch:hover{background:var(--pink);color:#fff}
.fd-nones{font-size:11.5px;color:var(--tx3);border-top:1px dashed var(--line);margin-top:14px;padding-top:9px}
.fd-nones span{font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:10px}
.fd-childlink{display:block;width:100%;text-align:left;border:1px solid var(--line2);background:var(--panel);
  border-radius:10px;padding:10px 13px;font-size:13px;cursor:pointer;margin-top:8px;transition:.15s;color:var(--tx)}
.fd-childlink:hover{border-color:var(--pink);color:var(--pink-ink)}
@media(max-width:900px){
  .fdoss{grid-template-columns:1fr}
  .fd-rail{position:static;max-height:230px}
}

/* ═══════════ Engineer's console (dossier) ═══════════ */
.fd-eng{border:1px solid var(--line2);border-radius:12px;background:var(--bg2);padding:12px 14px;margin-top:16px}
.fd-eng:empty{display:none}
.fd-eng-h{font-size:12.5px;font-weight:700;margin-bottom:9px}
.fd-eng-h span{font-weight:400;font-size:11px;color:var(--tx3);margin-left:7px}
.fd-eng-row{display:flex;gap:10px;align-items:flex-start;padding:6px 0;border-top:1px dashed var(--line)}
.fd-eng-l{flex:none;width:128px;font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--tx3);padding-top:5px}
.fd-eng-c{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.fd-cmd{border:1px solid var(--pink-dim);background:var(--panel);color:var(--pink-ink);border-radius:8px;
  padding:4px 10px;font-family:var(--mono);font-size:11px;font-weight:600;cursor:pointer;transition:.15s}
.fd-cmd:hover{background:var(--pink);border-color:var(--pink);color:#fff;box-shadow:0 3px 10px var(--pink-glow)}
.fd-eng-chip{border:1px solid var(--line2);background:var(--panel);border-radius:8px;padding:4px 10px;
  font-size:11.3px;color:var(--tx2)}
.fd-eng-chip.task{border-color:#d9c9f5;color:var(--violet);background:rgba(124,58,237,.05)}
.fd-eng-none{font-size:11.3px;color:var(--tx3);font-style:italic;padding:4px 0}
.fd-quick{border:1px solid var(--line2);background:var(--panel);border-radius:8px;padding:4px 10px;
  font-size:11px;color:var(--tx2);cursor:pointer;transition:.15s}
.fd-quick b{color:var(--pink-ink);font-family:var(--mono);font-weight:600;margin-right:3px}
.fd-quick:hover{border-color:var(--pink);color:var(--pink-ink)}

/* ═══════════ 3.7 Feature Lifecycle Matrix ═══════════ */
.lcm-pick{display:flex;flex-wrap:wrap;gap:8px}
.lcm-chip{border:1px solid var(--line2);background:var(--panel);border-radius:10px;padding:7px 12px;
  font-size:12px;color:var(--tx);cursor:pointer;transition:.15s;text-align:left;text-decoration:none;display:block}
.lcm-chip span{display:block;font-family:var(--mono);font-size:9.5px;color:var(--pink-ink);margin-bottom:1px}
.lcm-chip:hover{border-color:var(--pink-dim)}
.lcm-chip.on{border-color:var(--pink);background:rgba(255,0,113,.05);box-shadow:0 4px 14px var(--pink-glow)}
.lcm-chip.link{border-style:dashed;color:var(--tx3)}
.lcm-run{border:1px solid var(--ok);background:rgba(0,145,94,.06);color:var(--ok);border-radius:9px;
  padding:8px 16px;font-size:12.5px;font-weight:600;cursor:pointer;transition:.15s}
.lcm-run:hover{background:var(--ok);color:#fff}
#lcmbox.deact .lcm-run{border-color:var(--bad);color:var(--bad);background:rgba(211,38,38,.05)}
#lcmbox.deact .lcm-run:hover{background:var(--bad);color:#fff}
.lcm-sc{font-size:11.8px;color:var(--tx3);flex:1;min-width:200px}
.lcm-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px;margin-top:14px;align-items:start}
.lcm-h{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3);margin-bottom:10px}
.lcm-step{display:flex;gap:11px;padding:10px 11px;border:1px solid var(--line);border-radius:11px;
  margin-bottom:8px;background:var(--panel);transition:.25s}
.lcm-step.on{border-color:var(--pink);box-shadow:0 0 0 3px var(--pink-glow);transform:translateX(4px)}
.lcm-step.done{border-color:#a8dcc6;background:rgba(0,145,94,.03)}
.lcm-step.done .lcm-n{background:var(--ok)}
.lcm-n{flex:none;width:24px;height:24px;border-radius:50%;background:var(--pink);color:#fff;font-size:11.5px;
  font-weight:700;display:grid;place-items:center;margin-top:2px;transition:.25s}
#lcmbox.deact .lcm-step.on{border-color:var(--bad);box-shadow:0 0 0 3px rgba(211,38,38,.12)}
#lcmbox.deact .lcm-n{background:var(--bad)}
#lcmbox.deact .lcm-step.done .lcm-n{background:var(--tx3)}
.lcm-b{min-width:0;flex:1}
.lcm-t{font-size:12.6px;line-height:1.6;color:var(--tx2);white-space:pre-line;margin-bottom:6px}
.lcm-card{border:1px solid var(--line2);border-radius:12px;background:var(--panel);padding:12px 14px;margin-bottom:12px}
.lcm-card.note{border-left:3px solid var(--warn)}
.lcm-card.note.ok{border-left-color:var(--ok)}
.lcm-ch{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3);margin-bottom:8px}
.lcm-ul{margin:0;padding-left:18px;font-size:12.4px;color:var(--tx2);line-height:1.65}
.lcm-script{white-space:pre-wrap;max-height:320px;overflow-y:auto}
.lcm-cm{color:var(--tx3);font-style:italic}
.lcm-ver{font-size:12.4px;color:var(--tx2);line-height:1.65;white-space:pre-line;max-height:260px;overflow-y:auto}
@media(max-width:980px){.lcm-grid{grid-template-columns:1fr}}

/* ═══════════ 3.8 Licences ═══════════ */
.lic-n{font-family:var(--mono);font-size:11px;color:var(--warn)}
.lic-none{color:var(--tx3);font-size:11.5px;font-style:italic}
.lic-code{font-size:11px;margin:3px 0}
.lic-sent{margin-top:8px;font-size:12.3px;color:var(--tx2);line-height:1.6}
.lic-sent .pill{margin-right:7px}
.lic-foot{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}

/* ═══════════ 3.8 Licence Control Center ═══════════ */
.lic-stats{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.lic-stat{border:1px solid var(--line2);border-radius:12px;background:var(--panel);padding:10px 18px;text-align:center;flex:1;min-width:120px}
.lic-stat b{display:block;font-size:22px;letter-spacing:-.03em;color:var(--pink)}
.lic-stat.warn b{color:var(--warn)}
.lic-stat span{font-size:10.5px;color:var(--tx3);text-transform:uppercase;letter-spacing:.08em}
.lic-h3{margin:26px 0 8px;font-size:15.5px;letter-spacing:-.01em}
#licpipe{width:100%;max-height:200px;display:block}
#licpipe .lp-n{fill:var(--panel);stroke:var(--line2);stroke-width:1.2}
#licpipe .lp-n.ok{stroke:var(--ok);stroke-width:1.6}
#licpipe .lp-t{font-size:14px;font-weight:650;fill:var(--tx)}
#licpipe .lp-s{font-size:10.5px;fill:var(--tx3)}
#licpipe .lp-w{fill:none;stroke:var(--pink-dim);stroke-width:2;stroke-dasharray:6 5;animation:frFlow 1s linear infinite}
#licpipe .lp-c{font-size:11px;font-weight:600;fill:var(--pink-ink);font-family:var(--mono);cursor:pointer}
#licpipe .lp-c:hover{text-decoration:underline}
#licpipe .lp-chip rect{fill:var(--bg2);stroke:var(--line2);cursor:pointer;transition:.15s}
#licpipe .lp-chip text{font-size:10.5px;fill:var(--tx2);font-family:var(--mono);cursor:pointer}
#licpipe .lp-chip:hover rect{stroke:var(--pink)}
#licpipe .lp-chip:hover text{fill:var(--pink-ink)}
.lic-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.lic-item{border:1px solid var(--line2);border-radius:12px;background:var(--panel);padding:11px 13px;transition:.2s}
.lic-item.off{background:var(--bg2);opacity:.75}
.lic-item.flash{border-color:var(--pink);box-shadow:0 0 0 4px var(--pink-glow)}
.lic-item-h{display:flex;align-items:center;gap:8px}
.lic-item-n{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--pink-ink)}
.lic-item-c{font-size:10.5px;color:var(--tx2)}
.lic-item-c.dim{color:var(--tx3);font-style:italic;font-size:10px}
.lic-item-h .fsw{margin-left:auto}
.lic-item-f{margin-top:7px;font-size:10.5px;color:var(--tx3);display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.lic-term{border:1px solid var(--line2);border-radius:12px;background:#101018;margin-top:12px;overflow:hidden}
.lic-term-h{display:flex;align-items:center;justify-content:space-between;padding:8px 13px;font-size:10.5px;
  letter-spacing:.09em;text-transform:uppercase;color:#8a8aa0;border-bottom:1px solid #23232e}
.lic-copyall{border:1px solid #33333f;background:none;color:#a9a9bd;border-radius:7px;padding:3px 10px;
  font-size:10.5px;cursor:pointer;text-transform:none;letter-spacing:0}
.lic-copyall:hover{border-color:var(--pink);color:#fff}
.lic-term-b{padding:12px 14px;font-family:var(--mono);font-size:12px;color:#e6e6f0;min-height:74px;
  max-height:220px;overflow-y:auto;line-height:1.8}
.lic-term-b .cmd{color:#ff7ab5}.lic-term-b .val{color:#7dd3fc}.lic-term-b .kw{color:#fbbf24}
.lic-line{white-space:pre-wrap;word-break:break-all}
.lic-prompt{color:#00d492;margin-right:7px;font-weight:700}
.lic-ret{color:#6b6b80;font-size:10.5px;margin-left:10px}
.lic-caret{display:inline-block;width:7px;height:14px;background:#e6e6f0;margin-left:3px;vertical-align:-2px;
  animation:licBlink 1s steps(1) infinite}
@keyframes licBlink{50%{opacity:0}}
.lic-swref{border:1px solid var(--line2);background:var(--panel);border-radius:7px;padding:3px 9px;
  font-family:var(--mono);font-size:10.5px;color:var(--pink-ink);cursor:pointer;transition:.15s}
.lic-swref:hover{border-color:var(--pink)}
.lic-cmdgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.lic-cg{border:1px solid var(--line2);border-radius:12px;background:var(--panel);padding:11px 13px;
  display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.lic-fn{font-size:12.3px;color:var(--tx2);line-height:1.6;margin-bottom:8px}
.lic-sp-h{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:13px;margin-bottom:7px}
.lic-sp-r{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--tx2);margin-top:8px}
.lic-bw{font-size:12.6px;color:var(--tx2);line-height:1.7}

/* ═══════════ 4.3 Cause-Code Intelligence Center ═══════════ */
#czgal, #cz5gal{width:100%;max-height:460px;display:block}
#czgal .cz-hub, #cz5gal .cz-hub{fill:var(--panel);stroke:var(--pink);stroke-width:1.6}
#czgal .cz-hub-t, #cz5gal .cz-hub-t{font-size:15px;font-weight:700;fill:var(--tx)}
#czgal .cz-hub-s, #cz5gal .cz-hub-s{font-size:10.5px;fill:var(--tx3)}
#czgal .cz-spoke, #cz5gal .cz-spoke{stroke:var(--pink);stroke-width:1.6;stroke-dasharray:4 4;fill:none;animation:frFlow .8s linear infinite}
#czgal .cz-n, #cz5gal .cz-n{cursor:pointer}
#czgal .cz-n .cz-dot, #cz5gal .cz-n .cz-dot{transition:.18s}
#czgal .cz-n:hover .cz-dot, #cz5gal .cz-n:hover .cz-dot{transform:scale(1.28)}
#czgal .cz-ring, #cz5gal .cz-ring{fill:none;stroke:var(--pink);stroke-width:2;opacity:0;transition:.2s}
#czgal .cz-n.on .cz-ring, #cz5gal .cz-n.on .cz-ring{opacity:1;animation:czPulse 1.6s ease-out infinite}
@keyframes czPulse{0%{stroke-width:2.4;opacity:1}100%{stroke-width:.6;opacity:.35}}
#czgal .cz-nl, #cz5gal .cz-nl{font-size:9px;font-weight:700;fill:#fff;pointer-events:none;font-family:var(--mono)}
#czgal .cz-leg-t, #cz5gal .cz-leg-t{font-size:11px;fill:var(--tx2)}
.cz-two{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px;margin-top:16px;align-items:start}
@media(max-width:920px){.cz-two{grid-template-columns:1fr}}
#cztopo{width:100%;max-height:250px;display:block}
#cztopo .cz-tn rect{fill:var(--panel);stroke:var(--line2);stroke-width:1.2}
#cztopo .cz-tn.mme rect{stroke:var(--pink);stroke-width:1.6}
#cztopo .cz-tn text{font-size:12.5px;font-weight:650;fill:var(--tx)}
#cztopo .cz-tn text.s{font-size:9.5px;font-weight:400;fill:var(--tx3)}
#cztopo .cz-w{stroke:var(--line2);stroke-width:1.6;fill:none;transition:.3s}
#cztopo .cz-wl{font-size:9.5px;fill:var(--tx3);font-family:var(--mono)}
#cztopo .cz-flash{display:none}
#cztopo.f-nas #czw_nas1,#cztopo.f-nas #czw_nas2{stroke:var(--bad);stroke-width:2.6;stroke-dasharray:5 4;animation:frFlow .7s linear infinite}
#cztopo.f-s6a [data-w=s6a]{stroke:var(--bad);stroke-width:2.6;stroke-dasharray:5 4;animation:frFlow .7s linear infinite}
#cztopo.f-sgs [data-w=sgs]{stroke:var(--bad);stroke-width:2.6;stroke-dasharray:5 4;animation:frFlow .7s linear infinite}
#cztopo.f-nas [data-f=nas]{display:block}
#cztopo.f-s6a [data-f=s6a]{display:block}
#cztopo.f-sgs [data-f=sgs]{display:block}
.cz-sel{border:1px solid var(--pink-dim);border-radius:14px;background:var(--panel);padding:16px 18px}
.cz-sel-num{font-family:var(--mono);font-size:26px;font-weight:700;color:var(--pink);letter-spacing:-.02em}
.cz-sel-name{font-size:15px;font-weight:650;margin:2px 0 10px;line-height:1.4}
.cz-sel-p{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:9px}
.cz-sel-hint{font-size:12.3px;color:var(--tx2);line-height:1.6;border-top:1px dashed var(--line);padding-top:9px}
.cz-tbl{border-collapse:collapse;width:100%}
.cz-tbl th{position:sticky;top:0;background:var(--panel2);z-index:2;font-size:10.5px;text-transform:uppercase;
  letter-spacing:.07em;color:var(--tx3);padding:8px 10px;text-align:center}
.cz-tbl th.cz-sticky,.cz-tbl td.cz-sticky{position:sticky;left:0;background:var(--panel);text-align:left;z-index:1;min-width:230px}
.cz-tbl th.cz-sticky{z-index:3;background:var(--panel2)}
.cz-tbl td{padding:6px 10px;font-size:11.8px;border-top:1px solid var(--line);text-align:center}
.cz-tbl td.cz-sticky{cursor:pointer}
.cz-tbl td.cz-sticky b{color:var(--pink-ink);font-family:var(--mono);font-size:11px}
.cz-tbl td.cz-sticky span{color:var(--tx2);font-size:11.3px}
.cz-tbl .cz-cell{cursor:pointer;font-family:var(--mono);font-weight:600;transition:.12s}
.cz-tbl .cz-cell:hover{outline:2px solid var(--pink);outline-offset:-2px}
.cz-tbl .cz-cell.empty{color:var(--line2);cursor:default}
.cz-tbl tr.on td{border-top-color:var(--pink);border-bottom:1px solid var(--pink)}
.cz-tbl tr.on td.cz-sticky{background:rgba(255,0,113,.05)}

/* ═══════════ 4.4 Fault Case Command Center ═══════════ */
.fn-finder{margin:14px 0}
.fn-finder input{width:100%;border:1px solid var(--line2);border-radius:11px;background:var(--panel);
  padding:12px 16px;font-size:13.5px;font-family:var(--sans);color:var(--tx)}
.fn-finder input:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 4px var(--pink-glow)}
.fn-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
.fn-chips button{border:1px solid var(--line2);background:var(--panel);color:var(--tx2);border-radius:999px;
  padding:5px 12px;font-size:11.5px;cursor:pointer;transition:.15s}
.fn-chips button:hover{border-color:var(--pink-dim)}
.fn-chips button.on{background:var(--pink);border-color:var(--pink);color:#fff}
#fnmap, #f5map{width:100%;max-height:260px;display:block}
#fnmap .fn-n rect, #f5map .fn-n rect{fill:var(--panel);stroke:var(--line2);stroke-width:1.2}
#fnmap .fn-t, #f5map .fn-t{font-size:12.5px;font-weight:650;fill:var(--tx)}
#fnmap .fn-s, #f5map .fn-s{font-size:9.5px;fill:var(--tx3)}
#fnmap .fn-w, #f5map .fn-w{stroke:var(--line2);stroke-width:1.6;fill:none}
#fnmap .fn-w.thin, #f5map .fn-w.thin{stroke-dasharray:3 4}
#fnmap .fn-note, #f5map .fn-note{font-size:10px;fill:var(--tx3);text-anchor:middle}
.fn-pin{cursor:pointer}
.fn-pin-c{fill:var(--bad);transition:.18s}
.fn-pin-halo{fill:none;stroke:var(--bad);stroke-width:2;animation:czPulse 1.8s ease-out infinite}
.fn-pin-t{fill:#fff;font-size:12.5px;font-weight:700;font-family:var(--mono)}
.fn-pin:hover .fn-pin-c{transform:scale(1.18)}
.fn-pin.on .fn-pin-c{fill:var(--pink)}
.fn-pin.on .fn-pin-halo{stroke:var(--pink)}
.fn-grid{display:grid;grid-template-columns:330px minmax(0,1fr);gap:16px;margin-top:16px;align-items:start}
@media(max-width:980px){.fn-grid{grid-template-columns:1fr}}
.fn-case{display:block;width:100%;text-align:left;border:1px solid var(--line);background:var(--panel);
  border-radius:10px;padding:9px 12px;margin-bottom:6px;cursor:pointer;transition:.15s}
.fn-case:hover{border-color:var(--pink-dim)}
.fn-case.on{border-color:var(--pink);background:rgba(255,0,113,.04)}
.fn-case b{display:block;font-size:12.3px;font-weight:600;color:var(--tx);line-height:1.4}
.fn-case span{display:block;font-size:10.8px;color:var(--tx3);margin-top:3px;line-height:1.45}
.fn-doss{border:1px solid var(--line2);border-radius:14px;background:var(--panel);padding:16px 18px;min-width:0}
.fn-d-t{font-size:17px;font-weight:700;letter-spacing:-.01em;margin-top:8px;line-height:1.35}
.fn-x{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0 2px;padding-bottom:10px;border-bottom:1px dashed var(--line)}
.fn-x-cause{border:1px solid #f2b8b8;background:rgba(211,38,38,.05);color:var(--bad);border-radius:8px;
  padding:4px 10px;font-size:11px;font-family:var(--mono);cursor:pointer;transition:.15s}
.fn-x-cause:hover{background:var(--bad);color:#fff}
.fn-sec{margin-top:14px;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.fn-sec-h{padding:8px 14px;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3);background:var(--panel2)}
.fn-sec-b{padding:11px 14px;font-size:12.8px;line-height:1.65;color:var(--tx2)}
.fn-sec-b p{margin:0 0 7px}
.fn-sec.sym{border-color:#f2b8b8}.fn-sec.sym .fn-sec-h{background:rgba(211,38,38,.06);color:var(--bad)}
.fn-sec.cause .fn-sec-h{color:var(--warn);background:rgba(168,104,0,.05)}
.fn-sec.proc .fn-sec-h{color:var(--ok);background:rgba(0,145,94,.05)}
.fn-sec.alm .fn-sec-h{color:var(--warn)}
.fn-sec.rel{opacity:.85}

/* ═══════════ 4.5 KPI Observatory ═══════════ */
.kob-top{display:grid;grid-template-columns:360px minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:980px){.kob-top{grid-template-columns:1fr}}
.kob-ringwrap{padding:10px 12px}
#kobring{width:100%;display:block}
.kob-track{fill:none;stroke:var(--line);stroke-width:26}
.kob-seg{fill:none;stroke-width:26;cursor:pointer;transition:.25s;transform-origin:160px 150px;
  animation:kobIn 1s cubic-bezier(.6,0,.2,1) both}
@keyframes kobIn{from{opacity:0;transform:rotate(-14deg)}to{opacity:1;transform:rotate(0)}}
.kob-seg:hover{stroke-width:32}
.kob-seg.dim{opacity:.22}
.kob-c-n{font-size:34px;font-weight:700;fill:var(--tx);letter-spacing:-.03em}
.kob-c-s{font-size:11px;fill:var(--tx3)}
.kob-leg{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.kob-lg{display:flex;align-items:center;gap:8px;border:1px solid transparent;background:none;border-radius:8px;
  padding:5px 9px;font-size:12px;color:var(--tx2);cursor:pointer;text-align:left;transition:.15s}
.kob-lg:hover{background:var(--panel2)}
.kob-lg.on{border-color:var(--pink);background:rgba(255,0,113,.04)}
.kob-lg i{width:10px;height:10px;border-radius:3px;flex:none}
.kob-lg b{margin-left:auto;font-family:var(--mono);font-size:11px}
.kob-spot{border:1px solid var(--pink-dim);border-radius:14px;background:var(--panel);padding:16px 18px}
.kob-spot-cat{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.kob-spot-n{font-size:17px;font-weight:700;letter-spacing:-.01em;margin:4px 0 8px;line-height:1.35}
.kob-spot-m{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.kob-spot-d{font-size:12.6px;color:var(--tx2);line-height:1.6;margin:0 0 10px}
.kob-frac{border:1px solid var(--line2);border-radius:12px;background:var(--bg2);padding:13px 15px}
.kob-num,.kob-den{font-family:var(--mono);font-size:12px;line-height:2.1;color:var(--tx)}
.kob-bar{display:flex;align-items:center;gap:10px;margin:8px 0}
.kob-bar::before,.kob-bar::after{content:'';flex:1;height:2px;background:var(--pink);border-radius:2px}
.kob-bar span{color:var(--pink);font-weight:700}
.kob-ctr{display:inline-flex;flex-direction:column;vertical-align:middle;border:1px solid var(--pink-dim);
  border-radius:8px;padding:2px 8px;margin:2px 3px;background:var(--panel);color:var(--pink-ink);
  font-size:10.5px;font-weight:700;line-height:1.3;animation:kobChip .5s ease both}
.kob-ctr i{font-style:normal;font-weight:400;font-size:9px;color:var(--tx3);max-width:190px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
@keyframes kobChip{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.kob-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:10px;margin-top:14px}
.kob-card{border:1px solid var(--line2);border-top:3px solid var(--line2);border-radius:11px;background:var(--panel);
  padding:11px 13px;cursor:pointer;transition:.16s;animation:kobCard .45s ease both}
@keyframes kobCard{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.kob-card:hover{border-color:var(--pink-dim);transform:translateY(-2px);box-shadow:0 8px 20px rgba(21,21,31,.06)}
.kob-card-n{font-size:12.3px;font-weight:600;line-height:1.45;min-height:36px}
.kob-card-m{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}
.fn-ne{font-style:normal;font-size:9px;font-weight:700;color:var(--warn);border:1px solid #e8cf9c;border-radius:5px;padding:0 4px;margin-left:5px;vertical-align:1px}
.fn-pin.empty{opacity:.25}

/* ═══════════ 1.6 Huawei Product Architecture ═══════════ */
#paStack{width:100%;max-height:320px;display:block}
.pa-layer{animation:paRise .7s cubic-bezier(.5,0,.2,1) both}
@keyframes paRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.pa-l{stroke-width:1.4}
.pa-l.nfvi{fill:rgba(22,104,209,.06);stroke:var(--info)}
.pa-l.vnf{fill:rgba(255,0,113,.05);stroke:var(--pink)}
.pa-l.ems{fill:rgba(0,145,94,.06);stroke:var(--ok)}
.pa-l.mano{fill:rgba(124,58,237,.06);stroke:var(--violet)}
.pa-lt{font-size:14px;font-weight:700;fill:var(--tx)}
.pa-ls{font-size:10.5px;fill:var(--tx3)}
.pa-w{stroke:var(--line2);stroke-width:2;stroke-dasharray:4 4;fill:none;animation:frFlow 1s linear infinite}
.pa-vnf{border:2px solid var(--pink-dim);border-radius:16px;padding:14px 16px 10px;margin-bottom:16px;
  background:radial-gradient(circle,var(--line) 1px,transparent 1px) 0 0/16px 16px,var(--bg)}
.pa-vnf-h{font-size:13px;font-weight:700;margin-bottom:11px}
.pa-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:9px}
.pa-c{border:1px solid var(--line2);border-radius:11px;background:var(--panel);padding:10px 12px;cursor:pointer;
  transition:.16s;animation:kobCard .5s ease both}
.pa-c:hover{border-color:var(--pink-dim);transform:translateY(-2px);box-shadow:0 8px 18px rgba(21,21,31,.07)}
.pa-c.svc{border-color:var(--pink);box-shadow:0 0 0 1px var(--pink) inset}
.pa-c-n{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--pink-ink)}
.pa-c-f{font-size:11.3px;color:var(--tx2);line-height:1.5;margin:5px 0 7px;min-height:48px}
.pa-c-m{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.pa-c-flt{border:1px solid #f2b8b8;background:rgba(211,38,38,.04);color:var(--bad);border-radius:7px;
  padding:2px 8px;font-size:10px;cursor:pointer;transition:.15s}
.pa-c-flt:hover{background:var(--bad);color:#fff}
.pa-vnfp{margin-top:10px;border:1px dashed var(--line2);border-radius:10px;text-align:center;padding:8px;
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx3)}
.pa-detail{border:1px solid var(--pink-dim);border-radius:14px;background:var(--panel);padding:15px 17px;margin:4px 0 18px}
.pa-lanes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
.pa-lane{border:1px solid var(--line2);border-radius:12px;background:var(--bg2);padding:10px 11px}
.pa-lane-h{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--info);margin-bottom:8px}
.pa-proc{border:1px solid var(--line2);border-radius:9px;background:var(--panel);padding:8px 10px;margin-bottom:7px}
.pa-proc b{font-family:var(--mono);font-size:12px;color:var(--pink-ink);margin-right:7px}
.pa-proc span{font-size:11px;color:var(--tx2)}
.pa-proc em{display:block;font-style:normal;font-size:10.8px;color:var(--tx3);line-height:1.5;margin-top:4px}
.pa-proc i{display:block;font-size:10px;color:var(--info);margin-top:3px}
.pa-hl{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.pa-hl-c{border:1px solid var(--line2);border-radius:12px;background:var(--panel);padding:12px 14px;cursor:pointer;
  transition:.16s;animation:kobCard .5s ease both}
.pa-hl-c:hover{border-color:var(--pink-dim);transform:translateY(-2px)}
.pa-hl-n{font-size:13px;font-weight:700;margin-bottom:5px}
.pa-hl-t{font-size:11.4px;color:var(--tx3);line-height:1.55}
.pa-hl-more{display:inline-block;margin-top:7px;font-size:10.5px;color:var(--pink-ink);font-weight:600}

/* ═══════════ 4.6 NSA Deployment War Room ═══════════ */
.wr-ready{border:1px solid var(--line2);border-radius:14px;background:var(--panel);padding:12px 15px}
.wr-check{display:flex;align-items:center;gap:11px;padding:7px 4px;cursor:pointer;border-bottom:1px dashed var(--line)}
.wr-check input{display:none}
.wr-tick{width:20px;height:20px;border:2px solid var(--line2);border-radius:6px;flex:none;position:relative;transition:.18s}
.wr-check input:checked+.wr-tick{background:var(--ok);border-color:var(--ok)}
.wr-check input:checked+.wr-tick::after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:13px;font-weight:700}
.wr-check-t{font-size:12.6px;color:var(--tx2);line-height:1.5}
.wr-check input:checked~.wr-check-t{color:var(--tx3);text-decoration:line-through}
.wr-ready-bar{position:relative;height:26px;border-radius:999px;background:var(--bg2);border:1px solid var(--line2);margin-top:11px;overflow:hidden}
.wr-ready-fill{height:100%;width:0;background:var(--pink);transition:.4s;border-radius:999px}
.wr-ready-fill.go{background:var(--ok)}
.wr-ready-bar span{position:absolute;inset:0;display:grid;place-items:center;font-size:11px;font-weight:700;font-family:var(--mono)}
.wr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.wr-tile{border:1px solid var(--line2);border-radius:14px;background:var(--panel);padding:14px 16px;cursor:pointer;
  transition:.18s;animation:kobCard .5s ease both}
.wr-tile:hover{border-color:var(--pink-dim);transform:translateY(-2px);box-shadow:0 10px 24px rgba(21,21,31,.07)}
.wr-tile.on{border-color:var(--pink);box-shadow:0 0 0 3px var(--pink-glow)}
.wr-tile-h{display:flex;align-items:center;gap:9px;font-size:13.6px;line-height:1.4;margin-bottom:7px}
.wr-ico{font-size:19px;flex:none}
.wr-tile-why{font-size:11.8px;color:var(--tx3);line-height:1.55;min-height:52px}
.wr-tile-m{display:flex;gap:5px;flex-wrap:wrap;margin:9px 0 7px}
.wr-open{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--pink-ink)}
.wr-play{border:1px solid var(--pink);border-radius:14px;background:var(--panel);padding:15px 17px;margin-top:14px;
  box-shadow:0 14px 40px rgba(255,0,113,.08)}
.wr-play-h{display:flex;align-items:center;gap:10px;font-size:14.5px;margin-bottom:12px}
.wr-x{margin-left:auto;border:1px solid var(--line2);background:var(--panel);border-radius:8px;width:28px;height:28px;cursor:pointer;color:var(--tx3)}
.wr-x:hover{color:var(--bad);border-color:var(--bad)}
.wr-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.wr-row{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:1px solid var(--line);
  background:var(--panel);border-radius:9px;padding:7px 10px;margin-bottom:6px;font-size:11.8px;color:var(--tx2);
  cursor:pointer;transition:.14s;line-height:1.45}
.wr-row:hover{border-color:var(--pink);color:var(--tx)}
.wr-row.static{cursor:default}
.wr-row.static:hover{border-color:var(--line)}
.wr-row b{flex:none;font-family:var(--mono);font-size:9.5px;color:var(--pink-ink);border:1px solid var(--pink-dim);
  border-radius:5px;padding:1px 5px}
.wr-health{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.wr-g{border:1px solid var(--line2);border-radius:12px;background:var(--panel);padding:11px 13px;cursor:pointer;
  transition:.16s;animation:kobCard .5s ease both;display:flex;flex-direction:column;gap:7px}
.wr-g:hover{border-color:var(--pink-dim);transform:translateY(-2px)}
.wr-g-ring{position:relative;width:60px;height:60px}
.wr-g-ring svg{width:60px;height:60px;transform:rotate(-90deg)}
.wr-g-tr{fill:none;stroke:var(--line);stroke-width:6}
.wr-g-arc{fill:none;stroke:var(--pink);stroke-width:6;stroke-linecap:round;stroke-dasharray:151;
  stroke-dashoffset:151;animation:wrArc 1.4s cubic-bezier(.5,0,.2,1) forwards}
@keyframes wrArc{to{stroke-dashoffset:38}}
.wr-g-ring span{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--mono);font-size:11px;font-weight:700;color:var(--pink-ink)}
.wr-g-n{font-size:11.4px;color:var(--tx2);line-height:1.5;min-height:48px}
.wr-g-m{display:flex;gap:5px;flex-wrap:wrap}

/* ═══════════ 1.6 living VNF motherboard ═══════════ */
#paMobo{width:100%;max-height:430px;display:block}
.mb-board{fill:var(--bg2);stroke:var(--line2);stroke-width:1.4}
.mb-title{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;fill:var(--tx3)}
.mb-c rect{fill:var(--panel);stroke:var(--line2);stroke-width:1.3;transition:.25s;cursor:pointer}
.mb-c text{font-family:var(--mono);font-size:12px;font-weight:700;fill:var(--tx);cursor:pointer}
.mb-c.svc rect{stroke:var(--pink)}
.mb-c.big rect{stroke-width:2}
.mb-c.ems rect{stroke:var(--ok);stroke-dasharray:4 3}
.mb-c.on rect{stroke:var(--pink);stroke-width:2.4;filter:drop-shadow(0 0 10px rgba(255,0,113,.45))}
.mb-w{stroke:var(--line2);stroke-width:1.8;fill:none}
.mb-w.in{stroke:var(--info)}
.mb-w.dash{stroke-dasharray:4 5}
.mb-l{font-size:10px;fill:var(--tx3);font-family:var(--mono)}
.mb-vnfp{fill:rgba(124,58,237,.06);stroke:var(--violet);stroke-width:1.2}
.mb-vnfp-t{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;fill:var(--violet)}
.mb-fac{fill:none;stroke:var(--ok);stroke-width:2;opacity:.8;animation:mbFac 2.4s ease-out infinite}
@keyframes mbFac{0%{r:14;opacity:.9}100%{r:150;opacity:0}}
.mb-cap{margin-top:8px;border-left:3px solid var(--pink);background:var(--panel2);border-radius:0 9px 9px 0;
  padding:9px 13px;font-size:12.4px;color:var(--tx2);line-height:1.6;min-height:44px}
.mb-cap b{font-family:var(--mono);color:var(--pink-ink)}

/* ═══════════ 4.6 triage wizard ═══════════ */
.wz{border:2px solid var(--pink);border-radius:16px;background:var(--panel);padding:16px 18px;margin-bottom:18px;
  box-shadow:0 14px 44px rgba(255,0,113,.09)}
.wz-h{font-size:16px;font-weight:700;letter-spacing:-.01em}
.wz-sub{font-size:12px;color:var(--tx3);margin:4px 0 12px;line-height:1.55}
.wz-crumb{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.wz-crumb:empty{display:none}
.wz-back{border:1px solid var(--line2);background:var(--bg2);border-radius:7px;padding:3px 10px;font-size:10.5px;
  color:var(--tx3);cursor:pointer;transition:.15s}
.wz-back:hover{color:var(--pink-ink);border-color:var(--pink-dim)}
.wz-q{font-size:14.5px;font-weight:650;margin-bottom:11px}
.wz-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:9px}
.wz-opt{border:1px solid var(--line2);background:var(--panel);border-radius:11px;padding:13px 15px;font-size:13px;
  text-align:left;cursor:pointer;transition:.16s;animation:kobCard .4s ease both}
.wz-opt:hover{border-color:var(--pink);transform:translateY(-2px);box-shadow:0 8px 20px var(--pink-glow)}
.wz-diag{font-size:13.2px;line-height:1.6;color:var(--tx);border-left:3px solid var(--pink);
  background:var(--panel2);border-radius:0 10px 10px 0;padding:10px 14px;margin-bottom:12px}
.wz-step{display:flex;gap:11px;padding:10px 4px;border-bottom:1px dashed var(--line);animation:kobCard .45s ease both}
.wz-step-t{font-size:12.8px;color:var(--tx2);line-height:1.55;margin-bottom:7px}
.wz-acts{display:flex;gap:6px;flex-wrap:wrap}
.wz-mini{width:auto;margin-bottom:0;padding:5px 9px;font-size:11px}

/* ═══════════ Part B 1.3 — real 5GC product board ═══════════ */
#a5board{width:100%;max-height:470px;display:block}
.a5-bus{stroke:var(--pink);stroke-width:3;stroke-dasharray:8 6;fill:none;animation:frFlow 1.2s linear infinite}
.a5-bl{font-size:10.5px;fill:var(--pink-ink);font-family:var(--mono)}
.a5-w{stroke:var(--line2);stroke-width:1.8;fill:none}
.a5-w.up{stroke:var(--violet);stroke-width:2.6}
.a5-w.dash{stroke:var(--pink-dim);stroke-dasharray:5 5}
.a5-wl{font-size:10px;fill:var(--tx3);font-family:var(--mono)}
.a5-wl.vio{fill:var(--violet)}
.a5-rack{cursor:pointer}
.a5-rack-r{fill:var(--panel);stroke-width:1.6;transition:.25s}
.a5-rack.on .a5-rack-r{stroke-width:3;filter:drop-shadow(0 0 12px rgba(255,0,113,.35))}
.a5-rack-n{font-size:15px;font-weight:700;font-family:var(--mono)}
.a5-rack-s{font-size:10px;fill:var(--tx3)}
.a5-nf{fill:var(--bg2);stroke:var(--line2)}
.a5-nf-t{font-size:10.5px;font-weight:700;fill:var(--tx);font-family:var(--mono)}
.a5-n rect{fill:var(--panel);stroke:var(--line2);stroke-width:1.3}
.a5-nt{font-size:12.5px;font-weight:650;fill:var(--tx)}
.a5-ns{font-size:9.5px;fill:var(--tx3)}
#a5stack{width:100%;max-height:300px;display:block}
.a5-ms{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.a5-ms-c{border:1px solid var(--line2);border-radius:10px;background:var(--panel);padding:9px 11px;animation:kobCard .4s ease both}
.a5-ms-c b{font-family:var(--mono);font-size:12px;color:var(--pink-ink);margin-right:7px}
.a5-ms-c span{font-size:11px;color:var(--tx2)}
.a5-ms-c em{display:block;font-style:normal;font-size:10.5px;color:var(--tx3);margin-top:4px;line-height:1.5}
.a5-ms-cat{display:block;font-style:normal;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx3);margin-bottom:3px}

/* ═══════════ Part B — CUPS evolution theatre ═══════════ */
#cupsEvo{width:100%;max-height:400px;display:block}
.e5-zone{fill:var(--bg2);stroke:var(--line);stroke-dasharray:5 5}
.e5-zone.c{fill:rgba(22,104,209,.03)}
.e5-zl{font-size:9.5px;letter-spacing:.12em;fill:var(--tx3);font-family:var(--mono)}
.e5-n rect,.e5-box rect,.e5-split rect{fill:var(--panel);stroke:var(--line2);stroke-width:1.4;transition:all .7s cubic-bezier(.5,0,.2,1)}
.e5-nt{font-size:13px;font-weight:700;fill:var(--tx)}
.e5-ns{font-size:9.5px;fill:var(--tx3)}
.e5-box,.e5-split,.e5-unc,.e5-delay{transition:opacity .7s,transform .8s cubic-bezier(.5,0,.2,1)}
.e5-w{fill:none;stroke-width:2.4;transition:opacity .6s}
.e5-w.up{stroke:var(--violet)}
/* act gating */
#cupsEvo .e5-split,#cupsEvo .e5-unc,#cupsEvo .e5-nf,#cupsEvo .e5-dots-short,#cupsEvo .shrt{opacity:0}
#cupsEvo .e5-delay{opacity:0}
#cupsEvo.act1.pain .e5-delay{opacity:1;animation:e5Pulse 1s ease-in-out infinite}
@keyframes e5Pulse{50%{transform:translateY(-3px)}}
#cupsEvo.act2 .e5-split,#cupsEvo.act3 .e5-split{opacity:1}
#cupsEvo.act2 .e5-sgw rect,#cupsEvo.act2 .e5-pgw rect,#cupsEvo.act3 .e5-sgw,#cupsEvo.act3 .e5-pgw{opacity:.25}
#cupsEvo.act2 .e5-dots-long,#cupsEvo.act2 .lng,#cupsEvo.act3 .e5-dots-long,#cupsEvo.act3 .lng{opacity:.15}
#cupsEvo.act2 .e5-dots-short,#cupsEvo.act2 .shrt,#cupsEvo.act3 .e5-dots-short,#cupsEvo.act3 .shrt{opacity:1}
#cupsEvo.act3 .e5-sgwc,#cupsEvo.act3 .e5-pgwc,#cupsEvo.act3 .e5-mme{opacity:0;transform:translate(0,40px)}
#cupsEvo.act3 .e5-unc{opacity:1}
#cupsEvo.act3 .e5-unc rect:first-of-type{stroke:var(--pink);stroke-width:2.4}
#cupsEvo.act3 .e5-nf{opacity:1;transform:none}
#cupsEvo .e5-nf{transform:translateY(14px);transition:opacity .5s,transform .5s}
#cupsEvo .e5-nf rect{fill:var(--bg2);stroke:var(--pink-dim)}
#cupsEvo .e5-nf text{font-size:11px;font-weight:700;fill:var(--pink-ink);font-family:var(--mono)}
#cupsEvo.done .e5-unc rect:first-of-type{filter:drop-shadow(0 0 14px rgba(255,0,113,.45))}
.e5-unc rect{fill:var(--panel);stroke:var(--line2)}
.e5-unc-t{font-size:16px;font-weight:700;fill:var(--pink);font-family:var(--mono)}
.e5-delay rect{fill:rgba(211,38,38,.08);stroke:var(--bad)}
.e5-delay text{font-size:11px;fill:var(--bad);font-weight:700}

/* ═══════════ 1.2 constellation & cover ═══════════ */
#nfcst,#nfcover{width:100%;display:block}
.cst-core{fill:var(--panel);stroke:var(--pink);stroke-width:2}
.cst-core-halo{fill:none;stroke:var(--pink);stroke-width:2;animation:czPulse 2s ease-out infinite}
.cst-core-t{font-size:16px;font-weight:700;fill:var(--pink);font-family:var(--mono)}
.cst-core-s{font-size:10px;fill:var(--tx3)}
.cst-sp{cursor:pointer;animation:kobCard .5s ease both}
.cst-w{stroke:var(--line2);stroke-width:1.6;fill:none;transition:.2s}
.cst-dot{fill:var(--info)}
.cst-sp:hover .cst-w,.cst-sp.on .cst-w{stroke:var(--pink);stroke-width:2.6}
.cst-sp.on .cst-dot{fill:var(--pink)}
.cst-tag rect{fill:var(--bg2);stroke:var(--line2);transition:.2s}
.cst-tag text{font-size:10px;font-weight:700;fill:var(--tx2);font-family:var(--mono)}
.cst-sp.on .cst-tag rect{fill:var(--pink);stroke:var(--pink)}
.cst-sp.on .cst-tag text{fill:#fff}
.cst-peer rect{fill:var(--panel);stroke:var(--line2);stroke-width:1.2;transition:.2s}
.cst-peer text{font-size:10.5px;font-weight:600;fill:var(--tx)}
.cst-sp:hover .cst-peer rect,.cst-sp.on .cst-peer rect{stroke:var(--pink)}
.cst-orb rect{fill:var(--panel);stroke:var(--pink-dim);stroke-width:1.4}
.cst-orb text{font-size:12px;font-weight:700;fill:var(--pink-ink);font-family:var(--mono)}
.cst-spec{font-size:21px;font-weight:700;color:var(--pink);letter-spacing:-.02em;font-family:var(--mono);
  animation:kobChip .5s ease both}

/* ═══════════ 3.1 SA configuration deck ═══════════ */
#cfgdk{width:100%;max-height:330px;display:block}
.dk-unc{fill:var(--bg2);stroke:var(--line2);stroke-width:1.6;transition:.5s}
#cfgdk.s-unc .dk-unc{stroke:var(--pink);stroke-width:2.4}
.dk-unc-t{font-size:16px;font-weight:700;fill:var(--pink);font-family:var(--mono)}
.dk-unc-s{font-size:10px;fill:var(--tx3)}
.dk-nf rect{fill:var(--panel);stroke:var(--line2);stroke-width:1.3;transition:all .5s}
.dk-nf{opacity:.25;transition:opacity .5s;cursor:pointer}
#cfgdk.s-nfs .dk-nf{opacity:1}
#cfgdk.s-nfs .dk-nf rect{stroke:var(--pink)}
.dk-nf-t{font-size:13px;font-weight:700;fill:var(--tx);font-family:var(--mono)}
.dk-nf-s{font-size:9.5px;fill:var(--pink-ink);font-family:var(--mono)}
.dk-w{stroke:var(--line2);stroke-width:2;fill:none;transition:.5s}
.dk-w.dash{stroke-dasharray:4 5}
.dk-wl{font-size:9.5px;fill:var(--tx3);font-family:var(--mono)}
.dk-dots-w,.dk-dots-u{opacity:0;transition:.5s}
#cfgdk.s-wires .dk-dots-w{opacity:1}
#cfgdk.s-wires .dk-w:not(.dash){stroke:var(--info)}
#cfgdk.s-u2020 .dk-dots-u{opacity:1}
#cfgdk.s-u2020 .dk-w.dash{stroke:var(--ok)}
.dk-done{opacity:0;transition:.5s}
#cfgdk.s-done .dk-done{opacity:1}
.dk-done-t{font-size:12px;font-weight:700;fill:#fff}

/* ═══════════ 3.1c config build theatre ═══════════ */
.ca-board{display:grid;grid-template-columns:170px repeat(4,1fr);gap:10px;align-items:start}
@media(max-width:960px){.ca-board{grid-template-columns:1fr 1fr}}
.ca-core{border:2px solid var(--pink);border-radius:14px;background:var(--panel);padding:12px;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:4px}
.ca-core b{font-family:var(--mono);font-size:20px;color:var(--pink)}
.ca-core span{font-size:11px;color:var(--tx3);font-family:var(--mono)}
.ca-core svg{width:56px;height:56px;transform:rotate(-90deg)}
.ca-arc{fill:none;stroke:var(--pink);stroke-width:6;stroke-linecap:round;transition:stroke-dashoffset .35s}
.ca-zone{border:1px solid var(--line2);border-radius:12px;background:var(--bg2);min-height:190px}
.ca-zone-h{padding:7px 11px;font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--tx3);border-bottom:1px dashed var(--line);display:flex;justify-content:space-between}
.ca-zone-h b{color:var(--pink-ink);font-family:var(--mono)}
.ca-zone-b{padding:8px;display:flex;flex-direction:column;gap:5px;max-height:300px;overflow-y:auto}
.ca-chip{border:1px solid var(--line2);border-radius:8px;background:var(--panel);padding:5px 8px;
  animation:kobChip .4s ease both}
.ca-chip b{display:block;font-family:var(--mono);font-size:10px;color:var(--pink-ink)}
.ca-chip span{font-size:9.5px;color:var(--tx3);font-family:var(--mono)}
.ca-chip.zlnk{border-left:3px solid var(--info)}
.ca-chip.zip{border-left:3px solid var(--violet)}
.ca-chip.zid{border-left:3px solid var(--warn)}
.ca-chip.zsvc{border-left:3px solid var(--ok)}

/* ═══════════ 3.2–3.5 config anatomy ═══════════ */
.cfx{margin-bottom:14px}
.cfx-cst{width:100%;max-height:400px;display:block}
.cfx-sp{animation:kobCard .5s ease both}
.cfx-b rect{fill:var(--panel);stroke:var(--line2);stroke-width:1.2;transition:.2s}
.cfx-b.fqdn rect{stroke:var(--ok);stroke-dasharray:3 3}
.cfx-sp:hover .cfx-b rect{stroke:var(--pink)}
.cfx-bv{font-size:10.5px;font-weight:700;fill:var(--tx);font-family:var(--mono)}
.cfx-bo{font-size:8.5px;fill:var(--pink-ink);font-family:var(--mono)}
.cfx-cmd{border:1px solid var(--line);border-left:3px solid var(--line2);border-radius:10px;background:var(--panel);
  padding:9px 11px;margin-bottom:8px;animation:kobCard .45s ease both}
.cfx-cmd .code{margin:0}
.cfx-params{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.cfx-p{border:1px solid var(--line2);border-radius:7px;padding:2px 7px;font-size:10px;font-family:var(--mono);color:var(--tx2)}
.cfx-p b{color:var(--pink-ink);margin-right:4px}

/* ═══════════ config anatomy — premium restyle ═══════════ */
.cfx-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:11px;margin-bottom:13px}
.cfx-stat{display:flex;align-items:center;gap:12px;border:1px solid var(--line2);border-radius:14px;
  background:var(--panel);padding:13px 15px;box-shadow:0 6px 20px rgba(21,21,31,.05);animation:kobCard .5s ease both}
.cfx-ico{width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;
  box-shadow:0 6px 14px rgba(21,21,31,.18)}
.cfx-ico svg{width:24px;height:24px}
.cfx-stat b{display:block;font-size:22px;letter-spacing:-.03em;color:var(--pink)}
.cfx-stat span{font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx3)}
.cfx-meta{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:14px}
.cfx-pill{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line2);border-radius:11px;
  background:var(--panel);padding:8px 13px;font-size:12px;color:var(--tx2);box-shadow:0 4px 12px rgba(21,21,31,.04)}
.cfx-pill i{width:9px;height:9px;border-radius:50%;background:linear-gradient(135deg,#4aa8ff,var(--pink));flex:none}
.cfx-pill b{color:var(--tx);font-weight:600}
/* premium constellation */
.cfx .panel{background:linear-gradient(180deg,rgba(74,168,255,.05),rgba(255,0,113,.02)),var(--panel)}
.cfxc-o{fill:none;stroke:rgba(255,0,113,.14);stroke-width:10}
.cfxc-spin{fill:none;stroke:var(--pink);stroke-width:3.5;stroke-dasharray:60 200;stroke-linecap:round;
  transform-origin:center;transform-box:fill-box;animation:cfxSpin 5s linear infinite}
.cfxc-spin.two{stroke:#4aa8ff;stroke-dasharray:34 260;animation-duration:7.5s;animation-direction:reverse}
@keyframes cfxSpin{to{transform:rotate(360deg)}}
.cfxc-in{fill:var(--panel);stroke:rgba(255,0,113,.25);stroke-width:1.4;
  filter:drop-shadow(0 8px 22px rgba(255,0,113,.18))}
.cfxc-t{font-size:19px;font-weight:800;fill:var(--pink);letter-spacing:-.02em}
.cfxc-s{font-size:10px;fill:var(--tx3)}
.cfx-b rect{filter:drop-shadow(0 5px 12px rgba(21,21,31,.10));stroke:var(--line)}
.cfx-bv{font-size:11px}
.cfx-sp .cst-w{stroke:rgba(74,168,255,.55);stroke-width:1.3}
.cfx-sp .cst-dot{fill:#2563eb}
.sol-on{background:rgba(255,0,113,.08);border-radius:7px;outline:2px solid var(--pink);outline-offset:2px;transition:.3s}
.sol-done{opacity:.55;transition:.3s}

/* ═══════════ 4.2 premium — diagnosis tree & hot segments ═══════════ */
.f5-tree{width:100%;display:block;margin:6px 0 4px}
.f5t-sym rect{fill:rgba(211,38,38,.06);stroke:var(--bad);stroke-width:1.6;filter:drop-shadow(0 6px 14px rgba(211,38,38,.12))}
.f5t-sym-t{font-size:9px;font-weight:800;letter-spacing:.18em;fill:var(--bad)}
.f5t-sym-s{font-size:11.5px;font-weight:600;fill:var(--tx)}
.f5t-e{fill:none;stroke:var(--warn);stroke-width:1.6;stroke-dasharray:4 4}
.f5t-dot{fill:var(--warn)}
.f5t-branch{animation:kobCard .5s ease both}
.f5t-cause rect{fill:var(--panel);stroke:#e8cf9c;stroke-width:1.3;filter:drop-shadow(0 4px 10px rgba(21,21,31,.08));cursor:help}
.f5t-c1{font-size:8.5px;font-weight:800;letter-spacing:.14em;fill:var(--warn)}
.f5t-c2{font-size:10.5px;fill:var(--tx2)}
#f5map .fn-w.f5-hot{stroke:var(--bad);stroke-width:3;stroke-dasharray:6 5;animation:frFlow .6s linear infinite}
#f5map .fn-pin-c{fill:url(#f5grad)}

/* ═══════════ 4.3 next-level ═══════════ */
.ctr5-gl{color:#fff;font-size:15px;font-weight:800;font-family:var(--mono)}
.ctr5-units{border:1px solid var(--line2);border-radius:14px;background:var(--panel);padding:12px 15px}
.ctr5-bar{display:flex;align-items:center;gap:10px;width:100%;border:none;background:none;padding:4px 2px;
  cursor:pointer;animation:kobCard .45s ease both}
.ctr5-bar-l{flex:none;width:300px;text-align:right;font-size:11px;color:var(--tx2);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.ctr5-bar-t{flex:1;height:14px;background:var(--bg2);border-radius:7px;overflow:hidden}
.ctr5-bar-t i{display:block;height:100%;background:linear-gradient(90deg,#4aa8ff,var(--pink));border-radius:7px;
  transform-origin:left;animation:ctr5Grow 1s cubic-bezier(.5,0,.2,1) both}
@keyframes ctr5Grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ctr5-bar b{flex:none;width:46px;font-family:var(--mono);font-size:11.5px;color:var(--pink-ink);text-align:left}
.ctr5-bar:hover .ctr5-bar-l{color:var(--pink-ink)}
@media(max-width:760px){.ctr5-bar-l{width:150px}}
.ia-param{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:5px 0;border-bottom:1px dashed var(--line);animation:kobCard .45s ease both}
.ia-param em{font-style:normal;font-size:10px;color:var(--tx3);font-family:var(--mono)}
.ia-val{border:1px solid var(--line2);border-radius:7px;padding:2px 8px;font-size:10.5px;font-family:var(--mono);color:var(--violet);background:var(--bg2)}
.sw-loop{display:flex;gap:8px;flex-wrap:wrap;border:1px solid var(--line2);border-radius:14px;background:var(--panel);padding:13px 15px}
.sw-step{display:flex;align-items:center;gap:8px;font-size:12.3px;color:var(--tx2);animation:kobCard .5s ease both;
  border:1px dashed var(--line2);border-radius:999px;padding:6px 14px 6px 6px}
