/* SBOM Bench: graphite task-card sheets, ruled cells, witness marks, inspector-ink stamps. */
@font-face{font-family:"Fira Sans";src:url(../fonts/fira-sans-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Fira Sans";src:url(../fonts/fira-sans-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Fira Sans";src:url(../fonts/fira-sans-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Fira Sans";src:url(../fonts/fira-sans-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Fira Code";src:url(../fonts/fira-code-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Fira Code";src:url(../fonts/fira-code-500.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --ground:#121314; --rail:#0d0e0f; --sheet:#18191b; --sheet-2:#1f2022; --sheet-3:#27282b; --well:#141516;
  --rule:#2a2b2e; --rule-2:#36383b; --rule-3:#4a4c50;
  --ink:#ebebec; --ink-2:#bcbfc4; --ink-3:#95989e; --ink-4:#83868c;
  --stamp:#ab9dff; --stamp-ink:#c7bdff; --stamp-fill:#8d7cf7; --on-stamp:#0f0d1c; --stamp-wash:rgba(171,157,255,.11); --stamp-wash-2:rgba(171,157,255,.2);
  --s-critical:#ff4f8f; --s-high:#f59234; --s-medium:#f8e58c; --s-low:#4ea3ff; --s-negligible:#85888e; --s-unknown:#a6a9ae;
  --ok:#4ec98f; --warn:#e7c64e; --bad:#ff6e6e; --info:#6db3ff;
  --ok-wash:rgba(78,201,143,.12); --bad-wash:rgba(255,110,110,.12); --warn-wash:rgba(231,198,78,.12);
  --shadow:0 8px 24px rgba(0,0,0,.45),0 2px 6px rgba(0,0,0,.3);
  --focus:0 0 0 2px var(--ground),0 0 0 4px var(--stamp);
  --font:"Fira Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Fira Code",ui-monospace,Consolas,monospace;
  --r:4px; --r-2:6px;
  --t-fast:140ms; --t:200ms; --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:dark;
}
:root[data-theme=light]{
  --ground:#eef0f3; --rail:#e4e7ec; --sheet:#ffffff; --sheet-2:#f5f6f8; --sheet-3:#eceef2; --well:#f7f8fa;
  --rule:#dfe3e8; --rule-2:#cdd3da; --rule-3:#aeb6c0;
  --ink:#141920; --ink-2:#3d4652; --ink-3:#59636f; --ink-4:#5f6773; --st-high:#a35200;
  --stamp:#5a44e0; --stamp-ink:#4b36cc; --stamp-fill:#5a44e0; --on-stamp:#ffffff; --stamp-wash:rgba(90,68,224,.08); --stamp-wash-2:rgba(90,68,224,.16);
  --s-critical:#b0103f; --s-high:#d06a00; --s-medium:#6e6000; --s-low:#2563c7; --s-negligible:#6b7480; --s-unknown:#5d6672;
  --ok:#1d8655; --warn:#8a6a00; --bad:#c4232b; --info:#1d62b8;
  --ok-wash:rgba(29,134,85,.1); --bad-wash:rgba(196,35,43,.08); --warn-wash:rgba(138,106,0,.1);
  --shadow:0 8px 24px rgba(20,25,32,.14),0 2px 6px rgba(20,25,32,.08);
  color-scheme:light;
}
@media (prefers-color-scheme:light){:root[data-theme=system]{
  --ground:#eef0f3; --rail:#e4e7ec; --sheet:#ffffff; --sheet-2:#f5f6f8; --sheet-3:#eceef2; --well:#f7f8fa;
  --rule:#dfe3e8; --rule-2:#cdd3da; --rule-3:#aeb6c0;
  --ink:#141920; --ink-2:#3d4652; --ink-3:#59636f; --ink-4:#5f6773; --st-high:#a35200;
  --stamp:#5a44e0; --stamp-ink:#4b36cc; --stamp-fill:#5a44e0; --on-stamp:#ffffff; --stamp-wash:rgba(90,68,224,.08); --stamp-wash-2:rgba(90,68,224,.16);
  --s-critical:#b0103f; --s-high:#d06a00; --s-medium:#6e6000; --s-low:#2563c7; --s-negligible:#6b7480; --s-unknown:#5d6672;
  --ok:#1d8655; --warn:#8a6a00; --bad:#c4232b; --info:#1d62b8;
  --ok-wash:rgba(29,134,85,.1); --bad-wash:rgba(196,35,43,.08); --warn-wash:rgba(138,106,0,.1);
  --shadow:0 8px 24px rgba(20,25,32,.14),0 2px 6px rgba(20,25,32,.08);
  color-scheme:light;
}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font:400 14px/1.5 var(--font);font-variant-numeric:tabular-nums;
  -webkit-font-smoothing:antialiased;caret-color:var(--stamp)}
::selection{background:var(--stamp-wash-2);color:var(--ink)}
*{scrollbar-width:thin;scrollbar-color:var(--rule-3) transparent}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--rule-2);border-radius:10px;border:2px solid var(--ground)}
::-webkit-scrollbar-track{background:transparent}
a{color:var(--stamp-ink);text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--stamp-ink) 45%,transparent)}
a:hover{text-decoration-color:currentColor}
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:var(--r)}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.005em;text-wrap:balance}
h1{font-size:20px;line-height:1.3}h2{font-size:16px;line-height:1.35}h3{font-size:14px}
p{margin:0}
code,.mono{font-family:var(--mono);font-size:12.5px;font-variant-ligatures:none}
.mut{color:var(--ink-3)}.mut-2{color:var(--ink-2)}
.nowrap{white-space:nowrap}.break{word-break:break-word;overflow-wrap:anywhere}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.icon{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.icon.sm{width:14px;height:14px}.icon.lg{width:20px;height:20px}
[hidden]{display:none!important}

/* ---------- shell */
.shell{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
.rail{background:var(--rail);border-right:1px solid var(--rule);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.brand{display:flex;align-items:center;gap:10px;height:56px;padding:0 18px;border-bottom:1px solid var(--rule);color:var(--ink);text-decoration:none}
.brand .mark{width:22px;height:22px;flex:none}
.brand b{font-weight:600;font-size:15px;letter-spacing:.01em}
.nav{padding:10px 8px;display:flex;flex-direction:column;gap:1px;overflow:auto;flex:1}
.nav .grp{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-4);padding:14px 10px 6px}
.nav a{display:flex;align-items:center;gap:10px;height:34px;padding:0 10px;border-radius:var(--r);color:var(--ink-2);text-decoration:none;font-weight:500}
.nav a:hover{background:var(--sheet);color:var(--ink)}
.nav a[aria-current=page]{background:var(--sheet-2);color:var(--ink);font-weight:600}
.nav a[aria-current=page] .icon{color:var(--stamp)}
.nav a .count{margin-left:auto;font-size:12px;color:var(--ink-3);font-weight:500}
.rail-foot{border-top:1px solid var(--rule);padding:10px 8px}
.worker-state{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-3);padding:6px 10px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ink-4);flex:none}
.dot.ok{background:var(--ok)}.dot.bad{background:var(--bad)}.dot.run{background:var(--stamp);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35}}

.main{min-width:0;display:flex;flex-direction:column}
.top{height:56px;display:flex;align-items:center;gap:12px;padding:0 24px;border-bottom:1px solid var(--rule);background:var(--ground);position:sticky;top:0;z-index:20}
.top .crumbs{display:flex;align-items:center;gap:8px;min-width:0;font-size:14px;color:var(--ink-3)}
.top .crumbs a{color:var(--ink-3);text-decoration:none}.top .crumbs a:hover{color:var(--ink)}
.top .crumbs b{color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top .spacer{flex:1}
.search{position:relative;width:min(340px,32vw)}
.search .icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--ink-3)}
.search input{padding-left:32px;width:100%}
.search kbd{position:absolute;right:8px;top:50%;transform:translateY(-50%)}
.menu-btn{display:none}
.page{padding:24px;max-width:1480px;width:100%;margin:0 auto}
.page-head{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.page-head .grow{flex:1;min-width:240px}
.page-head p{color:var(--ink-3);margin-top:4px;max-width:75ch}
kbd{font:500 11.5px/1 var(--mono);padding:3px 5px;border:1px solid var(--rule-2);border-bottom-width:2px;border-radius:4px;color:var(--ink-3);background:var(--sheet)}

/* ---------- sheet (ruled card) */
.sheet{background:var(--sheet);border:1px solid var(--rule);border-radius:var(--r-2)}
.sheet+.sheet,.stack>*+*{margin-top:16px}
.sheet-head{display:flex;align-items:center;gap:12px;min-height:48px;padding:10px 16px;border-bottom:1px solid var(--rule);flex-wrap:wrap}
.sheet-head h2{font-size:14px;font-weight:600}
.sheet-head .grow{flex:1}
.sheet-head .sub{color:var(--ink-3);font-size:13px}
.sheet-body{padding:16px}
.sheet-foot{border-top:1px solid var(--rule);padding:10px 16px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;color:var(--ink-3);font-size:13px}
.grid-2{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px}
.grid-2>.sheet+.sheet{margin-top:0}

/* ledger strip: one ruled row of cells, a task-card header */
.ledger{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));background:var(--sheet);border:1px solid var(--rule);border-radius:var(--r-2);overflow:hidden}
.ledger .cell{padding:12px 16px 14px;border-right:1px solid var(--rule);min-width:0;position:relative}
.ledger .cell:last-child{border-right:0}
.ledger .cell.wide{grid-column:span 2}
.ledger .lbl{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3)}
.ledger .val{font-size:22px;font-weight:600;line-height:1.25;margin-top:4px;letter-spacing:-.01em}
.ledger .val small{font-size:13px;font-weight:500;color:var(--ink-3);margin-left:4px;letter-spacing:0}
.ledger .note{font-size:12.5px;color:var(--ink-3);margin-top:2px}
.ledger a.cell{color:inherit;text-decoration:none}.ledger a.cell:hover{background:var(--sheet-2)}

/* key/value card fields */
.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));border-top:1px solid var(--rule)}
.fields>div{padding:10px 16px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);min-width:0}
.fields dt,.k{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3)}
.fields dd{margin:3px 0 0;word-break:break-word}
dl{margin:0}

/* ---------- controls */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:32px;padding:0 12px;border-radius:var(--r);
  border:1px solid var(--rule-2);background:var(--sheet-2);color:var(--ink);font:500 13.5px/1 var(--font);cursor:pointer;white-space:nowrap;
  text-decoration:none;transition:background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),color var(--t-fast)}
.btn:hover{background:var(--sheet-3);border-color:var(--rule-3)}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--stamp-fill);border-color:var(--stamp-fill);color:var(--on-stamp)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--ink-2)}
.btn.ghost:hover{background:var(--sheet-2);color:var(--ink)}
.btn.danger{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 45%,var(--rule-2));background:transparent}
.btn.danger:hover{background:var(--bad-wash)}
.btn.danger.solid{background:var(--bad);border-color:var(--bad);color:#16090a}
.btn.sm{height:28px;padding:0 9px;font-size:13px}
.btn.icon-only{width:32px;padding:0}.btn.sm.icon-only{width:28px}
.btn[disabled],.btn[aria-disabled=true]{opacity:.45;cursor:not-allowed;transform:none;filter:none}
.btn .spin{width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

input[type=text],input[type=search],input[type=password],input[type=number],select,textarea{
  height:32px;padding:0 10px;border:1px solid var(--rule-2);border-radius:var(--r);background:var(--well);color:var(--ink);font:400 13.5px/1.4 var(--font);
  transition:border-color var(--t-fast)}
textarea{height:auto;min-height:72px;padding:8px 10px;resize:vertical;width:100%}
select{padding-right:28px;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238b97a6' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 9px center}
input:hover,select:hover,textarea:hover{border-color:var(--rule-3)}
input:focus-visible,select:focus-visible,textarea:focus-visible{border-color:var(--stamp);box-shadow:0 0 0 3px var(--stamp-wash-2);border-radius:var(--r)}
input::placeholder,textarea::placeholder{color:var(--ink-4)}
input[aria-invalid=true],textarea[aria-invalid=true]{border-color:var(--bad)}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label,.field>.label{font-size:13px;font-weight:500;color:var(--ink-2)}
.field .help{font-size:12.5px;color:var(--ink-3)}
.field .err{font-size:12.5px;color:var(--bad);display:flex;gap:6px;align-items:center}
.form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px 20px}
.check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;color:var(--ink-2);font-size:13.5px;user-select:none}
.check input{appearance:none;width:16px;height:16px;border:1.5px solid var(--rule-3);border-radius:3px;margin:0;display:grid;place-content:center;background:var(--well);cursor:pointer;flex:none}
.check input:checked{background:var(--stamp-fill);border-color:var(--stamp-fill)}
.check input:checked::after{content:"";width:9px;height:5px;border:2px solid var(--on-stamp);border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
.check input[type=radio]{border-radius:50%}
.check input[type=radio]:checked::after{width:6px;height:6px;border:0;border-radius:50%;background:var(--on-stamp);transform:none}
.check input:indeterminate{background:var(--stamp-fill);border-color:var(--stamp-fill)}
.check input:indeterminate::after{content:"";width:8px;height:2px;background:var(--on-stamp);border:0;transform:none}
.switch{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer}
.switch input{appearance:none;width:34px;height:20px;border-radius:20px;background:var(--rule-2);margin:0;position:relative;cursor:pointer;transition:background var(--t-fast)}
.switch input::after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:var(--ink);top:3px;left:3px;transition:transform var(--t) var(--ease)}
.switch input:checked{background:var(--stamp-fill)}.switch input:checked::after{transform:translateX(14px);background:var(--on-stamp)}

/* segmented filter chips */
.seg{display:inline-flex;border:1px solid var(--rule-2);border-radius:var(--r);overflow:hidden;background:var(--well)}
.seg button{height:30px;padding:0 11px;border:0;border-right:1px solid var(--rule-2);background:transparent;color:var(--ink-2);font:500 13px var(--font);cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.seg button:last-child{border-right:0}
.seg button:hover{background:var(--sheet-2);color:var(--ink)}
.seg button[aria-pressed=true]{background:var(--stamp-wash-2);color:var(--ink)}
.toolbar{display:flex;gap:8px 10px;flex-wrap:wrap;align-items:center;padding:10px 16px;border-bottom:1px solid var(--rule)}
.toolbar .grow{flex:1}
.toolbar input[type=search]{width:min(320px,100%)}
.chip-toggle{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--rule-2);border-radius:14px;background:transparent;color:var(--ink-2);font:500 12.5px var(--font);cursor:pointer}
.chip-toggle:hover{border-color:var(--rule-3);color:var(--ink)}
.chip-toggle[aria-pressed=true]{background:var(--stamp-wash-2);border-color:var(--stamp);color:var(--ink)}

/* ---------- tables */
.tw{overflow-x:auto}
table.t{width:100%;border-collapse:separate;border-spacing:0;font-size:13.5px}
.t th{position:sticky;top:0;z-index:2;background:var(--sheet);text-align:left;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);
  padding:0 12px;height:36px;border-bottom:1px solid var(--rule-2);white-space:nowrap}
.t th.num,.t td.num{text-align:right}
.t th button.sort{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:4px}
.t th button.sort:focus-visible{box-shadow:var(--focus);border-radius:3px}
.t th[aria-sort] button.sort{color:var(--ink)}
.t td{padding:8px 12px;border-bottom:1px solid var(--rule);vertical-align:top}
.t tbody tr.row{cursor:pointer;transition:background var(--t-fast)}
.t tbody tr.row:hover>td{background:var(--sheet-2)}
.t tbody tr.row[aria-expanded=true]>td{background:var(--sheet-2);border-bottom-color:transparent}
.t tbody tr.sel>td{background:var(--stamp-wash)}
.t td.check-cell,.t th.check-cell{width:36px;padding-right:0}
.t .sub{color:var(--ink-3);font-size:12.5px;margin-top:1px}
.t tr.detail>td{padding:0;background:var(--sheet-2);cursor:default}
.t .ell{max-width:340px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t td.mono,.t .mono{font-size:12.5px}
.idx{color:var(--ink-4);font:500 12px var(--mono)}
.pager{display:flex;align-items:center;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.empty{padding:40px 24px;text-align:center;color:var(--ink-3)}
.empty h3{color:var(--ink);font-size:15px;margin-bottom:6px}
.empty p{max-width:56ch;margin:0 auto 14px}

/* skeleton */
.skel{background:linear-gradient(90deg,var(--sheet-2) 0,var(--sheet-3) 40%,var(--sheet-2) 80%);background-size:200% 100%;animation:shimmer 1.4s linear infinite;border-radius:3px;height:12px}
@keyframes shimmer{to{background-position:-200% 0}}

/* ---------- severity */
.sev{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:12.5px;white-space:nowrap}
.sev::before{content:"";width:8px;height:8px;border-radius:2px;background:currentColor;flex:none}
.sev.Critical{color:var(--s-critical)}.sev.High{color:var(--s-high)}.sev.Medium{color:var(--s-medium)}
.sev.Low{color:var(--s-low)}.sev.Negligible{color:var(--s-negligible)}.sev.Unknown{color:var(--s-unknown)}
.sevbar{display:flex;gap:2px;height:8px;min-width:80px;border-radius:2px;overflow:hidden;background:transparent}
.sevbar span{display:block;height:100%;border-radius:1px}
.sevbar .Critical{background:var(--s-critical)}.sevbar .High{background:var(--s-high)}.sevbar .Medium{background:var(--s-medium)}
.sevbar .Low{background:var(--s-low)}.sevbar .Negligible{background:var(--s-negligible)}.sevbar .Unknown{background:var(--s-unknown)}
.sevbar.empty-bar{background:var(--rule);}
.sevcounts{display:flex;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-2);margin-top:6px}
.sevcounts b{font-weight:600;color:var(--ink)}
.sevcounts .sev{font-size:12.5px}
.sevtag{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;padding:0 5px;border-radius:3px;font:700 11.5px/1 var(--font);
  letter-spacing:.03em;border:1px solid currentColor}
.sevtag.Critical{color:var(--s-critical)}.sevtag.High{color:var(--s-high)}.sevtag.Medium{color:var(--s-medium)}.sevtag.Low{color:var(--s-low)}
.sevtag.Negligible{color:var(--s-negligible)}.sevtag.Unknown{color:var(--s-unknown)}

/* ---------- witness marks: filled = detected, ring = ran but did not detect, dash = not run */
.wit{display:inline-grid;grid-auto-flow:column;gap:6px;align-items:center}
.wit i{width:11px;height:11px;border-radius:50%;display:block;position:relative}
.wit i.y{background:var(--ink-2)}
.wit i.n{border:1.5px solid var(--rule-3)}
.wit i.x{width:10px;height:2px;border-radius:1px;background:var(--rule-2)}
.wit i.f{border:1.5px solid var(--bad)}
.wit i.f::after{content:"";position:absolute;inset:3px 1px;background:var(--bad);transform:rotate(45deg);height:1.5px;top:3.5px}
.wit-head{display:inline-grid;grid-auto-flow:column;gap:6px;font:600 11px/1 var(--mono);color:var(--ink-3);letter-spacing:0}
.wit-head span{width:11px;text-align:center}
.legend{display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:12.5px;color:var(--ink-3)}
.legend .wit i{display:inline-block}
.legend>span{display:inline-flex;gap:6px;align-items:center}

/* ---------- inspector stamps */
.stamp{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border:1.5px solid var(--stamp);border-radius:3px;color:var(--stamp-ink);
  font:700 11.5px/1 var(--font);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;transform:rotate(-1.2deg);background:var(--stamp-wash)}
.stamp .by{font:500 11px/1 var(--mono);letter-spacing:0;text-transform:none;opacity:.85;border-left:1px solid currentColor;padding-left:6px}
.stamp.fixed{border-color:var(--ok);color:var(--ok);background:var(--ok-wash)}
.stamp.investigating{border-style:dashed}
.stamp.open{border-color:var(--rule-3);color:var(--ink-3);background:transparent;transform:none}
.stamp.press{animation:press 220ms var(--ease)}
@keyframes press{0%{transform:rotate(-1.2deg) scale(1.18);opacity:.3}100%{transform:rotate(-1.2deg) scale(1);opacity:1}}
.flag{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 6px;border-radius:3px;font:700 11px/1 var(--font);letter-spacing:.06em;text-transform:uppercase}
.flag.kev{background:var(--bad-wash);color:var(--bad);border:1px solid color-mix(in srgb,var(--bad) 50%,transparent)}
.flag.new{color:var(--stamp-ink);border:1px solid var(--stamp)}
.flag.fix{color:var(--ok);border:1px solid color-mix(in srgb,var(--ok) 50%,transparent)}

/* state pills */
.state{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;white-space:nowrap}
.state.done{color:var(--ok)}.state.failed{color:var(--bad)}.state.cancelled{color:var(--ink-3)}
.state.queued,.state.extracting,.state.unpacking,.state.scanning,.state.running{color:var(--stamp-ink)}

/* stamp picker in the finding detail */
.stamps-pick{display:flex;gap:8px;flex-wrap:wrap}
.stamps-pick label{cursor:pointer}
.stamps-pick input{position:absolute;opacity:0;pointer-events:none}
.stamps-pick .stamp{transform:none;background:transparent;border-color:var(--rule-3);color:var(--ink-2);height:30px;padding:0 12px;transition:all var(--t-fast)}
.stamps-pick label:hover .stamp{border-color:var(--stamp);color:var(--ink)}
.stamps-pick input:checked+.stamp{border-color:var(--stamp);color:var(--stamp-ink);background:var(--stamp-wash-2);transform:rotate(-1.2deg)}
.stamps-pick input:checked+.stamp.fixed{border-color:var(--ok);color:var(--ok);background:var(--ok-wash)}
.stamps-pick input:focus-visible+.stamp{box-shadow:var(--focus)}

/* finding detail (inline expansion) */
.detail-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);border-top:1px solid var(--rule)}
.detail-grid>section{padding:16px 18px;min-width:0}
.detail-grid>section+section{border-left:1px solid var(--rule)}
.detail-grid h4{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);margin:16px 0 8px}
.detail-grid h4:first-child{margin-top:0}
.desc{color:var(--ink-2);max-width:78ch;white-space:pre-line}
.desc.clamp{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;font-size:13px}
.kv dt{color:var(--ink-3)}.kv dd{margin:0;word-break:break-word}
.evid{width:100%;border-collapse:collapse;font-size:13px}
.evid td,.evid th{padding:6px 8px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
.evid th{font-size:11.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.locs{list-style:none;margin:0;padding:0;font:12px/1.6 var(--mono);color:var(--ink-2)}
.locs li{word-break:break-all;padding:1px 0}
.refs{list-style:none;margin:0;padding:0;font-size:13px}
.refs li{padding:2px 0;word-break:break-all}

/* bulk action bar */
.bulkbar{position:sticky;bottom:16px;z-index:15;margin:12px auto 0;width:max-content;max-width:calc(100% - 32px);display:flex;gap:10px;align-items:center;
  padding:8px 10px 8px 16px;background:var(--sheet-3);border:1px solid var(--rule-3);border-radius:var(--r-2);box-shadow:var(--shadow);flex-wrap:wrap}

/* tabs: each tab carries its count */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--rule);margin-bottom:16px;overflow-x:auto}
.tabs a{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;color:var(--ink-3);text-decoration:none;font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs a:hover{color:var(--ink)}
.tabs a[aria-selected=true]{color:var(--ink);border-bottom-color:var(--stamp)}
.tabs .n{font-size:12px;color:var(--ink-3);background:var(--sheet-2);border:1px solid var(--rule);padding:1px 6px;border-radius:9px}

/* progress */
.progress{height:6px;background:var(--rule);border-radius:3px;overflow:hidden}
.progress>span{display:block;height:100%;background:var(--stamp-fill);border-radius:3px}
.progress.indet>span{width:100%;animation:pulse 1.6s ease-in-out infinite}
.meter{display:flex;align-items:center;gap:8px}.meter .progress{flex:1;min-width:60px}

/* steps (scan pipeline) */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));border-top:1px solid var(--rule)}
.steps>div{padding:12px 16px;border-right:1px solid var(--rule);min-width:0}
.steps>div:last-child{border-right:0}
.steps .k{display:flex;align-items:center;gap:8px}
.steps .m{font-size:12.5px;color:var(--ink-3);margin-top:4px;word-break:break-word}

/* drop zone */
.drop{border:1.5px dashed var(--rule-3);border-radius:var(--r-2);padding:36px 24px;text-align:center;background:var(--well);transition:border-color var(--t-fast),background var(--t-fast);cursor:pointer}
.drop:hover,.drop.over{border-color:var(--stamp);background:var(--stamp-wash)}
.drop .icon{width:28px;height:28px;color:var(--ink-3);margin-bottom:8px}
.drop strong{display:block;font-size:15px;font-weight:600;margin-bottom:4px}
.engine-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.engine-pick label{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid var(--rule-2);border-radius:var(--r);cursor:pointer;background:var(--well)}
.engine-pick label:hover{border-color:var(--rule-3)}
.engine-pick label:has(input:checked){border-color:var(--stamp);background:var(--stamp-wash)}
.engine-pick label:has(input:disabled){opacity:.5;cursor:not-allowed}
.engine-pick b{display:block;font-weight:600;font-size:13.5px}
.engine-pick span.mut{font-size:12.5px}

/* charts */
.chart{width:100%;display:block;overflow:visible}
.chart text{font:500 11.5px var(--font);fill:var(--ink-3)}
.chart .grid{stroke:var(--rule);stroke-width:1}
.chart .axis{stroke:var(--rule-2)}
.chart-wrap{position:relative}
.tip{position:fixed;z-index:60;pointer-events:none;background:var(--sheet-3);border:1px solid var(--rule-3);border-radius:var(--r);box-shadow:var(--shadow);padding:8px 10px;font-size:12.5px;max-width:280px}
.tip b{font-weight:600}
.combo{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px 14px;align-items:center;font-size:13px}
.combo .bar{height:10px;background:var(--ink-3);border-radius:2px;min-width:2px}
.combo .bar.one{background:var(--rule-3)}

/* ---------- overlays */
dialog{border:1px solid var(--rule-3);border-radius:var(--r-2);background:var(--sheet);color:var(--ink);padding:0;width:min(480px,calc(100vw - 32px));box-shadow:var(--shadow)}
dialog::backdrop{background:rgba(5,7,10,.6)}
dialog .d-body{padding:20px}
dialog h2{font-size:16px;margin-bottom:8px}
dialog p{color:var(--ink-2)}
dialog .d-foot{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px;border-top:1px solid var(--rule);background:var(--sheet-2)}
dialog[open]{animation:dlg 180ms var(--ease)}
@keyframes dlg{from{opacity:0;transform:translateY(6px)}}
.toasts{position:fixed;right:16px;bottom:16px;z-index:70;display:flex;flex-direction:column;gap:8px;max-width:min(420px,calc(100vw - 32px))}
.toast{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;background:var(--sheet-3);border:1px solid var(--rule-3);border-radius:var(--r-2);box-shadow:var(--shadow);font-size:13.5px;animation:toast 220ms var(--ease)}
.toast.ok .icon{color:var(--ok)}.toast.bad .icon{color:var(--bad)}
.toast .grow{flex:1}
@keyframes toast{from{opacity:0;transform:translateY(8px)}}
.popover{position:fixed;z-index:50;min-width:200px;background:var(--sheet-3);border:1px solid var(--rule-3);border-radius:var(--r-2);box-shadow:var(--shadow);padding:6px;margin:0}
.popover button,.popover a{display:flex;width:100%;align-items:center;gap:10px;height:32px;padding:0 10px;border:0;background:transparent;color:var(--ink);font:400 13.5px var(--font);border-radius:var(--r);cursor:pointer;text-decoration:none;text-align:left}
.popover button:hover,.popover a:hover{background:var(--sheet-2)}
.popover .danger{color:var(--bad)}
.popover hr{border:0;border-top:1px solid var(--rule-2);margin:6px 2px}
.popover .who{padding:8px 10px 10px;font-size:12.5px;color:var(--ink-3);border-bottom:1px solid var(--rule-2);margin-bottom:6px}
.popover .who b{display:block;color:var(--ink);font-size:13.5px}
.callout{display:flex;gap:10px;padding:10px 14px;border:1px solid var(--rule-2);border-radius:var(--r);background:var(--well);color:var(--ink-2);font-size:13.5px}
.callout .icon{margin-top:2px;color:var(--ink-3)}
.callout.warn{border-color:color-mix(in srgb,var(--warn) 45%,var(--rule-2));background:var(--warn-wash)}.callout.warn .icon{color:var(--warn)}
.callout.bad{border-color:color-mix(in srgb,var(--bad) 45%,var(--rule-2));background:var(--bad-wash)}.callout.bad .icon{color:var(--bad)}
.callout.ok{border-color:color-mix(in srgb,var(--ok) 45%,var(--rule-2));background:var(--ok-wash)}.callout.ok .icon{color:var(--ok)}
.secret{display:flex;gap:8px;align-items:center;padding:8px 10px;border:1px solid var(--rule-2);border-radius:var(--r);background:var(--well);font:500 13px var(--mono);word-break:break-all}
pre.log{margin:0;padding:14px 16px;max-height:70vh;overflow:auto;font:12px/1.55 var(--mono);color:var(--ink-2);white-space:pre-wrap;word-break:break-all;background:var(--well);border-radius:0 0 var(--r-2) var(--r-2)}

/* ---------- login */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--ground)}
.login{width:min(400px,100%)}
.login .sheet-body{padding:24px}
.login .brand{border:0;padding:0;height:auto;margin-bottom:20px}
.login h1{font-size:18px;margin-bottom:4px}
.login form{display:flex;flex-direction:column;gap:14px;margin-top:20px}
.login input{width:100%;height:38px}
.login .btn{height:38px}
.login .foot{display:flex;justify-content:space-between;padding:10px 24px;border-top:1px solid var(--rule);font-size:12.5px;color:var(--ink-3)}

/* ---------- responsive */
@media (max-width:1100px){
  .grid-2{grid-template-columns:minmax(0,1fr)}
  .detail-grid{grid-template-columns:1fr}
  .detail-grid>section+section{border-left:0;border-top:1px solid var(--rule)}
}
@media (max-width:860px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .rail{position:fixed;inset:0 auto 0 0;width:260px;z-index:40;transform:translateX(-100%);transition:transform var(--t) var(--ease);box-shadow:var(--shadow)}
  .rail.open{transform:none}
  .scrim{position:fixed;inset:0;background:rgba(5,7,10,.55);z-index:35}
  .menu-btn{display:inline-flex}
  .top{padding:0 12px;gap:8px}
  .search{display:none}
  .page{padding:16px}
  .ledger .cell.wide{grid-column:auto}
  .btn{height:38px}.btn.sm{height:34px}
  .t .ell{max-width:200px}
  .hide-sm{display:none!important}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:1ms!important;scroll-behavior:auto!important}
  .skel,.dot.run,.progress.indet>span,.btn .spin{animation:none!important}
  .progress.indet>span{opacity:.6}
  .stamp.press{animation:fade 160ms linear}
  dialog[open],.toast{animation:none}
}
@keyframes fade{from{opacity:.2}}
@media (forced-colors:active){.sevbar span,.wit i.y{background:CanvasText}.stamp{border-color:CanvasText}}


/* ---------- finish pass: one ruled sheet per region, robust rail */
.search input[type=search]{padding-left:32px;padding-right:30px}
#view:focus,#view:focus-visible{box-shadow:none;outline:none}
.shell{align-items:start}
.rail{height:100vh;height:100dvh;align-self:start}
.brand,.rail-foot{flex:none}
.nav{flex:1 1 auto;min-height:0}
.fields{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.steps .k{justify-content:space-between;gap:8px}
.steps .k .name{color:var(--ink);font-weight:600;font-size:13.5px}
.fixv{white-space:nowrap}
.crumbs .sep{color:var(--ink-4)}
.tw{position:relative}

/* hairline construction: regions are ruled bands of one sheet, not floating cards */
.stack>.sheet+.sheet,.sheet+.sheet{margin-top:0;border-top:0;border-radius:0}
.stack>.sheet:has(+.sheet),.sheet:has(+.sheet){border-bottom-left-radius:0;border-bottom-right-radius:0}
.stack>.sheet:last-child:not(:first-child),.sheet+.sheet:not(:has(+.sheet)){border-radius:0 0 var(--r-2) var(--r-2)}
.ledger+.grid-2,.ledger+.sheet{margin-top:0!important;border-top-left-radius:0;border-top-right-radius:0}
.ledger:has(+.grid-2),.ledger:has(+.sheet){border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:0}
.grid-2{gap:1px!important;background:var(--rule);border:1px solid var(--rule);border-radius:var(--r-2);overflow:hidden}
.grid-2>.stack>.sheet,.grid-2>.sheet{border:0;border-radius:0}
.grid-2>.stack{background:var(--sheet);min-width:0}
.grid-2>.stack>.sheet+.sheet{border-top:1px solid var(--rule)}
form.stack>.sheet+.sheet{border-top:1px solid var(--rule)}
form.stack>.sheet:not(:first-child){border-top:0}


@media (max-width:860px){
  .detail-grid{position:sticky;left:0;max-width:calc(100vw - 34px)}
  .tabs{flex-wrap:wrap;overflow:visible}
  .tabs a{height:36px;padding:0 10px}
  .steps .k{flex-direction:column;align-items:flex-start;gap:2px}
  .sevcell{min-width:0!important}
}

.show-sm{display:none}
@media (max-width:860px){.show-sm{display:block}}
@media (max-width:860px){.toolbar .seg{max-width:100%;overflow-x:auto}.toolbar .seg button{flex:none}.toolbar input[type=search]{width:100%}}
/* severity words keep AA contrast in light mode; marks keep the validated palette */
.sev.High,.sevtag.High{color:var(--st-high,var(--s-high))}
@media (max-width:860px){.btn{min-height:44px}.btn.sm{min-height:40px}.seg button{height:40px}.chip-toggle{height:36px}}
