/* Agents & tools: mission control. Dense, mono, instrument panel even in light mode. Rows and rules, not cards. */
.ag{--ag-panel:var(--bg-2);--ag-mono:var(--mono,"IBM Plex Mono",ui-monospace,monospace);padding-bottom:var(--s6)}
.ag .ag-mono,.ag .num{font-family:var(--ag-mono);font-variant-numeric:tabular-nums}
.ag .mu{color:var(--muted)}
.ag .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ag section{margin-top:var(--s5)}

/* section label: mono ordinal + uppercase label, the editorial signature */
.ag-sec{display:flex;align-items:baseline;gap:var(--s2);margin:0 0 var(--s2);padding-bottom:6px;border-bottom:1px solid var(--line)}
.ag-sec h3{margin:0;font:600 11px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.ag-ord{font:500 11px var(--ag-mono);color:var(--muted)}
.ag-sec-r{margin-left:auto;font:400 11px var(--ag-mono);color:var(--faint)}

/* lamps: square instrument lights and round status dots */
.ag-lamp{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--faint);flex:none;vertical-align:middle}
.ag-lamp.sq{border-radius:2px;width:9px;height:9px}
.ag-lamp.ok,.ag-lamp.good{background:var(--good)}
.ag-lamp.run,.ag-lamp.ai,.ag-lamp.breathe{background:var(--ai)}
.ag-lamp.warn{background:var(--warn)}.ag-lamp.bad{background:var(--bad)}
.ag-lamp.off{background:transparent;box-shadow:inset 0 0 0 1.5px var(--faint)}
.ag-lamp.run,.ag-lamp.breathe{animation:ag-breathe 2s ease-in-out infinite}
@keyframes ag-breathe{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.ag-lamp.run,.ag-lamp.breathe{animation:none}}

/* console block: the instrument panel */
.ag-console{background:var(--ag-panel);border:1px solid var(--line);border-radius:var(--r2);padding:var(--s4) var(--s4) var(--s4);margin-top:var(--s3)}
.ag-console .ag-sec{border-color:var(--line-2)}
.ag-hero{display:flex;flex-direction:column;gap:var(--s3);margin-bottom:var(--s4)}
.ag-headline{display:flex;align-items:center;gap:10px;margin:0;font:600 20px/1.25 var(--display);letter-spacing:-.01em;color:var(--ink)}
.ag-headline b{font-weight:700}
.ag-headline span:last-child{color:var(--ink-2);font-weight:600}
.ag-lamps{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--line-2);border-radius:var(--r1);background:var(--surface)}
.ag-lampc{display:flex;align-items:center;gap:8px;padding:8px 12px;border-right:1px solid var(--line);min-height:36px;cursor:default}
.ag-lampc:last-child{border-right:0}
.ag-ll{font-size:12px;color:var(--muted)}
.ag-lv{font:600 11px var(--ag-mono);letter-spacing:.04em;color:var(--ink)}
.ag-meter{flex:1;min-width:240px}
.ag-bar{position:relative;flex:1;height:6px;border-radius:3px;background:var(--line);min-width:80px}
.ag-bar i{position:absolute;inset:0 auto 0 0;border-radius:3px;background:color-mix(in srgb,var(--ink) 70%,transparent)}
.ag-bar.hot i{background:var(--warn)}
.ag-bar s{position:absolute;top:-3px;width:1px;height:12px;background:var(--ink-2);opacity:.5}

/* topology */
.ag-topo{display:grid;grid-template-columns:minmax(220px,auto) 56px 1fr minmax(150px,auto);align-items:start;gap:var(--s3)}
.ag-t-col{display:flex;flex-direction:column;gap:6px;min-width:0}
.ag-t-lab{font:600 10px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ag-t-lab .ag-mono{letter-spacing:0;color:var(--faint)}
.ag-t-skills{display:flex;flex-direction:column;gap:4px;margin-left:14px;padding-left:12px;border-left:1px dashed var(--ai-line)}
.ag-t-roles{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:4px}
.ag-t-wire{align-self:stretch;position:relative;margin-top:22px}
.ag-t-wire::before{content:"";position:absolute;left:0;right:0;top:16px;border-top:1px dashed var(--line-2)}
.ag-t-wire span{position:absolute;top:2px;left:50%;transform:translateX(-50%);font:400 10px var(--ag-mono);color:var(--faint);background:var(--ag-panel);padding:0 4px}
.ag-node{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:8px;height:32px;padding:0 10px;border:1px solid var(--line-2);border-radius:3px;background:transparent;cursor:pointer;min-width:0;transition:border-color .12s ease-out,background .12s ease-out}
.ag-node:hover{border-color:var(--ink-2);background:var(--hover)}
.ag-node:focus-visible{outline:2px solid var(--act);outline-offset:2px}
.ag-node.on{border-color:var(--act);box-shadow:inset 3px 0 0 var(--act)}
.ag-node.lead{height:40px;border-left:3px solid var(--ai)}
.ag-node.lead .ag-nn{font-weight:600}
.ag-node.skill{height:28px}
.ag-node.off{border-style:dashed;background:transparent}
.ag-nn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;color:var(--ink)}
.ag-nc{font:500 11px var(--ag-mono);color:var(--muted);font-variant-numeric:tabular-nums}

/* tables */
.ag-tbl-w{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r2);background:var(--surface)}
.ag-tbl{width:100%;border-collapse:collapse;font-size:12.5px;min-width:900px}
.ag-tbl th{position:sticky;top:0;background:var(--bg-2);text-align:left;font:600 10.5px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.ag-tbl td{padding:0 10px;height:38px;border-bottom:1px solid var(--line);white-space:nowrap;color:var(--ink)}
.ag-tbl tbody tr:last-child td{border-bottom:0}
.ag-tbl .num{text-align:right;font-size:12px}
.ag-tbl td.num small{font-family:var(--body);color:var(--faint);font-size:11px}
.ag-tbl td.warn{color:var(--warn)}
.ag-tbl .w-dot{width:18px;padding-right:0}
.ag-tbl td:first-child{padding-right:0}
.ag-name{font-weight:600}
.ag-trig{max-width:240px;overflow:hidden;text-overflow:ellipsis}
.ag-sp{width:92px}
.ag-sp svg,.ag-sp .ch-spark{display:block;width:84px;height:22px}
.ag-spk{color:var(--ink-2)}.ag-spk.ai{color:var(--ai)}
.ag-row{cursor:pointer}
.ag-row:hover td{background:var(--hover)}
.ag-row:focus-visible{outline:2px solid var(--act);outline-offset:-2px}
.ag-row.open td{background:var(--sel)}
.ag-detail td{background:var(--bg-2);white-space:normal;height:auto;padding:var(--s3) 10px var(--s4)}
.ag-detail p{margin:0 0 var(--s3);max-width:72ch;font-size:13px;line-height:1.5;color:var(--ink-2)}
.ag-sub{border-collapse:collapse;font-size:12px;width:auto;min-width:560px}
.ag-sub th{font:600 10px var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:left;padding:4px 16px 4px 0;border-bottom:1px solid var(--line-2)}
.ag-sub td{padding:5px 16px 5px 0;border-bottom:1px dashed var(--line);height:auto}
.ag-sub .num{text-align:right}
.ag-tool{font-weight:500;color:var(--ink)}
.ag-tbl.tools td.mu:nth-child(3){max-width:280px;overflow:hidden;text-overflow:ellipsis}
.ag-sort{all:unset;cursor:pointer;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;border-radius:3px}
.ag-sort:hover{color:var(--ink)}
.ag-sort.on{color:var(--ink)}
.ag-sort.on::after{content:" ↓";font-family:var(--ag-mono)}
.ag-sort:focus-visible{outline:2px solid var(--act);outline-offset:2px}

/* stamps (fallback if the shell has none) */
.ag .ag-stamp{display:inline-block;font:500 9.5px/1 var(--ag-mono);letter-spacing:.06em;text-transform:uppercase;padding:4px 5px 3px;border:1px solid var(--line-2);border-radius:3px;color:var(--ink-2);white-space:nowrap}
.ag .ag-stamp.ai{color:var(--ai);border-color:var(--ai-line)}
.ag .ag-stamp.off,.ag .ag-stamp.mute{color:var(--faint);border-style:dashed}
.ag .ag-stamp.good{color:var(--good);border-color:currentColor}
.ag .ag-stamp.warn{color:var(--warn);border-color:currentColor}

/* trace: the signature */
.ag-trace{display:grid;grid-template-columns:280px 1fr;border:1px solid var(--line);border-radius:var(--r2);background:var(--surface);overflow:hidden}
.ag-picker{display:flex;flex-direction:column;background:var(--bg-2);border-right:1px solid var(--line)}
.ag-picker>.ag-turn:last-child{border-bottom:1px solid var(--line)}
.ag-turn{all:unset;box-sizing:border-box;display:flex;flex-direction:column;gap:4px;padding:10px 12px;border-bottom:1px solid var(--line);cursor:pointer}
.ag-turn:hover{background:var(--hover)}
.ag-turn.on{background:var(--surface);box-shadow:inset 3px 0 0 var(--act)}
.ag-turn:focus-visible{outline:2px solid var(--act);outline-offset:-2px}
.ag-tt{display:flex;justify-content:space-between;gap:8px;font-size:12.5px}
.ag-tt .ag-mono{font-size:11px}
.ag-tq{font-size:12px;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4}
.ag-tr{display:flex;justify-content:space-between;align-items:center;font-size:11px}
.ag-tl{padding:var(--s4);min-width:0}
.ag-tl-h{display:flex;gap:var(--s5);align-items:flex-start;justify-content:space-between;padding-bottom:var(--s3);border-bottom:1px solid var(--line);margin-bottom:var(--s2)}
.ag-quote{margin:4px 0 0;font:500 15px/1.45 var(--body);color:var(--ink);max-width:52ch}
.ag-quote::before{content:"“"}.ag-quote::after{content:"”"}
.ag-tl-sum{display:grid;grid-template-columns:repeat(2,auto);gap:6px var(--s4);margin:0;flex:none}
.ag-tl-sum div{display:flex;flex-direction:column}
.ag-tl-sum dt{font:600 10px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ag-tl-sum dd{margin:2px 0 0;font-size:12.5px;color:var(--ink)}
.ag-steps{list-style:none;margin:0;padding:0;position:relative}
.ag-step{display:grid;grid-template-columns:62px minmax(0,1fr) minmax(120px,32%) 56px;gap:var(--s3);align-items:start;padding:8px 0;border-bottom:1px dashed var(--line)}
.ag-step:last-child{border-bottom:0}
.ag-st-t{font-size:11px;color:var(--muted);text-align:right;padding-top:2px}
.ag-st-l{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;min-width:0;padding-left:12px;border-left:2px solid var(--line-2)}
.ag-step.ai .ag-st-l,.ag-step.tool .ag-st-l{border-left-color:var(--ai)}
.ag-step.gate .ag-st-l{border-left-color:var(--good)}
.ag-step.out .ag-st-l{border-left-color:var(--ink-2)}
.ag-st-lane{font:600 9.5px var(--ag-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint);width:44px}
.ag-st-l b{font-size:13px;font-weight:600;color:var(--ink)}
.ag-st-l b.ag-mono{font-size:12.5px;font-weight:500;color:var(--ai)}
.ag-st-d{flex-basis:100%;font-size:11px;color:var(--ink-2);margin-left:52px;overflow-wrap:anywhere}
.ag-st-w{flex-basis:100%;font-size:12px;line-height:1.45;color:var(--muted);margin-left:52px}
.ag-st-bar{position:relative;height:8px;margin-top:6px;background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 10%);border-radius:2px}
.ag-st-bar i{position:absolute;top:0;bottom:0;border-radius:2px;background:var(--ink-2)}
.ag-step.ai .ag-st-bar i,.ag-step.tool .ag-st-bar i{background:var(--ai)}
.ag-step.q .ag-st-bar i{background:var(--line-2)}
.ag-step.gate .ag-st-bar i{background:var(--good)}
.ag-st-ms{font-size:11px;color:var(--ink-2);text-align:right;padding-top:2px}
.ag-foot{margin:var(--s3) 0 0;font-size:10.5px;color:var(--faint)}

/* gate + cost */
.ag-two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5)}
.ag-panel{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r2);padding:var(--s4);min-height:100%;box-sizing:border-box}
.ag-big{margin:0;font:600 15px/1.35 var(--body);color:var(--ink-2)}
.ag-big b{display:block;font:700 32px/1.1 var(--display);letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums;margin-bottom:2px}
.ag-sm{margin:6px 0 var(--s4);font-size:11px}
.ag-bars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ag-bars li{display:grid;grid-template-columns:minmax(0,190px) 1fr 32px;gap:var(--s3);align-items:center;font-size:12.5px}
.ag-bl{display:flex;flex-direction:column;min-width:0}
.ag-bl small{font-size:10.5px;color:var(--faint)}
.ag-bt{height:8px;background:var(--line);border-radius:2px;overflow:hidden}
.ag-bt i{display:block;height:100%;background:var(--ink-2)}
.ag-bars b{text-align:right;font-size:12px}
.ag-note{display:flex;gap:8px;align-items:flex-start;margin:var(--s4) 0 0;padding-top:var(--s3);border-top:1px solid var(--line);font-size:12px;line-height:1.45;color:var(--ink-2)}
.ag-note .ag-lamp{margin-top:4px}
.ag-hist{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--s2);height:120px;align-items:end;border-bottom:1px solid var(--line-2);padding-bottom:0}
.ag-hc{display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;height:100%;position:relative}
.ag-hc i{display:block;background:var(--ai);opacity:.85;border-radius:2px 2px 0 0;order:2}
.ag-hc.warn i{background:var(--warn)}
.ag-hc b{order:1;font-size:11px;text-align:center;color:var(--ink);margin-bottom:3px}
.ag-hc small{position:absolute;bottom:-18px;left:0;right:0;text-align:center;font-size:10px;color:var(--muted);white-space:nowrap}
.ag-panel .ag-hist{margin-bottom:22px}

/* widths */
@media (max-width:1180px){
  .ag-topo{grid-template-columns:1fr;gap:var(--s3)}
  .ag-t-wire{display:none}
  .ag-t-skills{flex-direction:row;flex-wrap:wrap}
}
@media (max-width:1024px){
  .ag-trace{grid-template-columns:1fr}
  .ag-picker{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line)}
  .ag-turn{min-width:220px;border-bottom:0;border-right:1px solid var(--line)}
  .ag-turn.on{box-shadow:inset 0 -3px 0 var(--act)}
  .ag-two{grid-template-columns:1fr}
}
@media (max-width:640px){
  .ag-console{padding:var(--s3)}
  .ag-headline{font-size:17px;align-items:flex-start}
  .ag-headline .ag-lamp{margin-top:7px}
  .ag-lamps{flex-direction:column}
  .ag-lampc{border-right:0;border-bottom:1px solid var(--line)}
  .ag-lampc:last-child{border-bottom:0}
  .ag-meter{min-width:0}
  .ag-t-roles{grid-template-columns:1fr}
  .ag-t-skills{margin-left:0;flex-direction:column}
  .ag-tl{padding:var(--s3)}
  .ag-tl-h{flex-direction:column;gap:var(--s3)}
  .ag-step{grid-template-columns:44px minmax(0,1fr) 44px;gap:var(--s2)}
  .ag-st-bar{grid-column:2/3;grid-row:2;margin-left:12px}
  .ag-st-d,.ag-st-w{margin-left:0}
  .ag-st-lane{width:auto}
  .ag-bars li{grid-template-columns:minmax(0,1fr) 72px 28px}
}

/* when it works: 7x24 heat, amber intensity, after-hours outlined */
.ag-heat-p{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:var(--s5);align-items:start}
.ag-heat-h .ag-sm{margin-bottom:0;line-height:1.6}
.ag-heat{display:grid;grid-template-columns:32px repeat(24,minmax(0,1fr));gap:3px;align-items:center}
.ag-heat i{display:block;height:16px;border-radius:2px;background:color-mix(in srgb,var(--ai) calc(var(--v)*100%),var(--line) );opacity:calc(.25 + var(--v)*.75)}
.ag-heat i.ah{box-shadow:inset 0 0 0 1px var(--ink-2)}
.ag-hd{font:500 10.5px var(--ag-mono);color:var(--muted)}
.ag-heat small{font:400 9.5px var(--ag-mono);color:var(--faint);text-align:left}
@media (max-width:1024px){.ag-heat-p{grid-template-columns:1fr}}
@media (max-width:640px){.ag-heat{gap:2px;grid-template-columns:26px repeat(24,minmax(0,1fr))}.ag-heat i{height:12px}}


/* break-ui: the quote column shrinks and truncates instead of pushing the summary out */
.ag-tl-h>:first-child{min-width:0;flex:1 1 auto}
.ag-tl-h>:first-child :is(q,blockquote,p,b,strong){overflow-wrap:anywhere}

/* proposed skill: dashed, never a live lamp */
.ag-lamp.prop{background:transparent;box-shadow:inset 0 0 0 1.5px var(--ai-line)}
.ag-node.prop{border-style:dashed;background:transparent}
.ag-node.prop .ag-nn{color:var(--ink-2)}
.ag-node.prop .ag-nc{font-style:italic;color:var(--faint)}
.ag .ag-stamp.prop{color:var(--muted);border-style:dashed}
.ag-rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);margin:0 0 var(--s3);max-width:1000px}
.ag-rule{border-top:2px solid var(--line-2);padding-top:6px}
.ag-rule.may{border-top-color:var(--good)}.ag-rule.never{border-top-color:var(--bad)}.ag-rule.hand{border-top-color:var(--act)}
.ag-rule ul{margin:4px 0 0;padding-left:16px;font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.ag-rule li{margin:2px 0}
.ag-audit{margin-top:var(--s3);padding-top:var(--s3);border-top:1px dashed var(--line-2)}
.ag-audit p{margin:4px 0 6px}
@media (max-width:760px){.ag-rules{grid-template-columns:1fr;gap:var(--s3)}.ag-audit .ag-sub{min-width:0}.ag-audit .ag-sub td{white-space:normal}}
/* phone: the workforce table scrolls sideways; keep an opened row's detail pinned to the visible width */
@media (max-width:760px){.ag-detail td>p,.ag-detail td>.ag-rules,.ag-detail td>.ag-audit,.ag-detail td>.ag-sub{position:sticky;left:12px;width:calc(100vw - 80px);max-width:calc(100vw - 80px);box-sizing:border-box}.ag-detail td>.ag-sub{min-width:0}}
/* turn picker on narrow screens: a contained, snapping scroll row; card text truncates instead of pushing out */
.ag-trace{min-width:0}
.ag-turn,.ag-tt,.ag-tt b{min-width:0}
.ag-tt b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ag-tt .ag-mono{flex:none;white-space:nowrap}
@media (max-width:1024px){
  .ag-trace{grid-template-columns:minmax(0,1fr)}
  .ag-picker{min-width:0;max-width:100%;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:thin}
  .ag-turn{flex:0 0 220px;scroll-snap-align:start}
}
@media (max-width:640px){.ag-turn{flex-basis:72%}}

.ag-console .ag-sec-r{max-width:60%;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:640px){.ag-console .ag-sec{flex-wrap:wrap}.ag-console .ag-sec-r{margin-left:0;max-width:100%;white-space:normal;text-align:left;flex-basis:100%}}

.ag-sp-w{display:block;cursor:default}

/* sort buttons: 32px hit area without changing the header layout */
.ag-sort{position:relative}
.ag-sort::before{content:"";position:absolute;inset:-10px -8px}
@media (prefers-reduced-motion:reduce){.ag *{transition:none!important;animation:none!important}}

/* kill switch row */
.ag-kill{gap:10px}
.ag-kill .btn{margin-left:4px}
.ag-kill .lnk{font-size:12px;margin-left:4px}
.ag-kill.on{background:var(--bad-bg);flex:1 1 100%;border-bottom:1px solid var(--line);border-right:0}
.ag-kill.on .ag-kill-t{color:var(--ink)}
.ag-kill-t b{font-weight:600}
@media (max-width:640px){.ag-kill{flex-wrap:wrap}.ag-kill .btn{margin-left:auto}}

/* period chips in the page head: 28px total, same head height as the other Impact tabs, so the tab row never jumps */
.ag-per{padding:2px}
.ag-per button{height:24px;padding:0 10px;font-size:12px}

/* phone: the head row is dropped, the period chips ride the status strip's first line, the lamps scroll in one row */
.ag-per-m{display:none}
@media (max-width:760px){
  #view>.phead:has(+ .seg[aria-label="Impact"]):has(.ag-per){display:none}
  .ag-console{margin-top:0;padding:10px 12px}
  .ag-hero{gap:8px;margin-bottom:12px}
  .ag-hero-top{display:flex;align-items:flex-start;gap:8px}
  .ag-hero-top .ag-headline{order:1;flex:1;min-width:0;font-size:14px;line-height:1.3}
  .ag-hero-top .ag-headline .ag-lamp{margin-top:4px}
  .ag-per-m{display:inline-flex;order:2;flex:none;flex-wrap:nowrap}
  .ag-per-m button{min-height:28px;height:28px}
  .ag-lamps{flex-direction:row;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
  .ag-lamps::-webkit-scrollbar{display:none}
  .ag-lampc{flex:none;border-right:1px solid var(--line);border-bottom:0;min-height:32px;padding:6px 10px;white-space:nowrap}
  .ag-lampc:last-child{border-bottom:0}
  .ag-meter{min-width:240px;flex:none}
  .ag-meter .ag-ll{white-space:nowrap}
  .ag-kill.on{flex:none}
  .ag-kill{flex-wrap:nowrap}
  .ag-kill .btn{margin-left:4px;min-height:32px;height:32px}
  .ag-kill{padding-top:1px;padding-bottom:1px}
  .ag>section:first-child{margin-top:0}
  /* sort buttons: 32px tall from mobile.css; keep label and arrow on one centred line */
  .ag-sort{display:inline-flex;align-items:center;justify-content:flex-end;gap:2px}
}

/* phone pass: overflow cue for tables that scroll inside their boxes, and hit aprons on small secondary controls */
.ag-swipe{display:none}
@media (max-width:760px){
  .ag-swipe{display:block;margin:0 0 6px;font:500 11px var(--mono);color:var(--muted)}
  .ag-tbl-w{box-shadow:inset -10px 0 8px -8px color-mix(in srgb,var(--ink) 22%,transparent)}
  .ag-per-m button,.ag-kill .lnk,.ag-tl-sum .lnk{position:relative}
  .ag-per-m button::after{content:"";position:absolute;inset:-4px 0}
  .ag-kill .lnk::after,.ag-tl-sum .lnk::after{content:"";position:absolute;inset:-10px -6px}
}
/* phone: kill switch is the primary action here (44px); the lamp row fades at its scrolling edge */
@media (max-width:760px){
  /* the lamp row scrolls, which clips any apron, so the button itself is 44px */
  .ag-kill .btn{min-height:44px;height:44px}
  .ag-lamps{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);padding-right:24px}
}
/* phone, final: the lamps wrap instead of scrolling (nothing cut at rest, no cue needed); the console loses its frame so the topology isn't card-in-card */
@media (max-width:760px){
  .ag-lamps{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none;padding-right:0}
  .ag-lampc{flex:1 1 auto;border-right:0;border-bottom:1px solid var(--line)}
  .ag-meter{flex:1 1 100%;min-width:0;border-bottom:0}
  .ag-kill,.ag-kill.on{flex:1 1 100%;flex-wrap:nowrap}
  .ag-kill .ag-kill-t{white-space:normal;flex:1;min-width:0}
  .ag-kill .btn{margin-left:auto}
}
@media (max-width:640px){
  .ag-console{border:0;padding:0;background:transparent;border-radius:0}
}
@media (max-width:760px){
  /* the row wraps now, so the shell's overflow fade (set via [data-edge]) must not apply */
  .ag .ag-lamps[data-edge]{-webkit-mask-image:none;mask-image:none}
  .ag-meter{flex-wrap:wrap;row-gap:6px}
  .ag-meter .ag-ll{flex:1 1 100%;white-space:normal}
  .ag-meter .ag-bar{flex:1;min-width:0}
}

/* "Drives": the outcome each worker or tool feeds, with its confidence stamp */
.ag-tbl td.ag-drv{white-space:normal;min-width:240px;max-width:320px;padding-top:6px;padding-bottom:6px;line-height:1.35}
.ag-drv-t{display:block;font-size:12px;color:var(--ink-2)}
.ag-drv .ag-stamp{margin-top:3px;font-size:9px;padding:2px 4px}
.ag .ag-stamp.bad{color:var(--bad);border-color:currentColor}
.ag-tbl{min-width:1140px}
.ag-tbl{min-width:1000px}
.ag-trig{max-width:150px}
.ag-tbl td.ag-drv{min-width:220px;max-width:260px}
.ag-tbl.tools td.mu:nth-child(3){max-width:200px}
.ag-trig{max-width:120px}
.ag-tbl td.ag-drv{min-width:200px;max-width:220px}
.ag-tbl.tools td.mu:nth-child(3){max-width:170px}
.ag-trig{max-width:105px}