:root{
 --bg:#071116;--side:#091820;--panel:#0d2029;--panel2:#102a35;--line:#1b3a47;
 --text:#edf8fa;--mut:#8aabb5;--ok:#62dfa0;--warn:#ffd06b;--bad:#ff7d8a;--blue:#68a8ff;--violet:#b28aff;--cyan:#58d9e6;
}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font:14px/1.45 Inter,Segoe UI,Arial,sans-serif}
body{overflow:hidden}.app{height:100%;display:grid;grid-template-columns:250px 1fr}
.sidebar{background:linear-gradient(180deg,#0a1a22,#07131a);border-right:1px solid var(--line);padding:18px 14px;display:flex;flex-direction:column;gap:18px}
.brand{display:flex;gap:11px;align-items:center;padding:4px}.brandmark{width:39px;height:39px;border-radius:11px;display:grid;place-items:center;background:#123847;border:1px solid #27576a;color:var(--cyan);font-weight:800}
.brand b{display:block;font-size:15px}.brand small,.muted{color:var(--mut)}nav{display:grid;gap:5px}nav button{border:0;background:transparent;color:#bcd1d7;text-align:left;padding:10px 11px;border-radius:9px;cursor:pointer;font:inherit}
nav button:hover,nav button.active{background:#102a35;color:white}nav button.active{box-shadow:inset 3px 0 0 var(--cyan)}
.legacy{margin-top:auto;display:grid;gap:5px;padding:8px}.legacy a{color:#86bfff;text-decoration:none;font-size:13px}
main{overflow:auto;padding:0 22px 36px}header{position:sticky;top:0;z-index:10;background:rgba(7,17,22,.94);backdrop-filter:blur(10px);padding:20px 0 14px;border-bottom:1px solid #102a34;display:flex;justify-content:space-between;gap:16px;align-items:end}
h1{margin:0 0 2px;font-size:25px}.header-right{display:flex;gap:10px;align-items:center}.status-pill,.chip{border:1px solid var(--line);border-radius:999px;padding:5px 9px;background:#0c2029}
.status-pill.healthy,.chip.healthy,.chip.success{color:var(--ok);border-color:#245941}.status-pill.warning,.chip.warning,.chip.waiting,.chip.queued{color:var(--warn);border-color:#64552d}.status-pill.degraded,.chip.degraded,.chip.error,.chip.stalled{color:var(--bad);border-color:#66333b}.chip.running{color:var(--cyan);border-color:#275969}
#content{padding-top:18px}.grid{display:grid;gap:12px}.grid.cols4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid.cols3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.cols2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{background:linear-gradient(180deg,var(--panel),#0a1b22);border:1px solid var(--line);border-radius:13px;padding:14px}.metric b{display:block;font-size:25px}.metric small{color:var(--mut)}
.section-title{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:23px 0 9px}.section-title h2{font-size:16px;margin:0}
.notice{padding:11px 12px;border-left:3px solid var(--warn);background:#1c1a12;border-radius:7px;margin-bottom:8px}.notice.bad{border-color:var(--bad);background:#201216}
.workstream{padding:0;overflow:hidden}.ws-head{padding:13px 14px;display:flex;justify-content:space-between;gap:12px;cursor:pointer}.ws-title{font-weight:700;font-size:15px}.ws-tech{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:#658794;margin-top:3px}
.ws-body{display:none;border-top:1px solid var(--line);padding:13px 14px;background:#09191f}.workstream.open .ws-body{display:block}
.stages{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 13px}.stage{padding:6px 9px;border-radius:8px;background:#0e2933;border:1px solid #1a4251;color:#bad0d6}.stage.live{color:var(--cyan);border-color:#28616f}.stage.done{color:var(--ok);border-color:#2a5c43}.stage.future{opacity:.55}
.task{padding:10px 0;border-top:1px solid #15313c}.task:first-child{border-top:0}.task-title{font-size:13px}.task-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px;font-size:11px;color:var(--mut)}
.search{width:320px;max-width:100%;padding:9px 11px;border-radius:9px;border:1px solid var(--line);background:#07171d;color:white}
.event{display:grid;grid-template-columns:145px 110px 1fr;gap:10px;padding:9px 0;border-top:1px solid #15313c}.event:first-child{border-top:0}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;color:#7fa1ab}
.domain b{display:block;margin-bottom:4px}.source{display:flex;justify-content:space-between;gap:14px;align-items:center}
.resource{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid #15313c}.resource:first-child{border-top:0}
.topology{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.node{padding:11px;border-radius:10px;background:#0b222b;border:1px solid #1a4251}.node .kind{font-size:10px;text-transform:uppercase;color:#6e919c}.node.workstream{grid-column:span 1}
.presence-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid #15313c}.presence-row:first-child{border-top:0}
.loading{color:var(--mut);padding:20px 0}.empty{color:var(--mut);padding:14px}
@media(max-width:1000px){.app{grid-template-columns:205px 1fr}.grid.cols4,.grid.cols3{grid-template-columns:repeat(2,1fr)}.topology{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){body{overflow:auto}.app{display:block}.sidebar{position:static}.legacy{display:none}nav{grid-template-columns:repeat(2,1fr)}main{padding:0 12px}header{position:static}.grid.cols4,.grid.cols3,.grid.cols2{grid-template-columns:1fr}.event{grid-template-columns:1fr}.topology{grid-template-columns:1fr}.header-right{display:none}}


/* 0.3 product-density pass: dashboard first, investigation second */
.nowbar{display:grid;grid-template-columns:1.65fr repeat(5,minmax(92px,1fr));gap:8px;margin:0 0 18px}
.now-main,.now-stat{background:linear-gradient(180deg,#102a35,#0b2028);border:1px solid var(--line);border-radius:11px;padding:11px 12px;min-width:0}
.now-main{display:flex;flex-direction:column;justify-content:center}.eyebrow{font-size:10px;letter-spacing:.12em;color:var(--cyan);font-weight:800}.now-main b{font-size:17px;margin-top:2px}
.now-stat{display:flex;flex-direction:column;justify-content:center}.now-stat span{font-size:11px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.now-stat b{font-size:21px;line-height:1.05;margin-top:3px}.now-stat.warn{border-color:#5d4d27;background:#191a12}.now-stat.bad{border-color:#65313b;background:#1c1217}
.overview-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(330px,.75fr);gap:18px;align-items:start}.section-title.tight{margin-top:0}
.notice-stack{display:grid;gap:7px}.notice-stack .notice{margin:0}.notice-main{display:flex;align-items:center;justify-content:space-between;gap:12px}.notice-main .chip{font-size:10px;padding:3px 7px}
.good-callout{display:flex;gap:10px;align-items:center;border:1px solid #245941;background:#0d211a;border-radius:10px;padding:11px 12px;color:var(--ok)}.good-callout>span{font-size:20px}.good-callout b{display:block}.good-callout small{display:block;color:#86b9a2;margin-top:2px}
.work-table{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#0a1b22}.work-row{display:grid;grid-template-columns:minmax(220px,1.4fr) 112px minmax(210px,.8fr) minmax(150px,.65fr);gap:12px;align-items:center;padding:10px 12px;border-top:1px solid #15313c;cursor:pointer}.work-row:first-child{border-top:0}.work-row:hover{background:#0e2630}.work-row-title{font-weight:700;font-size:14px}.work-row-sub{font-size:12px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.work-row-state{justify-self:start}.work-row-counts{display:flex;gap:8px;flex-wrap:wrap;font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:#789aa5}.work-row-counts .hot{color:var(--cyan)}.badtext{color:var(--bad)!important}.work-row-last{display:flex;flex-direction:column;min-width:0}.work-row-last b{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.work-row-last span{font-size:10px;color:var(--mut)}
.recent-fold{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px;font-size:11px;color:var(--mut)}.recent-fold>span:first-child{font-weight:700}.recent-fold .chip{padding:2px 6px;font-size:9px}
.activity-card{padding:6px 12px}.event.compact{grid-template-columns:118px 92px minmax(0,1fr);font-size:12px}.event.compact .chip{padding:3px 6px;font-size:9px}.event.compact b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glance-grid{display:grid;grid-template-columns:1.2fr .9fr 1.15fr;gap:12px}.compact-card{padding:11px 12px}.compact-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}.compact-title button,.linkbtn{border:0;background:transparent;color:#80bbff;cursor:pointer;font:inherit;font-size:12px;padding:0}.compact-title button:hover,.linkbtn:hover{text-decoration:underline}.mini-row{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:7px 0;border-top:1px solid #15313c}.mini-row:first-of-type{border-top:0}.mini-row .chip{padding:2px 6px;font-size:9px}.mini-row small{color:var(--mut)}.big-line{font-weight:800;font-size:17px;margin:12px 0 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ws-glance{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px 10px}.ws-glance .stages{margin:0;min-width:0}.last-signal{display:grid;grid-template-columns:auto auto;gap:0 8px;justify-items:end;font-size:10px;color:var(--mut)}.last-signal b{color:var(--text);max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.last-signal time{grid-column:2}.ws-summary{font-size:12px;color:var(--mut);margin-top:2px}.ws-state{display:flex;gap:8px;align-items:center}.ws-runtime{font-size:11px;color:var(--mut)}.detail-strip{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:10px}
.empty-stages{padding:0}
@media(max-width:1180px){.nowbar{grid-template-columns:repeat(3,1fr)}.now-main{grid-column:span 2}.overview-grid{grid-template-columns:1fr}.glance-grid{grid-template-columns:1fr 1fr}.work-row{grid-template-columns:minmax(220px,1fr) 105px minmax(180px,.8fr)}.work-row-last{display:none}}
@media(max-width:820px){.nowbar{grid-template-columns:1fr 1fr}.now-main{grid-column:1/-1}.glance-grid{grid-template-columns:1fr}.work-row{grid-template-columns:1fr auto}.work-row-counts{grid-column:1/-1}.work-row-last{display:none}.overview-grid{display:block}.activity-card{margin-top:8px}}

/* 0.4 product semantics + operator affordances */
.status-pill.degraded,.chip.degraded{color:var(--warn);border-color:#64552d}
.notice.warn{border-color:var(--warn);background:#1c1a12}.notice.bad{border-color:var(--bad);background:#201216}
.attention-tag{font-size:10px;padding:3px 7px;border:1px solid var(--line);border-radius:999px;white-space:nowrap}
.attention-tag.warn{color:var(--warn);border-color:#64552d}.attention-tag.bad{color:var(--bad);border-color:#66333b}
.notice-details{color:#9eb3ba;font-size:12px;margin-top:6px;display:grid;gap:2px}
.ws-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:2px 0 11px}
.copy-state,.version-foot{border:1px solid var(--line);background:#0d2731;color:#cce2e7;border-radius:8px;padding:6px 9px;cursor:pointer;font:inherit;font-size:11px}
.copy-state:hover,.version-foot:hover{border-color:#2b6678;color:white}
.chat-link{color:#80bbff;text-decoration:none;font-size:12px}.chat-link:hover{text-decoration:underline}
.version-foot{margin-top:7px;text-align:left;width:100%;background:transparent;color:#678b96;border-color:#173641;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.source-fresh{font-size:11px;color:var(--mut);margin-top:7px}.source-fresh b{color:var(--warn)}
.version-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.version-grid>div{border:1px solid #15313c;border-radius:9px;padding:9px}.version-grid span{display:block;color:var(--mut);font-size:10px}.version-grid b{display:block;margin-top:2px;font:12px ui-monospace,SFMono-Regular,Consolas,monospace}
#fresh time,.event time,.last-signal time{cursor:help}
@media(max-width:820px){.version-grid{grid-template-columns:1fr 1fr}}

/* Product pass 05: presence sessions/events and readable topology edges */
.presence-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(360px,.85fr);gap:18px;align-items:start;margin-top:20px}
.presence-site+.presence-site{margin-top:16px}.presence-devices{padding:4px 12px}
.presence-device{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 0;border-top:1px solid #15313c}.presence-device:first-child{border-top:0}.presence-device-main{min-width:0;flex:1}.presence-device-title{display:flex;align-items:center;gap:8px;min-width:0}.presence-device-title b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.site-pill{border:1px solid var(--line);border-radius:999px;padding:2px 6px;color:var(--mut);font-size:9px;text-transform:uppercase}.site-pill.home{color:#79d7ff;border-color:#285b69}.site-pill.remote{color:#ddb975;border-color:#69572b}.presence-times{display:flex;gap:10px;flex-wrap:wrap;margin-top:3px;color:#7f9ea8;font-size:10px}.presence-events{padding:3px 11px;max-height:740px;overflow:auto}.presence-event{display:grid;grid-template-columns:105px 74px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px 0;border-top:1px solid #15313c;font-size:11px}.presence-event:first-child{border-top:0}.presence-event strong{font-size:9px;letter-spacing:.04em;color:#9cc1ca}.presence-event .chip{font-size:8px;padding:2px 5px}.presence-raw-note{margin-top:7px;color:var(--mut);font-size:10px}.topology-edges{padding:5px 12px}.topology-edge{display:grid;grid-template-columns:minmax(140px,1fr) 24px minmax(140px,1fr) minmax(120px,.7fr);gap:8px;align-items:center;padding:9px 0;border-top:1px solid #15313c}.topology-edge:first-child{border-top:0}.topology-edge>span{text-align:center;color:var(--cyan)}.topology-edge small{color:var(--mut);text-align:right}
@media(max-width:1000px){.presence-layout{grid-template-columns:1fr}.presence-events{max-height:none}}
@media(max-width:720px){.presence-event{grid-template-columns:1fr}.topology-edge{grid-template-columns:1fr}.topology-edge>span{text-align:left}.topology-edge small{text-align:left}}


/* --- borrowed Control UI v2 visual grammar --- */

:root{--bg:#051019;--p:#0b1c28;--p2:#0d2533;--line:#193b4d;--text:#edf8fb;--muted:#83a3b5;--green:#58e39a;--cyan:#39d8e6;--blue:#4b9dff;--purple:#a86cff;--amber:#ffc75b;--red:#ff7183;--shadow:0 14px 40px rgba(0,0,0,.25)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 42% -8%,#102a3e 0,#06111a 35%,#030910 100%);color:var(--text);font:14px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;min-height:100vh}.shell{max-width:1500px;margin:auto;padding:0 16px 30px}.topbar{position:sticky;top:0;z-index:50;background:rgba(5,15,23,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(92,167,207,.17);margin:0 -16px;padding:11px 16px}.topin{max-width:1500px;margin:auto;display:flex;align-items:center;gap:10px}.logo{width:34px;height:34px;border:1px solid #315e76;border-radius:11px;background:linear-gradient(145deg,#18394e,#0b1c28);display:grid;place-items:center;color:#9ce3ff;font-size:17px}.brand{font-weight:800;white-space:nowrap}.nav{display:flex;gap:4px;overflow:auto;scrollbar-width:none}.nav::-webkit-scrollbar{display:none}.nav button,.ghost,.action{font:inherit;border-radius:10px;border:1px solid transparent;background:transparent;color:#8caabb;padding:8px 10px;cursor:pointer;white-space:nowrap}.nav button.active{background:#0d2b3e;border-color:#22516c;color:#9bd9ff}.right{margin-left:auto;display:flex;align-items:center;gap:9px}.pulse{width:9px;height:9px;border-radius:50%;background:#52636e}.pulse.ok{background:var(--green);box-shadow:0 0 15px rgba(88,227,154,.6)}.pulse.warn{background:var(--amber)}.pulse.bad{background:var(--red)}.ghost{border-color:#1b3d50;background:#091b27;color:#bad0dc}.fresh{font-size:12px;color:var(--muted)}.view{display:none;padding-top:18px}.view.active{display:block}.hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:start;margin-bottom:12px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.13em;color:#6f93a8}.hero h1{font-size:30px;line-height:1.12;margin:5px 0 7px}.hero p{margin:0;color:#9bb6c5;max-width:960px}.heroState{display:flex;gap:8px;align-items:center;border:1px solid #1c4559;background:#081b27;padding:9px 12px;border-radius:12px}.cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin-bottom:10px}.card,.panel{background:linear-gradient(180deg,rgba(15,41,57,.97),rgba(8,25,36,.97));border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.metric{position:relative;min-height:116px;padding:13px 14px;overflow:hidden;cursor:pointer;transition:transform .16s ease,border-color .16s ease}.metric:hover{transform:translateY(-1px);border-color:#2b617f}.metric:active{transform:translateY(0)}.metric:after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-60px;top:-55px;background:radial-gradient(circle,rgba(53,216,229,.09),transparent 65%)}.label{font-size:12px;color:#86a7b9}.big{font-size:29px;font-weight:820;line-height:1.04;margin:6px 0 7px;letter-spacing:-.03em}.sub{font-size:12px;color:#7899ab}.spark{position:absolute;right:10px;bottom:9px;width:84px;height:28px;opacity:.92}.layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(320px,.9fr);gap:10px}.stack{display:grid;gap:10px}.panel{padding:14px}.panelHead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.panelHead h2{font-size:16px;margin:0}.chips{display:flex;gap:5px;flex-wrap:wrap}.chip{border:1px solid #214456;background:#0a1c27;color:#90aebe;border-radius:99px;padding:4px 8px;font-size:11px;cursor:pointer}.chip.active{color:#d6f2ff;border-color:#397da3;background:#102d40}.summary{font-size:15px;color:#dcecf3}.summary strong{color:var(--green)}.workstreams{display:grid;gap:9px}.ws{border:1px solid #17394b;border-radius:13px;background:#081a25;overflow:hidden}.wsHead{padding:12px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;cursor:pointer}.wsHead:hover{background:#0b2230}.wsTitle{font-size:15px;font-weight:780}.wsMeta{font-size:11px;color:#7696a8;margin-top:3px}.badText{color:var(--red)}.warnText{color:var(--amber)}.good{color:var(--green)}.badge{display:inline-flex;align-items:center;gap:5px;width:max-content;border:1px solid #2b4858;background:#091a24;border-radius:99px;padding:3px 7px;font-size:11px}.badge:before{content:"";width:7px;height:7px;border-radius:50%;background:#6b7d87}.badge.running:before,.badge.done:before{background:var(--green)}.badge.waiting:before{background:var(--amber)}.badge.problem:before{background:var(--red)}.badge.unknown:before{background:#708391}.pipelineWrap{padding:0 12px 12px;overflow:auto}.pipeline{min-width:540px;display:flex;align-items:flex-start;padding:8px 2px 0}.stage{position:relative;flex:1;min-width:90px;text-align:center;color:#6f8e9f}.stage:not(:last-child):after{content:"";position:absolute;top:14px;left:58%;right:-42%;height:3px;background:#183846;border-radius:9px}.stage.done:not(:last-child):after{background:linear-gradient(90deg,#36c988,#55dfa1)}.stage.live:not(:last-child):after{background:linear-gradient(90deg,#3f9eff,#39d8e6)}.stageDot{position:relative;z-index:2;margin:0 auto 6px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:2px solid #25495b;background:#0a1a24;font-size:11px;font-weight:800}.stage.done .stageDot{border-color:#48d795;background:#0f3629;color:#aef0cc}.stage.live .stageDot{border-color:#48cde4;background:#0c3442;color:#c2f5ff;box-shadow:0 0 18px rgba(57,216,230,.22)}.stage.waiting .stageDot{border-color:#d7a744;color:#ffe29a}.stage.problem .stageDot{border-color:#ef687b;color:#ffbec6}.stageLabel{font-size:11px;line-height:1.2}.stage.live .stageLabel{color:#d9f4ff;font-weight:700}.clock{font-variant-numeric:tabular-nums;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.wsBody{display:none;padding:0 12px 12px}.ws.open .wsBody{display:block}.taskList{display:grid;gap:7px}.task{border:1px solid #153545;border-radius:10px;background:#071824;padding:9px;cursor:pointer}.task:hover{border-color:#285d78}.taskTop{display:flex;gap:8px;align-items:flex-start;justify-content:space-between}.task b{display:block;min-width:0}.id{font:10px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace;color:#66889a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.miniStages{display:flex;gap:4px;margin-top:8px}.miniStage{height:5px;flex:1;background:#153544;border-radius:99px}.miniStage.done{background:var(--green)}.miniStage.running{background:var(--cyan)}.miniStage.waiting{background:var(--amber)}.miniStage.problem{background:var(--red)}.focusbox{display:grid;gap:8px}.focusitem{border:1px solid #16394b;border-radius:10px;background:#081a25;padding:10px}.focusitem b{display:block;margin-top:3px}.provenance{display:inline-flex;border-radius:99px;border:1px solid #26536c;padding:2px 6px;font-size:10px;color:#91bfd5}.actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.action{border-color:#24526c;background:#0d2a3c;color:#cbeeff}.action.secondary{background:#091c29;color:#9fc0d0}.action.warn{border-color:#705927;color:#ffd982}.action:disabled{opacity:.45;cursor:not-allowed}.transportGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.transport{padding:10px;border:1px solid #173a4c;border-radius:11px;background:#081a25}.transport strong{font-size:18px}.kv{display:grid;grid-template-columns:1fr auto;gap:6px 10px;margin-top:8px;font-size:12px}.kv span:nth-child(odd){color:#7897a9}.drawer{position:fixed;z-index:70;right:0;top:0;width:min(520px,96vw);height:100vh;background:#071722;border-left:1px solid #1d455b;box-shadow:-25px 0 60px rgba(0,0,0,.48);padding:18px;transform:translateX(105%);transition:.2s ease;overflow:auto}.drawer.open{transform:translateX(0)}.drawer .close{float:right}.drawer h2{margin:4px 45px 5px 0}.drawer pre{white-space:pre-wrap;word-break:break-word;background:#051019;border:1px solid #17394b;border-radius:10px;padding:10px;color:#a2c6d8;font-size:11px}.drawerSection{margin-top:13px;border-top:1px solid #173747;padding-top:12px}.drawerSection h3{font-size:13px;margin:0 0 7px}.copyToast{position:fixed;z-index:90;left:50%;bottom:22px;transform:translate(-50%,30px);opacity:0;background:#0e2b3c;border:1px solid #2c6785;color:#dff5ff;padding:9px 12px;border-radius:10px;transition:.18s}.copyToast.show{opacity:1;transform:translate(-50%,0)}.versions{margin-top:14px}.versionRows{display:grid;gap:6px}.versionRow{display:grid;grid-template-columns:1fr auto;gap:10px;padding:8px 9px;border:1px solid #153747;border-radius:9px;cursor:pointer}.versionRow:hover{background:#0b2330}.empty{padding:14px;color:#7899ab;text-align:center}.topology{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.node{border:1px solid #1c455b;background:#081c29;border-radius:13px;padding:12px}.node strong{display:block}.node small{color:#7898aa}.controlNote{border-left:3px solid var(--amber);padding-left:10px;color:#b7ccd6}.metricBar{height:5px;background:#102d3b;border-radius:9px;overflow:hidden;margin-top:5px}.metricBar i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--cyan))}
@media(max-width:1050px){.cards{grid-template-columns:repeat(3,1fr)}.layout{grid-template-columns:1fr}.topology{grid-template-columns:1fr 1fr}}
@media(max-width:700px){body{font-size:13px}.shell{padding:0 10px 24px}.topbar{margin:0 -10px;padding:9px 10px}.brand{display:none}.nav button{padding:7px 8px}.right .fresh{display:none}.hero{grid-template-columns:1fr}.hero h1{font-size:25px}.heroState{width:max-content}.cards{grid-template-columns:1fr 1fr}.metric{min-height:105px;padding:12px}.big{font-size:26px}.panel{padding:12px}.wsHead{padding:10px}.pipelineWrap{padding:0 8px 10px}.pipeline{min-width:500px}.stage{min-width:82px}.stageLabel{font-size:10px}.transportGrid,.topology{grid-template-columns:1fr}.drawer{width:100vw}.topology{gap:8px}.action{padding:8px 9px}.versionRow{font-size:12px}}


/* 0.6 Control UI v2 parity shell */
body{overflow:auto}
.shell{max-width:1500px;margin:auto;padding:0 16px 34px}
.shell main{overflow:visible;padding:0}
#content{padding-top:18px}
.topbar{position:sticky;top:0;z-index:50;background:rgba(5,15,23,.91);backdrop-filter:blur(18px);border-bottom:1px solid rgba(92,167,207,.17);margin:0 -16px;padding:11px 16px}
.topin{max-width:1500px;margin:auto;display:flex;align-items:center;gap:10px}
.logo{width:34px;height:34px;border:1px solid #315e76;border-radius:11px;background:linear-gradient(145deg,#18394e,#0b1c28);display:grid;place-items:center;color:#9ce3ff;font-size:12px;font-weight:800}
.nav{display:flex;gap:4px;overflow:auto;scrollbar-width:none}.nav button{text-align:center;box-shadow:none!important}
.right{margin-left:auto;display:flex;align-items:center;gap:9px}.fresh{font-size:12px;color:#83a3b5;white-space:nowrap}
.hero{padding-top:0}.hero p{max-width:900px}
.cards{grid-template-columns:repeat(5,minmax(0,1fr))}.cards>.metric:nth-child(6){grid-column:auto}
.metric.warn{border-color:#705927}.metric.bad{border-color:#783845}
.versions-panel,.edges-panel{margin-top:10px}
.notice-stack{display:grid;gap:7px}.notice{padding:10px 11px;border:1px solid #5d4d27;border-left:3px solid var(--amber);background:#171910;border-radius:9px}.notice.bad{border-color:#66333b;border-left-color:var(--red);background:#201216}.notice-main{display:flex;justify-content:space-between;gap:10px}.notice-details{color:#91aebb;font-size:12px;margin-top:6px}
.grid{display:grid;gap:12px}.grid.cols4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid.cols3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.cols2{grid-template-columns:repeat(2,minmax(0,1fr))}
.muted,.sub{color:#83a3b5}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.search{width:320px;max-width:100%;padding:8px 10px;border:1px solid #234658;border-radius:9px;background:#071722;color:#edf8fb}
.badge.chip{cursor:default}
.event{display:grid;grid-template-columns:145px 110px minmax(0,1fr);gap:10px;padding:9px 0;border-top:1px solid #15313c}.event:first-child{border-top:0}
.source{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:9px 0;border-top:1px solid #15313c}.source:first-child{border-top:0}
.resource{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid #15313c}.resource:first-child{border-top:0}
.presence-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(360px,.85fr);gap:18px;align-items:start;margin-top:14px}
.presence-site+.presence-site{margin-top:16px}.presence-devices{padding:4px 12px}
.presence-device{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 0;border-top:1px solid #15313c}.presence-device:first-child{border-top:0}.presence-device-main{min-width:0;flex:1}.presence-device-title{display:flex;align-items:center;gap:8px;min-width:0}.presence-device-title b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site-pill{border:1px solid #1b3a47;border-radius:999px;padding:2px 6px;color:#83a3b5;font-size:9px;text-transform:uppercase}.site-pill.home{color:#79d7ff;border-color:#285b69}.site-pill.remote{color:#ddb975;border-color:#69572b}
.presence-times{display:flex;gap:10px;flex-wrap:wrap;margin-top:3px;color:#7f9ea8;font-size:10px}.presence-events{padding:3px 11px;max-height:740px;overflow:auto}.presence-event{display:grid;grid-template-columns:105px 74px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px 0;border-top:1px solid #15313c;font-size:11px}.presence-event:first-child{border-top:0}.presence-event strong{font-size:9px;letter-spacing:.04em;color:#9cc1ca}
.topology-edges{padding:5px 12px}.topology-edge{display:grid;grid-template-columns:minmax(140px,1fr) 24px minmax(140px,1fr) minmax(120px,.7fr);gap:8px;align-items:center;padding:9px 0;border-top:1px solid #15313c}.topology-edge:first-child{border-top:0}.topology-edge>span{text-align:center;color:var(--cyan)}.topology-edge small{color:#83a3b5;text-align:right}
.source-fresh{font-size:11px;color:#83a3b5;margin-top:5px}
@media(max-width:1050px){.cards{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){.right .fresh{display:none}.presence-layout{grid-template-columns:1fr}.cards{grid-template-columns:1fr 1fr}.event,.presence-event,.topology-edge{grid-template-columns:1fr}.topology-edge>span,.topology-edge small{text-align:left}}

/* 0.6.4 Activity operator pass */
.activityFilters{justify-content:flex-end}
.activityFilters .chip{font:inherit}
.activityHint{font-size:12px;color:var(--mut);padding:2px 0 9px;border-bottom:1px solid #15313c}
.eventMain{min-width:0}
.eventMain>b{display:block;overflow-wrap:anywhere}
.eventTags{display:flex;gap:5px;flex-wrap:wrap;margin-top:5px}
.eventTags span{font-size:10px;color:#79a1b2;border:1px solid #214553;border-radius:999px;padding:2px 6px;background:#081b24}
.chip.timeout,.chip.rejected,.chip.failed{color:var(--bad);border-color:#66333b}
@media(max-width:720px){.activityFilters{justify-content:flex-start}.activityHint{padding-top:6px}}
/* 0.6.7 observed-vs-desired */
.wsStateStack,.nodeStateStack{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:112px}
.stateCaption{font-size:10px;line-height:1;text-transform:uppercase;letter-spacing:.05em;opacity:.58}
.targetState{font-size:11px;line-height:1.2;opacity:.78;white-space:nowrap}
@media(max-width:760px){.wsStateStack,.nodeStateStack{align-items:flex-start;min-width:0}}

/* 0.6.12 DeviceAtlas contextual knowledge */
.knowledge-pill{display:inline-flex;align-items:center;min-height:20px;padding:2px 7px;border:1px solid rgba(86,197,255,.28);border-radius:999px;font-size:10px;line-height:1.2;color:#9cdbff;background:rgba(26,93,126,.18);white-space:nowrap}
.knowledge-panel{display:flex;flex-direction:column;gap:8px}
.knowledge-row{display:flex;justify-content:space-between;gap:12px;padding:10px 11px;border:1px solid rgba(111,152,174,.16);border-radius:10px;background:rgba(13,31,42,.38)}
.knowledge-row>div:first-child{min-width:0}
.knowledge-meta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;max-width:58%;font-size:11px;color:#8faeba;text-align:right}
.knowledge-note{padding-top:3px;font-size:11px;line-height:1.45;color:#7796a3}
@media(max-width:700px){.knowledge-row{flex-direction:column}.knowledge-meta{align-items:flex-start;max-width:none;text-align:left}.knowledge-pill{white-space:normal}}

.wsControls{align-items:center;gap:8px;flex-wrap:wrap}
.wsControls select{background:var(--panel,#17191f);color:inherit;border:1px solid rgba(127,127,127,.35);border-radius:8px;padding:7px 9px}


/* 0.7 clarity pass: honest progress + stable presence locations */
.progressBlock{margin-top:9px}
.progressHead{display:flex;justify-content:space-between;gap:10px;align-items:baseline;color:#86a7b9;font-size:11px}
.progressHead b{color:#dff6ff;font-variant-numeric:tabular-nums;font-size:12px}
.progressTrack{height:8px;margin-top:5px;overflow:hidden;border:1px solid #1c4355;border-radius:999px;background:#07141d}
.progressFill{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--cyan));transition:width .28s ease}
.pipelineProgress{padding:0 12px 2px}
.pipelineWrapSimple{padding:0 12px 12px}
.activityState{display:flex;align-items:center;gap:7px;margin-top:9px;color:#9cb6c3;font-size:11px}
.activityState i{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:#647a86}
.activityState i.live{background:var(--cyan);box-shadow:0 0 10px rgba(57,216,230,.45)}
.activityState i.waiting{background:var(--amber)}
.activityState i.problem{background:var(--red)}
.activityState small{margin-left:auto;color:#637f8d}
.taskActivity{padding:1px 0}
.locationHead{display:flex;justify-content:space-between;gap:14px;align-items:flex-end;margin-bottom:8px}
.locationHead h2{margin:2px 0 1px;font-size:20px}
.locationCount{text-align:right;display:flex;flex-direction:column}
.locationCount b{font-size:24px;line-height:1;font-variant-numeric:tabular-nums}
.locationCount span{font-size:10px;color:#83a3b5;margin-top:3px}
.locationSource{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid #1d4254;border-radius:10px;padding:8px 10px;margin-bottom:7px;background:#081a25}
.locationSource>div{display:flex;flex-direction:column;min-width:0}
.locationSource b{font-size:12px}
.locationSource span{font-size:10px;color:#83a3b5}
.locationSource.stale,.locationSource.degraded{border-color:#6a5428;background:#171910}
.sourceEmpty{padding:18px 12px}
.presenceCards{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:700px){.presenceCards{grid-template-columns:1fr 1fr}.locationHead{align-items:flex-start}.locationSource{align-items:flex-start}}