:root{--bg:#f6f8fa;--card:#ffffff;--head:#0c365d;--ink:#22313f;--line:#d5dee8;--muted:#566677;--soft:#eef2f6;--side:#ffffff;
--pass:#0d6b66;--fail:#b42318;--attn:#9a5b00;--attn-fill:#e3b341;--accent:#1b65fb;--mock:#64748b;
--pass-bg:#e2f1ef;--fail-bg:#fcebe9;--attn-bg:#fbf0d4;--mock-bg:#eceff3;--info:#e6eeff;--mark:#fbd0c9;
--navy:#0c365d;--teal:#0d6b66;--blue:#1b65fb;--lblue:#7aa5ff;--amber:#e3b341;--brand:#0d6b66;
--danger:#b42318;--danger-bg:#fcebe9;--warn:#9a5b00;--warn-bg:#fbf0d4;--warn-line:#e3b341;--gray:#64748b;--gray-bg:#eceff3;
--info-fg:#1b65fb;--info-bg:#e6eeff;--shadow:none;color-scheme:light}
:root[data-theme=dark]{--bg:#0b1724;--card:#102133;--head:#e6edf5;--ink:#c9d4e0;--line:#22364a;--muted:#9babbd;--soft:#162a40;--side:#0e1c2c;
--pass:#3fb8af;--fail:#f97066;--attn:#f5b942;--attn-fill:#f5b942;--accent:#7aa5ff;--mock:#8a9bb0;
--pass-bg:#123631;--fail-bg:#3a1d22;--attn-bg:#3a2d10;--mock-bg:#1b2d42;--info:#15284a;--mark:#6b2b33;
--navy:#e6edf5;--teal:#3fb8af;--blue:#7aa5ff;--lblue:#7aa5ff;--amber:#f5b942;--brand:#3fb8af;
--danger:#f97066;--danger-bg:#3a1d22;--warn:#f5b942;--warn-bg:#3a2d10;--warn-line:#8f6d17;--gray:#8a9bb0;--gray-bg:#1b2d42;
--info-fg:#7aa5ff;--info-bg:#15284a;--shadow:none;color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0b1724;--card:#102133;--head:#e6edf5;--ink:#c9d4e0;--line:#22364a;--muted:#9babbd;--soft:#162a40;--side:#0e1c2c;
--pass:#3fb8af;--fail:#f97066;--attn:#f5b942;--attn-fill:#f5b942;--accent:#7aa5ff;--mock:#8a9bb0;
--pass-bg:#123631;--fail-bg:#3a1d22;--attn-bg:#3a2d10;--mock-bg:#1b2d42;--info:#15284a;--mark:#6b2b33;
--navy:#e6edf5;--teal:#3fb8af;--blue:#7aa5ff;--lblue:#7aa5ff;--amber:#f5b942;--brand:#3fb8af;
--danger:#f97066;--danger-bg:#3a1d22;--warn:#f5b942;--warn-bg:#3a2d10;--warn-line:#8f6d17;--gray:#8a9bb0;--gray-bg:#1b2d42;
--info-fg:#7aa5ff;--info-bg:#15284a;--shadow:none;color-scheme:dark}}
/* Gasket release proof. Colour tokens (light + dark) come from THEME_CSS in gasket/brand.py.
   Solid means a real event; dashed means recorded-only, mock or pending. The same rule is used in the rail, the timelines, the ledger and every status. */
@font-face{font-family:"Public Sans";font-weight:400;font-display:swap;src:url(fonts/public-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Public Sans";font-weight:600;font-display:swap;src:url(fonts/public-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-display:swap;src:url(fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}
:root{--sans:"Public Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--r:8px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 14px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
h1,h2,h3{color:var(--head);font-weight:600;margin:0;letter-spacing:-.005em}
h1{font-size:28px;line-height:1.2}h2{font-size:20px;line-height:1.3;margin-bottom:6px}h3{font-size:16px;line-height:1.4;margin:18px 0 6px}
p{margin:0 0 10px}
a{color:var(--accent);text-underline-offset:2px}
.mono,code{font:400 13px/1.5 var(--mono);overflow-wrap:anywhere}
.muted,.sub{color:var(--muted)}.sub{font-size:13px}
b,strong{font-weight:600}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--card);color:var(--accent);padding:8px 12px;border:1px solid var(--accent);border-radius:6px;z-index:50}
.skip:focus{left:12px}
a.ext::after{content:"";display:inline-block;width:.75em;height:.75em;margin-left:.3em;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M4 1.5h6.5V8M10.5 1.5L2 10' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M4 1.5h6.5V8M10.5 1.5L2 10' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") center/contain no-repeat}

/* header */
.top{position:sticky;top:0;z-index:20;display:flex;gap:16px;align-items:center;padding:0 24px;min-height:56px;background:var(--card);border-bottom:1px solid var(--line)}
.logo{width:30px;height:30px;border-radius:6px;background:#fff;border:1px solid var(--line);padding:2px;flex:none}
.brand{font-weight:600;color:var(--head);font-size:16px}
.crumb{color:var(--muted);font-size:14px;overflow-wrap:anywhere}.crumb b{color:var(--ink)}
.sp{flex:1}
details.snap{position:relative;font-size:13px;color:var(--muted)}
details.snap>summary{cursor:pointer;list-style:none;padding:6px 4px}details.snap>summary::-webkit-details-marker{display:none}
details.snap>summary::after{content:" (details)";text-decoration:underline}
details.snap .pop{position:absolute;right:0;top:100%;width:min(420px,86vw);background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;z-index:30;color:var(--ink)}
.iconbtn{background:transparent;border:1px solid var(--line);color:var(--ink);border-radius:6px;min-width:36px;height:36px;cursor:pointer;font:inherit}
#nav-toggle{display:none}

/* shell */
.shell{display:grid;grid-template-columns:224px minmax(0,1fr);align-items:start}
#side{position:sticky;top:56px;height:calc(100vh - 56px);overflow:auto;padding:16px 12px;border-right:1px solid var(--line);background:var(--side)}
#side nav{display:flex;flex-direction:column;gap:2px}
.nav{display:block;padding:8px 12px;border-radius:6px;color:var(--ink);text-decoration:none;font-weight:400}
.nav:hover{background:var(--soft)}
.nav.active{background:var(--soft);color:var(--head);font-weight:600;box-shadow:inset 3px 0 0 var(--accent)}
.sidehead{margin:20px 12px 6px;font-size:13px;color:var(--muted);font-weight:600}
.sidenote{margin:16px 12px;font-size:13px;color:var(--muted)}
#app{padding:28px 32px 56px;max-width:1240px;min-width:0}
.pagehead{margin-bottom:22px}.pagehead p{margin:6px 0 0;max-width:70ch}
section.block{margin-top:30px}

/* status: solid marker = real event, dashed ring = recorded only, mock or pending */
.st{display:inline-flex;align-items:center;gap:7px;font-weight:600;white-space:nowrap}
.st i{width:10px;height:10px;border-radius:50%;flex:none;background:currentColor}
.st.pass{color:var(--pass)}.st.fail{color:var(--fail)}.st.attn{color:var(--attn)}
.st.mock,.st.pending{color:var(--muted)}
.st.mock i,.st.pending i{background:transparent;border:1.5px dashed var(--mock)}
.st.attn i{background:var(--attn-fill)}
.st.plain{font-weight:400}

/* panels, key/value lists, tables */
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.panel+.panel{margin-top:16px}
.panel>h2:first-child,.panel>h3:first-child{margin-top:0}
dl.kv{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:8px 24px;margin:0}
dl.kv dt{color:var(--muted)}dl.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.tablewrap{overflow-x:auto}
table.t{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
table.t th{background:var(--soft);color:var(--muted);font-weight:600;font-size:13px;text-align:left;padding:8px 12px;border-bottom:1px solid var(--line)}
table.t td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
table.t tr.row:hover td{background:var(--soft)}
table.t td.num{text-align:right}
.reason{font:500 12.5px/1.4 var(--mono);color:var(--fail)}
.copy{border:1px solid var(--line);background:var(--card);color:var(--accent);border-radius:6px;padding:2px 8px;font:600 12px var(--sans);cursor:pointer;margin-left:8px}
.copy:hover{border-color:var(--accent)}
.btn{display:inline-block;border:1px solid var(--accent);color:var(--accent);background:transparent;border-radius:6px;padding:7px 14px;font:600 14px var(--sans);text-decoration:none;cursor:pointer}
.btn:hover{background:var(--card);box-shadow:inset 0 0 0 1px var(--accent)}
.btn.primary{background:var(--accent);color:var(--card);border-color:var(--accent)}
.empty{border:1px dashed var(--mock);border-radius:var(--r);padding:16px 18px;color:var(--muted)}
.empty b{color:var(--ink)}
.attn-list{list-style:none;margin:0;padding:0}
.attn-list li{padding:12px 0;border-bottom:1px solid var(--line)}.attn-list li:last-child{border-bottom:0}
.attn-list .st{margin-bottom:2px}

/* gate rail */
ol.rail{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--cols,7),minmax(0,1fr));gap:0}
ol.rail li{position:relative;padding-top:30px;padding-right:10px;font-size:13px}
ol.rail li::before{content:"";position:absolute;top:8px;left:0;right:0;border-top:2px solid var(--pass)}
ol.rail li.mock::before,ol.rail li.pending::before{border-top:2px dashed var(--mock)}
ol.rail li.fail::before{border-top:2px solid var(--fail)}
ol.rail li.attn::before{border-top:2px solid var(--attn)}
ol.rail li.attn .dot{background:var(--attn-fill);border-color:var(--attn)}
ol.rail li:first-child::before{left:9px}ol.rail li:last-child::before{right:calc(100% - 9px)}
ol.rail li .dot{position:absolute;top:0;left:0;width:18px;height:18px;border-radius:50%;background:var(--pass);border:2px solid var(--card)}
ol.rail li.fail .dot{background:var(--fail)}
ol.rail li.mock .dot,ol.rail li.pending .dot{background:var(--card);border:2px dashed var(--mock)}
ol.rail li b{display:block;color:var(--head)}ol.rail li span{color:var(--muted)}

/* THE SEAL */
.seal{margin-top:6px}
.seal .row{display:grid;grid-template-columns:minmax(150px,200px) minmax(0,1fr) auto;gap:6px 16px;align-items:center}
.seal .lbl{color:var(--muted)}
.hash{font:500 15px/1.9 var(--mono);color:var(--head);display:flex;flex-wrap:wrap;gap:0 .75ch}
.hash .g{display:inline-block;width:4ch}
.hash .d{background:var(--mark);color:var(--fail);text-decoration:underline;text-decoration-style:wavy;text-underline-offset:3px}
.sealline{grid-column:2;display:flex;align-items:center;height:14px;gap:0}
.sealline .bar{display:block;height:3px;flex:1;background:var(--pass);border-radius:2px;transform-origin:left center}
.sealline.broken .bar{background:var(--fail)}.sealline.broken .bar.a{flex:0 0 42%}.sealline.broken .bar.b{flex:0 0 42%}
.sealline .cut{font:600 13px var(--sans);color:var(--fail);flex:1;text-align:center;font-style:normal}
.sealline.draw .bar{transform:scaleX(0);animation:seal 1.1s ease-out .15s forwards}
@keyframes seal{to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.sealline.draw .bar{animation:none;transform:none}}
.seal .verdict{grid-column:2;margin:2px 0 4px;font-weight:600}.seal .verdict.ok{color:var(--pass)}.seal .verdict.bad{color:var(--fail)}

/* metric vs limit */
.meter{margin:14px 0}.meter .top2{display:flex;justify-content:space-between;gap:12px;margin-bottom:4px}
.track{position:relative;height:10px;background:var(--soft);border-radius:5px;border:1px solid var(--line)}
.track i{position:absolute;left:0;top:0;bottom:0;border-radius:5px 0 0 5px;background:var(--pass)}
.track.over i{background:var(--fail)}
.track em{position:absolute;top:-5px;bottom:-5px;width:2px;background:var(--head)}
.meter .cap{font-size:13px;color:var(--muted);margin-top:4px}

/* tabs */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:22px 0 18px;overflow-x:auto}
.tabs a{padding:9px 14px;color:var(--muted);text-decoration:none;font-weight:600;border-bottom:3px solid transparent;white-space:nowrap}
.tabs a:hover{color:var(--ink)}
.tabs a[aria-selected=true]{color:var(--head);border-bottom-color:var(--accent)}

/* filters, grouping */
.filters{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:flex-end;margin:0 0 18px}
.filters label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
.filters select,.filters input{font:400 14px var(--sans);color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:6px;padding:7px 10px;min-height:36px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.seg a{padding:7px 14px;text-decoration:none;color:var(--accent);font-weight:600;background:var(--card)}
.seg a[aria-pressed=true]{background:var(--accent);color:var(--card)}
details.mrg{border:1px solid var(--line);border-radius:var(--r);background:var(--card);margin-bottom:10px}
details.mrg>summary{list-style:none;cursor:pointer;padding:12px 16px;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1.4fr);gap:6px 20px;align-items:start}
details.mrg>summary::-webkit-details-marker{display:none}
details.mrg>summary::before{content:"";position:absolute}
details.mrg[open]>summary{border-bottom:1px solid var(--line)}
details.mrg .body{padding:4px 16px 12px}
.mrtitle{font-weight:600;color:var(--head)}
.more{margin-top:14px}.more>summary{cursor:pointer;font-weight:600;color:var(--head);padding:6px 0}

/* chain of custody: lanes, solid = happened, dashed = recorded only or pending */
.lanes{display:grid;gap:10px}
.lane{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:start}
.lane>.ln{font-weight:600;color:var(--head);padding-top:10px}
.lane .evs{display:grid;grid-template-columns:repeat(var(--n,1),minmax(0,1fr));gap:8px}
.ev{border:2px solid var(--pass);border-radius:var(--r);padding:7px 8px;background:var(--card);font-size:13px;min-height:58px;overflow-wrap:anywhere;min-width:0}
.ev.fail{border-color:var(--fail)}
.ev.attn{border-color:var(--attn)}
ul.plain{margin:0;padding-left:18px}
.ev.mock,.ev.pending{border:2px dashed var(--mock)}
.ev b{display:block;color:var(--head)}.ev .sub{display:block}
.ev.none{border:0;background:transparent;min-height:0;padding:0}
.legend{display:flex;gap:18px;font-size:13px;color:var(--muted);margin-bottom:10px;flex-wrap:wrap}
.legend i{display:inline-block;width:22px;height:0;border-top:2px solid var(--pass);vertical-align:middle;margin-right:6px}
.legend i.d{border-top:2px dashed var(--mock)}

.attest{display:none}
footer{margin-top:40px;padding-top:14px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}

/* narrow screens: nothing scrolls sideways, tables become stacked rows */
@media (max-width:900px){
  .shell{grid-template-columns:minmax(0,1fr)}
  #side{display:none;position:static;height:auto;border-right:0;border-bottom:1px solid var(--line)}
  body.nav-open #side{display:block}
  #nav-toggle{display:inline-block}
  #app{padding:20px 16px 40px}
  .cols{grid-template-columns:minmax(0,1fr)}
  ol.rail{grid-template-columns:minmax(0,1fr);gap:14px}
  ol.rail li{padding:0 0 0 30px;min-height:24px}
  ol.rail li::before{top:18px;bottom:-14px;left:8px;right:auto;border-top:0!important;border-left:2px solid var(--pass)}
  ol.rail li.mock::before,ol.rail li.pending::before{border-left:2px dashed var(--mock)}
  ol.rail li:last-child::before{display:none}
  .seal .row{grid-template-columns:minmax(0,1fr)}.sealline{grid-column:1}.seal .verdict{grid-column:1}
  details.mrg>summary{grid-template-columns:minmax(0,1fr)}
  .lane{grid-template-columns:minmax(0,1fr)}.lane .evs{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  table.t.stack thead{display:none}
  table.t.stack,table.t.stack tbody,table.t.stack tr,table.t.stack td{display:block;width:100%}
  table.t.stack tr{border:1px solid var(--line);border-radius:var(--r);margin-bottom:10px;background:var(--card);padding:6px 4px}
  table.t.stack td{border:0;padding:5px 12px;display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px}
  table.t.stack td::before{content:attr(data-label);color:var(--muted);font-size:13px}
  table.t.stack tr.row:hover td{background:transparent}
  dl.kv{grid-template-columns:minmax(0,1fr);gap:2px}dl.kv dt{margin-top:8px}
  .top{padding:0 12px;gap:8px}.crumb{display:none}
}

/* printing a case file gives one clean page: the release attestation */
@media print{
  :root,:root[data-theme=dark]{--bg:#fff;--card:#fff;--ink:#111;--head:#000;--muted:#333;--line:#999;--pass:#0d6b66;--fail:#b42318;--accent:#000}
  .top,#side,.tabs,.skip,footer,.filters,.noprint,.panel,.pagehead,.other-runs,.tabpanel,.case-head{display:none!important}
  .shell{display:block}#app{padding:0;max-width:none}
  .attest{display:block!important;font-size:12px}
  .attest h1{font-size:20px}.attest .hash{font-size:11px}
  a{color:#000;text-decoration:none}
  .sealline.draw .bar{animation:none;transform:none}
}
td.nowrap{white-space:nowrap}
table.t td:nth-child(2){min-width:220px}
.cols>.panel{margin-top:0}
table.t td:nth-child(2){min-width:0;max-width:300px}
table.t.ledger td:nth-child(2) span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
table.t.ledger td:nth-child(3){max-width:200px}
.filters select,.filters input{max-width:100%;min-width:0}
.filters label{min-width:0}
@media (max-width:640px){
  .filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.filters label{min-width:0}
  .filters label:first-child{grid-column:1/-1}
  table.t.stack td{max-width:none!important}
  .top{flex-wrap:wrap;padding:8px 12px}
  details.snap>summary::after{content:""}
}

/* review fixes */
.lead .st{margin-right:10px}
.st.neutral{color:var(--muted)}
.other-runs li .st{margin:0 8px}
.reason{overflow-wrap:anywhere}
table.t.ledger th,table.t.ledger td{padding:10px 8px}
table.t.ledger td:nth-child(2){max-width:200px}
.lane{grid-template-columns:minmax(0,1fr);gap:4px}
.lane>.ln{padding-top:0}
.ev{font-size:12.5px;padding:6px}
@media (max-width:900px){.ev.none{display:none}}
@media (max-width:640px){.tabs{flex-wrap:wrap;overflow-x:visible}}

.exports{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:4px 0 12px}
.exports .btn{padding:5px 12px;font-size:13px}
.exports .sub{margin-right:4px}

/* about */
ol.flow{list-style:none;margin:0;padding:0;display:grid;gap:0}
ol.flow>li{position:relative;padding-left:22px;padding-bottom:10px;border-left:2px solid var(--line);margin-left:6px}
ol.flow>li::before{content:"";position:absolute;left:-7px;top:12px;width:12px;height:12px;border-radius:50%;background:var(--card);border:2px solid var(--accent)}
ol.flow>li:last-child{border-left-color:transparent}
.flowbox{padding:8px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.flowbox.decision{border-style:dashed}
.flowbox ul{margin:4px 0 0}
details.claims{padding:12px 16px}details.claims>summary{cursor:pointer}
details.claims[open]>summary{margin-bottom:10px}
.aboutlogo{display:block;margin:0 0 16px;border-radius:var(--r);background:#fff;padding:6px;border:1px solid var(--line);max-width:160px;height:auto}
.facts{display:grid;gap:2px}