:root{
  --bg:#f4f6fa;--card:#fff;--ink:#17202e;--muted:#5d6b82;--line:#e1e6ee;--brand:#12355b;--brand-2:#1f6feb;
  --ok:#0f7b45;--ok-bg:#e6f6ee;--bad:#b42318;--bad-bg:#fdecea;--warn:#946200;--warn-bg:#fff4d6;--info-bg:#eaf1fd;
  --shadow:0 1px 2px #0b1f4010,0 4px 14px #0b1f4010;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#0d1420;--card:#151f30;--ink:#e6ecf5;--muted:#93a3bb;--line:#26344b;--brand:#8ab4ff;--brand-2:#5b9bff;
  --ok:#59d493;--ok-bg:#12301f;--bad:#ff8a80;--bad-bg:#3a1714;--warn:#f2c14e;--warn-bg:#35290c;--info-bg:#15263f;--shadow:none}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;overflow-wrap:break-word}
button,input,textarea{max-width:100%}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px 16px;flex-wrap:wrap;padding:12px 24px;background:var(--card);border-bottom:1px solid var(--line)}
.brand{display:flex;gap:12px;align-items:center;color:var(--brand);min-width:0}
.brand h1{font-size:19px;margin:0;color:var(--ink);letter-spacing:.2px}.brand p{margin:0;font-size:12.5px;color:var(--muted)}
.chips{display:flex;gap:6px 8px;flex-wrap:wrap}
.chip{font-size:12px;padding:3px 10px;border-radius:999px;background:var(--info-bg);color:var(--brand);white-space:nowrap}
.chip.ok{background:var(--ok-bg);color:var(--ok)}
.lede{display:flex;gap:12px 24px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:16px 24px 0;padding:14px 18px;border:1px solid var(--line);border-left:4px solid var(--brand-2);border-radius:10px;background:var(--card)}
.lede p{margin:0;flex:1 1 420px;font-size:14px;color:var(--muted)}.lede p b{color:var(--ink)}
.lede-actions{display:flex;gap:8px;flex-wrap:wrap}
.lede-actions .primary{margin:0;width:auto;padding:9px 16px}.lede-actions small{opacity:.85;font-weight:400;margin-left:6px}
.layout{display:grid;grid-template-columns:320px minmax(0,1fr) 380px;gap:18px;padding:16px 24px 24px;align-items:start}
.layout>*{min-width:0}
@media (max-width:1280px){.layout{grid-template-columns:300px minmax(0,1fr)}.col-right{grid-column:1/-1}}
@media (max-width:820px){.layout{grid-template-columns:minmax(0,1fr);padding:12px 16px}.top{padding:10px 16px}.lede{margin:12px 16px 0}}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 18px;box-shadow:var(--shadow);margin-bottom:16px}
.card h2{font-size:15px;margin:0 0 12px;letter-spacing:.2px}.card h2 small{font-weight:400;color:var(--muted);font-size:12px;margin-left:6px}
label{display:block;font-size:12.5px;color:var(--muted);margin:10px 0 4px;font-weight:600}
textarea,input{width:100%;font:inherit;font-size:14px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px}
textarea{resize:vertical}
textarea:focus,input:focus,button:focus-visible,summary:focus-visible{outline:2px solid var(--brand-2);outline-offset:1px}
button{font:inherit;cursor:pointer;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:8px 14px}
button:disabled{opacity:.45;cursor:not-allowed}
button.primary{background:var(--brand-2);border-color:var(--brand-2);color:#fff;width:100%;margin-top:12px;font-weight:600;padding:10px}
button.ghost{font-size:13px;padding:7px 12px}
button.ok{background:var(--ok);border-color:var(--ok);color:#fff;font-weight:600}
.presets{display:flex;flex-direction:column;gap:8px}
.preset{display:block;width:100%;text-align:left;padding:9px 12px;line-height:1.35}
.preset b{display:block;font-size:14px}.preset span{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.preset.hostile,.preset.redirect{border-color:#e7b3ad}
.preset:hover:not(:disabled){border-color:var(--brand-2);background:var(--info-bg)}
.custom{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.custom summary{cursor:pointer;font-weight:600;font-size:13.5px}.custom summary small{font-weight:400;color:var(--muted);margin-left:6px}
.hint{font-size:12px;color:var(--muted);margin:10px 0 0}
.err{color:var(--bad);font-size:13px;margin:8px 0 0}
.joblist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.joblist li{padding:8px 10px;border:1px solid var(--line);border-radius:8px;cursor:pointer;font-size:13px}
.joblist li:hover,.joblist li.on{border-color:var(--brand-2);background:var(--info-bg)}
.joblist .r1{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.joblist .r2{color:var(--muted);font-size:12px;margin-top:3px}
.joblist .star{color:#c98a00;font-weight:700}
.tag{font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:6px;background:var(--info-bg);color:var(--brand)}
.tag.hostile,.tag.redirect{background:var(--bad-bg);color:var(--bad)}.tag.normal{background:var(--ok-bg);color:var(--ok)}
.empty ol{padding-left:20px;margin:0}.empty li{margin:8px 0}
/* status */
.status{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap;margin-bottom:14px}
.status .grow{flex:1}
.pill{font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--info-bg);color:var(--brand);text-transform:uppercase;letter-spacing:.4px;white-space:nowrap}
.pill.ok{background:var(--ok-bg);color:var(--ok)}.pill.bad{background:var(--bad-bg);color:var(--bad)}.pill.warn{background:var(--warn-bg);color:var(--warn)}
.spin{width:14px;height:14px;border:2px solid var(--line);border-top-color:var(--brand-2);border-radius:50%;animation:s .8s linear infinite}
@keyframes s{to{transform:rotate(360deg)}}
.banner{border-radius:12px;padding:14px 18px;margin-bottom:16px;border:1px solid var(--bad);background:var(--bad-bg);color:var(--bad)}
.banner b{font-size:16px;display:block}.banner span{color:var(--ink);font-size:13.5px}
.banner.calm{border-color:var(--ok);background:var(--ok-bg);color:var(--ok)}
.banner.warn{border-color:#e0a100;background:var(--warn-bg);color:var(--warn)}
.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:16px}
@media (max-width:900px){.stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:480px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.stat{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-width:0}
.stat b{display:block;font-size:22px;line-height:1.1}.stat span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;overflow-wrap:normal;word-break:normal}
.stat.red b{color:var(--bad)}.stat.green b{color:var(--ok)}
.src{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:10px}
.src.q{border-color:var(--bad);background:var(--bad-bg)}
.src .u{font:12.5px ui-monospace,Menlo,monospace;color:var(--muted)}
.src .h{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;flex-wrap:wrap;margin-bottom:4px}
.src ul{margin:6px 0 0;padding-left:18px;font-size:12.5px}
.compare{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
@media (max-width:700px){.compare{grid-template-columns:minmax(0,1fr)}}
.title-box{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg)}
.title-box small{display:block;color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;margin-bottom:4px}
.title-box.new{border-color:var(--ok);background:var(--ok-bg)}
.title-box.old .v{text-decoration:line-through;text-decoration-color:var(--bad)}
.title-box .v{font-weight:600}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;align-items:center}
.actions input{flex:1 1 200px;width:auto;min-width:0}
.rationale{font-size:13.5px;color:var(--muted);margin:10px 0 0}.rationale .src-line{display:block;font-size:12px;margin-top:4px}
/* quarantine room */
.qroom{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:12px}
@media (max-width:900px){.qroom{grid-template-columns:minmax(0,1fr)}}
.qpane{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg);min-width:0}
.qpane.held{border-color:var(--bad);background:var(--bad-bg)}
.qpane.model{border-color:var(--ok);background:var(--ok-bg)}
.qpane h3{margin:0 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.4px}
.qpane.held h3{color:var(--bad)}.qpane.model h3{color:var(--ok)}
.qtext,.codebox{font:12.5px/1.5 ui-monospace,Menlo,monospace;white-space:pre-wrap;margin:0;max-height:300px;overflow:auto}
mark.hid{background:#ffd54a;color:#201700;padding:0 2px;border-radius:3px;outline:1px dashed #a07a00}
.legend{font-size:12px;color:var(--muted);margin:8px 0 0}.legend mark{font-size:11px}
.qwhy{font-size:12.5px;color:var(--muted);margin:8px 0 0}
/* replay stage */
.replay{border:1px solid var(--brand-2)}
.rbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.rbar h2{margin:0;flex:1 1 auto}.replay>.hint{margin:0 0 10px}
.rbar button{padding:4px 10px;font-size:12.5px}
.stage{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:center;padding:14px 8px;background:var(--bg);border-radius:10px;border:1px solid var(--line)}
@media (max-width:640px){.stage{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:22px}}
.node{border:2px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--card);font-size:12px;text-align:center;transition:border-color .2s,background .2s,box-shadow .2s;min-width:0}
.node b{display:block;font-size:13px}.node small{color:var(--muted)}
.node.on{border-color:var(--brand-2);box-shadow:0 0 0 3px #1f6feb33}
.node.gone{opacity:.45;border-style:dashed}
.node.alarm{border-color:var(--bad);background:var(--bad-bg);animation:shake .35s}
.node.good{border-color:var(--ok);background:var(--ok-bg)}
.dests{display:flex;flex-direction:column;gap:8px}
.node.bad{border-color:var(--bad);border-style:dashed}
.node .hosts{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;margin-top:4px}
.node .hosts i{font-style:normal;font-size:11px;background:var(--bad-bg);color:var(--bad);border-radius:5px;padding:1px 6px}
@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.dot{position:absolute;width:12px;height:12px;border-radius:50%;left:0;top:0;pointer-events:none;z-index:3}
.dot.blue{background:var(--brand-2)}.dot.green{background:var(--ok)}.dot.red{background:var(--bad);box-shadow:0 0 8px var(--bad)}
.rcap{margin:12px 0 4px;font-size:15px;font-weight:600;min-height:2.6em}
.rcount{display:flex;gap:8px 16px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}.rcount b{color:var(--ink);font-size:15px}
.rcount b.red{color:var(--bad)}
.rmodel{margin-top:12px}
/* audit */
.audit-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}.audit-head h2{margin:0}
.seg{display:flex}.seg button{padding:4px 10px;font-size:12px;border-radius:0}.seg button:first-child{border-radius:8px 0 0 8px}.seg button:last-child{border-radius:0 8px 8px 0;border-left:0}.seg .on{background:var(--info-bg);color:var(--brand)}
.timeline{list-style:none;margin:0;padding:0;max-height:1100px;overflow:auto;font-size:12.5px}
.timeline li{display:grid;grid-template-columns:62px minmax(0,1fr);gap:8px;padding:6px 8px;border-left:3px solid var(--line);margin-bottom:4px;border-radius:0 6px 6px 0}
.timeline li time{color:var(--muted);font:11.5px ui-monospace,Menlo,monospace}
.timeline li.warning{border-left-color:#e0a100;background:var(--warn-bg)}
.timeline li.critical{border-left-color:var(--bad);background:var(--bad-bg)}
.timeline li .k{font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.3px;color:var(--muted)}
.timeline li.critical .k{color:var(--bad)}
.timeline li .jt{font:11px ui-monospace,Menlo,monospace;color:var(--muted)}
/* agent steps */
.steps{list-style:none;margin:0;padding:0}
.steps li{display:grid;grid-template-columns:28px 124px minmax(0,1fr) auto;gap:4px 8px;align-items:baseline;padding:6px 0;border-bottom:1px dashed var(--line);font-size:13px}
.steps li:last-child{border-bottom:0}
.steps .n{color:var(--muted);font:12px ui-monospace,Menlo,monospace}
.steps .t{font:600 12.5px ui-monospace,Menlo,monospace}
.steps .a{color:var(--muted);font:12px ui-monospace,Menlo,monospace}
.steps li.denied .t,.steps li.denied .st,.steps li.quarantined .t,.steps li.quarantined .st{color:var(--bad)}
.steps li.rejected .st{color:var(--warn)}
.steps .st{font-size:11.5px;font-weight:700;text-transform:uppercase;white-space:nowrap}
.steps li .note{grid-column:3/-1;color:var(--muted);font-size:12px}
@media (max-width:700px){.steps li{grid-template-columns:24px minmax(0,1fr)}.steps .a,.steps .st,.steps li .note{grid-column:2}}
.pulse{animation:pulse 1s ease-in-out 3}
@keyframes pulse{50%{box-shadow:0 0 0 6px #1f6feb55}}
@media (prefers-reduced-motion:reduce){.pulse,.node.alarm,.spin{animation:none}}

/* views + lab */
.viewnav{display:flex;gap:8px;margin:14px 24px 0;flex-wrap:wrap}
.viewnav button{border-radius:999px;padding:6px 14px;font-size:13.5px}.viewnav button small{color:var(--muted);margin-left:4px;font-weight:400}
.viewnav button.on{background:var(--info-bg);border-color:var(--brand-2);color:var(--brand);font-weight:600}
.labview{padding:16px 24px 24px;max-width:1280px}
.labview .card{margin-bottom:16px}
@media (max-width:820px){.viewnav{margin:10px 16px 0}.labview{padding:12px 16px}}
.labstats{display:flex;gap:10px 28px;flex-wrap:wrap;margin:12px 0}
.labstats div b{display:block;font-size:22px;line-height:1.15}.labstats div span{font-size:12px;color:var(--muted)}
.labstats b.ok{color:var(--ok)}.labstats b.bad{color:var(--bad)}
.labactions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
table.lab{width:100%;border-collapse:collapse;font-size:13px}
table.lab th{text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
table.lab td{padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:top}
table.lab tr.bad td{background:var(--bad-bg)}
table.lab .res{white-space:nowrap;font-weight:700}.res.ok{color:var(--ok)}.res.bad{color:var(--bad)}
table.lab .name{font-weight:600}.table-note{color:var(--muted);font-size:12px}
.ev-toggle{font-size:12px;padding:2px 8px;margin-top:6px}
.evlist{list-style:none;margin:6px 0 0;padding:0;font:11.5px/1.45 ui-monospace,Menlo,monospace}
.evlist li{padding:2px 0 2px 8px;border-left:3px solid var(--line)}.evlist li.critical{border-left-color:var(--bad);color:var(--bad)}.evlist li.warning{border-left-color:#e0a100}
.chip.red{background:var(--bad-bg);color:var(--bad)}
@media (max-width:820px){
  table.lab,table.lab tbody,table.lab tr,table.lab td{display:block;width:100%}
  table.lab thead{display:none}
  table.lab tr{border:1px solid var(--line);border-radius:10px;margin-bottom:10px;padding:6px 4px}
  table.lab td{border:0;padding:4px 8px}
  table.lab td[data-label]::before{content:attr(data-label);display:block;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
}
[hidden]{display:none!important}

.fig{margin:8px 0 0}.fig figcaption{font-size:12px;color:var(--muted);margin-top:4px}
img.shot{display:block;width:100%;max-width:420px;max-height:260px;object-fit:cover;object-position:top;border:1px solid var(--line);border-radius:8px;cursor:zoom-in;background:var(--bg)}
.qshots{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:10px 0}
.qshots img.shot{max-width:none;max-height:340px}

table.batch td input[type=text],table.batch td input:not([type]){width:100%}
table.batch th:first-child,table.batch td:first-child{width:34px}
table.batch td input[type=checkbox]{width:auto}
#csvfile{padding:6px}
.steps li.empty{display:block;color:var(--muted)}
table.batch{table-layout:fixed}
table.batch th:nth-child(2),table.batch td:nth-child(2){width:34px}
table.batch th:nth-child(3){width:30%}table.batch th:nth-child(4){width:44%}table.batch th:nth-child(5),table.batch td:nth-child(5){width:96px}
table.batch td{overflow-wrap:break-word}
@media (max-width:820px){table.batch{table-layout:auto}table.batch th:nth-child(n){width:auto}}
.banner.redteam{border-color:#7c5cc4;background:#f0eafc;color:#4b2f91}@media (prefers-color-scheme:dark){.banner.redteam{background:#251a45;color:#c5b0ff;border-color:#7c5cc4}}
.preset.redteam{border-color:#b9a3e8}
table.lab code{font-size:12px;word-break:break-all}

.joblist li.folded{border-style:dashed;cursor:default;color:var(--muted);font-size:12px}.joblist li.folded:hover{border-color:var(--line);background:none}
.joblist li:focus-visible{outline:2px solid var(--brand-2);outline-offset:1px}
#recent>summary{cursor:pointer;margin-bottom:8px}
.lightbox{position:fixed;inset:0;z-index:50;background:rgba(10,14,24,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px;cursor:zoom-out}
.lightbox img{max-width:96%;max-height:84%;min-height:0;object-fit:contain;border-radius:8px;background:#fff}
canvas.shot.zoom{display:block;width:100%;max-width:560px;height:auto;border:2px solid #e0a100;border-radius:8px;cursor:zoom-in}
.pill.ok{white-space:nowrap}
@media (max-width:820px){.layout.has-job .col-main{order:-1}}
.qshots .zoomfig{grid-column:1/-1}