/* Evidence exhibits — redacted screen captures. Every selector scoped under .ev */

.ev{ --ev-h:196px; --ev-blur:3.1px; }
.ev.is-compact{ --ev-h:168px; --ev-blur:2.8px; }

/* ---------- stage ---------- */
.ev-stage{ margin:0 0 12px }
.ev-page{ display:grid; gap:12px; grid-template-columns:repeat(var(--ev-cols,1),minmax(0,1fr)); }
.ev-page[hidden]{ display:none }
.ev.is-compact .ev-page{ grid-template-columns:minmax(0,1fr) }
@media (max-width:820px){ .ev-page{ grid-template-columns:repeat(auto-fit,minmax(220px,1fr)) } }

/* ---------- tile ---------- */
.ev-tile{
  display:block; width:100%; margin:0; padding:0; text-align:left; font:inherit; color:inherit;
  background:var(--bg-1); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--shadow-1); overflow:hidden; cursor:pointer; position:relative; -webkit-appearance:none;
  transition:transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
}
/* every layer inside the tile is part of the same control */
.ev-tile *{ cursor:inherit }
.ev-tile:hover, .ev-tile:focus-visible{
  transform:translateY(-2px); box-shadow:var(--shadow-2); border-color:var(--brand);
}
.ev-tile:focus-visible{ outline:2px solid var(--focus); outline-offset:2px }
.ev-tile:active{ transform:translateY(-1px) }
.ev-shot{ display:block; position:relative }

/* the enlarge cue — announces the tile before the pointer arrives */
.ev-zoom{
  position:absolute; left:8px; top:8px; z-index:5; display:inline-flex; align-items:center; gap:5px;
  padding:3px 9px 3px 7px; border-radius:999px; pointer-events:none;
  background:var(--brand); color:#fff; font-size:10.5px; font-weight:600; letter-spacing:.01em;
  box-shadow:0 1px 2px rgba(45,38,28,.18), 0 6px 16px rgba(1,58,244,.28);
  opacity:0; transform:translateY(-4px) scale(.96);
  transition:opacity .18s var(--ease), transform .18s var(--ease);
}
.ev-zoom svg{ flex:none }
.ev-tile:hover .ev-zoom, .ev-tile:focus-visible .ev-zoom{ opacity:1; transform:none }
@media (hover:none){ .ev-zoom{ opacity:1; transform:none } }

/* ---------- chrome strip ---------- */
.ev-chrome{
  display:flex; align-items:center; gap:8px; height:22px; padding:0 8px;
  background:linear-gradient(180deg,var(--bg-2),var(--bg-3));
  border-bottom:1px solid var(--line);
  opacity:.82; transition:opacity .22s var(--ease);
}
.ev-tile:hover .ev-chrome, .ev-tile:focus-visible .ev-chrome{ opacity:1 }
.ev-dots{ display:inline-flex; gap:4px; flex:none }
.ev-dots i{ width:6px; height:6px; border-radius:50%; background:var(--line-2) }
.ev-tile:hover .ev-dots i:nth-child(1){ background:rgba(198,41,63,.42) }
.ev-tile:hover .ev-dots i:nth-child(2){ background:rgba(184,86,24,.42) }
.ev-tile:hover .ev-dots i:nth-child(3){ background:rgba(16,121,106,.42) }
.ev-tab{
  width:64px; height:13px; flex:none; border-radius:4px 4px 0 0;
  background:var(--bg-1); border:1px solid var(--line); border-bottom:0; align-self:flex-end;
}
.ev-addr{
  flex:1; height:12px; min-width:0; border-radius:999px; background:var(--bg-1);
  border:1px solid var(--line); display:flex; align-items:center; gap:5px; padding:0 6px; overflow:hidden;
}
.ev-lock{ width:5px; height:5px; border-radius:1px; background:var(--ink-4); opacity:.5; flex:none }
.ev-crumb{ height:3px; border-radius:2px; background:var(--line-2); width:34px; flex:none }
.ev-crumb.w2{ width:20px } .ev-crumb.w3{ width:28px }
.ev-title-line{ flex:1; height:3px; max-width:120px; border-radius:2px; background:var(--line-2) }
.ev-win{ display:inline-flex; gap:5px; margin-left:auto; flex:none }
.ev-win i{ width:8px; height:2px; background:var(--line-2) }
.ev-win i:last-child{ height:8px; width:8px; border:1px solid var(--line-2); background:none }

/* ---------- the screen ---------- */
.ev-screen{ display:block; position:relative; height:var(--ev-h); background:var(--bg-1); overflow:hidden }
.ev-lay{ display:block; position:absolute; inset:0; filter:blur(var(--ev-blur)); }
.ev-b{
  position:absolute; display:block; border-radius:2px;
  background:#C5BEB2;                     /* redacted text mass */
}
.ev-b.soft{ background:#DAD3C8 }
.ev-b.strong{ background:#9E978C }
.ev-b.tint{ background:var(--bg-3); border-radius:0 }
.ev-b.band{ background:var(--bg-2); border-radius:0 }
.ev-b.band.strong{ background:#B9B2A6 }
.ev-b.invert{ background:rgba(255,255,255,.72) }
.ev-b.dot{ border-radius:50%; background:#C4BDB2 }
.ev-b.dot.small{ background:#B4ADA2 }
.ev-b.field{ background:var(--bg-2); border:1px solid #C9C2B6; border-radius:3px }
.ev-b.chip{ background:#D5CEC3; border-radius:999px }
.ev-b.chip.alt{ background:var(--brand-tint-2) }
.ev-b.alt{ background:rgba(198,41,63,.24) }
.ev-b.bubble{ background:#DFD8CC; border-radius:9px 9px 9px 2px }
.ev-b.bubble.right{ background:var(--brand-tint-2); border-radius:9px 9px 2px 9px }
.ev-b.wave{ background:#B6AFA4; border-radius:1px }
.ev-b.wave.alt{ background:rgba(1,58,244,.30) }

/* crisp structure that survives the blur */
.ev-net{ position:absolute; inset:0; display:block }
.ev-veil{
  position:absolute; inset:0; display:block;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(246,244,240,.14));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);
}

/* per-type separators, drawn unblurred over the content */
.ev-t-crm .ev-net{
  background:
    linear-gradient(var(--line),var(--line)) 0 15% / 100% 1px no-repeat,
    linear-gradient(var(--line),var(--line)) 52% 15% / 1px 85% no-repeat,
    linear-gradient(var(--line),var(--line)) 0 84% / 100% 1px no-repeat;
}
.ev-t-queue .ev-net{
  background:
    linear-gradient(var(--line),var(--line)) 0 10% / 100% 1px no-repeat,
    repeating-linear-gradient(180deg,transparent 0 calc(var(--ev-h)*.106 - 1px),var(--line) calc(var(--ev-h)*.106 - 1px) calc(var(--ev-h)*.106)) 0 calc(var(--ev-h)*.185) / 100% 82% no-repeat,
    linear-gradient(var(--line-2),var(--line-2)) 68% 12% / 1px 88% no-repeat;
}
.ev-t-portal .ev-net{
  background:
    linear-gradient(var(--line-2),var(--line-2)) 0 17% / 100% 1px no-repeat,
    linear-gradient(var(--line),var(--line)) 0 24% / 100% 1px no-repeat,
    linear-gradient(var(--line),var(--line)) 33.5% 24% / 1px 76% no-repeat,
    linear-gradient(var(--line),var(--line)) 66% 24% / 1px 76% no-repeat;
}
.ev-t-chat .ev-net{
  background:
    linear-gradient(var(--line),var(--line)) 0 11% / 100% 1px no-repeat,
    linear-gradient(var(--line),var(--line)) 0 88% / 100% 1px no-repeat;
}
.ev-t-ai-panel .ev-net{
  background:
    linear-gradient(var(--line),var(--line)) 0 9% / 100% 1px no-repeat,
    linear-gradient(var(--line),var(--line)) 0 30.5% / 100% 1px no-repeat,
    linear-gradient(var(--line),var(--line)) 0 81% / 100% 1px no-repeat;
}
.ev-t-spreadsheet .ev-net{
  background:
    repeating-linear-gradient(90deg,transparent 0 calc(12.2% - 1px),var(--line) calc(12.2% - 1px) 12.2%),
    repeating-linear-gradient(180deg,transparent 0 calc(var(--ev-h)*.11 - 1px),var(--line) calc(var(--ev-h)*.11 - 1px) calc(var(--ev-h)*.11)) 0 calc(var(--ev-h)*.10) / 100% 90% no-repeat,
    linear-gradient(var(--line-2),var(--line-2)) 0 10% / 100% 1px no-repeat,
    linear-gradient(var(--line-2),var(--line-2)) 0 17% / 100% 1px no-repeat,
    linear-gradient(var(--line-2),var(--line-2)) 12.2% 10% / 1px 90% no-repeat;
}
.ev-t-form .ev-net{
  background:linear-gradient(var(--line),var(--line)) 0 12% / 100% 1px no-repeat,
             linear-gradient(var(--line),var(--line)) 0 85% / 100% 1px no-repeat;
}
.ev-t-ticket .ev-net{
  background:
    linear-gradient(var(--line),var(--line)) 0 22% / 100% 1px no-repeat,
    linear-gradient(var(--line),var(--line)) 6.8% 26% / 1px 74% no-repeat,
    repeating-linear-gradient(180deg,transparent 0 calc(var(--ev-h)*.24 - 1px),var(--line) calc(var(--ev-h)*.24 - 1px) calc(var(--ev-h)*.24)) 0 calc(var(--ev-h)*.255) / 100% 74% no-repeat;
}
.ev-t-call .ev-net{
  background:
    linear-gradient(var(--line),var(--line)) 0 10% / 100% 1px no-repeat,
    linear-gradient(var(--line-2),var(--line-2)) 0 40% / 64% 1px no-repeat,
    linear-gradient(var(--line),var(--line)) 0 70% / 64% 1px no-repeat,
    linear-gradient(var(--line),var(--line)) 66% 10% / 1px 90% no-repeat;
}

/* ---------- redacted pill ---------- */
.ev-redacted{
  position:absolute; right:8px; top:8px; z-index:3;
  font-family:var(--mono); font-size:9px; letter-spacing:.06em; color:var(--ink-3);
  background:var(--bg-1); border:1px solid var(--line-2); border-radius:999px;
  padding:2px 7px 2px 16px; box-shadow:var(--shadow-1);
}
.ev-redacted::before{
  content:""; position:absolute; left:6px; top:50%; width:6px; height:6px; margin-top:-3px;
  border-radius:1px; background:var(--ink-4); opacity:.55;
}

/* ---------- callouts ---------- */
.ev-co{
  position:absolute; z-index:4; display:flex; align-items:center; gap:6px;
  transform:translate(-9px,-9px); width:max-content; max-width:78%;
}
.ev-co.is-left{ flex-direction:row-reverse; transform:translate(calc(-100% + 9px),-9px) }
.ev-co-n{
  flex:none; width:18px; height:18px; border-radius:50%;
  background:var(--ink); color:var(--bg-1);
  font-family:var(--mono); font-size:10px; line-height:18px; text-align:center; font-weight:600;
  box-shadow:0 0 0 3px rgba(255,255,255,.9), var(--shadow-1);
}
.ev-co-label{
  background:var(--bg-1); border:1px solid var(--line-2); border-radius:var(--r-s);
  box-shadow:var(--shadow-1); color:var(--ink); font-size:10.5px; line-height:1.3;
  padding:4px 7px; max-width:200px; min-width:0;
}
.ev.is-compact .ev-co-label{ max-width:170px; font-size:10px }

/* ---------- caption ---------- */
.ev-cap{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 10px;
  padding:8px 10px 9px; border-top:1px solid var(--line); background:var(--bg-2);
}
.ev-cap-1{ font-size:11.5px; font-weight:600; color:var(--ink); letter-spacing:-.005em }
.ev-cap-2{ font-size:10px; color:var(--ink-3); font-variant-numeric:tabular-nums }
.ev .ev-sep{ color:var(--ink-4); margin:0 6px; opacity:.8 }

/* ---------- stepper ---------- */
.ev-step{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 14px }
.ev-step-flat{ margin-top:-2px }
.ev-step-flat .ev-count{ margin-left:0 }
.ev-nav{
  display:inline-flex; align-items:center; gap:5px; padding:4px 9px;
  border:1px solid var(--line-2); border-radius:999px; background:var(--bg-1);
  font-size:11.5px; color:var(--ink-2); box-shadow:var(--shadow-1);
  transition:background .16s var(--ease), color .16s var(--ease), border-color .16s var(--ease);
}
.ev-nav:hover:not(.is-off){ background:var(--bg-3); color:var(--ink); border-color:var(--brand) }
.ev-nav.is-off{ opacity:.42; box-shadow:none }
.ev-nav.is-bump, .ev-dotbtn.is-bump{ animation:ev-bump .4s var(--ease) }
@keyframes ev-bump{
  0%,100%{ transform:translateX(0) } 22%{ transform:translateX(-3px) }
  55%{ transform:translateX(2px) } 80%{ transform:translateX(-1px) }
}
.ev-dotbtn.is-on.is-bump{ animation:ev-bump-dot .4s var(--ease) }
@keyframes ev-bump-dot{ 0%,100%{ transform:scale(1.15) } 45%{ transform:scale(1.5) } }
.ev-dotsnav{ display:inline-flex; gap:5px; align-items:center }
.ev-dotbtn{
  width:7px; height:7px; padding:0; border-radius:50%; background:var(--line-2);
  transition:background .16s var(--ease), transform .16s var(--ease);
}
.ev-dotbtn:hover{ background:var(--ink-4) }
.ev-dotbtn.is-on{ background:var(--ink); transform:scale(1.15) }
.ev-count{ margin-left:auto; font-size:10.5px; color:var(--ink-3); white-space:nowrap }

/* ---------- finding, aggregate, link ---------- */
.ev-finding{
  margin:0 0 6px; font-size:13.5px; line-height:1.5; color:var(--ink); max-width:64ch;
}
.ev.is-compact .ev-finding{ font-size:12.5px }
.ev-agg{ margin:0 0 10px; font-size:10.5px; color:var(--ink-3); font-variant-numeric:tabular-nums }
.ev-link{
  display:inline-flex; align-items:center; gap:5px; font-size:11.5px; color:var(--ink-2);
  border-bottom:1px solid var(--line-2); padding-bottom:1px;
  transition:color .16s var(--ease), border-color .16s var(--ease);
}
.ev-link:hover{ color:var(--ink); border-color:var(--ink-3) }
.ev-ext{ opacity:.7; flex:none }

/* ================= enlarged capture — modal dialog =================
   Sits above the drilldown overlay (61), the popovers (90) and the chart
   tooltips (9999) so an exhibit opened from inside a drilldown is reachable. */
html.evlb-open{ overflow:hidden }

.evlb{ position:fixed; inset:0; z-index:12000; display:none }
.evlb.is-on{ display:block }
.evlb-scrim{
  position:absolute; inset:0; background:rgba(9,10,14,.56); backdrop-filter:blur(3px);
  animation:evlb-in .18s var(--ease);
}
.evlb-panel{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(1060px,94vw); max-height:92vh; display:flex; flex-direction:column; overflow:hidden;
  background:var(--bg-1); border:1px solid var(--line-2); border-radius:var(--r);
  box-shadow:var(--shadow-2); outline:none;
  --ev-h:min(56vh,540px); --ev-blur:6.4px;
  animation:evlb-rise .2s var(--ease);
}
@keyframes evlb-in{ from{ opacity:0 } to{ opacity:1 } }
@keyframes evlb-rise{ from{ opacity:0; transform:translate(-50%,calc(-50% + 8px)) } to{ opacity:1; transform:translate(-50%,-50%) } }

.evlb-head{
  display:flex; align-items:center; gap:12px; flex:none;
  padding:13px 14px 12px 18px; border-bottom:1px solid var(--line); background:var(--bg-2);
}
.evlb-id{ min-width:0; flex:1 }
.evlb-title{
  margin:0; font-size:14.5px; font-weight:650; color:var(--ink); letter-spacing:-.01em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.evlb-tsep{ color:var(--ink-4); margin:0 7px; font-weight:400 }
.evlb-meta{ margin:2px 0 0; font-size:10.5px; color:var(--ink-3) }
.evlb-pill{
  position:relative; flex:none; font-family:var(--mono); font-size:9px; letter-spacing:.06em;
  color:var(--ink-3); background:var(--bg-1); border:1px solid var(--line-2); border-radius:999px;
  padding:3px 8px 3px 17px;
}
.evlb-pill::before{
  content:""; position:absolute; left:7px; top:50%; width:6px; height:6px; margin-top:-3px;
  border-radius:1px; background:var(--ink-4); opacity:.55;
}
.evlb-x{
  flex:none; display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px;
  border:1px solid var(--line-2); border-radius:var(--r-s); background:var(--bg-1); color:var(--ink-2);
  transition:background .16s var(--ease), color .16s var(--ease), border-color .16s var(--ease);
}
.evlb-x:hover{ background:var(--bg-3); color:var(--ink); border-color:var(--brand) }

.evlb-body{
  flex:1; min-height:0; overflow:auto; padding:16px 18px;
  background:linear-gradient(180deg,var(--bg-3),var(--bg-2));
}
.evlb-body .ev-shot{
  background:var(--bg-1); border:1px solid var(--line-2); border-radius:var(--r-s);
  overflow:hidden; box-shadow:var(--shadow-1);
}
.evlb-body .ev-chrome{ height:30px; padding:0 11px; opacity:1 }
.evlb-body .ev-dots i{ width:8px; height:8px }
.evlb-body .ev-tab{ width:104px; height:19px }
.evlb-body .ev-addr{ height:17px }
.evlb-body .ev-crumb{ height:4px; width:52px }
.evlb-body .ev-crumb.w2{ width:30px } .evlb-body .ev-crumb.w3{ width:42px }
/* the head already carries the redaction pill — one is enough at this size */
.evlb-body .ev-redacted{ display:none }
.evlb-body .ev-co-n{ width:24px; height:24px; font-size:12px; line-height:24px }
.evlb-body .ev-co{ transform:translate(-12px,-12px) }
.evlb-body .ev-co.is-left{ transform:translate(calc(-100% + 12px),-12px) }
.evlb-body .ev-co-label{ font-size:12px; max-width:300px; padding:6px 10px }

.evlb-foot{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px; flex:none;
  padding:11px 18px 12px; border-top:1px solid var(--line); background:var(--bg-2);
}
.evlb-nav{
  display:inline-flex; align-items:center; gap:6px; padding:5px 11px;
  border:1px solid var(--line-2); border-radius:999px; background:var(--bg-1);
  font-size:11.5px; color:var(--ink-2); box-shadow:var(--shadow-1);
  transition:background .16s var(--ease), color .16s var(--ease), border-color .16s var(--ease);
}
.evlb-nav:hover:not(.is-off){ background:var(--bg-3); color:var(--ink); border-color:var(--brand) }
.evlb-nav.is-off{ opacity:.42; box-shadow:none }
.evlb-nav.is-bump{ animation:ev-bump .4s var(--ease) }
.evlb-count{ font-size:11px; color:var(--ink-3); white-space:nowrap; font-variant-numeric:tabular-nums }
.evlb-link{
  margin-left:auto; display:inline-flex; align-items:center; gap:6px; padding:6px 14px;
  border-radius:var(--r-s); font-size:12px; font-weight:600; color:#fff;
  background:var(--brand); box-shadow:var(--shadow-1);
  transition:background .16s var(--ease);
}
.evlb-link:hover{ background:var(--brand-deep) }
.evlb-link:focus-visible{ outline:2px solid var(--brand-dark); outline-offset:2px }
.evlb-link.is-off{ background:var(--bg-3); color:var(--ink-3); box-shadow:none; cursor:default }
.evlb-link .ev-ext{ opacity:.85 }

@media (max-width:720px){
  .evlb-panel{ width:96vw; --ev-h:min(46vh,380px) }
  .evlb-head{ padding-left:14px }
  .evlb-link{ margin-left:0; width:100% ; justify-content:center }
}
