[hidden]{display:none!important}
:root{
  --bg:#f7f6f2;--surface:#ffffff;--surface-2:#efede7;--border:#dedad1;--border-2:#c9c4b8;
  --text:#1b1a17;--muted:#5f5b52;--faint:#8e897e;
  --accent:#f26b1d;--accent-ink:#b84a0c;
  --s-vul:#d64545;--s-inv:#8c96a8;--s-fix:#2f9e63;--s-nv:#d9e3ea;--s-eta:#f26b1d;--s-none:transparent;--s-pre:#f1d2d2;
  --grid:#e7e3da;
  --font:"General Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;
  --r:6px;
}
html[data-theme="dark"]{
  --bg:#121212;--surface:#1a1a19;--surface-2:#232321;--border:#2e2d2a;--border-2:#3c3a36;
  --text:#ecebe6;--muted:#a6a298;--faint:#77736b;
  --accent:#ff7a2b;--accent-ink:#ff9a5c;
  --s-vul:#d24a55;--s-inv:#5f6878;--s-fix:#2f9e63;--s-nv:#2a3640;--s-pre:#4a2a2e;
  --grid:#262523;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:var(--accent-ink)}
.app{max-width:1280px;margin:0 auto;padding:20px 24px 24px;display:flex;flex-direction:column;gap:12px}
.hdr{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.hdr h1{font-size:20px;font-weight:600;margin:0;letter-spacing:-.01em}
.meta{margin:4px 0 0;color:var(--muted);font-size:12.5px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.dot{width:8px;height:8px;border-radius:50%;background:var(--faint);flex:none}
.dot.live{background:var(--s-fix);box-shadow:0 0 0 3px color-mix(in srgb,var(--s-fix) 25%,transparent)}
.dot.snap{background:var(--accent)}
.logo{flex:none;display:block;line-height:0}
.logo img{height:44px;width:auto}
.logo-dark{display:none}
html[data-theme="dark"] .logo-light{display:none}
html[data-theme="dark"] .logo-dark{display:block}

.controls{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;padding:10px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r)}
.seg{display:inline-flex;border:1px solid var(--border-2);border-radius:var(--r);overflow:hidden}
.seg button{font:inherit;font-size:13px;border:0;background:transparent;color:var(--muted);padding:5px 12px;cursor:pointer}
.seg button[aria-selected="true"]{background:var(--text);color:var(--bg)}
.chips{display:inline-flex;gap:6px;flex-wrap:wrap}
.chip{font:inherit;font-size:12.5px;display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;border:1px solid var(--border-2);background:transparent;color:var(--muted);cursor:pointer}
.chip i{width:9px;height:9px;border-radius:2px;display:inline-block}
.chip[aria-pressed="true"]{color:var(--text);border-color:var(--text);background:var(--surface-2)}
.chip b{font-weight:600;font-variant-numeric:tabular-nums}
.sel,.tog{font-size:12.5px;color:var(--muted);display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.sel select{font:inherit;font-size:12.5px;color:var(--text);background:var(--surface);border:1px solid var(--border-2);border-radius:var(--r);padding:4px 6px}
.tog input{accent-color:var(--accent)}
.search{font:inherit;font-size:13px;flex:1 1 180px;min-width:150px;padding:5px 9px;border:1px solid var(--border-2);border-radius:var(--r);background:var(--surface);color:var(--text)}
.actions{display:inline-flex;gap:6px;margin-left:auto}
.btn{font:inherit;font-size:12.5px;padding:5px 11px;border-radius:var(--r);border:1px solid var(--border-2);background:var(--surface);color:var(--text);cursor:pointer}
.btn:hover{border-color:var(--text)}
.btn:focus-visible,.chip:focus-visible,.seg button:focus-visible,.search:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:12px;height:12px;border-radius:2px;display:inline-block}
.legend .hatch{background:repeating-linear-gradient(135deg,var(--s-fix) 0 2px,transparent 2px 4px);outline:1px solid var(--s-fix);outline-offset:-1px}
.legend .eta{background:repeating-linear-gradient(135deg,var(--s-eta) 0 2px,transparent 2px 4px);outline:1px solid var(--s-eta);outline-offset:-1px}

.stage{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);min-height:240px;overflow:hidden}
.tl{display:flex;flex-direction:column}
.tl-head{display:block;width:100%;height:34px;border-bottom:1px solid var(--border)}
.tl-scroll{position:relative;overflow-y:auto;overflow-x:hidden;height:var(--tl-h,560px)}
.tl-body{position:sticky;top:0;display:block;width:100%}
#tlSpacer{width:1px}
.vd{max-height:var(--tl-h,594px);overflow:auto}
.vd table{width:100%;border-collapse:collapse;font-size:13px}
.vd th{position:sticky;top:0;background:var(--surface);text-align:center;font-weight:500;color:var(--muted);font-size:12px;padding:8px 6px;border-bottom:1px solid var(--border);z-index:1}
.vd th:first-child{text-align:left;padding-left:14px}
.vd td{padding:2px 3px;border-bottom:1px solid var(--grid)}
.vd td:first-child{padding:6px 14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}
.vd tr{cursor:pointer}
.vd tr:hover td:first-child{color:var(--accent-ink)}
.cell{height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums;font-size:12px;font-weight:500}
.empty{padding:48px;text-align:center;color:var(--muted)}
.skeleton{padding:16px;display:grid;gap:8px}
.skeleton div{height:14px;border-radius:3px;background:linear-gradient(90deg,var(--surface-2),var(--border),var(--surface-2));background-size:200% 100%;animation:sh 1.2s linear infinite}
@keyframes sh{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.skeleton div{animation:none}}

.tip{position:fixed;pointer-events:none;z-index:20;background:var(--text);color:var(--bg);font-size:12px;padding:6px 9px;border-radius:5px;max-width:360px;opacity:0;transition:opacity .08s}
.tip.on{opacity:1}
.tip b{font-weight:600}

.detail{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--r);padding:14px 16px;font-size:13px}
.detail h3{margin:0 0 2px;font-size:15px;font-weight:600}
.detail .sub{color:var(--muted);margin:0 0 10px}
.detail .grid{display:grid;grid-template-columns:120px 1fr;gap:4px 12px}
.detail .k{color:var(--faint)}
.detail .hist{font-family:var(--mono);font-size:12px}
.detail .close{float:right}
.badge{display:inline-block;padding:1px 7px;border-radius:999px;font-size:11.5px;font-weight:600;color:#fff}
.foot{font-size:12px;color:var(--faint)}

dialog{border:1px solid var(--border-2);border-radius:var(--r);background:var(--surface);color:var(--text);max-width:560px;width:92vw;padding:18px}
dialog::backdrop{background:rgba(0,0,0,.35)}
dialog h2{margin:0 0 6px;font-size:16px;font-weight:600}
dialog p{margin:0 0 10px;color:var(--muted);font-size:13px}
dialog textarea{width:100%;font-family:var(--mono);font-size:12px;padding:8px;border:1px solid var(--border-2);border-radius:var(--r);background:var(--bg);color:var(--text);resize:vertical}
.dlg-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:10px}

/* Embed mode */
html.embed .app{padding:10px 12px;gap:8px;max-width:none}
html.embed .hdr h1{font-size:16px}
html.embed .logo img{height:34px}
html.embed .foot{font-size:11px}
html.embed #embedBtn{display:none}

@media (max-width:640px){
  .app{padding:14px 12px}
  .logo img{height:32px}
  .hdr h1{font-size:17px}
  .actions{margin-left:0}
  .detail .grid{grid-template-columns:1fr}
}

.hdr h1 .cves{display:block;font-size:12.5px;font-weight:500;color:var(--muted);letter-spacing:0;margin-top:2px}
.ref{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;padding:9px 12px;border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--r);background:var(--surface);font-size:13px}
.ref-k{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--accent-ink)}
.ref a{font-weight:500;color:var(--text);text-decoration-color:var(--accent);text-underline-offset:3px}
.ref a:hover{color:var(--accent-ink)}
.ref-by{color:var(--faint);font-size:12px}
.about{font-size:13px;color:var(--muted);max-width:860px}
.about h2{font-size:15px;font-weight:600;color:var(--text);margin:8px 0 6px}
.about h3{font-size:13px;font-weight:600;color:var(--text);margin:12px 0 4px}
.about p{margin:0 0 8px}
.about .links{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:4px 16px}
html.embed .about{display:none}
html.embed .ref{padding:6px 10px;font-size:12px}

.faq{max-width:860px;font-size:13px;color:var(--muted)}
.faq h2{font-size:15px;font-weight:600;color:var(--text);margin:8px 0 6px}
.faq details{border-top:1px solid var(--border);padding:8px 0}
.faq details:last-child{border-bottom:1px solid var(--border)}
.faq summary{cursor:pointer;color:var(--text);font-weight:500;list-style:none;display:flex;gap:8px;align-items:baseline}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+";color:var(--accent-ink);font-weight:600;width:10px;flex:none}
.faq details[open] summary::before{content:"\2013"}
.faq summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.faq p{margin:6px 0 2px 18px}
html.embed .faq{display:none}