/* Bloodhail: layout and components, shared by every skin. Skin values live in css/themes.css. */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --accent:   #8fcbe6;   /* Hail */
  --accent2:  #5898b8;
  --accent3:  #3878a0;
  --accentlo: rgba(120,184,212,0.12);
  --pale:     #ccdce8;
  /* the palette and the severity scale live in css/tokens.css */
  --red:      var(--sev-critical);
  --orange:   var(--sev-high);
  --amber:    var(--sev-medium);
  --teal:     var(--sev-low);
  --dim:      rgba(170,205,225,0.35);
  --dim2:     rgba(220,225,230,0.55);
  --text:     #a9c2d2;
  --text2:    #8aa3b5;
  --r3:       0;
  /* panels: the access screen's card is the one surface for cards, lists and menus */
  --panel-r:     0;
  --panel-bg:    rgba(11,15,20,0.95);   /* data sits on an opaque panel: the photo never changes its contrast */
  --panel-line:  rgba(255,255,255,0.12);
  --panel-sep:   rgba(255,255,255,0.07);
  --panel-hair:  rgba(255,255,255,0.28);
  --panel-hl:    inset 0 1px 0 rgba(255,255,255,0.06);
  --panel-depth: 0 26px 70px rgba(0,0,0,0.42), 0 8px 22px rgba(0,0,0,0.28);
  --panel-lift:  0 44px 110px rgba(0,0,0,0.5), 0 12px 30px rgba(0,0,0,0.34);
  --header-h: 38px;
  --gls-blur:   blur(22px) saturate(1.5) brightness(0.88);
  --gls-shadow: 0 8px 32px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.1);
  /* skin values (Aurora by default; css/themes.css overrides them per theme) */
  --bg-image:      url("/bg_wolves_aur.jpg");
  --bg-pos:        center 50%;
  --search-bg:     rgba(38,54,68,0.48);
  --search-border: rgba(255,255,255,0.27);
  --search-focus:  rgba(120,184,212,0.35);
  --card-bg:       rgba(30,33,38,0.64);
  --card-border:   rgba(255,255,255,0.17);
  --title-shadow:  0 0 6px rgba(0,0,0,0.9), 0 0 16px rgba(0,0,0,0.6);
  --sub-shadow:    0 0 5px rgba(0,0,0,0.85), 0 0 12px rgba(0,0,0,0.55);
}

html { height: 100%; }
body { height: 100%; overflow: hidden; }
body.searched { overflow: hidden; }
body.searched #app-header { opacity: 1; pointer-events: all; transform: translateY(0); }
body.searched #app-main { padding-top: calc(var(--tabs-h) + var(--header-h)); }
body {
  font-family: var(--sans); color: var(--text); line-height: 1.5;
  min-height: 100vh; overflow-x: hidden;
  background: var(--bg-image) var(--bg-pos) / cover no-repeat fixed;
}
body::before {
  content: ''; position: fixed; inset: 0;
  background: rgba(10,12,15,0.2);
  pointer-events: none; z-index: 0;
}
body::after {
  content: ''; position: fixed; inset: 0;
  background: radial-gradient(ellipse 120% 115% at 50% 45%, transparent 30%, rgba(4,5,7,0.5) 100%);
  pointer-events: none; z-index: 0;
}
/* the home page: a band of Night behind the name and the search, so the photo never competes with them */
body:not(.searched)::after {
  background: linear-gradient(180deg, rgba(10,14,19,0.06) 0%, rgba(10,14,19,0.38) 16%, rgba(10,14,19,0.42) 34%, rgba(10,14,19,0.08) 58%, rgba(10,14,19,0.42) 100%),
              radial-gradient(ellipse 120% 115% at 50% 45%, transparent 30%, rgba(4,5,7,0.5) 100%);
}
body.searched {
  backdrop-filter: blur(2.5px) brightness(0.94);
  -webkit-backdrop-filter: blur(2.5px) brightness(0.94);
}

/* Header */
#app-header {
  position: fixed; top: 0; left: 0; right: 0; height: var(--header-h);
  opacity: 0; pointer-events: none; transform: translateY(-8px);
  transition: opacity .35s ease, transform .35s ease;
  z-index: 1000; background: rgba(10,12,15,0.68);
  backdrop-filter: var(--gls-blur); -webkit-backdrop-filter: var(--gls-blur);
  border-bottom: 1px solid color-mix(in srgb, var(--accent) 13%, transparent);
  box-shadow: 0 1px 0 rgba(255,255,255,0.06), 0 4px 24px rgba(0,0,0,0.2);
  display: flex; align-items: center;
}
#app-header::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent 5%, rgba(255,255,255,0.22) 40%, rgba(255,255,255,0.22) 60%, transparent 95%); }

.header-inner { max-width: 1100px; width: 100%; margin: 0 auto; padding: 0 32px; display: flex; align-items: center; }
.brand-name { font-family: var(--display); font-size: 22px; font-weight: 600; letter-spacing: 0.05em; color: var(--pale); white-space: nowrap; text-shadow: 0 1px 8px rgba(0,0,0,0.4); }
.brand-row { display: flex; align-items: baseline; gap: 7px; }
.brand-sub-static { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.06em; color: var(--text2); position: relative; top: -1px; }
.header-spacer { flex: 1; }
.header-status { display: none !important; }
.status-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--accent2); flex-shrink: 0; }
.status-dot.live { background: var(--accent); box-shadow: 0 0 6px rgba(107,163,214,0.6); animation: sPulse 2s ease infinite; }
@keyframes sPulse { 0%,100%{opacity:1} 50%{opacity:.35} }

.chevron { width: 7px; height: 7px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .2s; }

/* Main */
/* Main — defined in hero section below */

/* Search */
.search-section { margin-bottom: 28px; position: relative; }
.scan-loop-bar { position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; overflow: hidden; border-radius: 0; display: none; }
body.searched .scan-loop-bar.active { display: block; }
.scan-loop-bar::after { content: ''; position: absolute; top: 0; bottom: 0; width: 72%; background: linear-gradient(90deg, transparent 0%, var(--accent2) 22%, rgba(255,255,255,0.55) 50%, var(--accent) 78%, transparent 100%); animation: scanLoop 1.9s ease-in-out infinite; }
@keyframes scanLoop { 0% { left: -72%; } 100% { left: 100%; } }
body.searched .type-row { display: none; }
.search-row { display: flex; gap: 10px; align-items: stretch; }

.search-wrap {
  flex: 1; background: var(--search-bg);
  border: 1px solid var(--search-border);
  border-radius: 0; overflow: hidden; transition: border-color .2s;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.search-wrap:focus-within { border-color: var(--search-focus); }
.search-inner { display: flex; }
.search-glyph { display: none; align-items: center; justify-content: center; width: 23px; padding: 0; background: rgba(255,255,255,0.03); border-right: 1px solid rgba(255,255,255,0.07); color: var(--dim2); cursor: default; transition: background .15s, color .15s; flex-shrink: 0; }
body.searched .search-glyph { display: flex; cursor: pointer; }
body.searched .search-glyph:hover { background: var(--accentlo); color: var(--accent); }
.search-glyph svg { width: 14px; height: 14px; }
#ioc-input { flex: 1; background: transparent; border: none; outline: none; font-family: var(--mono); font-size: 15px; color: var(--pale); caret-color: var(--accent); letter-spacing: 0.04em; padding: 11px 18px; }
#ioc-input[readonly] { cursor: default; }
.ioc-type-tag { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.1em; text-transform: uppercase; padding: 3px 9px; border-radius: 0; background: var(--accentlo); color: var(--accent); border: 1px solid rgba(120,184,212,0.3); margin-right: 12px; align-self: center; opacity: 0; transform: scale(0.9); transition: opacity .15s ease, transform .15s ease; flex-shrink: 0; }
.ioc-type-tag.visible { opacity: 1; transform: scale(1); }
#ioc-input::placeholder { color: rgba(190,200,210,0.28); font-size: 14px; }
#search-btn { background: rgba(255,255,255,0.09); color: var(--text); border: none; border-left: 1px solid rgba(255,255,255,0.12); padding: 0; font-family: var(--display); font-size: 14px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; transition: all .15s; white-space: nowrap; display: flex; flex-direction: column; align-items: stretch; justify-content: center; overflow: hidden; position: relative; }
#search-btn[data-scanning]:hover #search-btn-label { opacity: 0; }
#search-btn[data-scanning]:hover { background: rgba(210,80,74,0.14) !important; color: #ef9a91 !important; }
#search-btn-label { padding: 0 22px; flex: 1; display: flex; align-items: center; justify-content: center; }
#search-btn-track { display: none; }
#search-btn-fill { display: none; }
#search-btn[data-scanning] { cursor: default; background: rgba(255,255,255,0.04); color: var(--text2); }
#search-btn[data-scanning] #search-btn-label { color: var(--text2); }
#search-btn[data-scanning]:hover { background: rgba(255,255,255,0.08); color: var(--text); }
#search-btn:not([data-scanning]):hover { background: rgba(255,255,255,0.15); color: var(--pale); }
#search-btn[data-finished] { background: rgba(255,255,255,0.06); }
#search-btn:disabled { background: rgba(255,255,255,0.04); color: var(--dim); cursor: not-allowed; }
#search-btn { cursor: pointer !important; opacity: 1 !important; }

#file-input { display: none; }

.type-row { display: flex; gap: 6px; margin-top: 10px; flex-wrap: wrap; transition: opacity .2s ease, visibility .2s ease; }
.type-row.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.type-chip { background: none; font-family: var(--mono); font-size: var(--fs-min); padding: 3px 9px; border-radius: 0; border: 1px solid rgba(255,255,255,0.18); color: rgba(200,220,235,0.80); cursor: pointer; transition: all .15s; letter-spacing: 0.07em; background: rgba(0,0,0,0.38); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); text-shadow: 0 1px 4px rgba(0,0,0,0.9); }
.type-chip:hover    { border-color: rgba(107,163,214,0.4); color: var(--accent); background: var(--accentlo); }
.type-chip.detected { border-color: var(--accent2); color: var(--accent); background: var(--accentlo); }

/* Drop overlay */
#drop-overlay {
  display: none; position: fixed; inset: 0; z-index: 2000;
  background: rgba(13,14,17,0.88); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  align-items: center; justify-content: center; flex-direction: column;
}
#drop-overlay.active { display: flex; }
#drop-overlay.over .drop-box { border-color: var(--accent); background: rgba(107,163,214,0.07); }
.drop-box {
  border: 1.5px dashed rgba(255,255,255,0.22); border-radius: 0; padding: 64px 96px;
  display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center;
  transition: all .2s; cursor: pointer; background: rgba(0,0,0,0.2);
}
.drop-box:hover { border-color: rgba(107,163,214,0.45); }
.drop-icon { color: var(--accent2); }
.drop-icon svg { width: 44px; height: 44px; stroke-width: 1.2; }
.drop-title { font-family: var(--display); font-size: 24px; font-weight: 600; color: var(--pale); letter-spacing: 0.04em; }
.drop-sub  { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); letter-spacing: 0.1em; text-transform: uppercase; }
.drop-hint { font-family: var(--mono); font-size: var(--fs-min); color: var(--dim); letter-spacing: 0.06em; margin-top: 4px; }
.drop-close { position: absolute; top: 28px; right: 32px; font-family: var(--mono); font-size: var(--fs-min); color: var(--dim2); letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; transition: color .15s; }
.drop-close:hover { color: var(--pale); }

/* Status bar */
#status-bar { display: none !important; align-items: center; gap: 10px; margin-bottom: 20px; padding: 9px 14px; background: rgba(10,12,15,0.88); border: 1px solid rgba(255,255,255,0.07); border-radius: 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--dim2); letter-spacing: 0.06em; }
#status-bar.visible { display: flex; }
.pulse-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--accent); animation: blink 1.4s ease infinite; flex-shrink: 0; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.2} }

/* Results */
#results { display: none; }
#results.visible { display: block; }

/* Cards */
.cards { display: flex; flex-direction: column; gap: 12px; }
.card-slot { display: block; }
.card-loading { opacity: 1; }
@keyframes cardReveal { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
.card:not(.card-loading) { animation: cardReveal .18s ease both; }
.card { background: var(--panel-bg); border: 1px solid var(--panel-line); border-radius: 0; overflow: hidden; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: inset 2px 0 0 var(--vcolor, transparent), var(--panel-hl); transition: border-color .25s, background .25s; animation: fadeSlide .3s ease both; position: relative; }
.card::after { content: ''; position: absolute; top: 0; left: 24px; right: 24px; height: 1px; background: linear-gradient(90deg, transparent, var(--panel-hair), transparent); pointer-events: none; }
.card:not(.vp-card):hover { background: rgba(10,12,15,0.92); border-top-color: rgba(255,255,255,0.14); border-right-color: rgba(255,255,255,0.14); border-bottom-color: rgba(255,255,255,0.14); backdrop-filter: blur(0px) saturate(1); -webkit-backdrop-filter: blur(0px) saturate(1); box-shadow: 0 12px 40px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.1); }
.card:not(.vp-card):hover .sv { color: #ffffff; }
.card:not(.vp-card):hover .sl { color: rgba(220,232,240,0.85); }
.card:not(.vp-card):hover .card-target-id span { filter: brightness(1.25); }
.card:not(.vp-card):hover .svc-row { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.12); }
.card:not(.vp-card):hover .svc-port { filter: brightness(1.2); }
@keyframes fadeSlide { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} }


.card-head { display: flex; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.32); cursor: pointer; transition: background .15s; }
.card-head:hover { background: rgba(0,0,0,0.46); }
.card-arrow { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); flex-shrink: 0; display: inline-block; transform: rotate(90deg); transition: transform .25s ease; }
.card.card-collapsed .card-arrow { transform: rotate(0deg); }
.source-name-cap { font-family: var(--mono); font-size: var(--fs-min); font-weight: 600; letter-spacing: 0.1em; color: var(--mist); transition: color .15s; text-decoration: none; flex: 0 1 auto; min-width: 0; }
a.source-name-cap:hover { color: var(--accent); text-decoration: underline; }
/* collapse button (was SOURCE tag) */
/* collapsed card */
.card.card-collapsed .card-body,
.card.card-collapsed .card-target-id { display: none; }
.card-summary { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2);
  padding: 8px 16px 12px; letter-spacing: 0.04em; display: none;
  border-top: 1px solid rgba(255,255,255,0.06); }
.card.card-collapsed .card-summary { display: block; }
.card-target-id { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.06em; color: var(--text2); padding: 9px 16px 0; }
.vbadge { display: none; }
.vb-malicious  { background: #d07070; box-shadow: 0 0 10px rgba(208,112,112,0.6); }
.vb-clean      { background: #5cc2ae; box-shadow: 0 0 10px rgba(92,194,174,0.5); }
.vb-suspicious { background: #c89060; box-shadow: 0 0 10px rgba(200,144,96,0.5); }
.vb-unknown    { background: rgba(255,255,255,0.25); }
.vb-info       { background: var(--accent2); box-shadow: 0 0 10px rgba(74,130,184,0.5); }
.vb-no_key     { background: rgba(255,255,255,0.18); }

.card-body { padding: 12px 16px 16px; }
.sgrid { display: flex; flex-wrap: wrap; gap: 5px 28px; margin-bottom: 12px; }
.stat  { display: flex; align-items: baseline; gap: 7px; }
.sl    { font-family: var(--sans); font-size: var(--fs-min); font-weight: 500; color: var(--text2); letter-spacing: 0.04em; text-transform: uppercase; }
.sv    { font-family: var(--mono); font-size: 13px; color: var(--pale); }
.sv.r  { color: var(--red); }
.sv.g  { color: var(--accent); }
.sv.o  { color: var(--orange); }
.det-bar  { height: 2px; background: rgba(255,255,255,0.1); border-radius: 0; margin-bottom: 14px; overflow: hidden; }
.det-fill { height: 100%; border-radius: 0; transition: width .7s ease; }
.tags { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 10px; }
.tag  { font-family: var(--mono); font-size: var(--fs-min); padding: 2px 8px; border-radius: 0; border: 1px solid rgba(255,255,255,0.1); color: var(--text2); background: rgba(255,255,255,0.04); max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.note-text { font-size: 12px; color: var(--text2); line-height: 1.65; }

/* Sandbox progress */
.skel { background: linear-gradient(90deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 15%, rgba(255,255,255,0.10) 35%, rgba(255,255,255,0.20) 50%, rgba(255,255,255,0.10) 65%, rgba(255,255,255,0.03) 85%, rgba(255,255,255,0.03) 100%); background-size: 500% 100%; border-radius: 0; animation: shimmer 2.4s ease-in-out infinite; }
@keyframes shimmer { 0% { background-position: 110% 0 } 100% { background-position: -110% 0 } }
.error-box { background: rgba(210,80,74,0.07); border: 1px solid rgba(210,80,74,0.25); border-radius: 0; padding: 14px 20px; font-family: var(--mono); font-size: var(--fs-min); color: var(--red); line-height: 1.6; }


/* Service table for Shodan/Censys */
.svc-label { font-family: var(--sans); font-size: var(--fs-min); font-weight: 500; color: var(--text2); letter-spacing: 0.04em; text-transform: uppercase; margin: 12px 0 6px; }
.svc-table { display: flex; flex-direction: column; gap: 3px; }
.svc-row   { display: flex; align-items: center; gap: 8px; padding: 4px 8px; background: rgba(255,255,255,0.03); border-radius: 0; border: 1px solid rgba(255,255,255,0.07); }
.svc-port  { font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); min-width: 72px; flex-shrink: 0; }
.svc-name  { font-family: var(--mono); font-size: var(--fs-min); color: var(--pale); flex: 1; }
.svc-soft  { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); margin-left: auto; flex-shrink: 0; }

/* ── Hero / centered search ── */
/* Default state: search section fills the viewport, centered */
#app-main { padding-top: 0; height: 100vh; position: relative; z-index: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
#app-main::-webkit-scrollbar { display: none; }
#app-main::-webkit-scrollbar { display: none; }

.main-inner { max-width: 1100px; margin: 0 auto; padding: 48px 32px 90px; overflow: visible; }

/* Hero wraps search + results — in hero mode it centers everything */
#hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-top: 10vh;
  height: 100%;
  transition: height .5s ease, justify-content .5s ease, padding-top .5s ease;
}
#hero.searched {
  height: auto;
  padding-top: 10px;
  justify-content: flex-start;
  align-items: stretch;
  overflow: visible;
}

.hero-brand {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  margin-bottom: 36px;
  opacity: 1; transition: opacity .3s ease, max-height .4s ease, margin .4s ease;
  max-height: 120px; overflow: hidden;
}
.hb-name {
  font-family: var(--display); font-size: 36px; font-weight: 600;
  letter-spacing: 0.05em; color: var(--pale);
  text-shadow: var(--title-shadow);
}
.hb-sub {
  font-family: var(--mono); font-size: var(--fs-min); font-weight: 400;
  letter-spacing: 0.24em; text-transform: uppercase; color: rgba(220,232,240,0.78);
  text-shadow: var(--sub-shadow);
}
#hero.searched .hero-brand {
  opacity: 0; max-height: 0; margin-bottom: 0; pointer-events: none;
}

/* When centered, search section takes fixed width */
#hero:not(.searched) .search-section {
  width: min(680px, 100%);
}
#hero.searched .search-section {
  width: 100%;
  margin-bottom: 28px;
}

@media (max-width: 700px) {
  .header-status { display: none; }
  .main-inner { padding: 24px 14px 100px; }
  #ioc-input { font-size: 13px; }
  body { background-position: center center !important; background-size: cover !important; }
  .hb-name { font-size: 22px; }
  .search-row { flex-direction: column; gap: 8px; }
  #search-btn { padding: 12px; width: 100%; }
    .card-head { padding: 11px 14px; gap: 10px; }
  .card-body { padding: 12px 14px; }
}
/* ── bloodhail:verdict-panel (shared across themes; uses each theme's variables) ── */
/* The verdict is a regular .card built from the same pieces as the source cards
   (title bar, label/value pairs, tags), so both read as one family.
   Colour: the verdict's own tint and the theme's blue, nothing else. */
.vp-red    { --vc: var(--red);    --vt: color-mix(in srgb, var(--red) 55%, #ffffff); --vb: #a8322d; }
.vp-orange { --vc: var(--orange); --vt: color-mix(in srgb, var(--orange) 55%, #ffffff); --vb: #99661f; }
.vp-teal   { --vc: var(--sev-low); --vt: #7fe3d3; --vb: #1f6e60; }
.vp-grey   { --vc: var(--sev-info); --vt: var(--pale); --vb: #4a5056; }

/* Placement. Closed: the search box, the verdict and the source rows form one
   composition, slightly enlarged (5%) and centred in the window (--stage-top is
   measured by the script), so the search box stays right above the card.
   Details drops the offset and the enlargement: the "zoom out". */
#hero { transition: height .5s ease, padding-top .45s cubic-bezier(.2,.7,.2,1); }
body.vp-stage #hero.searched { padding-top: var(--stage-top, 10px); }
@media (min-width: 701px) {
  .main-inner { transform-origin: top center; transition: transform .45s cubic-bezier(.2,.7,.2,1); }
  body.vp-stage .main-inner { transform: scale(1.05); }
  /* the header's column follows the enlarged composition, so it stays flush with the cards */
  .header-inner { transition: width .45s cubic-bezier(.2,.7,.2,1); }
  body.vp-stage .header-inner { width: min(100%, calc(max(calc(65vw / var(--z)), 900px) * 1.05)); max-width: 1680px; }
  #app-main { overflow-x: hidden; }
}

/* The verdict scrolls away like any content; when only its footer is left under the slim
   header, it fades out and the header carries it (never both at once). */
#verdict-unit { margin-bottom: 14px; transition: opacity .2s ease; }
body.vp-docked #verdict-unit { opacity: 0; pointer-events: none; }
.vp-card { animation: none !important; }

/* A firm, opaque surface and no hover effect, unlike the source cards. Lit faintly from
   the top-left corner in the verdict's own colour, with a top edge in the same tint. */
.vp-card, .vp-card:hover { background: radial-gradient(120% 160% at 0% 0%, color-mix(in srgb, var(--vc) 11%, transparent) 0%, transparent 45%), linear-gradient(180deg, rgba(255,255,255,0.025), transparent 40%), var(--panel-bg); -webkit-backdrop-filter: none; backdrop-filter: none; border: 1px solid var(--panel-line); border-radius: 0; box-shadow: var(--panel-lift), var(--panel-hl); }

/* Sources that returned nothing are left out of the list */
.card-slot.slot-empty { display: none !important; }
/* The target is in the verdict's title: the source cards do not repeat it */
.card-slot .card-target-id { display: none; }
.vp-card::after { background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--vc) 55%, var(--panel-hair)), transparent); }

/* Only the Details button opens and closes: headers are plain title bars */
.card-head { cursor: default; }
.card-head:hover { background: rgba(0,0,0,0.32); }
.card-arrow { display: none; }

/* Source rows: one line each (name, then the card's own summary), joined into a single
   list under the verdict, same width as it; Details open or closed, the list stays joined
   (a row opened by a click grows in place). */
#results .cards { gap: 0; }
#results .card-slot + .card-slot { margin-top: -1px; }
#results .cards .card { clip-path: none; }
#results .cards .card:hover { box-shadow: none; }
@media (min-width: 701px) {
  .card.card-collapsed:not(.vp-card) { display: flex; align-items: center; min-height: 42px; }
  .card.card-collapsed:not(.vp-card) .card-head { flex: 0 0 200px; border-bottom: 0; background: transparent; padding: 0 0 0 16px; }
  .card.card-collapsed:not(.vp-card) .card-head .card-age { display: none; }
  .card.card-collapsed:not(.vp-card) .card-summary { display: block; flex: 1 1 auto; min-width: 0; border-top: 0; padding: 0 16px 0 0; font-size: var(--fs-min); color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #results:not(.vp-open) .card-loading { display: flex; align-items: center; min-height: 42px; }
  #results:not(.vp-open) .card-loading > :not(.card-head) { display: none; }
  #results:not(.vp-open) .card-loading .card-head { flex: 1 1 auto; border-bottom: 0; background: transparent; padding: 0 16px; }
  #results:not(.vp-open) .card-loading .source-name-cap { flex: 0 0 184px; }
  #results:not(.vp-open) .card-loading .card-head::after { content: 'checking…'; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); animation: vpPulse 1.6s ease-in-out infinite; }
}

/* Sources still loading: same neutral name colour as the finished rows */
.card-loading .source-name-cap { color: var(--text2) !important; }
@keyframes vpPulse { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .card-loading .card-head::after { animation: none !important; } }

/* Title bar: the IOC is the title, the verdict a smaller coloured label beside it */
.vp-headtarget { font-family: var(--display); font-size: 18px; font-weight: 600; line-height: 1.1; letter-spacing: 0.06em; color: var(--pale); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.vp-headtarget i { font-style: normal; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.12em; text-transform: uppercase; margin-left: 6px; color: var(--text2); }
.vp-sep { width: 1px; height: 15px; background: rgba(255,255,255,0.16); flex-shrink: 0; }
/* the verdict: a solid badge in its colour, white letters (>= 4.5:1 on every badge) */
.vp-title { font-family: var(--display); font-size: 12.5px; font-weight: 600; line-height: 1.1; letter-spacing: 0.18em; text-transform: uppercase; color: var(--vt, var(--pale)); white-space: nowrap; background: color-mix(in srgb, var(--vb, #4a5056) 24%, transparent); border: 1px solid color-mix(in srgb, var(--vc, #8595a2) 48%, transparent); padding: 2px 8px; border-radius: 0; box-shadow: none; }
.vp-head .card-age { white-space: nowrap; }

/* Facts: label above value on a four-column grid (same rhythm open or closed), no boxes */
.vp-rowline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 28px; padding: 12px 16px 13px; }
.vp-item { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.vp-item .sv { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
.vp-item .sv i { font-style: normal; color: var(--text2); }
.vp-item .sv:has(.vp-cut) { display: block; }
.vp-cut { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vp-more { flex: none; margin-left: 8px; font-weight: 600; color: var(--text2); }
.vp-card .risk { color: var(--vt); }

/* Reasons: one per line, the source code (blue, opens its card) in front of the text */
.vp-reasons { display: flex; flex-direction: column; gap: 6px; padding: 11px 16px 12px; border-top: 1px solid rgba(255,255,255,0.07); }
.vp-reason { display: flex; align-items: baseline; gap: 12px; font-family: var(--mono); font-size: 12px; line-height: 1.4; min-width: 0; }
.vp-reason > span { color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.vp-reason.muted > span { color: var(--text2); }
.vp-gap { flex: 0 0 44px; }
.vp-src { flex: 0 0 44px; text-align: left; font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: 0.06em; color: var(--accent); background: none; border: 0; padding: 0; cursor: pointer; }
.vp-reason.muted .vp-src { font-weight: 600; margin-left: 9px; }
.vp-src:hover { text-decoration: underline; }
.vp-src-off { margin-left: 9px; font-weight: 600; letter-spacing: 0.06em; color: color-mix(in srgb, var(--orange) 70%, #ffffff); }

/* Opened by Details, inside the card above the footer: remaining facts, ports / signals /
   CVEs in full, how it works */
.vp-lines { padding: 4px 16px 12px; border-top: 1px solid rgba(255,255,255,0.07); }
.vp-line { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 14px; align-items: start; padding: 10px 0 0; }
.vp-line + .vp-line { border-top: 1px solid rgba(255,255,255,0.06); margin-top: 2px; }
.vp-line .svc-label { margin: 4px 0 0; }
.vp-line-v { min-width: 0; }
.vp-line-v .tags { margin-bottom: 8px; flex-wrap: wrap; }
.vp-how-line { padding-top: 10px; border-top: 1px solid rgba(255,255,255,0.06); margin-top: 2px; }
.tag.risk { color: var(--vt); border-color: color-mix(in srgb, var(--vc) 45%, transparent); }
.tag a { color: inherit; text-decoration: none; }
.tag a:hover { text-decoration: underline; }
.vp-note { padding-top: 8px; font-size: var(--fs-min); color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vp-note code { font-family: var(--mono); color: var(--text); }
.vp-how { font-size: 12px; color: var(--text); }
.vp-how summary { cursor: pointer; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.06em; color: var(--accent); width: fit-content; }
.vp-how-body { margin-top: 8px; padding: 12px 16px; background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.1); line-height: 1.6; }
.vp-how-body p { margin: 0 0 8px; }
.vp-how-body ul { margin: 0 0 8px; padding-left: 18px; }

/* Footer: tools on the left, Details on the right */
.vp-foot { display: flex; align-items: center; gap: 18px; padding: 9px 16px; border-top: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.12); }
.vp-act { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.04em; color: var(--text); background: none; border: 0; padding: 2px 0; cursor: pointer; transition: color .15s; }
.vp-act:hover { color: var(--accent); }
.vp-act.warn { color: color-mix(in srgb, var(--orange) 70%, #ffffff); }

/* Details: blue outline button; a quick metallic glint crosses it now and then */
.vp-toggle { position: relative; overflow: hidden; margin-left: auto; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.08em; color: var(--accent); background: transparent; border: 1px solid color-mix(in srgb, var(--accent) 60%, transparent); border-radius: 0; padding: 5px 13px; cursor: pointer; transition: background .15s; white-space: nowrap; }
.vp-toggle:hover { background: color-mix(in srgb, var(--accent) 14%, transparent); }
.vp-toggle::after { content: ''; position: absolute; top: -20%; bottom: -20%; left: -40%; width: 24%; background: linear-gradient(100deg, transparent 0%, rgba(205,226,248,0.12) 32%, rgba(240,248,255,0.65) 50%, rgba(205,226,248,0.12) 68%, transparent 100%); transform: skewX(-22deg); animation: vpGlint 4.4s linear infinite; pointer-events: none; }
.vp-toggle[aria-expanded="true"]::after { display: none; }
@keyframes vpGlint { 0% { left: -40%; } 13% { left: 125%; } 100% { left: 125%; } }
@media (prefers-reduced-motion: reduce) { .vp-toggle::after { display: none; } #hero, .main-inner { transition: none; } }
.vp-src:focus-visible, .vp-act:focus-visible, .vp-toggle:focus-visible, .vp-how summary:focus-visible, .retry-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Slim header: carries the verdict once it has folded away */
.hdr-verdict { display: none; align-items: center; gap: 14px; margin-left: 22px; padding-left: 22px; border-left: 1px solid rgba(255,255,255,0.12); min-width: 0; flex: 1 1 auto; }
body.vp-docked .hdr-verdict { display: flex; animation: hvIn .25s ease both; }
body.vp-docked .header-spacer { display: none; }
@keyframes hvIn { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: none; } }
.hv-label { font-family: var(--display); font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: #ffffff; white-space: nowrap; background: var(--vb, #4a5056); padding: 2px 8px; border-radius: 0; box-shadow: inset 0 1px 0 rgba(255,255,255,0.16), 0 0 0 1px rgba(0,0,0,0.3), 0 3px 12px color-mix(in srgb, var(--vc) 38%, transparent); }
.hv-ioc { font-family: var(--display); font-size: 16px; font-weight: 600; letter-spacing: 0.05em; color: var(--pale); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.hv-toggle { padding: 3px 10px; flex-shrink: 0; }

.card-flash { box-shadow: 0 0 0 2px var(--accent), 0 12px 40px rgba(0,0,0,0.4) !important; }
.retry-btn { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.05em; color: var(--pale); background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.22); border-radius: 0; padding: 6px 12px; cursor: pointer; margin-top: 10px; transition: border-color .15s, color .15s; }
.retry-btn:hover { border-color: var(--accent); color: var(--accent); }
.card-age { font-family: var(--mono); font-size: var(--fs-min); color: var(--dim2); margin-left: auto; white-space: nowrap; }

@media (max-width: 700px) {
  /* phones: two columns, and values may wrap (the no-wrap rule is for wide screens) */
  .vp-rowline { grid-template-columns: 1fr 1fr; gap: 10px 16px; padding: 10px 14px 11px; }
  .vp-item .sv { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
  .vp-cut { white-space: normal; overflow: visible; }
  .vp-item .sv:has(.vp-cut) { display: block; }
  .vp-more { margin-left: 6px; }
  .vp-reasons { padding: 10px 14px 11px; }
  .vp-reason > span { white-space: normal; }
  .vp-headtarget { font-size: 16px; }
  .vp-line { grid-template-columns: 1fr; gap: 4px; }
  .vp-head .card-age { display: none; }
  .vp-foot { padding: 9px 14px; gap: 14px; }
  .hdr-verdict { display: none !important; }
}
/* ── /bloodhail:verdict-panel ── */
/* ── bloodhail:layout (shared across themes) ── */
/* Footer: solid, no transparency */

/* Background: sharp on the home screen only; frosted as soon as a query is made. */
body::before { transition: background-color .5s ease, -webkit-backdrop-filter .5s ease, backdrop-filter .5s ease; }
body.searched::before { background: rgba(10,12,15,0.42); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }

/* Header: when the page is scrolled it shrinks to a slim solid bar with the name
   and a "back to top" arrow (same look as the arrow in the search box). */
/* no transition on the background: the slim bar must be solid at once, never see-through */
#app-header { transition: height .25s ease, opacity .35s ease, transform .35s ease; }
.hdr-up { display: none; width: 26px; height: 26px; margin-right: 12px; padding: 0; align-items: center; justify-content: center; flex-shrink: 0; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.14); color: var(--dim2); cursor: pointer; transition: background .15s, color .15s; }
.hdr-up svg { width: 13px; height: 13px; }
.hdr-up:hover { background: var(--accentlo); color: var(--accent); }
.hdr-up:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
body.scrolled .hdr-up { display: flex; }
body.scrolled #app-header { height: 38px; background: #0b0d10; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; border-bottom: 1px solid rgba(255,255,255,0.1); }
body.scrolled #app-header::after { display: none; }
body.scrolled .brand-name { font-size: 17px; text-shadow: none; }
body.scrolled .brand-sub-static { display: none; }

/* Desktop: the whole interface is drawn at 82.5%.
   Viewport units are scaled by `zoom` too, so they are divided by the same factor
   to keep filling the window. Not applied on phones. */
:root { --z: 0.825; }
@media (min-width: 701px) {
  @supports (zoom: 1) {
    html { zoom: var(--z); }
    body { min-height: calc(100vh / var(--z)); }
    #app-main { height: calc(100vh / var(--z)); }
    #hero { padding-top: calc(10vh / var(--z)); }
  }
  /* Results: a centred column (about 65% of the window) */
  .main-inner { width: min(100%, max(calc(65vw / var(--z)), 900px)); max-width: 1600px; padding: 36px 0 40px; }
  .header-inner { width: min(100%, max(calc(65vw / var(--z)), 900px)); max-width: 1600px; padding: 0; }
  #hero.searched .search-section { margin-bottom: 16px; }
}
/* ── /bloodhail:layout ── */

/* ── Source cards: same reading pattern as the verdict (label above value) ── */
.sgrid { gap: 12px 32px; }
.stat  { flex-direction: column; align-items: flex-start; gap: 3px; min-width: 0; }
.stat .sv { overflow-wrap: anywhere; }
.svc-port, .svc-name { font-size: var(--fs-min); }
.card-summary { font-size: var(--fs-min); }

/* ── Re-run (title bar of the verdict, next to the check time) ── */
.vp-rerun { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin-left: 4px; padding: 0; flex-shrink: 0; color: var(--text2); background: transparent; border: 1px solid transparent; border-radius: 0; cursor: pointer; transition: color .15s, border-color .15s, background .15s, transform .4s ease; }
.vp-rerun svg { width: 14px; height: 14px; }
.vp-rerun:hover:not(:disabled) { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: var(--accentlo); transform: rotate(-90deg); }
.vp-rerun:disabled { opacity: .35; cursor: default; }
.vp-rerun:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ── File check: button in the search box, drop overlay, sandbox offer ── */
#file-btn { display: flex; align-items: center; justify-content: center; width: 44px; flex-shrink: 0; padding: 0; color: var(--text2); background: transparent; border: 0; border-left: 1px solid rgba(255,255,255,0.10); cursor: pointer; transition: color .15s, background .15s; }
#file-btn svg { width: 17px; height: 17px; }
#file-btn:hover { color: var(--accent); background: var(--accentlo); }
#file-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.drop-sub { text-transform: none; letter-spacing: 0.04em; font-size: var(--fs-min); }
.vp-file { font-weight: 600; color: var(--pale); }
.vp-sandbox { margin-top: 4px; padding: 10px 12px; border: 1px dashed color-mix(in srgb, var(--accent) 35%, transparent); border-radius: 0; background: color-mix(in srgb, var(--accent) 5%, transparent); }
.vp-sandbox-t { font-family: var(--mono); font-size: 12px; color: var(--pale); }
.vp-sandbox-b { display: flex; flex-wrap: wrap; gap: 8px; margin: 9px 0 8px; }
.vp-sbx { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.04em; color: var(--accent); background: transparent; border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent); border-radius: 0; padding: 5px 12px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; transition: background .15s; }
.vp-sbx svg { width: 9px; height: 9px; }
.vp-sbx:hover { background: var(--accentlo); }
.vp-sbx.busy { color: var(--text2); border-color: rgba(255,255,255,0.15); cursor: default; animation: vpPulse 1.6s ease-in-out infinite; }
.vp-sbx.done { color: #7fe3d3; border-color: rgba(92,194,174,0.5); }
.vp-sbx.err { color: color-mix(in srgb, var(--orange) 70%, #ffffff); border-color: color-mix(in srgb, var(--orange) 55%, transparent); }
.vp-sandbox-n { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); }

@media (max-width: 700px) {
  #file-btn { width: 40px; }
  #ioc-input { min-width: 0; }
  #search-btn { width: auto; padding: 0; flex-shrink: 0; }
  #search-btn-label { padding: 0 14px; }
}

/* ── Malware family (Malpedia), inside the reasons ── */
.vp-family { margin: 4px 0 2px; padding: 9px 12px; border-left: 2px solid color-mix(in srgb, var(--vc, var(--red)) 55%, transparent); background: rgba(255,255,255,0.025); }
.vp-family-h { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.vp-family-n { font-family: var(--display); font-size: 14px; font-weight: 600; letter-spacing: 0.06em; color: var(--pale); }
.vp-family-a { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); }
.vp-family-l { margin-left: auto; font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); text-decoration: none; display: inline-flex; align-items: center; gap: 5px; }
.vp-family-l svg { width: 9px; height: 9px; }
.vp-family-l:hover { text-decoration: underline; }
.vp-family-d { margin-top: 5px; font-size: 12.5px; line-height: 1.55; color: var(--text); }

/* ── Indicators you can scan with one click (related, subdomains) ── */
a.tag-link { text-decoration: none; cursor: pointer; transition: color .15s, border-color .15s, background .15s; }
a.tag-link:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 50%, transparent); background: var(--accentlo); }
.vp-muted { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); animation: vpPulse 1.6s ease-in-out infinite; }

/* ── Bulk scan: groups by verdict, filters, rows that open in place ── */
.bg-red    { --gc: var(--red);    --gt: color-mix(in srgb, var(--red) 55%, #ffffff); }
.bg-orange { --gc: var(--orange); --gt: color-mix(in srgb, var(--orange) 55%, #ffffff); }
.bg-teal   { --gc: #5cc2ae;       --gt: #7fe3d3; }
.bg-grey   { --gc: var(--text2);  --gt: var(--pale); }
.bulk-top { display: flex; flex-direction: column; gap: 11px; padding: 12px 16px 11px; border-top: 1px solid rgba(255,255,255,0.07); }
.bulk-bar { display: flex; gap: 2px; height: 4px; }
.bulk-seg { display: block; min-width: 4px; border-radius: 0; }
.bs-red { background: var(--red); } .bs-orange { background: var(--orange); } .bs-teal { background: #5cc2ae; } .bs-grey { background: var(--text2); }
.bs-pending { background: rgba(255,255,255,0.12); animation: vpPulse 1.6s ease-in-out infinite; }
.bulk-tools { display: flex; align-items: center; gap: 12px; }
.bulk-filters { display: flex; gap: 6px; flex-wrap: wrap; }
.bulk-f { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.03em; color: var(--text); background: transparent; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; padding: 4px 10px; cursor: pointer; transition: border-color .15s, color .15s, background .15s; }
.bulk-f b { margin-left: 7px; font-weight: 600; color: var(--text2); }
.bulk-f:hover { border-color: rgba(255,255,255,0.28); }
.bulk-f.on { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 60%, transparent); background: var(--accentlo); }
.bulk-f.on b { color: var(--accent); }
.bulk-selall { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); background: none; border: 0; cursor: pointer; white-space: nowrap; }
.bulk-selall:hover { color: var(--text); }
.bulk-list { border-top: 1px solid rgba(255,255,255,0.07); padding-bottom: 4px; }
.bulk-group { display: flex; align-items: center; gap: 9px; padding: 13px 16px 7px; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.14em; text-transform: uppercase; color: var(--gt); }
.bulk-group b { font-weight: 500; color: var(--text2); letter-spacing: 0.06em; }
.bulk-group::after { content: ""; flex: 1; height: 1px; background: rgba(255,255,255,0.07); }
.bulk-dot { width: 7px; height: 7px; border-radius: 0; background: var(--gc); flex: none; }
.bulk-row { display: grid; grid-template-columns: 14px minmax(0, 1.5fr) 62px minmax(0, 2.6fr) 40px; gap: 14px; align-items: center; padding: 9px 16px; border-bottom: 1px solid rgba(255,255,255,0.045); cursor: pointer; transition: background .15s; }
.bulk-row:hover { background: rgba(255,255,255,0.03); }
.bulk-row.sel { background: rgba(120,184,212,0.05); }
.bulk-row.open { background: rgba(255,255,255,0.035); border-bottom-color: transparent; }
.bulk-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.bulk-cb { position: relative; display: inline-block; width: 13px; height: 13px; flex: none; border: 1px solid rgba(255,255,255,0.28); border-radius: 0; transition: background .15s, border-color .15s; }
.bulk-cb:hover { border-color: var(--accent); }
.bulk-cb.on { background: var(--accent); border-color: var(--accent); }
.bulk-cb.on::after { content: ""; position: absolute; left: 3.5px; top: 0.5px; width: 4px; height: 8px; border: solid #0d0f12; border-width: 0 1.6px 1.6px 0; transform: rotate(45deg); }
.bulk-ioc { font-family: var(--mono); font-size: 12.5px; color: var(--pale); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bulk-kind { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.12em; text-transform: uppercase; color: var(--text2); }
.bulk-why { display: flex; align-items: baseline; gap: 10px; min-width: 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); }
.bulk-why b { flex: none; color: var(--accent); font-weight: 700; letter-spacing: 0.06em; }
.bulk-why span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bulk-why i { flex: none; font-style: normal; font-size: var(--fs-min); color: var(--text2); }
.bulk-wait { color: var(--text2); animation: vpPulse 1.6s ease-in-out infinite; }
.bulk-acts { display: flex; align-items: center; justify-content: flex-end; gap: 12px; color: var(--text2); }
.bulk-open { display: flex; color: var(--text2); transition: color .15s; }
.bulk-open svg { width: 10px; height: 10px; }
.bulk-open:hover { color: var(--accent); }
.bulk-chev { font-size: var(--fs-min); }
.bulk-exp { margin: 0 16px 10px 44px; padding: 12px 14px 10px; border-left: 2px solid color-mix(in srgb, var(--gc) 60%, transparent); background: rgba(255,255,255,0.025); }
.bulk-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 24px; margin-bottom: 11px; }
.bulk-facts .sv { font-size: 12px; }
.bulk-reasons { display: flex; flex-direction: column; gap: 5px; }
.bulk-reasons .vp-reason { font-size: var(--fs-min); }
.vp-src-b { flex: 0 0 44px; color: var(--accent); font-weight: 700; letter-spacing: 0.06em; }
.bulk-tags { margin: 10px 0 0; }
.bulk-exp-acts { display: flex; gap: 20px; margin-top: 10px; padding-top: 9px; border-top: 1px solid rgba(255,255,255,0.06); }
.bulk-exp-acts a, .bulk-exp-acts button { display: inline-flex; align-items: center; gap: 6px; font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: none; }
.bulk-exp-acts svg { width: 9px; height: 9px; }
.bulk-exp-acts a:hover, .bulk-exp-acts button:hover:not(:disabled) { text-decoration: underline; }
.bulk-exp-acts button:disabled { color: var(--text2); cursor: default; }
.vp-act.bulk-copysel { color: var(--accent); }

/* ── urlscan.io: the "Page" strip of the verdict, and the source card ── */
.vp-page { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 16px; align-items: center; padding: 11px 16px; border-top: 1px solid rgba(255,255,255,0.07); }
.vp-shot { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: #131518; transition: border-color .15s; }
.vp-shot img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
a.vp-shot:hover { border-color: color-mix(in srgb, var(--accent) 55%, transparent); }
.vp-shot.noimg img { display: none; }
.vp-shot.noimg::after, .vp-shot.none span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.06em; color: var(--text2); }
.vp-shot.noimg::after { content: "No screenshot"; }
.vp-shot.none { border-style: dashed; }
.vp-page-i { min-width: 0; }
.vp-page .sl { display: block; margin-bottom: 4px; }
.vp-chain { display: flex; align-items: baseline; gap: 8px; min-width: 0; font-family: var(--mono); font-size: 12px; color: var(--text); }
.vp-chain span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vp-chain .vp-arrow { flex: none; color: var(--text2); }
.vp-chain .vp-final { color: var(--pale); }
.vp-page-t { margin-top: 4px; font-size: 12.5px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vp-page.empty .vp-page-t { white-space: normal; color: var(--text2); font-size: 12px; }
.vp-page.empty .vp-sandbox-b { margin: 8px 0 0; align-items: center; }
.vp-page-c { margin: 8px 0 0; }
.tag.warn { color: color-mix(in srgb, var(--orange) 70%, #ffffff); border-color: color-mix(in srgb, var(--orange) 45%, transparent); }
.vp-page-err { font-family: var(--mono); font-size: var(--fs-min); color: color-mix(in srgb, var(--orange) 70%, #ffffff); }
.us-card { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 700px) {
  .bulk-row { grid-template-columns: 14px minmax(0, 1fr) auto; gap: 4px 12px; padding: 10px 14px; }
  .bulk-kind { display: none; }
  .bulk-why { grid-column: 2 / -1; grid-row: 2; }
  .bulk-acts { grid-column: 3; grid-row: 1; }
  .bulk-tools { flex-wrap: wrap; }
  .bulk-exp { margin: 0 14px 10px 14px; }
  .bulk-facts { grid-template-columns: 1fr 1fr; }
  .vp-page { grid-template-columns: 92px minmax(0, 1fr); gap: 12px; padding: 10px 14px; }
  .us-card { grid-template-columns: 1fr; }
}

/* ── Capture enlarged over the page ── */
.shot-zoom { position: fixed; inset: 0; z-index: 3000; display: flex; align-items: center; justify-content: center; padding: 4%; background: rgba(10,12,15,0.82); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .2s ease; cursor: zoom-out; }
.shot-zoom.on { opacity: 1; }
.shot-zoom figure { margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; transform: scale(.96); transition: transform .25s cubic-bezier(.2,.7,.2,1); cursor: default; }
.shot-zoom.on figure { transform: none; }
.shot-zoom img { display: block; flex: 0 1 auto; max-width: 100%; max-height: 100%; min-height: 0; object-fit: contain; border: 1px solid rgba(255,255,255,0.18); border-radius: 0; background: #fff; box-shadow: 0 24px 80px rgba(0,0,0,0.6); }
.shot-zoom figcaption { align-self: stretch; max-width: 1200px; margin: 0 auto; width: 100%; display: flex; align-items: center; gap: 20px; padding-top: 12px; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); }
.shot-zoom figcaption a { color: var(--accent); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.shot-zoom figcaption a svg { width: 9px; height: 9px; }
.shot-zoom figcaption a:hover { text-decoration: underline; }
.shot-zoom figcaption button { margin-left: auto; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); background: none; border: 0; cursor: pointer; }
.shot-zoom figcaption button:hover { color: var(--pale); }
a.vp-shot { cursor: zoom-in; }

/* ── Timeline (Details): oldest first, a rail with one dot per event ── */
.vp-tl { list-style: none; margin: 2px 0 8px; padding: 0; position: relative; }
.vp-tl::before { content: ""; position: absolute; left: 95px; top: 8px; bottom: 8px; width: 1px; background: rgba(255,255,255,0.12); }
.vp-tl li { display: grid; grid-template-columns: 84px 22px minmax(0, 1fr) auto; align-items: baseline; gap: 0; padding: 3px 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); }
.tl-when { color: var(--text2); font-size: var(--fs-min); white-space: nowrap; }
.tl-dot { position: relative; justify-self: center; width: 7px; height: 7px; border-radius: 50%; background: var(--text2); box-shadow: 0 0 0 3px #0c0e11; transform: translateY(-1px); }
.tl-red .tl-dot { background: var(--red); }
.tl-orange .tl-dot { background: var(--orange); }
.tl-text { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 12px; }
.vp-tl li b { color: var(--accent); font-weight: 700; letter-spacing: 0.06em; font-size: var(--fs-min); }
.tl-gap { color: var(--text2); font-style: italic; }
.tl-gap .tl-dot { background: transparent; border: 1px dashed var(--text2); }

/* ── Relations graph (interactive) ── */
.g-host { margin: 0 0 6px; }
.g-wrap { border: 1px solid rgba(255,255,255,0.1); border-radius: 0; background: #05080c; overflow: hidden; }
/* toolbar reads like the card footer: plain mono words, accent on hover */
.g-tools { display: flex; align-items: center; gap: 10px; min-height: 34px; padding: 0 12px 0 6px; border-bottom: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.12); }
.g-tools button { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.04em; color: var(--text); background: none; border: 0; padding: 2px 0; cursor: pointer; transition: color .15s; }
.g-tools button:hover, .g-tools button:focus-visible { color: var(--accent); outline: none; }
.g-tools-r { display: inline-flex; align-items: center; gap: 16px; margin-left: auto; }
.g-tools-r [data-a="in"], .g-tools-r [data-a="out"] { width: 14px; font-size: 14px; line-height: 1; }
.g-tools-r [data-a="out"] { margin-left: -8px; }
.g-count { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.08em; text-transform: uppercase; color: var(--text2); white-space: nowrap; }
.g-hidden .g-canvas, .g-hidden .g-info, .g-hidden .g-tools-r { display: none; }
.g-hidden .g-tools { border-bottom: 0; }
.g-svg { display: block; width: 100%; height: auto; cursor: grab; touch-action: none; user-select: none; }
.g-svg:active { cursor: grabbing; }
.g-n { cursor: pointer; }
.g-box { transition: opacity .15s; }
.g-n:hover .g-box, .g-n.hl .g-box { opacity: 1 !important; }
.g-n:hover .g-frame { stroke: rgba(204,220,232,0.45); }
.g-n.sel .g-frame, .g-n:hover.sel .g-frame { stroke-opacity: 1; }
.g-pulse { transform-box: fill-box; transform-origin: center; }
.can-expand .g-pulse { animation: gPulse 2.6s ease-out infinite; }
@keyframes gPulse { 0% { opacity: .35; transform: scale(.95); } 70% { opacity: 0; transform: scale(1.45); } 100% { opacity: 0; } }
.loading .g-ring { stroke: rgba(92,194,174,0.7) !important; stroke-dasharray: 3 3; animation: gSpin 1s linear infinite; transform-box: fill-box; transform-origin: center; }
@keyframes gSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .can-expand .g-pulse { animation: none; opacity: .4; } }
.g-info { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; min-height: 34px; padding: 9px 12px; border-top: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.12); font-family: var(--mono); font-size: var(--fs-min); color: var(--text); }
@keyframes gPulseDot { 0% { box-shadow: 0 0 0 0 rgba(92,194,174,0.5); } 70% { box-shadow: 0 0 0 6px rgba(92,194,174,0); } 100% { box-shadow: 0 0 0 0 rgba(92,194,174,0); } }
.g-sel-v { padding: 1px 7px; border-radius: 0; font-size: var(--fs-min); border: 1px solid rgba(255,255,255,0.16); }
.g-v-bad { color: #fff; background: rgba(210,80,74,0.75); border-color: transparent; }
.g-v-warn { color: #dbbd9b; border-color: rgba(211,154,76,0.5); }
.g-v-quiet { color: #7fe3d3; border-color: rgba(92,194,174,0.35); }
.g-v-self { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 50%, transparent); }
.g-sel-a { display: inline-flex; gap: 14px; margin-left: auto; }
.g-sel-a a, .g-sel-a button { font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 5px; }
.g-sel-a svg { width: 9px; height: 9px; }
.g-loading { display: block; margin: 4px 0 0; }
@media (max-width: 700px) {
  .g-sel-a { margin-left: 0; }
  .vp-tl::before { left: 79px; }
  .vp-tl li { grid-template-columns: 70px 20px minmax(0, 1fr); }
  .vp-tl li b { display: none; }
  .tl-text { white-space: normal; }
}

/* ── E-mail card (.eml), above the bulk scan of what it contains ── */
.bulk-lead { margin-bottom: 14px; }
.mail-card .vp-headtarget { font-size: 16px; letter-spacing: 0.03em; }
.mail-card .vp-rowline { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.mail-auth { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; padding: 0 16px 12px; }
.mail-auth .tag { margin: 0; }
.tag.ok { color: #7fe3d3; border-color: rgba(92,194,174,0.4); }
.mail-count { margin-left: auto; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); }
.mail-warn { color: color-mix(in srgb, var(--orange) 70%, #ffffff) !important; }
.mail-files { border-top: 1px solid rgba(255,255,255,0.07); padding: 8px 16px 10px; display: flex; flex-direction: column; gap: 4px; }
.mail-file { display: grid; grid-template-columns: minmax(0, 1fr) 70px 170px; gap: 14px; align-items: baseline; font-family: var(--mono); font-size: var(--fs-min); }
.mail-fn { color: var(--pale); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mail-fs { color: var(--text2); text-align: right; }
.mail-fh { color: var(--accent); text-decoration: none; }
.mail-fh:hover { text-decoration: underline; }
@media (max-width: 700px) { .mail-file { grid-template-columns: minmax(0, 1fr) auto; } .mail-fh { grid-column: 1 / -1; } .mail-count { margin-left: 0; width: 100%; } }

/* ── Long lists: [all N] ── */
.more-rest { display: contents; }
.more-rest[hidden] { display: none; }
.tag.tag-more { cursor: pointer; color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: transparent; font-family: var(--mono); }
.tag.tag-more:hover { background: var(--accentlo); }
.tag.tag-more::before { content: "["; } .tag.tag-more::after { content: "]"; }
.cve-list > .tag-more, .cert-table > .tag-more { margin-top: 8px; }
button.tag.tag-link { font-family: var(--mono); background: transparent; cursor: pointer; }

/* ── CVE table (verdict details) ── */
.cve-list { display: flex; flex-direction: column; margin-bottom: 8px; align-items: flex-start; }
.cve-list .more-rest.shown { display: contents; }
.cve-row { align-self: stretch; border-bottom: 1px solid rgba(255,255,255,0.06); transition: background .3s; }
.cve-row.flash { background: var(--accentlo); }
.cve-h { display: grid; grid-template-columns: 138px 96px auto minmax(0, 1fr) 12px; gap: 12px; align-items: center; width: 100%; padding: 7px 0; background: none; border: 0; color: inherit; text-align: left; cursor: pointer; font-family: var(--mono); font-size: var(--fs-min); }
.cve-h::after { content: "\25BE"; color: var(--text2); font-size: var(--fs-min); }
.cve-row.open .cve-h::after { content: "\25B4"; }
.cve-id { color: var(--pale); font-weight: 600; }
.cve-sev { justify-self: start; padding: 1px 7px; border-radius: 0; border: 1px solid rgba(255,255,255,0.14); font-size: var(--fs-min); white-space: nowrap; }
.sev-critical { color: #f0a0a0; border-color: rgba(210,80,74,0.6); background: rgba(210,80,74,0.12); }
.sev-high { color: #e3afaf; border-color: rgba(210,80,74,0.4); }
.sev-medium { color: #dbbd9b; border-color: rgba(211,154,76,0.45); }
.sev-low, .sev-none { color: var(--text2); }
.cve-flags { display: flex; gap: 6px; white-space: nowrap; }
.cve-kev { padding: 1px 7px; border-radius: 0; font-size: var(--fs-min); color: #fff; background: rgba(210,80,74,0.75); }
.cve-epss { padding: 1px 7px; border-radius: 0; font-size: var(--fs-min); color: var(--text); border: 1px solid rgba(255,255,255,0.14); }
.cve-sum { min-width: 0; color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cve-body { display: none; padding: 2px 0 12px 150px; font-size: 12.5px; line-height: 1.6; color: var(--text); }
.cve-row.open .cve-body { display: block; }
.cve-row.open .cve-sum { visibility: hidden; }
.cve-body p { margin: 0 0 6px; }
.cve-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); }
.cve-meta a { color: var(--accent); text-decoration: none; display: inline-flex; align-items: center; gap: 5px; }
.cve-meta a svg { width: 9px; height: 9px; }
.cve-kev-t { color: #e3afaf; }

/* ── Certificates table (Certificates card) ── */
.cert-table { display: flex; flex-direction: column; align-items: flex-start; font-family: var(--mono); font-size: var(--fs-min); }
.cert-table .more-rest.shown { display: contents; }
.cert-row { align-self: stretch; display: grid; grid-template-columns: 96px 96px minmax(0, 1fr) minmax(0, 1.4fr); gap: 12px; padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,0.05); color: var(--text); }
.cert-row span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cert-head { color: var(--text2); font-size: var(--fs-min); letter-spacing: 0.1em; text-transform: uppercase; }
.cert-row.revoked { color: var(--text2); text-decoration: line-through; }
@media (max-width: 700px) {
  .cve-h { grid-template-columns: minmax(0, 1fr) auto 12px; }
  .cve-flags, .cve-sum { display: none; }
  .cve-body { padding-left: 0; }
  .cert-row { grid-template-columns: 84px minmax(0, 1fr); }
  .cert-row span:nth-child(2), .cert-row span:nth-child(4) { display: none; }
}

/* ── Graph in full screen (browser full screen, or a fixed overlay as fallback) ── */
.g-wrap.g-full-on { position: fixed; inset: 0; z-index: 4000; border: 0; border-radius: 0; display: flex; flex-direction: column; }
.g-wrap.g-full-on .g-canvas { flex: 1 1 auto; min-height: 0; display: flex; align-items: center; }
.g-wrap.g-full-on .g-svg { height: 100%; width: 100%; }

/* ── Graph: constellation look, command sheet ── */
.g-wrap { position: relative; }
.g-sheet { position: absolute; right: 10px; top: 40px; z-index: 5; display: grid; grid-template-columns: auto 1fr; gap: 8px 12px; align-items: center; width: 260px; padding: 12px 14px; background: #0c0e11; border: 1px solid var(--card-border); border-radius: 0; box-shadow: 0 14px 34px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.08); font-family: var(--mono); font-size: var(--fs-min); color: var(--text); }
.g-sheet[hidden] { display: none; }
.g-sheet .kbd { justify-self: start; display: inline-flex; align-items: center; height: 19px; padding: 0 6px; font-size: var(--fs-min); color: var(--pale); border: 1px solid rgba(255,255,255,0.22); border-bottom-width: 2px; border-radius: 0; background: rgba(255,255,255,0.04); white-space: nowrap; }

/* ── Graph: the indicator list (discreet, under the canvas) ── */
/* the list's handle: a slim tab under the drawing that opens and closes the list */
.g-list-tab { display: flex; align-items: center; gap: 10px; width: 100%; padding: 6px 12px; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .1em; text-transform: uppercase; color: var(--text2); background: rgba(0,0,0,0.2); border: 0; border-top: 1px solid rgba(255,255,255,0.08); cursor: pointer; transition: color .15s; }
.g-list-tab:hover, .g-list-tab[aria-expanded="true"] { color: var(--accent); }
.g-list-tab b { font-weight: 400; color: var(--text2); letter-spacing: .06em; }
.g-list-tab i { margin-left: auto; font-style: normal; transition: transform .2s; }
.g-list-tab[aria-expanded="true"] i { transform: rotate(180deg); }
.g-wrap.g-full-on .g-list-tab, .g-wrap.g-full-on .g-list { flex: none; }
.g-wrap.g-full-on .g-list ul { max-height: 30vh; }
.g-list { border-top: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.12); font-family: var(--mono); font-size: var(--fs-min); }
.g-list[hidden] { display: none; }
.g-list-h { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 16px; padding: 8px 12px 6px; color: var(--text2); font-size: var(--fs-min); letter-spacing: 0.08em; text-transform: uppercase; }
.g-list-h button { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.04em; text-transform: none; color: var(--text); background: none; border: 0; padding: 0; cursor: pointer; transition: color .15s; }
.g-list-h button:hover { color: var(--accent); }
.g-list ul { list-style: none; margin: 0; padding: 0 0 6px; max-height: 210px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.14) transparent; }
.g-list li { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 3px 12px; cursor: pointer; color: var(--text); }
.g-list li:hover { background: rgba(255,255,255,0.03); color: var(--pale); }
.g-list-v { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-list-r { font-size: var(--fs-min); color: var(--text2); white-space: nowrap; }
.g-dot { width: 6px; height: 6px; border-radius: 50%; background: #3f5566; }
.g-d-bad { background: #f0a0a0; box-shadow: 0 0 6px rgba(210,80,74,0.6); }
.g-d-warn { background: #e2c39f; }
.g-d-quiet { background: #8fb3c4; }
.g-d-unknown { background: #5d7889; }
.g-n.hl .g-ring { stroke: rgba(204,220,232,0.7); }
html.g-lock, html.g-lock body { overflow: hidden; }
@media (max-width: 700px) { .g-list-r { display: none; } .g-list li { grid-template-columns: 8px minmax(0, 1fr); } }

/* ── Graph: TLP picker (printed on the image and the report) ── */
.g-tlp-w { position: relative; display: inline-flex; }
.g-tools .g-tlp { display: inline-flex; align-items: center; gap: 6px; color: var(--text2); }
.g-tlp i, .g-tlp-m i { width: 6px; height: 6px; border-radius: 50%; flex: none; }
.g-tlp-m { position: absolute; right: 0; top: calc(100% + 8px); z-index: 6; display: grid; min-width: 250px; padding: 5px; background: #0c0e11; border: 1px solid var(--card-border); border-radius: 0; box-shadow: 0 14px 34px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.08); }
.g-tlp-m[hidden] { display: none; }
.g-tools .g-tlp-m button { display: grid; grid-template-columns: 6px auto; align-items: center; column-gap: 9px; padding: 6px 8px; text-align: left; border-radius: 0; }
.g-tools .g-tlp-m button:hover { background: rgba(255,255,255,0.04); }
.g-tlp-m small { grid-column: 2; font-size: var(--fs-min); letter-spacing: 0; color: var(--text2); }

/* ── Graph: icon buttons, the ? in the corner, the right-click menu ── */
.g-tools .g-full { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; padding: 0; }
.g-full svg { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linecap: square; }
.g-canvas { position: relative; }
.g-qw { position: absolute; right: 10px; bottom: 10px; z-index: 5; }
.g-q { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; padding: 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); background: rgba(13,15,18,0.8); border: 1px solid rgba(255,255,255,0.16); border-radius: 50%; cursor: help; transition: color .15s, border-color .15s; }
.g-qw:hover .g-q, .g-qw.open .g-q { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 50%, transparent); }
.g-qw .g-sheet { display: none; top: auto; right: 0; bottom: calc(100% + 8px); }
.g-qw:hover .g-sheet, .g-qw:focus-within .g-sheet, .g-qw.open .g-sheet { display: grid; }
.g-menu { position: fixed; z-index: 4100; min-width: 230px; max-width: 320px; padding: 5px; background: #0c0e11; border: 1px solid var(--card-border); border-radius: 0; box-shadow: 0 16px 40px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.08); font-family: var(--mono); font-size: var(--fs-min); }
.g-menu[hidden] { display: none; }
.g-menu-h { display: grid; grid-template-columns: 8px auto 1fr; align-items: center; column-gap: 8px; row-gap: 3px; padding: 6px 8px 8px; border-bottom: 1px solid rgba(255,255,255,0.07); margin-bottom: 4px; }
.g-menu-h b { font-size: var(--fs-min); font-weight: 600; letter-spacing: 0.12em; color: var(--text2); }
.g-menu-h span { font-size: var(--fs-min); color: var(--text2); justify-self: end; }
.g-menu-h code { grid-column: 1 / -1; font-family: var(--mono); font-size: var(--fs-min); color: var(--pale); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-menu button, .g-menu a { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; padding: 6px 8px; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); background: none; border: 0; border-radius: 0; text-align: left; text-decoration: none; cursor: pointer; }
.g-menu button:hover, .g-menu a:hover { background: rgba(255,255,255,0.04); color: var(--pale); }
.g-menu small { font-size: var(--fs-min); color: var(--text2); }
.g-menu a svg { width: 9px; height: 9px; color: var(--text2); flex: none; }
.g-menu .warn { color: color-mix(in srgb, var(--red) 75%, #ffffff); }
.g-menu hr { border: 0; border-top: 1px solid rgba(255,255,255,0.07); margin: 4px 0; }
.g-d-self { background: #9fd2ea; }
.g-d-family { background: #f07a72; }
.g-d-info { background: #7d93a6; }


/* ── Ambient light: the page takes a faint glow in the verdict's colour ── */
#app-main::before { content: ''; position: fixed; left: 0; right: 0; top: 0; height: 55vh; pointer-events: none; z-index: -1; opacity: 0; transition: opacity 1.4s ease, background 1.4s ease; background: radial-gradient(60% 90% at 50% 0%, var(--amb, transparent), transparent 70%); }
body[data-verdict] #app-main::before { opacity: 1; }
body[data-verdict="red"]    { --amb: rgba(210,80,74,0.16); }
body[data-verdict="orange"] { --amb: rgba(211,154,76,0.14); }
body[data-verdict="teal"]   { --amb: rgba(92,194,174,0.11); }
body[data-verdict="grey"]   { --amb: rgba(152,184,204,0.07); }

/* ── What changed since the last scan of the same indicator ── */
.vp-diff { color: var(--pale); }
.vp-diff .vp-diff-k { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; text-transform: uppercase; color: var(--accent); margin-right: 10px; white-space: nowrap; }
.vp-diff b { font-weight: 600; color: var(--pale); }

/* ── Recent scans (this browser only) ── */
/* Home: the recent analyses, one quiet line each, under the search box */
.hist-row { width: min(680px, 100%); margin: 26px auto 0; font-family: var(--mono); }
.hist-row[hidden] { display: none; }
#hero.searched .hist-row { display: none; }
.hist-h { display: flex; align-items: baseline; gap: 12px; padding: 0 2px 7px; }
.hist-k { font-size: var(--fs-min); letter-spacing: .14em; text-transform: uppercase; color: var(--text2); }
.hist-n { font-size: var(--fs-min); color: var(--text2); letter-spacing: .04em; }
.hist-clear { margin-left: auto; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); background: none; border: 0; cursor: pointer; padding: 2px 4px; }
.hist-clear:hover { color: var(--accent); }
.hist-list { list-style: none; margin: 0; padding: 0; max-height: 312px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.16) transparent;
  background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 0; }
.hist-list li + li { border-top: 1px solid rgba(255,255,255,0.06); }
.hist-it { display: grid; grid-template-columns: 8px minmax(0, 1.5fr) 44px 112px minmax(0, 2fr) 74px; align-items: center; gap: 12px; width: 100%; padding: 8px 12px; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); background: none; border: 0; text-align: left; cursor: pointer; transition: background .15s; }
.hist-it:hover, .hist-it:focus-visible { background: rgba(255,255,255,0.04); outline: none; }
.hist-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--text2); }
.hist-it.h-red .hist-dot { background: #f07a72; } .hist-it.h-orange .hist-dot { background: #e2b26b; } .hist-it.h-teal .hist-dot { background: #5cc2ae; }
.hist-ioc { color: var(--pale); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hist-kind { font-size: var(--fs-min); letter-spacing: .08em; color: var(--text2); text-transform: uppercase; }
.hist-v { font-size: var(--fs-min); letter-spacing: .1em; text-transform: uppercase; color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hist-it.h-red .hist-v { color: #f3a49c; } .hist-it.h-orange .hist-v { color: #ecc58c; } .hist-it.h-teal .hist-v { color: #86ddcf; }
.hist-why { color: var(--text2); font-size: var(--fs-min); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hist-at { font-size: var(--fs-min); color: var(--text2); text-align: right; white-space: nowrap; }
@media (max-width: 700px) {
  .hist-it { grid-template-columns: 8px minmax(0, 1fr) auto; gap: 4px 10px; }
  .hist-kind, .hist-why { display: none; }
  .hist-at { grid-column: 2 / -1; text-align: left; }
}

/* ── TLP picker (report) ── */
.tlp-pick { position: fixed; z-index: 4200; width: 300px; padding: 5px; background: #0c0e11; border: 1px solid var(--card-border); border-radius: 0; box-shadow: 0 16px 40px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.08); font-family: var(--mono); }
.tlp-pick[hidden] { display: none; }
.tlp-pick-h { font-size: var(--fs-min); letter-spacing: .12em; text-transform: uppercase; color: var(--text2); padding: 6px 8px 7px; border-bottom: 1px solid rgba(255,255,255,0.07); margin-bottom: 4px; }
.tlp-pick button { display: grid; grid-template-columns: 7px 1fr; align-items: center; column-gap: 10px; row-gap: 2px; width: 100%; padding: 6px 8px; text-align: left; background: none; border: 0; border-radius: 0; cursor: pointer; color: var(--text); font-family: var(--mono); }
.tlp-pick button:hover, .tlp-pick button.on { background: rgba(255,255,255,0.045); }
.tlp-pick i { width: 7px; height: 7px; border-radius: 50%; }
.tlp-pick b { font-size: var(--fs-min); font-weight: 600; color: var(--pale); }
.tlp-pick small { grid-column: 2; font-size: var(--fs-min); color: var(--text2); line-height: 1.35; }

/* ── Graph: the details bar floats over the drawing (the page never jumps) ── */
.g-canvas > .g-info { position: absolute; left: 10px; right: 38px; bottom: 10px; z-index: 4; min-height: 0; border: 1px solid rgba(159,210,234,0.16); border-radius: 0; background: rgba(17,19,23,0.82); backdrop-filter: blur(10px) saturate(1.2); -webkit-backdrop-filter: blur(10px) saturate(1.2); box-shadow: 0 10px 30px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.06); }
.g-canvas > .g-info[hidden] { display: none; }
.g-wrap { background: #05080c; }   /* the Radar's night (js/graph.js, G_BG) */

/* ── Graph: filter bar, focus, search hits, empty state ── */
.g-n, .g-e { transition: opacity .2s; }
.g-n.dim { opacity: .13; }
.g-e.dim { opacity: .08; }
.g-n.hit .g-ring { stroke: #e3b36c; stroke-dasharray: none; }
.g-n.hit .g-box { opacity: 1 !important; }
.g-tools .g-flt-b[aria-expanded="true"] { color: var(--accent); }
.g-flt { position: absolute; top: 34px; left: 10px; right: 10px; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 6px 8px; background: rgba(17,19,23,0.86); border: 1px solid rgba(159,210,234,0.16); border-radius: 0; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-family: var(--mono); font-size: var(--fs-min); }
.g-flt[hidden] { display: none; }
.g-flt-q { flex: 1 1 160px; min-width: 120px; font-family: var(--mono); font-size: var(--fs-min); color: var(--pale); background: rgba(0,0,0,0.25); border: 1px solid rgba(255,255,255,0.12); border-radius: 0; padding: 4px 8px; outline: none; }
.g-flt-q:focus { border-color: color-mix(in srgb, var(--accent) 55%, transparent); }
.g-flt button { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .06em; color: var(--text2); background: none; border: 1px solid transparent; border-radius: 0; padding: 2px 6px; cursor: pointer; }
.g-flt button:hover { color: var(--pale); }
.g-flt button.on { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.g-flt-t, .g-flt-s { display: inline-flex; gap: 2px; }
.g-flt-s { padding-left: 8px; border-left: 1px solid rgba(255,255,255,0.1); }
.g-flt-n { margin-left: auto; color: var(--text2); font-size: var(--fs-min); }
.g-flt .g-flt-x { color: var(--text2); }
.g-empty { position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding-bottom: 54px !important; gap: 6px; pointer-events: none; text-align: center; padding: 0 20px; }
.g-empty[hidden] { display: none; }
.g-empty svg { width: 90px; height: 45px; fill: #9fd2ea; stroke: rgba(159,210,234,0.5); stroke-width: .6; opacity: .7; }
.g-empty b { font-family: var(--display); font-size: 15px; letter-spacing: .08em; color: var(--pale); font-weight: 600; }
.g-empty span { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); max-width: 340px; }
/* a short map (phones): the line stays under the node instead of over it */
@media (max-width: 700px) { .g-empty { padding-bottom: 10px !important; gap: 2px; } .g-empty b { font-size: 13px; } .g-empty span { display: none; } }

/* ── 9 · numbers in the reasons ── */
.vp-reason b.num { font-family: var(--mono); font-weight: 600; color: var(--pale); font-variant-numeric: tabular-nums; }

/* ── 11 + 28 · the ring of sources next to the verdict ── */
.vp-ring { position: relative; display: inline-flex; width: 18px; height: 18px; flex: none; cursor: help; outline: none; }
.vp-ring svg { width: 18px; height: 18px; transform: rotate(0deg); }
.vp-ring circle { transition: stroke .3s; }
.vp-ring-pop { display: none; position: absolute; top: calc(100% + 8px); left: -8px; z-index: 50; width: 340px; padding: 8px 10px; background: #0c0e11; border: 1px solid var(--card-border); border-radius: 0; box-shadow: 0 14px 34px rgba(0,0,0,0.55); font-family: var(--mono); font-size: var(--fs-min); color: var(--text); text-transform: none; letter-spacing: 0; white-space: normal; }
.vp-ring:hover .vp-ring-pop, .vp-ring:focus .vp-ring-pop { display: grid; gap: 4px; }
.rg-h { color: var(--text2); font-size: var(--fs-min); padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,0.07); margin-bottom: 2px; }
.rg-row { display: grid; grid-template-columns: 7px 40px 1fr; align-items: baseline; gap: 8px; }
.rg-row i { width: 7px; height: 7px; border-radius: 50%; align-self: center; }
.rg-row b { color: var(--pale); font-weight: 600; }
.rg-row span { color: var(--text2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── 14 · bulk: what the indicators have in common ── */
.bulk-common { margin: 4px 16px 10px; padding: 8px 10px; border: 1px solid rgba(159,210,234,0.14); border-radius: 0; background: rgba(0,0,0,0.14); font-family: var(--mono); font-size: var(--fs-min); }
.bulk-common-h { font-size: var(--fs-min); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); margin-bottom: 6px; }
.bc-row { display: grid; grid-template-columns: 100px minmax(0, 1fr) auto auto; align-items: baseline; gap: 10px; padding: 3px 0; }
.bc-k { color: var(--text2); font-size: var(--fs-min); letter-spacing: .08em; text-transform: uppercase; }
.bc-v { color: var(--pale); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bc-n { color: var(--text2); font-size: var(--fs-min); }
.bc-sel { font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); background: none; border: 0; cursor: pointer; padding: 0; }
@media (max-width: 700px) { .bc-row { grid-template-columns: 1fr auto; } .bc-k, .bc-n { display: none; } }

/* ── 18 · command palette ── */

/* ── 31 · focus you can see, a voice for screen readers ── */
:where(button, a, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.g-n:focus { outline: none; }
.g-n:focus-visible .g-ring { stroke: var(--accent); stroke-dasharray: none; }
.g-n:focus-visible .g-box { opacity: 1 !important; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ── 8 · a mark per kind of source: ◆ curated list, ● reputation, ▫ context ── */
.sg { display: inline-block; width: 6px; height: 6px; margin-right: 5px; vertical-align: 1px; opacity: .75; }
.sg-list { background: currentColor; transform: rotate(45deg) scale(.85); }
.sg-rep { background: currentColor; border-radius: 50%; }
.sg-ctx { border: 1px solid currentColor; }
.vp-src { white-space: nowrap; }

/* graph, timeline and CVEs take the whole width of the card, the label on top */
.vp-line.wide { grid-template-columns: minmax(0, 1fr); gap: 6px; }
.vp-line.wide > .svc-label { margin: 0; }

/* full screen: the canvas takes every pixel left by the toolbar (and the list, if open) */
.g-wrap.g-full-on .g-canvas { flex: 1 1 auto; min-height: 0; display: block; position: relative; }
.g-wrap.g-full-on .g-svg { position: absolute; inset: 0; width: 100%; height: 100%; }

/* each source card opens and closes with a click */
#cards-container .card-slot .card { cursor: pointer; }
#cards-container .card-slot .card:not(.card-collapsed) .card-body { cursor: auto; }
#cards-container .card-slot .card:not(.card-collapsed) .card-arrow { transform: rotate(90deg); }

/* living sky: some stars twinkle (each with its own pace, set on the element) */
@keyframes gTw { from { opacity: 1; } to { opacity: .2; } }
/* the malware family: selection and "more to open" drawn on its hexagon, not in circles */
.g-claw-back { transition: stroke .2s; }
.g-n.sel .g-claw-back { stroke: rgba(232,241,247,0.75); stroke-width: .8; }
.g-n.can-expand:not(.sel) .g-claw-back { stroke: #5cc2ae; stroke-width: .7; animation: gHexPulse 2.6s ease-in-out infinite; }
@keyframes gHexPulse { 0%, 100% { stroke-opacity: .15; } 50% { stroke-opacity: .7; } }
@media (prefers-reduced-motion: reduce) { .g-n.can-expand .g-claw-back { animation: none; stroke-opacity: .4; } }

/* "+N": the see-through node standing for what is not drawn yet */
.g-n.ghost { cursor: pointer; }
.g-n.ghost .g-frame { transition: fill .15s, stroke .15s; }
.g-n.ghost:hover .g-frame, .g-n.ghost:focus-visible .g-frame { fill: rgba(204,220,232,0.12); stroke: rgba(204,220,232,0.8); }
.g-n.ghost:hover text { fill: #e3ecf2; }

/* bulk header: the worst group is the badge, the rest a quiet line beside it */
.bulk-rest { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }


/* card footer actions: a small drawing before each word */
.vp-act { display: inline-flex; align-items: center; gap: 6px; }
.vp-act svg { width: 13px; height: 13px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }

/* ── One slim header (38px) everywhere. On the home page it is only the clock; after a
   query it carries the name, the search box (compact) and, once the card scrolls away,
   the verdict. ── */
#app-header, body.scrolled #app-header { height: 38px; background: #0e1013; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; border-bottom: 1px solid rgba(255,255,255,0.1); }
#app-header::after { display: none; }
.brand-name { font-size: 17px; text-shadow: none; }
.brand-sub-static { display: none; }
body:not(.searched) #app-header { opacity: 1; transform: none; pointer-events: none; background: transparent; border-bottom-color: transparent; }
body:not(.searched) #app-header .header-inner > :not(.hdr-clock):not(.header-spacer) { visibility: hidden; }
.hdr-clock { margin-left: 18px; flex-shrink: 0; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.1em; text-transform: uppercase; color: var(--text2); white-space: nowrap; }
#hdr-search { flex: 0 1 460px; min-width: 180px; margin-left: 20px; }
#hdr-search:empty { display: none; }
#hdr-search .search-section { margin: 0; width: 100%; }
#hdr-search .search-row { flex-direction: row; gap: 0; }
#hdr-search .search-wrap { border-radius: 0; }
#hdr-search #ioc-input { font-size: 12px; padding: 5px 10px; letter-spacing: 0.03em; }
#hdr-search #ioc-input::placeholder { font-size: var(--fs-min); }
#hdr-search .search-glyph { width: 22px; }
#hdr-search .search-glyph svg { width: 11px; height: 11px; }
#hdr-search #file-btn { width: 28px; }
#hdr-search #file-btn svg { width: 13px; height: 13px; }
#hdr-search #search-btn { width: auto; padding: 0; font-size: var(--fs-min); letter-spacing: 0.12em; }
#hdr-search .ioc-type-tag { align-self: center; margin-right: 6px; padding: 1px 6px; font-size: var(--fs-min); }
#hdr-search .type-row, #hdr-search .hist-row { display: none; }
#hdr-search .scan-loop-bar { bottom: -1px; }
body.searched .hv-ioc { display: none; }   /* the indicator is already in the search box */
@media (max-width: 700px) {
  .hdr-clock { display: none; }
  #hdr-search { margin-left: 12px; min-width: 0; flex: 1 1 auto; }
  #hdr-search #file-btn, #hdr-search .ioc-type-tag { display: none; }
}

/* the Scan button is an eye: a hunter's, with a slit pupil; while a scan runs it looks around */
#search-btn { flex-direction: row; align-items: center; justify-content: center; padding: 0 20px; }
.scan-eye { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linejoin: round; }
.scan-eye .se-iris circle { stroke-width: 1.4; }
.scan-eye .se-pupil { fill: currentColor; stroke: none; transform-origin: 12px 12px; transition: transform .25s ease; }
#search-btn:not([data-scanning]):hover .se-pupil { transform: scaleX(1.9); }
#search-btn[data-scanning] .se-iris { animation: eyeLook 1.6s ease-in-out infinite; }
.scan-eye .se-x { display: none; stroke-width: 1.7; stroke-linecap: round; }
#search-btn[data-scanning]:hover .se-iris { display: none; }
#search-btn[data-scanning]:hover .se-x { display: inline; }
@keyframes eyeLook { 0%, 100% { transform: translateX(-2.2px); } 50% { transform: translateX(2.2px); } }
@media (prefers-reduced-motion: reduce) { #search-btn[data-scanning] .se-iris { animation: none; } }
#hdr-search #search-btn { padding: 0 11px; }
#hdr-search .scan-eye { width: 16px; height: 16px; }
@media (max-width: 700px) { #search-btn { padding: 10px; } }
/* phones: the card's actions keep their words; Details goes to its own line when they do not fit */
@media (max-width: 700px) { .vp-foot { flex-wrap: wrap; gap: 10px 16px; } .vp-foot .vp-toggle { margin-left: auto; } }

/* the slim header after a query: the name, the search box (all the room left) and the clock */
#app-header .hdr-up, #app-header .hdr-verdict { display: none !important; }
body.searched #app-header .header-spacer { display: none; }
#hdr-search { flex: 1 1 auto; max-width: none; }
/* the verdict card no longer hands over to the header: it simply scrolls away */
body.vp-docked #verdict-unit { opacity: 1; pointer-events: auto; }
/* no coloured light at the top of the page */
#app-main::before { display: none; }
/* recent analyses, softer: a light veil instead of a box, faint separators, six lines then a fade */
.hist-list { background: rgba(10,12,15,0.34); border: 0; border-radius: 0; max-height: 196px;
  -webkit-mask-image: linear-gradient(180deg, #000 82%, transparent); mask-image: linear-gradient(180deg, #000 82%, transparent); }
.hist-list li + li { border-top: 1px solid rgba(255,255,255,0.035); }
.hist-it { grid-template-columns: 7px minmax(0, 1.4fr) 104px minmax(0, 2fr) 62px; gap: 12px; padding: 6px 12px; font-size: var(--fs-min); }
.hist-it:hover, .hist-it:focus-visible { background: rgba(255,255,255,0.035); }
.hist-kind { display: none; }
.hist-ioc { color: var(--text); }
.hist-dot { width: 5px; height: 5px; opacity: .9; }
.hist-v { font-size: var(--fs-min); }
.hist-why, .hist-at { opacity: .85; }
@media (max-width: 700px) { .hist-it { grid-template-columns: 7px minmax(0, 1fr) auto; } }

/* ── the graph's map: a dot-matrix world, the IPs by country, the lists below ── */
.g-map { display: none; width: 100%; height: auto; }
.g-wrap.g-map-on .g-svg { display: none; }
.g-wrap.g-map-on .g-map { display: block; }
.g-tools .g-map-b[aria-pressed="true"] { color: var(--pale); }
.g-map .g-map-c { cursor: pointer; }
.g-map .g-map-c:hover circle:nth-child(2), .g-map .g-map-c:focus-visible circle:nth-child(2) { fill-opacity: .6; }
.g-map .g-map-t { fill: rgba(220,230,238,0.78); white-space: pre; }
.g-flt-cc { font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); }

/* ── #1 known benign: a quiet chip by the verdict, a first line in the reasons ── */
.vp-kb { font-family: var(--display); font-size: var(--fs-min); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #7fe3d3; border: 1px solid rgba(92,194,174,0.45); padding: 2px 7px; border-radius: 0; white-space: nowrap; }
.vp-kb-line > span b { color: #7fe3d3; font-weight: 600; }

/* ── #9 typical ATT&CK techniques of the family ── */
.vp-atk { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 6px; margin-top: 8px; }
.vp-atk-k { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .1em; text-transform: uppercase; color: var(--text2); margin-right: 4px; cursor: help; }
.vp-atk-t { display: inline-flex; gap: 6px; align-items: baseline; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); text-decoration: none; padding: 2px 7px; border: 1px solid rgba(255,255,255,0.12); border-radius: 0; }
.vp-atk-t b { font-weight: 600; color: var(--pale); }
.vp-atk-t:hover { border-color: color-mix(in srgb, var(--accent) 55%, transparent); color: var(--pale); }

/* ── #4 fingerprints ── */

/* ── #6 are two indicators related? ── */
.bulk-rel { margin: 12px 16px 4px; padding: 10px 12px; border: 1px solid rgba(255,255,255,0.1); border-left: 3px solid var(--text2); border-radius: 0; background: rgba(0,0,0,0.14); font-family: var(--mono); font-size: var(--fs-min); }
.bulk-rel.rel-yes { border-left-color: #ef7b70; } .bulk-rel.rel-maybe { border-left-color: #e3b36c; }
.bulk-rel-h { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; margin-bottom: 6px; }
.bulk-rel-k { font-size: var(--fs-min); letter-spacing: .12em; text-transform: uppercase; color: var(--text2); }
.bulk-rel-h b { font-family: var(--display); font-size: 14px; letter-spacing: .08em; text-transform: uppercase; color: var(--pale); }
.bulk-rel-p { color: var(--text2); font-size: var(--fs-min); }
.bulk-rel-l { color: var(--text2); font-size: var(--fs-min); margin-left: auto; }
.bulk-rel ul { list-style: none; display: grid; gap: 3px; }
.bulk-rel li { display: flex; gap: 9px; align-items: baseline; color: var(--text); }
.rel-w { flex: none; width: 7px; height: 7px; border-radius: 50%; transform: translateY(-1px); }
.rel-strong { background: #ef7b70; } .rel-medium { background: #e3b36c; } .rel-weak { background: var(--text2); }
.bulk-rel p { color: var(--text2); }

/* the filter bar: a strip right under the toolbar, across the whole graph (no gap, no float) */
.g-flt { position: static; inset: auto; z-index: auto; margin: 0; padding: 6px 12px; border: 0; border-bottom: 1px solid rgba(255,255,255,0.08); border-radius: 0; background: rgba(0,0,0,0.22); box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.g-wrap.g-full-on .g-flt { flex: none; }
@media (max-width: 700px) { .vp-atk-t span { display: none; } .vp-atk-k { flex-basis: 100%; } }
.g-map .g-map-l { fill: rgba(220,230,238,0.62); }

/* ── Access: the header button, the hint under the examples, the request screen ── */
.hdr-access { flex-shrink: 0; margin-left: 14px; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; text-transform: uppercase; color: var(--text); background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.14); border-radius: 0; padding: 4px 10px; cursor: pointer; pointer-events: all; visibility: visible !important; transition: background .15s, border-color .15s; }
.hdr-access:hover { background: rgba(255,255,255,0.12); border-color: rgba(255,255,255,0.22); }
body.searched #hero.searched html.acc-lock, html.acc-lock body { overflow: hidden; }
.acc-toast { position: fixed; left: 50%; bottom: 28px; z-index: 6000; transform: translate(-50%, 12px); opacity: 0; transition: opacity .3s, transform .3s; font-family: var(--mono); font-size: 12px; color: #eef3f6; background: rgba(13,15,18,0.92); border: 1px solid rgba(255,255,255,0.14); border-left: 3px solid #2bb39f; padding: 10px 16px; border-radius: 0; box-shadow: 0 14px 40px rgba(0,0,0,0.45); }
.acc-toast.on { opacity: 1; transform: translate(-50%, 0); }

/* the screen: the snow leopard far behind (blurred, dimmed, drifting with the pointer), a
   vignette, and a dark glass panel standing in front of it */
.acc { position: fixed; inset: 0; z-index: 4500; display: grid; place-items: center; padding: 28px 16px; overflow-y: auto;
  --text: #dfe6eb; --text2: #9fb0bd; --pale: #ffffff; --accent: #9fd2ea; color: var(--text); font-family: var(--sans); }
.acc[hidden] { display: none; }
.acc-bg { position: fixed; inset: -30px; background: #2a2c2f url("/bg_snow_leopard.webp") 75% 40% / cover no-repeat; filter: blur(3.5px) brightness(0.48) saturate(0.85);
  transform: scale(1.05); }
.acc::before { content: ''; position: fixed; inset: 0; pointer-events: none; background: radial-gradient(110% 85% at 50% 42%, rgba(5,6,8,0) 30%, rgba(5,6,8,0.7) 100%), linear-gradient(180deg, rgba(5,6,8,0.25), rgba(5,6,8,0) 30%, rgba(5,6,8,0.35)); }
.acc-panel { position: relative; width: min(520px, 100%); padding: 30px 32px 24px; background: rgba(13,15,18,0.74); border: 1px solid rgba(255,255,255,0.12); border-radius: 0;
  -webkit-backdrop-filter: blur(18px) saturate(1.1); backdrop-filter: blur(18px) saturate(1.1);
  box-shadow: 0 50px 120px rgba(0,0,0,0.55), 0 12px 30px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.06); animation: accIn .5s cubic-bezier(.2,.7,.2,1) both; }
.acc-panel::before { content: ''; position: absolute; top: 0; left: 24px; right: 24px; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.28), transparent); }
@keyframes accIn { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .acc-panel { animation: none; } }
.acc-x { position: absolute; top: 12px; right: 14px; width: 30px; height: 30px; font-size: 20px; line-height: 1; color: var(--text2); background: none; border: 0; cursor: pointer; border-radius: 0; }
.acc-x:hover { color: var(--pale); background: rgba(255,255,255,0.06); }
.acc-brand { font-family: var(--display); font-size: 24px; font-weight: 600; letter-spacing: .06em; line-height: 1.1; color: var(--pale); display: flex; flex-direction: column; align-items: center; gap: 5px; text-align: center; }
.acc-brand small { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .24em; text-transform: uppercase; color: var(--text2); }
.acc h2 { text-align: center; margin: 18px 0 6px; font-family: var(--display); font-size: 15px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--pale); }
.acc-lead { font-size: 13.5px; line-height: 1.6; color: var(--text); margin-bottom: 18px; text-align: center; }
.acc-lead[hidden] { display: none; }
.acc[data-step="key"] h2 { margin-bottom: 18px; }
.acc[data-step="key"] .acc-lead { margin-top: -10px; }
.acc-step[data-s="key"] .acc-link, .acc-done .acc-link { justify-self: center; }
.acc-kind { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); margin-top: -2px; }
.acc-kind[hidden] { display: none; }
.acc-note small { display: block; margin-top: 4px; font-size: 12px; color: var(--text2); }
.acc-who { color: var(--pale); font-weight: 600; display: inline-block; }
.acc-who.pop { animation: accWho .35s ease; }
@keyframes accWho { from { opacity: .2; transform: translateY(3px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .acc-who.pop { animation: none; } }
.acc-step { display: grid; gap: 8px; }
.acc-step[hidden] { display: none; }
.acc-l { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .12em; text-transform: uppercase; color: var(--text2); margin-top: 6px; }
.acc-l i { font-style: normal; letter-spacing: .04em; text-transform: none; opacity: .8; }
.acc-in { width: 100%; font-family: var(--mono); font-size: 13px; color: var(--pale); background: rgba(0,0,0,0.38); border: 1px solid rgba(255,255,255,0.14); border-radius: 0; padding: 10px 12px; outline: none; transition: border-color .15s, background .15s; }
.acc-in:focus { border-color: rgba(159,210,234,0.6); background: rgba(0,0,0,0.5); }
textarea.acc-in { resize: vertical; min-height: 74px; font-family: var(--sans); font-size: 13.5px; line-height: 1.5; }
select.acc-in { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #9fb0bd 50%), linear-gradient(135deg, #9fb0bd 50%, transparent 50%); background-position: calc(100% - 16px) 50%, calc(100% - 11px) 50%; background-size: 5px 5px; background-repeat: no-repeat; }
select.acc-in option { background: #16191d; color: #dfe6eb; }
.acc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.acc-grid > div { display: grid; gap: 8px; }
.acc-seg { display: inline-flex; justify-self: start; margin-top: 4px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; overflow: hidden; }
.acc-seg button { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .06em; color: var(--text2); background: none; border: 0; padding: 6px 14px; cursor: pointer; }
.acc-seg button + button { border-left: 1px solid rgba(255,255,255,0.14); }
.acc-seg button.on { color: #0b0e11; background: #dfe6eb; }
.acc-go { margin-top: 12px; font-family: var(--display); font-size: 14px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #0b0e11; background: linear-gradient(180deg, #f1f4f6, #d3d9de); border: 0; border-radius: 0; padding: 11px 16px; cursor: pointer; box-shadow: 0 6px 18px rgba(0,0,0,0.35); transition: filter .15s, transform .15s; }
.acc-go:hover { filter: brightness(1.06); }
.acc-go:active { transform: translateY(1px); }
.acc-go.busy { opacity: .6; cursor: progress; }
.acc-link { justify-self: start; font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); background: none; border: 0; padding: 4px 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(159,210,234,0.4); }
.acc-note { font-size: 13px; line-height: 1.55; color: var(--text); padding: 8px 10px; border-left: 2px solid rgba(159,210,234,0.5); background: rgba(255,255,255,0.03); }
.acc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.acc-ok { display: flex; gap: 10px; align-items: flex-start; margin-top: 8px; font-size: 12px; line-height: 1.5; color: var(--text2); cursor: pointer; }
.acc-ok input { margin-top: 3px; accent-color: #9fd2ea; }
.acc-done { justify-items: center; text-align: center; padding: 6px 0 2px; }
.acc-mark { width: 34px; height: 34px; border-radius: 50%; border: 1.5px solid rgba(227,179,108,0.8); position: relative; }
.acc-mark::after { content: ''; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: #e3b36c; }
.acc-done.ok .acc-mark { border-color: rgba(92,194,174,0.85); }
.acc-done.ok .acc-mark::after { width: 12px; height: 7px; margin: -6px 0 0 -6px; border-radius: 0; background: none; border-left: 2px solid #5cc2ae; border-bottom: 2px solid #5cc2ae; transform: rotate(-45deg); }
.acc-msg { font-size: 14px; line-height: 1.6; color: var(--pale); }
.acc-err { margin-top: 12px; font-size: 12.5px; color: #ffb3aa; }
.acc-foot[hidden] { display: none; }
.acc-foot { text-align: center; margin-top: 18px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.08); font-family: var(--mono); font-size: var(--fs-min); line-height: 1.6; color: var(--text2); }
@media (max-width: 560px) { .acc-panel { padding: 24px 20px 20px; } .acc-grid { grid-template-columns: 1fr; } }

/* without access: the examples are saved results; scanning again and files wait for a key */
/* without a key: the graph's list is a preview (the first five) */
/* Request access shows on the home page too: it is how a first visit starts */


/* ── Panels: the access screen's card as the one surface ──────────────────────────────
   Smoked glass over the (already blurred) photo, a fine light border, 6px corners, a light
   hairline along the top edge and a deep, soft shadow. The verdict is one panel; the
   sources are another, their rows inside it split by fine lines, each keeping its verdict
   as a thin bar on the left. The menus and the palette are the same panel, a little denser. */
#cards-container { position: relative; border: 1px solid var(--panel-line); border-radius: 0; background: var(--panel-bg); box-shadow: var(--panel-depth), var(--panel-hl); overflow: hidden; }
#cards-container::before { content: ''; position: absolute; top: 0; left: 24px; right: 24px; height: 1px; z-index: 1; pointer-events: none; background: linear-gradient(90deg, transparent, var(--panel-hair), transparent); }
#cards-container:not(:has(> .card-slot:not(.slot-empty))) { display: none; }
#results #cards-container .card-slot + .card-slot { margin-top: 0; }
#cards-container .card-slot:not(.slot-empty) ~ .card-slot:not(.slot-empty) { border-top: 1px solid var(--panel-sep); }
#cards-container .card:not(.vp-card) { background: transparent; border: 0; border-radius: 0; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: inset 2px 0 0 var(--vcolor, transparent); }
#cards-container .card:not(.vp-card)::after { display: none; }
#cards-container .card:not(.vp-card):hover { background: rgba(255,255,255,0.03); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: inset 2px 0 0 var(--vcolor, transparent); }
#cards-container .card-head, #cards-container .card-head:hover { background: transparent; }
#cards-container .card:not(.card-collapsed) .card-head { border-bottom-color: var(--panel-sep); }
.g-menu, .tlp-pick, .g-sheet, .g-tlp-m { border-color: rgba(255,255,255,0.12); border-radius: 0; background: rgba(13,15,18,0.92); -webkit-backdrop-filter: blur(18px) saturate(1.1); backdrop-filter: blur(18px) saturate(1.1);
  box-shadow: 0 30px 80px rgba(0,0,0,0.5), 0 10px 26px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.06); }
.g-menu::before, .tlp-pick::before, .g-sheet::before, .g-tlp-m::before { content: ''; position: absolute; top: 0; left: 18px; right: 18px; height: 1px; pointer-events: none; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.28), transparent); }

/* with a key: the person's name at the right end of the column, opening Options / Exit */
.hdr-me-wrap { position: relative; margin-left: 14px; flex-shrink: 0; pointer-events: all; visibility: visible !important; }
.hdr-me-wrap[hidden] { display: none; }
body:is(.searched, .newtab) .hdr-me-wrap, body.win-max .hdr-me-wrap { visibility: hidden !important; }   /* the header is out of sight with a tab open: so is its menu, for the keyboard too */
.hdr-me { display: inline-flex; align-items: center; gap: 7px; max-width: 240px; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .1em; text-transform: uppercase; color: var(--text); background: none; border: 1px solid transparent; border-radius: 0; padding: 4px 8px; margin-right: -8px; cursor: pointer; }
.hdr-me:hover, .hdr-me[aria-expanded="true"] { background: rgba(255,255,255,0.07); border-color: rgba(255,255,255,0.14); }
.hdr-me-n { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hdr-me > svg { width: 9px; height: 6px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.hdr-me[aria-expanded="true"] > svg { transform: rotate(180deg); }
.hdr-menu { position: absolute; right: -8px; top: calc(100% + 8px); z-index: 1100; min-width: 160px; padding: 5px; display: grid; background: rgba(13,15,18,0.94); border: 1px solid rgba(255,255,255,0.12); border-radius: 0;
  box-shadow: 0 30px 80px rgba(0,0,0,0.5), 0 10px 26px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.06); -webkit-backdrop-filter: blur(18px) saturate(1.1); backdrop-filter: blur(18px) saturate(1.1); }
.hdr-menu[hidden] { display: none; }
.hdr-menu::before { content: ''; position: absolute; top: 0; left: 14px; right: 14px; height: 1px; pointer-events: none; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.28), transparent); }
.hdr-menu button { text-align: left; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .04em; color: var(--text); background: none; border: 0; border-radius: 0; padding: 8px 10px; cursor: pointer; }
.hdr-menu button:hover, .hdr-menu button:focus-visible { background: rgba(255,255,255,0.07); color: var(--pale); outline: none; }
.acc-who-am { font-size: 13px; color: var(--text2); text-align: center; margin: -6px 0 6px; }
.acc-who-am b { color: var(--pale); font-weight: 500; }
/* the search hint changes softly */
#ioc-input::placeholder { transition: opacity .2s ease; }
#ioc-input.ph-out::placeholder { opacity: 0; }

/* The header on wide screens: the name in the screen's left corner, the clock in its right
   corner; between them the search and Request access (or the person's name) span exactly the
   cards' column. Narrower, everything sits in the column. */
@media (min-width: 1260px) {
  #app-header .brand-row { position: absolute; left: 18px; top: 0; bottom: 0; display: flex; align-items: center; margin: 0; }
  #app-header .hdr-clock { position: absolute; right: 18px; top: 0; bottom: 0; display: flex; align-items: center; margin: 0; }
  #hdr-search { margin-left: 0; }
  .hdr-me { margin-right: 0; }
}

/* the greeting on the home page (people with access) */
.hb-greet { width: min(680px, 100%); margin: -18px auto 10px; text-align: left; font-family: var(--mono); font-size: var(--fs-min); font-weight: 400; letter-spacing: .16em; text-transform: uppercase; color: var(--pale); opacity: .9; text-shadow: var(--sub-shadow); animation: hbGreet .8s ease .15s both; }
#hero.searched .hb-greet { display: none; }
.hb-greet[hidden] { display: none; }
@keyframes hbGreet { from { opacity: 0; transform: translateY(4px); } to { opacity: .9; transform: none; } }
@media (prefers-reduced-motion: reduce) { .hb-greet { animation: none; } }
/* the admin panel: the access screen, wider */
.acc[data-step="admin"] .acc-panel { width: min(900px, 100%); }
.adm-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 6px; }
.adm-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.adm-tabs button { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; text-transform: uppercase; color: var(--text2); background: none; border: 1px solid transparent; border-radius: 0; padding: 6px 10px; cursor: pointer; }
.adm-tabs button b { font-weight: 600; color: var(--text); margin-left: 4px; }
.adm-tabs button:hover { color: var(--pale); }
.adm-tabs button.on { color: var(--pale); background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.14); }
.adm-q { flex: 1 1 220px; width: auto; padding: 8px 12px; font-size: 12px; }
.adm-list { max-height: min(60vh, 560px); overflow-y: auto; margin: 4px -6px 0; padding: 0 6px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.16) transparent; }
.adm-row { padding: 12px 4px; border-top: 1px solid rgba(255,255,255,0.07); }
.adm-top { display: flex; gap: 16px; align-items: flex-start; }
.adm-row:first-child { border-top: 0; }
.adm-main { flex: 1 1 auto; min-width: 0; cursor: pointer; }
.adm-who { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.adm-who b { color: var(--pale); font-weight: 600; font-size: 14px; }
.adm-mail { font-family: var(--mono); font-size: 12px; color: var(--accent); overflow-wrap: anywhere; }
.adm-pill { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .1em; text-transform: uppercase; color: var(--text2); border: 1px solid rgba(255,255,255,0.14); border-radius: 0; padding: 1px 6px; }
.adm-sub { font-size: 12px; color: var(--text2); margin-top: 2px; }
.adm-why { font-size: 13px; color: var(--text); margin-top: 6px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.adm-more { display: none; margin-top: 6px; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); overflow-wrap: anywhere; }
.adm-more a { display: block; color: var(--accent); margin-bottom: 3px; }
.adm-row.open .adm-why { -webkit-line-clamp: unset; display: block; white-space: pre-wrap; }
.adm-row.open .adm-more { display: block; }
.adm-acts { display: flex; gap: 6px; flex-shrink: 0; }
.adm-acts button { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; text-transform: uppercase; color: var(--pale); background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.16); border-radius: 0; padding: 6px 11px; cursor: pointer; }
.adm-acts button:hover { background: rgba(255,255,255,0.12); }
.adm-acts button.go { background: #1f8a77; border-color: #1f8a77; color: #fff; }
.adm-acts button.go:hover { background: #24a08a; }
.adm-acts button:disabled { opacity: .5; cursor: progress; }
.adm-empty { padding: 26px 0; text-align: center; font-size: 13px; color: var(--text2); }
@media (max-width: 600px) { .adm-top { flex-direction: column; gap: 8px; } }

/* a shared result: when it was captured, and by whom */
.vp-shared { display: flex; align-items: center; gap: 8px; padding: 8px 16px; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; color: var(--text2); border-bottom: 1px solid var(--panel-sep); background: rgba(255,255,255,0.025); }
.vp-shared b { font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--pale); }
.vp-shared svg { width: 13px; height: 13px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linecap: round; }
/* Options: one button copies the key (it is never shown) */
.acc-keybox { display: grid; gap: 8px; margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,0.08); }
.acc-copykey { width: 100%; padding: 10px 12px; }
.acc-mini { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; text-transform: uppercase; color: var(--pale); background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.16); border-radius: 0; padding: 8px 11px; cursor: pointer; }
.acc-mini:hover { background: rgba(255,255,255,0.12); }
.acc-keyhint { margin: 0; text-align: center; font-size: var(--fs-min); color: var(--text2); }

/* the admin panel: notes, last access, forms, the sources, the danger zone */
.adm-static { cursor: default; }
.adm-ioc { font-family: var(--mono); font-size: 13px; overflow-wrap: anywhere; }
.adm-seen { color: var(--text); }
.adm-seen.never { color: #e3b36c; }
.adm-note-v { margin-top: 6px; padding: 5px 9px; font-size: 12px; color: var(--text); border-left: 2px solid #e3b36c; background: rgba(227,179,108,0.06); border-radius: 0; white-space: pre-wrap; }
.adm-extra { display: none; margin-top: 10px; }
.adm-row.open .adm-extra { display: block; }
.adm-note { min-height: 44px; font-size: 12.5px; }
.adm-acts a { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; text-transform: uppercase; color: var(--pale); text-decoration: none; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.16); border-radius: 0; padding: 6px 11px; }
.adm-acts a:hover { background: rgba(255,255,255,0.12); }
.adm-acts button.armed, .adm-dbtn.armed { background: #8a2a22; border-color: #a8322d; color: #fff; }
.adm-form { display: grid; gap: 8px; padding: 8px 2px 4px; }
.adm-form .acc-l i { font-style: normal; letter-spacing: .04em; text-transform: none; opacity: .8; }
.adm-lead { margin: 6px 0 8px; font-size: 12.5px; color: var(--text2); }
.adm-samples { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px 12px; }
.adm-sample { display: grid; grid-template-columns: 62px 1fr; align-items: center; gap: 8px; }
.adm-sample span { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .1em; text-transform: uppercase; color: var(--text2); }
.adm-sample .acc-in { padding: 7px 10px; font-size: 12px; }
.adm-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; align-self: center; }
.adm-dot.adm-ok { background: #2bb39f; } .adm-dot.adm-bad { background: #e05a4e; box-shadow: 0 0 6px rgba(224,90,78,0.6); } .adm-dot.adm-off { background: #6f7d88; }
.adm-danger { display: flex; gap: 16px; align-items: center; justify-content: space-between; margin-top: 18px; padding: 12px 14px; border: 1px solid rgba(179,38,30,0.45); border-radius: 0; background: rgba(179,38,30,0.07); }
.adm-danger b { display: block; color: var(--pale); font-size: 13px; font-weight: 600; }
.adm-danger span { display: block; margin-top: 2px; font-size: 12px; color: var(--text2); }
.adm-dbtn { flex: none; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; text-transform: uppercase; color: #ffb3aa; background: none; border: 1px solid rgba(179,38,30,0.6); border-radius: 0; padding: 7px 12px; cursor: pointer; }
.adm-dbtn:hover { background: rgba(179,38,30,0.18); }
@media (max-width: 600px) { .adm-danger { flex-direction: column; align-items: stretch; } }

/* the user's menu: Themes opens a second menu beside the first */
.hdr-menu [data-a="themes"] { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hdr-menu [data-a="themes"].on { background: rgba(255,255,255,0.07); color: var(--pale); }
.hdr-sub-ch { width: 6px; height: 10px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; opacity: .7; }
.hdr-sub { right: calc(100% + 6px); top: 0; min-width: 170px; }
.hdr-sub button { display: flex; align-items: center; gap: 9px; }
.hdr-sub button i { width: 7px; height: 7px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.35); flex: none; }
.hdr-sub button[aria-checked="true"] { color: var(--pale); }
.hdr-sub button[aria-checked="true"] i { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 6px color-mix(in srgb, var(--accent) 60%, transparent); }
@media (max-width: 700px) { .hdr-sub { right: 0; top: calc(100% + 4px); } }

/* the graph: Shift + drag draws the selection area */
.g-boxsel { fill: rgba(159,210,234,0.07); stroke: rgba(159,210,234,0.6); stroke-width: 0.8; stroke-dasharray: 4 3; pointer-events: none; }
/* the graph's bar: no TLP button (the report's picker sets it); full screen has no open / close arrow */
.g-tools .g-tlp-w { display: none !important; }
/* the re-scan button: a quiet round button, no glow; on hover it fills with a light colour */
.vp-rerun { width: 24px; height: 24px; border: 0; border-radius: 50%; color: var(--text); background: rgba(255,255,255,0.07); transition: transform .3s ease, background .15s ease, color .15s ease; }
.vp-rerun svg { width: 10px; height: 10px; stroke-width: 2; }
.vp-rerun:hover:not(:disabled) { color: #0d0f12; background: #cfdae2; border-color: transparent; transform: rotate(-90deg); filter: none; }
.vp-rerun:disabled { opacity: .3; filter: grayscale(1); }

/* the re-run button: the site's outlined button (as Details), the arrow turns on hover */
.vp-rerun { width: 26px; height: 24px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 0; color: var(--accent); background: transparent; transition: background .15s ease, border-color .15s ease; }
.vp-rerun svg { width: 12px; height: 12px; stroke-width: 1.6; transition: transform .3s ease; }
.vp-rerun:hover:not(:disabled) { background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent); border-color: color-mix(in srgb, var(--accent) 60%, transparent); }
.vp-rerun:hover:not(:disabled) svg { transform: rotate(-90deg); }
.vp-rerun:disabled { opacity: .3; filter: none; }

/* the graph: the list beside the canvas, by type, each group folds */
.g-body { position: relative; }
.g-body > .g-list { position: absolute; left: 0; top: 0; bottom: 0; width: var(--g-list-w, 260px); overflow-y: auto; border-top: 0; border-right: 1px solid rgba(255,255,255,0.08); background: rgba(8,9,11,0.55); scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.14) transparent; }
.g-body.has-list > .g-canvas { margin-left: var(--g-list-w, 260px); }
.g-list-rs { position: absolute; top: 0; bottom: 0; left: calc(var(--g-list-w, 260px) - 4px); width: 8px; z-index: 3; cursor: col-resize; touch-action: none; }
.g-list-rs::after { content: ''; position: absolute; top: 0; bottom: 0; left: 3.5px; width: 1px; background: var(--accent); opacity: 0; transition: opacity .15s; }
.g-list-rs:hover::after, .g-resizing .g-list-rs::after { opacity: .7; }
.g-body:not(.has-list) > .g-list-rs { display: none; }
.g-resizing { cursor: col-resize; user-select: none; }
.g-body > .g-list ul { max-height: none; overflow: visible; padding: 0 0 4px; }
.g-body > .g-list li { grid-template-columns: 8px minmax(0, 1fr); padding: 3px 12px 3px 14px; }
.g-body > .g-list .g-list-r { display: none; }
.g-body > .g-list .g-list-h { flex-wrap: nowrap; gap: 14px; position: sticky; top: 0; z-index: 1; background: rgba(12,14,17,0.96); border-bottom: 1px solid rgba(255,255,255,0.06); }
.g-lg-h { display: flex; align-items: center; gap: 6px; padding: 7px 10px 4px 8px; }
.g-lg-t { display: flex; align-items: center; gap: 7px; flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .1em; text-transform: uppercase; color: var(--text); background: none; border: 0; padding: 0; cursor: pointer; text-align: left; }
.g-lg-t span { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.g-lg-t i { flex: none; width: 0; height: 0; border-left: 4px solid currentColor; border-top: 3.5px solid transparent; border-bottom: 3.5px solid transparent; transform: rotate(90deg); transition: transform .15s; opacity: .7; }
.g-lg.shut .g-lg-t i { transform: none; }
.g-lg-t b { font-weight: 400; color: var(--text2); letter-spacing: .04em; }
.g-lg-t em { flex: none; display: inline-flex; align-items: center; gap: 4px; font-style: normal; letter-spacing: .04em; color: #ef9a91; font-size: var(--fs-min); }
.g-lg-t em::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.g-lg-t b { flex: none; }
.g-lg-copy { flex: none; }
.g-lg-copy { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); background: none; border: 0; padding: 0; cursor: pointer; }
.g-lg-copy:hover, .g-lg-t:hover { color: var(--accent); }
.g-lg.shut ul { display: none; }
.g-tools .g-list-tab { display: inline-flex; align-items: center; gap: 6px; width: auto; padding: 0; border: 0; background: none; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0; text-transform: none; color: var(--text2); cursor: pointer; }
.g-tools .g-list-tab b { font-weight: 400; color: var(--text2); opacity: .8; }
.g-tools .g-list-tab[aria-pressed="true"], .g-tools .g-list-tab:hover { color: var(--accent); }
.g-tools .g-cam { display: inline-flex; align-items: center; }
.g-tools .g-cam svg { width: 17px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.2; stroke-linejoin: round; stroke-linecap: round; }
.g-tools .g-cam .g-cam-in { fill: currentColor; stroke: none; opacity: .35; transition: opacity .15s; }
.g-tools .g-cam:hover .g-cam-in { opacity: .8; }
@media (max-width: 700px) {
  .g-body { display: flex; flex-direction: column-reverse; }
  .g-body > .g-list { position: static; width: auto; max-height: 40vh; border-right: 0; border-top: 1px solid rgba(255,255,255,0.08); }
  .g-list-rs { display: none; }
  .g-body.has-list > .g-canvas { margin-left: 0; }
}

/* full screen: the graph comes forward over the page (not the whole screen), the rest dims */
.g-wrap.g-full-on { inset: 4vh 4vw; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; overflow: hidden;
  box-shadow: 0 0 0 100vmax rgba(5,6,8,0.74), 0 40px 120px rgba(0,0,0,0.6); }
.g-wrap.g-full-on .g-body { flex: 1 1 auto; min-height: 0; }
.g-wrap.g-full-on .g-body > .g-canvas { height: 100%; }
@media (max-width: 700px) { .g-wrap.g-full-on { inset: 0; border: 0; border-radius: 0; } }

/* admin: who is online, and on what */
.adm-live-slot:empty { display: none; }
.adm-live { display: inline-flex; align-items: center; gap: 6px; min-width: 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); }
.adm-live i { flex: none; width: 6px; height: 6px; border-radius: 50%; background: #79c79a; box-shadow: 0 0 0 3px rgba(121,199,154,0.15); }
.adm-live.idle i { background: #8c979f; box-shadow: 0 0 0 3px rgba(140,151,159,0.15); }
.adm-live.bg i { background: transparent; border: 1px solid currentColor; box-shadow: none; width: 5px; height: 5px; }
.adm-live.hunt { color: var(--text); }
.adm-live.hunt i { animation: adm-live 2.4s ease-in-out infinite; }
.adm-live b { font-weight: 500; color: var(--accent); max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@keyframes adm-live { 50% { box-shadow: 0 0 0 5px rgba(121,199,154,0.05); } }
@media (prefers-reduced-motion: reduce) { .adm-live.hunt i { animation: none; } }

/* the card's actions, in its header: JSON · Report · Share | re-run · Details */
.vp-card { overflow: clip; container-type: inline-size; container-name: vpcard; }
.vp-acts { display: inline-flex; align-items: center; gap: 2px; margin-left: auto; flex: none; }
.vp-head .card-age ~ .vp-acts { margin-left: 10px; }
.vp-acts .vp-act { height: 26px; padding: 0 8px; border-radius: 0; transition: background .15s, color .15s; }
.vp-acts .vp-act:hover { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.vp-acts .vp-act:disabled { opacity: .5; cursor: default; }
.vp-acts-sep { width: 1px; height: 15px; background: rgba(255,255,255,0.14); margin: 0 6px; flex: none; }
.vp-acts .vp-rerun { margin: 0; }
.vp-acts .vp-toggle { margin-left: 6px; padding: 3px 10px; }
.vp-acts .bulk-copysel { color: var(--accent); }
.vp-retry { margin-left: 10px; font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: color-mix(in srgb, var(--accent) 45%, transparent); }
.vp-retry:hover { text-decoration-color: currentColor; }
/* it stays on top while the card scrolls under the slim header; compact once stuck */
.vp-card > .vp-head { position: sticky; top: calc(var(--header-h) + var(--tabs-h)); z-index: 6; transition: padding .2s ease, background .2s ease; }
.vp-card.vp-docks > .vp-head { position: relative; top: auto; }   /* with a tab strip it does not stick: a copy docks under the tabs */
.vp-card.vp-stuck > .vp-head { padding-top: 7px; padding-bottom: 7px; background: rgba(11,13,16,0.97); box-shadow: 0 10px 26px rgba(0,0,0,0.4); }
.vp-card.vp-stuck > .vp-head .vp-headtarget { font-size: 15px; }
.vp-card.vp-stuck > .vp-head .card-age { display: none; }
/* narrower cards: the actions keep only their icons (their word shows while they answer) */
@container vpcard (max-width: 860px) {
  .vp-acts .vp-act .lbl { display: none; }
  .vp-acts .vp-act.flashing .lbl { display: inline; }
  .vp-acts .vp-act { padding: 0 7px; }
}
@container vpcard (max-width: 640px) {
  .vp-head .card-age { display: none; }
}
/* phones: the actions take their own line under the IOC and verdict */
@container vpcard (max-width: 520px) {
  .vp-card > .vp-head { flex-wrap: wrap; row-gap: 8px; }
  .vp-acts { flex-basis: 100%; justify-content: flex-end; margin-left: 0; }
  .vp-head .card-age ~ .vp-acts { margin-left: 0; }
}

/* re-run: a round button, the clockwise arrow turning the way it points */
.vp-rerun { width: 26px; height: 26px; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); color: var(--accent); background: transparent; transform: none !important; }
.vp-rerun svg { width: 13px; height: 13px; stroke-width: 2; transition: transform .5s cubic-bezier(.3,.7,.3,1); }
.vp-rerun:hover:not(:disabled) { background: color-mix(in srgb, var(--accent) 14%, transparent); border-color: color-mix(in srgb, var(--accent) 65%, transparent); }
.vp-rerun:hover:not(:disabled) svg { transform: rotate(180deg); }
/* the actions always sit at the right end of the header (also when the date is hidden) */
.vp-card.vp-stuck .vp-acts { margin-left: auto; }
@container vpcard (max-width: 640px) { .vp-acts, .vp-head .card-age ~ .vp-acts { margin-left: auto; } }

/* the list's tab: on the left edge of the drawing, beside the list */
.g-body > .g-list-tab { position: absolute; z-index: 4; top: 12px; left: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; width: 22px; padding: 7px 0 6px; border: 1px solid rgba(255,255,255,0.12); border-left: 0; border-radius: 0; background: rgba(14,16,19,0.92); color: var(--text2); cursor: pointer; transition: color .15s, background .15s, left .2s ease; }
.g-body.has-list > .g-list-tab { left: var(--g-list-w, 260px); }
.g-body > .g-list-tab:hover, .g-body > .g-list-tab[aria-pressed="true"] { color: var(--accent); }
.g-body > .g-list-tab:hover { background: rgba(20,24,28,0.96); }
.g-body > .g-list-tab svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.2; stroke-linecap: round; }
.g-body > .g-list-tab b { font-family: var(--mono); font-size: var(--fs-min); font-weight: 400; letter-spacing: 0; color: inherit; opacity: .85; }
.g-resizing > .g-list-tab { transition: none; }
@media (max-width: 700px) { .g-body.has-list > .g-list-tab { left: 0; } }

/* folded: a strip that shows what is inside, the whole strip opens it */
.g-peek { display: none; }
.g-wrap.g-hidden .g-tools, .g-wrap.g-hidden .g-flt, .g-wrap.g-hidden .g-body { display: none; }
.g-wrap.g-hidden .g-peek { display: flex; align-items: center; gap: 16px; width: 100%; padding: 10px 16px 10px 10px; border: 0; background: transparent; color: var(--text); text-align: left; cursor: pointer; transition: background .15s; }
.g-wrap.g-hidden .g-peek:hover { background: rgba(255,255,255,0.025); }
.g-peek-go { margin-left: auto; flex: none; display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); }
.g-peek-go svg { width: 9px; height: 9px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.g-wrap.g-hidden .g-peek:hover .g-peek-go { background: color-mix(in srgb, var(--accent) 14%, transparent); }
@media (max-width: 560px) { .g-peek-go { display: none; } }

/* Request access: the same plain look as the signed-in name in the header */
.hdr-access { background: none; border: 1px solid transparent; padding: 4px 8px; margin-right: -8px; letter-spacing: .1em; }
.hdr-access:hover { background: rgba(255,255,255,0.07); border-color: rgba(255,255,255,0.14); }

/* the verdict, lighter: a dot in its colour and the word, no box */
.vp-head .vp-title { display: inline-flex; align-items: center; gap: 7px; padding: 0; background: none; border: 0; box-shadow: none; font-size: var(--fs-min); letter-spacing: .16em; color: color-mix(in srgb, var(--vc, #8595a2) 72%, #e6eef3); }
.vp-head .vp-title::before { content: ''; width: 7px; height: 7px; border-radius: 50%; flex: none; background: var(--vc, #8595a2); box-shadow: 0 0 0 3px color-mix(in srgb, var(--vc, #8595a2) 18%, transparent); }
/* Details, lighter: a quiet outline, no sweep of light */
.vp-acts .vp-toggle { border-color: rgba(255,255,255,0.14); color: var(--text); background: transparent; }
.vp-acts .vp-toggle::after { display: none; }
.vp-acts .vp-toggle:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.vp-acts .vp-toggle { margin-left: 8px; }

/* the card's header is opaque, stuck or not: nothing shows through it while the page scrolls */
.vp-card > .vp-head { background: #0d0f12; }
.vp-card.vp-stuck > .vp-head { background: #0d0f12; }
/* the indicator comes first: below ~1020px of card the date makes room for it (it is in the timeline) */
@container vpcard (max-width: 1020px) { .vp-head .card-age { display: none; } .vp-acts, .vp-head .card-age ~ .vp-acts { margin-left: auto; } }

/* ── the verdict, digested ── */
/* the score: one number in the verdict's colour */
.vp-pct { font-family: var(--display); font-size: 14px; font-weight: 600; letter-spacing: .04em; color: color-mix(in srgb, var(--vc, #8595a2) 80%, #e6eef3); flex: none; }
.vp-pct.none { color: var(--text2); }
/* the facts: a line of values */
.vp-facts { display: flex; flex-wrap: wrap; gap: 6px 22px; padding: 12px 16px; border-bottom: 1px solid rgba(255,255,255,0.06); font-family: var(--mono); font-size: 12px; color: var(--pale); }
.vp-facts i { font-style: normal; color: var(--text2); }
/* findings: a dot by how strong, the words */
.vp-reasons .vp-reason { display: flex; align-items: baseline; gap: 10px; }
.vp-bul { flex: none; width: 6px; height: 6px; border-radius: 50%; margin: 0 4px 1px 2px; background: var(--text2); opacity: .5; align-self: center; }
.vp-bul.l2 { background: #d2504a; opacity: 1; }
.vp-bul.l1 { background: #e3b36c; opacity: 1; }
.vp-fams { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.vp-fam { display: inline-flex; align-items: center; gap: 7px; padding: 3px 9px; border: 1px solid rgba(224,103,94,0.4); border-radius: 0; background: rgba(224,103,94,0.08); font-family: var(--mono); font-size: 12px; font-weight: 600; color: #f3b1aa; cursor: pointer; transition: background .15s, border-color .15s; }
.vp-fam:hover { background: rgba(224,103,94,0.14); border-color: rgba(224,103,94,0.6); }
.vp-fam svg { width: 9px; height: 6px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.vp-fam[aria-expanded="true"] svg { transform: rotate(180deg); }
.vp-fam.plain { cursor: default; }
.vp-reasons .vp-family { margin: 2px 0 6px 22px; }
.vp-family .vp-family-a { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); margin-bottom: 4px; }
.vp-family .vp-family-l { display: inline-flex; align-items: center; gap: 5px; margin-top: 8px; font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); }
.vp-family .vp-family-l svg { width: 9px; height: 9px; }
/* sections: each folds on its own; Details opens them all */
.vp-secs { border-top: 1px solid rgba(255,255,255,0.06); }
.vp-sec { border-bottom: 1px solid rgba(255,255,255,0.06); }
.vp-sec:last-child { border-bottom: 0; }
.vp-sec-h { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 40px; padding: 8px 16px; border: 0; background: transparent; color: var(--text); text-align: left; cursor: pointer; transition: background .15s; }
.vp-sec-h:hover { background: rgba(255,255,255,0.025); }
.vp-sec-h b { flex: none; width: 118px; font-family: var(--mono); font-size: var(--fs-min); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--text2); }
.vp-sec-s { display: flex; align-items: center; gap: 8px; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-family: var(--mono); font-size: 12px; color: var(--pale); }
.vp-sec-s span { color: var(--text2); }
.vp-sec-s em { font-style: normal; color: var(--text); }
.vp-sec-s em.risk { color: #f0a39b; }
.vp-sec-shot { flex: none; width: 44px; height: 28px; object-fit: cover; object-position: top; border: 1px solid rgba(255,255,255,0.12); border-radius: 0; background: #0f1215; }
.vp-sec-h > svg { flex: none; width: 10px; height: 6px; margin-left: auto; fill: none; stroke: var(--text2); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.vp-sec.open .vp-sec-h > svg { transform: rotate(180deg); }
.vp-sec-b { padding: 4px 16px 14px; }
.vp-sec-b .vp-rowline { padding: 6px 0 12px; }
.vp-sec-b .vp-page { margin: 0 0 12px; }
.vp-sec-map .vp-sec-b { padding: 12px 16px 12px; }
.vp-sec-map .g-host { margin: 0; }
@media (max-width: 640px) { .vp-sec-h b { width: auto; } .vp-sec-s { display: none; } }
/* the raw answers (each source's card) show only when that section is open */
body.vp-raw-off #results #cards-container { display: none; }

/* the graph: "expand me" is quiet (a faint ring); a node that leads somewhere relevant (a family,
   malware it served, a known sample) pings red, like a contact on a radar */
.can-expand .g-pulse { animation: none; opacity: .28; stroke-dasharray: 1.5 2.5; }
.g-n.leads .g-pulse { stroke: #ff6b5e !important; stroke-width: 1.1; stroke-dasharray: none; opacity: 0; animation: gLead 2.2s ease-out infinite; }
@keyframes gLead { 0% { opacity: .85; transform: scale(1); } 75% { opacity: 0; transform: scale(2.1); } 100% { opacity: 0; transform: scale(2.1); } }
@media (prefers-reduced-motion: reduce) { .g-n.leads .g-pulse { animation: none; opacity: .8; } }

/* the folded map: a radar and a few words that make you want to open it */
.g-wrap.g-hidden .g-peek { gap: 18px; padding: 10px 16px 10px 10px; }
@keyframes pkSweep { to { transform: rotate(360deg); } }
@keyframes pkPing { 0% { opacity: .9; transform: scale(1); } 75%, 100% { opacity: 0; transform: scale(2.4); } }
.pk-chip { display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px; border: 1px solid rgba(255,255,255,0.12); border-radius: 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); }
.pk-chip.fam { border-color: rgba(224,103,94,0.45); background: rgba(224,103,94,0.08); color: #f3b1aa; font-weight: 600; }
.pk-chip.bad { color: #f0a39b; }
.pk-chip.lead i { width: 6px; height: 6px; border-radius: 50%; background: #ff6b5e; box-shadow: 0 0 0 3px rgba(255,107,94,0.18); }
/* open in the card: lean. Zoom by wheel or pinch; the world map and the +/- live in full screen */


/* the map's header folds it (no chevron): the whole bar is the handle, its buttons keep their job */
.g-wrap:not(.g-full-on) .g-tools { cursor: pointer; transition: background .15s; padding-left: 12px; }
.g-wrap:not(.g-full-on) .g-tools:hover { background: rgba(255,255,255,0.03); }
.g-wrap:not(.g-full-on) .g-tools button, .g-wrap:not(.g-full-on) .g-tools input { cursor: pointer; }
/* Map | List in the card */
.g-tabs { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid rgba(255,255,255,0.1); border-radius: 0; }
.g-tools .g-tabs button { padding: 2px 9px; border-radius: 0; font-size: var(--fs-min); color: var(--text2); }
.g-tools .g-tabs button.on { background: rgba(255,255,255,0.07); color: var(--pale); }
.g-tools .g-tabs b { font-weight: 400; opacity: .8; }
.g-wrap.g-full-on .g-tabs { display: none; }


.g-wrap:not(.g-full-on)[data-tab="list"] .g-canvas { display: none; }
.g-wrap:not(.g-full-on)[data-tab="list"] .g-body > .g-list { position: static; width: auto; max-height: 330px; border-right: 0; background: transparent; }
/* the legend: bottom left, only what the map shows */
.g-legend { position: absolute; left: 10px; bottom: 8px; z-index: 2; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; max-width: calc(100% - 60px); font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); pointer-events: none; }
.g-legend[hidden] { display: none; }
.g-legend span { display: inline-flex; align-items: center; gap: 5px; }
.g-legend i { flex: none; display: inline-block; }
.g-legend .lg-bad { width: 7px; height: 7px; border-radius: 50%; background: #d2504a; }
.g-legend .lg-lead { width: 7px; height: 7px; border-radius: 50%; border: 1.2px solid #ff6b5e; box-shadow: 0 0 0 2px rgba(255,107,94,0.18); }
.g-legend .lg-mem { width: 14px; height: 0; border-top: 1.5px dashed rgba(169,156,216,0.8); }
.g-legend button { pointer-events: auto; padding: 1px 7px; border: 1px solid rgba(255,255,255,0.12); border-radius: 0; background: rgba(13,15,18,0.8); font-family: var(--mono); font-size: var(--fs-min); color: var(--text); cursor: pointer; }
.g-legend button:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
.g-canvas { position: relative; }

/* folded, the map reads like the other sections: its name, a small still thumbnail, a few chips,
   and "Open the map" where the others have their chevron; no box around it */
.vp-sec-map:has(.g-wrap.g-hidden) .vp-sec-b { padding: 0; }
.g-wrap.g-hidden { border: 0; border-radius: 0; background: transparent; }
.g-wrap.g-hidden .g-peek { gap: 14px; min-height: 40px; padding: 7px 16px; }
.g-peek .pk-label { flex: none; width: 118px; font-family: var(--mono); font-size: var(--fs-min); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--text2); }
.g-peek .pk-sum { display: flex; align-items: center; gap: 8px; min-width: 0; overflow: hidden; white-space: nowrap; font-family: var(--mono); font-size: 12px; color: var(--pale); }
.g-peek .pk-chip { flex: none; cursor: pointer; padding: 1px 7px; }
.g-peek .pk-chip:hover { border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
.g-peek .g-peek-go { margin-left: auto; padding: 0; border: 0; background: none !important; font-size: var(--fs-min); color: var(--accent); }
.g-wrap.g-hidden .g-peek:hover { background: rgba(255,255,255,0.025); }
@media (max-width: 640px) { .g-peek .pk-label { width: auto; } .g-peek .pk-chip:not(.fam) { display: none; } }

/* the map's row in the card: List opens the list under it, the rest opens the map over the page */
.g-wrap.g-hidden.g-listonly .g-body { display: block; }
.g-wrap.g-listonly:not(.g-full-on) .g-canvas { display: none; }
.g-wrap.g-listonly:not(.g-full-on) .g-body > .g-list { position: static; width: auto; max-height: 320px; border-right: 0; border-top: 1px solid rgba(255,255,255,0.06); background: transparent; }
.g-peek { display: none; }
.g-wrap.g-hidden .g-peek { cursor: pointer; }
.g-wrap.g-hidden .g-peek:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.g-peek .pk-list { flex: none; display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 2px 9px; border: 1px solid rgba(255,255,255,0.12); border-radius: 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); }
.g-peek .pk-list:hover, .g-peek .pk-list.on { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
.g-peek .pk-list svg { width: 8px; height: 5px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; transition: transform .15s; }
.g-peek .pk-list.on svg { transform: rotate(180deg); }
.g-peek .pk-list + .g-peek-go { margin-left: 14px; }
.g-peek .g-peek-go { padding: 3px 10px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 0; }
.g-peek .g-peek-go:hover { background: color-mix(in srgb, var(--accent) 12%, transparent) !important; }

/* the map lives in Footprinting: its row first in the section; "Open the map" in the header */
.vp-map-slot { padding: 0 16px; border-bottom: 1px solid rgba(255,255,255,0.05); }
.vp-map-slot[hidden] { display: none; }
.vp-map-slot .g-host { margin: 0; }
.vp-map-slot .g-wrap.g-hidden .g-peek { padding: 7px 0; }
.vp-map-slot .g-wrap.g-hidden .g-peek:hover { background: transparent; }
.vp-sec-act { flex: none; display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 3px 10px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); transition: background .15s; }
.vp-sec-act:hover { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.vp-sec-act svg { width: 9px; height: 9px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.vp-sec-act + svg { margin-left: 14px !important; }
/* inside Footprinting the map's row needs no label: the section names it */
.vp-map-slot .g-peek .pk-label { width: auto; }
/* "Open the map" once: in the Footprinting header (the row inside opens it on a click as well) */
.vp-map-slot .g-peek .g-peek-go { display: none; }

/* Relations: its own section, always in view; a header over a wide still miniature of the map */
.vp-sec-rel .vp-map-slot { padding: 0; border-bottom: 0; }
.vp-sec-rel .g-wrap.g-hidden .g-peek { display: block; padding: 0; gap: 0; min-height: 0; }
.vp-sec-rel .g-wrap.g-hidden .g-peek:hover { background: transparent; }
.pk-head { display: flex; align-items: center; gap: 14px; min-height: 40px; padding: 7px 16px; }
.pk-head .pk-label { flex: none; width: 118px; font-family: var(--mono); font-size: var(--fs-min); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--text2); }
.vp-sec-rel .g-peek .pk-sum { display: flex; align-items: center; gap: 8px; min-width: 0; overflow: hidden; white-space: nowrap; font-family: var(--mono); font-size: 12px; color: var(--pale); }
.vp-sec-rel .g-peek .pk-list { margin-left: auto; }
.vp-sec-rel .g-peek .g-peek-go { display: inline-flex; margin-left: 0; }
.vp-sec-rel .g-peek .pk-head .pk-list + .g-peek-go { margin-left: 8px; }
.pk-mini { position: relative; padding: 0 16px 14px; }
.pk-mini svg { display: block; width: 100%; height: 136px; border: 1px solid rgba(255,255,255,0.08); border-radius: 0; transition: border-color .15s; }
.g-peek:hover .pk-mini svg { border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.pk-mini .pk-hint { position: absolute; right: 26px; bottom: 22px; padding: 3px 9px; border-radius: 0; background: rgba(10,12,15,0.85); border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent); font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); opacity: 0; transition: opacity .15s; pointer-events: none; }
.g-peek:hover .pk-mini .pk-hint { opacity: 1; }
.vp-sec-rel .g-wrap.g-listonly .g-body > .g-list { margin: 0 16px 12px; border: 1px solid rgba(255,255,255,0.06); border-radius: 0; }
@media (max-width: 640px) { .pk-head .pk-label { width: auto; } .vp-sec-rel .g-peek .pk-chip:not(.fam) { display: none; } .pk-mini svg { height: 110px; } }

/* Relations: the title, "Open the map" under it and the filters on the left; the map itself,
   working as in full screen, in a tall frame on the right */
.vp-sec-rel { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; padding: 14px 16px; }
.rel-side { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.rel-title { font-family: var(--mono); font-size: var(--fs-min); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--text2); }
.rel-open { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 0; background: transparent; font-family: var(--mono); font-size: var(--fs-min); color: var(--accent); cursor: pointer; transition: background .15s; }
.rel-open:hover { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.rel-open svg { width: 9px; height: 9px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.rel-chips { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin-top: 4px; }
.rel-chips .rel-n { font-family: var(--mono); font-size: 12px; color: var(--pale); margin-bottom: 2px; }
.rel-chips .pk-chip { background: transparent; cursor: pointer; }
.rel-chips .pk-chip.on { background: rgba(255,255,255,0.08); border-color: color-mix(in srgb, var(--accent) 55%, transparent); color: var(--pale); }
.vp-sec-rel .vp-map-slot { padding: 0; border: 0; min-width: 0; }
.vp-sec-rel .g-host { margin: 0; }
.pk-mini .pk-hint { display: none !important; }
@media (max-width: 760px) { .vp-sec-rel { grid-template-columns: 1fr; } .rel-side { flex-direction: row; flex-wrap: wrap; align-items: center; } .rel-chips { flex-direction: row; flex-wrap: wrap; margin: 0; } }

/* Options: a profile (initials, name, address), the display name with a small Update beside it */
.acc-prof { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; padding: 12px; border: 1px solid rgba(255,255,255,0.1); border-radius: 0; background: rgba(255,255,255,0.03); text-align: left; }
.acc-avatar { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; font-family: var(--mono); font-size: 13px; font-weight: 600; color: var(--pale); }
.acc-prof-i { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.acc-prof-n { font-size: 14px; color: var(--pale); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.acc-prof .acc-who-am { margin: 0; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.acc-l i { font-style: normal; text-transform: none; letter-spacing: 0; color: var(--text2); opacity: .8; margin-left: 6px; }
/* admins: requests waiting */
.hdr-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 0; background: #d2504a; color: #fff; font-style: normal; font-family: var(--mono); font-size: var(--fs-min); font-weight: 600; letter-spacing: 0; }
.hdr-badge[hidden] { display: none; }
.hdr-pend { display: inline-flex; align-items: center; justify-content: center; min-width: 16px; height: 16px; margin-left: 8px; padding: 0 4px; border-radius: 0; background: #d2504a; color: #fff; font-family: var(--mono); font-size: var(--fs-min); font-weight: 600; }
.adm-was { font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); }

/* Relations folds: its title is the handle; folded, one row (title, Open the map, the filters) */
.rel-title { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none; cursor: pointer; }
.rel-title:hover { color: var(--text); }
.rel-title svg { width: 9px; height: 6px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.vp-sec-rel.open .rel-title svg { transform: rotate(180deg); }
.vp-sec-rel:not(.open) { grid-template-columns: 1fr; padding: 8px 16px; }
.vp-sec-rel:not(.open) .vp-map-slot { display: none; }
.vp-sec-rel:not(.open) .rel-side { flex-direction: row; align-items: center; gap: 14px; }
.vp-sec-rel:not(.open) .rel-chips { flex-direction: row; flex-wrap: wrap; align-items: center; margin: 0; }
.vp-sec-rel:not(.open) .rel-open { order: 3; margin-left: auto; }

/* == Concept A · Briefing: the answer first, then the facts, the findings, sections as cards == */
.vp-A .vp-head { gap: 18px; padding: 16px 20px; align-items: center; }
.vp-ring2 { position: relative; flex: none; width: 60px; height: 60px; display: inline-grid; place-items: center; }
.vp-ring2 svg { position: absolute; inset: 0; width: 60px; height: 60px; }
.vp-ring2 .trk { fill: none; stroke: rgba(255,255,255,0.08); stroke-width: 5; }
.vp-ring2 .val { fill: none; stroke: var(--vc, #8595a2); stroke-width: 5; stroke-linecap: round; }
.vp-ring2 b { position: relative; font-family: var(--display); font-size: 21px; font-weight: 700; color: var(--pale); }
.vp-id { display: flex; flex-direction: column; gap: 5px; min-width: 0; flex: 1 1 auto; }
.vp-id1 { display: flex; align-items: center; gap: 10px; min-width: 0; }
.vp-A .vp-headtarget { font-family: var(--mono); font-size: 19px; font-weight: 600; letter-spacing: -.01em; color: var(--pale); }
.vp-kindpill { flex: none; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; color: var(--text2); padding: 1px 7px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; }
.vp-id2 { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.vp-A .vp-id2 .card-age { margin: 0; font-size: var(--fs-min); }
.vp-A .vp-id1 .vp-pct { display: none; }
.vp-A.vp-stuck .vp-id1 .vp-pct { display: inline; }
.vp-A.vp-stuck > .vp-head { padding-top: 8px; padding-bottom: 8px; }
.vp-A.vp-stuck .vp-ring2, .vp-A.vp-stuck .vp-id2 { display: none; }
.vp-A.vp-stuck .vp-headtarget { font-size: 15px; }
.vp-sum { padding: 4px 20px 16px; }
.vp-tldr { margin: 0; font-family: var(--sans); font-size: 15.5px; line-height: 1.6; color: #dce6ec; }
.vp-tldr b { color: #fff; font-weight: 600; }
.vp-next { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; font-family: var(--sans); font-size: 13.5px; color: var(--text); }
.vp-next b { color: var(--pale); font-weight: 600; }
.vp-next-k { font-family: var(--mono); font-size: var(--fs-min); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); padding: 1px 7px; border-radius: 0; }
.vp-next-td { margin-left: auto; padding: 4px 11px; border: 1px solid rgba(224,103,94,0.5); border-radius: 0; background: rgba(224,103,94,0.08); font-family: var(--sans); font-size: 12.5px; color: #f3b1aa; cursor: pointer; }
.vp-next-td:hover { background: rgba(224,103,94,0.16); }
.vp-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1px; margin: 0 20px 16px; border: 1px solid rgba(255,255,255,0.08); border-radius: 0; overflow: hidden; background: rgba(255,255,255,0.08); }
.vp-tile { padding: 11px 14px; background: #13171b; min-width: 0; }
.vp-tile small { display: block; margin-bottom: 4px; font-family: var(--sans); font-size: 12px; color: var(--text2); }
.vp-tile span { display: block; font-family: var(--sans); font-size: 14px; color: var(--pale); overflow-wrap: anywhere; }
.vp-tile code { font-family: var(--mono); font-size: 13px; }
.vp-tile em { font-style: normal; color: #f2a59d; }
.vp-finds { margin: 0 20px 16px; padding: 14px 16px; border: 1px solid rgba(255,255,255,0.08); border-radius: 0; }
.vp-blk-h { margin-bottom: 10px; font-family: var(--sans); font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--text2); }
.vp-A .vp-finds .vp-reasons { padding: 0; border: 0; gap: 8px; }
.vp-A .vp-reason { font-family: var(--sans); font-size: 14px; color: var(--text); }
.vp-A .vp-secs { display: grid; gap: 10px; padding: 0 20px 20px; border-top: 0; }
.vp-A .vp-sec { border: 1px solid rgba(255,255,255,0.08); border-radius: 0; background: rgba(255,255,255,0.015); }
.vp-A .vp-sec-h { min-height: 46px; padding: 10px 16px; }
.vp-A .vp-sec-h b, .vp-A .rel-title { width: auto; min-width: 120px; font-family: var(--sans); font-size: 14px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--pale); }
.vp-A .vp-sec-s { font-family: var(--sans); font-size: 13px; color: var(--text2); }
.vp-A .vp-sec-s em, .vp-A .vp-sec-s b { color: var(--text); }
.vp-A .vp-sec-rel { padding: 14px 16px; }
.vp-A .vp-sec-rel:not(.open) { padding: 10px 16px; }
.vp-ev { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 13px; }
.vp-ev td { padding: 7px 8px; border-bottom: 1px solid rgba(255,255,255,0.05); color: var(--text); vertical-align: top; }
.vp-ev td:first-child { color: var(--pale); white-space: nowrap; width: 1%; }
.vp-ev td:last-child { white-space: nowrap; width: 1%; text-align: right; }
.vp-ev a { margin-left: 8px; color: var(--accent); font-size: 12px; }
.vp-ev a svg, .g-info .gc-a svg { width: 9px; height: 9px; }
.vp-ev-d { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,0.2); }
.vp-ev-d.l2 { background: #d2504a; } .vp-ev-d.l1 { background: #e3b36c; } .vp-ev-d.ok { background: #79c79a; }
.vp-ev-note { margin: 10px 0 0; font-size: 12.5px; color: var(--text2); }
.vp-act.vp-td { color: #f3b1aa; }
@media (max-width: 640px) { .vp-A .vp-head { padding: 12px 14px; gap: 12px; } .vp-ring2 { width: 48px; height: 48px; } .vp-ring2 svg { width: 48px; height: 48px; } .vp-ring2 b { font-size: 17px; } .vp-sum, .vp-A .vp-secs { padding-left: 14px; padding-right: 14px; } .vp-tiles, .vp-finds { margin-left: 14px; margin-right: 14px; } .vp-tldr { font-size: 14.5px; } }

/* the node card: beside the node, compact and readable */
.g-info { position: absolute; z-index: 4; display: block; width: 300px; max-width: calc(100% - 16px); padding: 12px 14px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: rgba(16,19,23,0.97); box-shadow: 0 16px 40px rgba(0,0,0,0.5); font-family: var(--sans); font-size: 13px; min-height: 0; }
.g-info[hidden] { display: none !important; }
.gc-top { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.gc-k { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .08em; text-transform: uppercase; color: var(--text2); padding: 1px 6px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; }
.gc-x { margin-left: auto; padding: 0 2px; border: 0; background: none; color: var(--text2); font-size: 17px; line-height: 1; cursor: pointer; }
.gc-x:hover { color: var(--pale); }
.gc-id { font-family: var(--mono); font-size: 13.5px; font-weight: 500; color: var(--pale); overflow-wrap: anywhere; margin-bottom: 6px; }
.gc-lead { color: #ff8f86; margin-bottom: 4px; }
.gc-why { color: var(--text); line-height: 1.45; margin-bottom: 4px; }
.gc-rel { color: var(--text2); font-size: 12px; }
.g-info .gc-a { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 10px 0 0; }

/* the takedown request */
.td-wrap { position: fixed; inset: 0; z-index: 5000; display: grid; place-items: center; padding: 16px; background: rgba(5,6,8,0.72); }
.td-wrap[hidden] { display: none; }
.td-box { width: min(720px, 100%); max-height: 92vh; overflow: auto; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: #12151a; box-shadow: 0 30px 80px rgba(0,0,0,0.6); font-family: var(--sans); color: var(--text); }
.td-h { position: sticky; top: 0; display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid rgba(255,255,255,0.08); background: #12151a; }
.td-h b { font-size: 15px; color: var(--pale); }
.td-h code { font-family: var(--mono); font-size: 12.5px; color: var(--text2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.td-x { margin-left: auto; border: 0; background: none; color: var(--text2); font-size: 20px; line-height: 1; cursor: pointer; }
.td-b { padding: 16px 18px 18px; }
.td-muted, .td-note { color: var(--text2); font-size: 12.5px; }
.td-l { margin: 14px 0 6px; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--text2); }
.td-l i { font-style: normal; text-transform: none; letter-spacing: 0; font-weight: 400; margin-left: 6px; }
.td-cts { display: grid; gap: 8px; }
.td-ct { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid rgba(255,255,255,0.1); border-radius: 0; cursor: pointer; }
.td-ct:has(input:checked) { border-color: color-mix(in srgb, var(--accent) 55%, transparent); background: rgba(140,200,226,0.06); }
.td-ct b { display: block; color: var(--pale); font-size: 13.5px; font-weight: 600; }
.td-sub { display: block; margin-top: 2px; font-size: 12.5px; color: var(--text2); }
.td-sub code { font-family: var(--mono); color: var(--text); }
.td-in { width: 100%; padding: 9px 11px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: rgba(0,0,0,0.25); color: var(--pale); font-family: var(--mono); font-size: 12.5px; line-height: 1.5; }
textarea.td-in { resize: vertical; min-height: 220px; }
.td-acts { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.td-acts button { padding: 7px 13px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: rgba(255,255,255,0.03); color: var(--text); font-size: 13px; cursor: pointer; }
.td-acts .td-go { border-color: color-mix(in srgb, var(--accent) 55%, transparent); background: rgba(140,200,226,0.1); color: var(--accent); }
.td-acts .td-note { margin-left: auto; }
.td-hist { padding: 10px 12px; border: 1px solid rgba(227,179,108,0.4); border-radius: 0; background: rgba(227,179,108,0.06); font-size: 13px; }
.td-hist ul { margin: 6px 0 0; padding-left: 18px; }
.td-hist code { font-family: var(--mono); font-size: 12px; }
/* phones: the blurred backdrop's bleed must not widen the page; the facts sit two to a row */
html { overflow-x: clip; }
@media (max-width: 640px) {
  .vp-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vp-tile { padding: 9px 11px; }
  .vp-tile span { font-size: 13px; }
  .vp-next-td { margin-left: 0; }
}
/* the facts: rows balanced by the page (--per), the last row's tiles widen to fill it */
.vp-tiles { display: flex; flex-wrap: wrap; }
.vp-tile { flex: 1 1 calc(100% / var(--per, 3) - 1px); }
@media (max-width: 640px) { .vp-tiles { display: flex; } .vp-tile { flex-basis: calc(50% - 1px); } }
/* Relations: the title and the filters in one row on top, the map the full width under them */
.vp-sec-rel, .vp-A .vp-sec-rel { grid-template-columns: minmax(0, 1fr); gap: 12px; }
.rel-side, .vp-sec-rel:not(.open) .rel-side { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.rel-chips, .vp-sec-rel:not(.open) .rel-chips { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; }
.rel-chips .rel-n { margin: 0 4px 0 0; color: var(--text2); }
.vp-A .rel-title { min-width: 0; }
/* the node card, compact: never stretched by the old docked-bar rule (full screen included) */
.g-canvas > .g-info { right: auto; bottom: auto; width: 264px; max-width: calc(100% - 16px); padding: 10px 12px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: rgba(16,19,23,0.96); box-shadow: 0 12px 32px rgba(0,0,0,0.5); font-family: var(--sans); font-size: 12.5px; line-height: 1.45; }
.gc-top { margin-bottom: 6px; gap: 6px; }
.gc-k { font-size: var(--fs-min); padding: 0 5px; }
.g-info .g-sel-v { font-size: var(--fs-min); padding: 0 6px; }
.gc-id { font-size: 12.5px; margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gc-lead { font-size: 12.5px; margin-bottom: 2px; }
.gc-why { font-size: 12.5px; color: var(--text); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 2px; }
.gc-rel { font-size: var(--fs-min); }
.g-info .gc-a { margin-top: 8px; gap: 4px 12px; }
.g-info .gc-a .gc-go { color: var(--accent); }
.g-canvas { background: #111519; }
/* the facts on top: a label and its value on one line, rows balanced (--per) */
.vp-tiles { margin: 0 20px 12px; border-radius: 0; }
.vp-tile { display: flex; align-items: baseline; gap: 10px; padding: 6px 12px; }
.vp-tile small { flex: none; margin: 0; font-size: var(--fs-min); }
.vp-tile span { min-width: 0; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vp-tile code { font-size: 12px; }
@media (max-width: 640px) { .vp-tile { display: block; padding: 6px 10px; } .vp-tile small { display: block; margin-bottom: 1px; } }
/* Findings: tighter */
.vp-finds { margin: 0 20px 12px; padding: 10px 14px; }
.vp-finds .vp-blk-h { margin-bottom: 6px; }
.vp-A .vp-finds .vp-reasons { gap: 4px; }
.vp-A .vp-reason { font-size: 13.5px; line-height: 1.45; }
/* Footprinting: a label and a row of chips per kind (ports, signals, fingerprints, CVEs) */
.vp-A .vp-lines { padding: 2px 16px 10px; }
.vp-A .vp-line { grid-template-columns: 92px minmax(0, 1fr); gap: 12px; padding: 7px 0 0; align-items: baseline; }
.vp-A .vp-line .svc-label { margin: 0; }
.vp-A .vp-line-v .tags { margin-bottom: 5px; gap: 4px; }
.vp-A .vp-line-v .tag { padding: 1px 6px; font-size: var(--fs-min); }
.fp-chips, .cve-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 5px; }
.cve-chips .more-rest.shown { display: contents; }
.fp-chip { display: inline-flex; align-items: stretch; border: 1px solid rgba(255,255,255,0.12); border-radius: 0; font-family: var(--mono); font-size: var(--fs-min); }
.fp-chip.rare { border-color: rgba(224,103,94,0.55); }
.fp-c { display: inline-flex; align-items: baseline; gap: 6px; padding: 1px 6px; border: 0; background: none; color: var(--text); font: inherit; cursor: copy; }
.fp-c b { font-weight: 500; color: var(--text2); }
.fp-c i { font-style: normal; color: var(--text2); }
.fp-chip.rare .fp-cnt { color: #f2a59d; }
.fp-chip a { display: inline-flex; align-items: center; padding: 0 5px; border-left: 1px solid rgba(255,255,255,0.1); color: var(--text2); }
.fp-chip a:hover, .fp-c:hover { color: var(--accent); }
.fp-chip a svg { width: 8px; height: 8px; }
.cve-chip { display: inline-flex; align-items: baseline; gap: 6px; padding: 1px 6px; border: 1px solid rgba(255,255,255,0.12); border-radius: 0; background: none; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); cursor: pointer; }
.cve-chip b { font-weight: 600; }
.cve-chip i { font-style: normal; font-size: var(--fs-min); color: #f2a59d; }
.cve-chip.sev-critical { border-color: rgba(224,103,94,0.6); } .cve-chip.sev-critical b { color: #f08a80; }
.cve-chip.sev-high { border-color: rgba(227,150,90,0.55); } .cve-chip.sev-high b { color: #eba070; }
.cve-chip.sev-medium b { color: #e3c36c; }
.cve-chip.kev { background: rgba(224,103,94,0.08); }
.cve-chip.on { background: rgba(255,255,255,0.08); border-color: color-mix(in srgb, var(--accent) 55%, transparent); }
.cve-chip.flash { box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 60%, transparent); }
.cve-det { margin: 2px 0 8px; padding: 8px 10px; border-left: 2px solid rgba(255,255,255,0.14); background: rgba(255,255,255,0.02); font-family: var(--sans); font-size: 12.5px; color: var(--text); }
.cve-det p { margin: 0 0 6px; line-height: 1.5; }
.cve-det .cve-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: var(--fs-min); color: var(--text2); }
/* the result header: lower, with where the indicator is */
.vp-A .vp-head { gap: 14px; padding: 10px 18px; }
.vp-ring2, .vp-ring2 svg { width: 46px; height: 46px; }
.vp-ring2 b { font-size: 17px; }
.vp-A .vp-headtarget { font-size: 17px; }
.vp-id { gap: 2px; }
.vp-A .vp-id2 { gap: 12px; }
.vp-geo { display: inline-flex; align-items: center; gap: 5px; font-family: var(--sans); font-size: 12.5px; color: var(--text); }
.vp-geo svg { width: 11px; height: 11px; fill: none; stroke: var(--text2); stroke-width: 1.2; }
.vp-sum { padding: 2px 18px 12px; }
/* Relations: the whole bar is the handle, like the other sections */
.rel-side { cursor: pointer; margin: -14px -16px 0; padding: 10px 16px; border-radius: 0; transition: background .15s; }
.vp-sec-rel:not(.open) .rel-side { margin: -10px -16px; }
.rel-side:hover { background: rgba(255,255,255,0.025); }
.rel-title svg { display: none; }
/* the map's header is not a button */
.g-wrap:not(.g-full-on) .g-tools { cursor: default; }
.g-wrap:not(.g-full-on) .g-tools:hover { background: rgba(0,0,0,0.12); }
@media (max-width: 640px) { .vp-ring2, .vp-ring2 svg { width: 40px; height: 40px; } .vp-ring2 b { font-size: 15px; } }
/* Geo: the map framed on where the IPs are, a panel of countries and networks on the right */
.g-geo-side { display: none; position: absolute; top: 34px; right: 10px; bottom: 10px; z-index: 3; width: min(250px, max(180px, 30%)); overflow-y: auto; padding: 10px 12px; border: 1px solid rgba(255,255,255,0.08); border-radius: 0; background: rgba(13,16,19,0.9); font-family: var(--sans); font-size: 12px; scrollbar-width: thin; }
.g-wrap.g-map-on .g-geo-side { display: block; }
.gg-in { margin: 0 0 10px; color: var(--text); line-height: 1.45; }
.gg-in b { color: var(--pale); font-weight: 600; }
.gg-h { margin: 10px 0 4px; font-size: var(--fs-min); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--text2); }
.gg-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; width: 100%; padding: 4px 6px; border: 0; border-radius: 0; background: none; color: var(--text); text-align: left; cursor: pointer; }
.gg-row:hover { background: rgba(255,255,255,0.04); }
.gg-row.on { background: rgba(140,200,226,0.1); }
.gg-n { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gg-c { font-family: var(--mono); font-size: var(--fs-min); color: var(--pale); }
.gg-c i { font-style: normal; color: #f2a59d; margin-left: 4px; }
.gg-bar { position: relative; grid-column: 1 / -1; height: 3px; border-radius: 0; background: rgba(255,255,255,0.05); }
.gg-bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 0; background: rgba(140,170,190,0.5); }
.gg-bar i.b { background: #d2504a; }
.gg-note { margin: 10px 0 0; font-size: var(--fs-min); color: var(--text2); }
.g-map .g-map-c.hot circle:first-child, .g-map .g-map-c.on circle:first-child { stroke: var(--accent); }
@media (max-width: 700px) { .g-geo-side { position: static; width: auto; margin: 8px; } }
.vp-tile span { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
/* ── tabs: the indicators open, under the header (on the home screen, at the top) ── */
:root { --tabs-h: 0px; }
#tabs-bar { position: fixed; left: 0; right: 0; top: 0; z-index: 1001; display: flex; align-items: flex-end; gap: 10px; height: var(--tabs-h); padding: 0 12px; background: rgba(9,11,14,0.86); border-bottom: 1px solid rgba(255,255,255,0.08); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); font-family: var(--mono); }
#tabs-bar[hidden] { display: none; }
.tabs-strip { display: flex; align-items: flex-end; gap: 2px; min-width: 0; flex: 1 1 auto; overflow-x: auto; scrollbar-width: none; }
.tabs-strip::-webkit-scrollbar { display: none; }
.tab { position: relative; flex: none; display: inline-flex; align-items: center; gap: 7px; max-width: 230px; height: 26px; padding: 0 5px 0 10px; border: 1px solid transparent; border-bottom: 0; border-radius: 0; background: none; color: var(--text2); font: 11.5px var(--mono); white-space: nowrap; cursor: pointer; }
.tab:hover { background: rgba(255,255,255,0.04); color: var(--text); }
.tab.fresh, .th-tab.fresh { animation: tab-fresh 1.2s ease-out; }
@keyframes tab-fresh { 0%, 30% { background: rgba(120,184,212,0.32); color: var(--pale); } 100% { background: transparent; } }
.tab.on { height: 27px; margin-bottom: -1px; background: #0f1215; border-color: rgba(255,255,255,0.12); color: var(--pale); box-shadow: inset 0 2px 0 var(--hail); }
.tab-dot { flex: none; width: 7px; height: 7px; border-radius: 50%; }
.tab-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.tab-sc { font-size: var(--fs-min); font-weight: 600; font-variant-numeric: tabular-nums; color: var(--text2); }
.tab-x { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 0; font-size: 13px; line-height: 1; color: var(--text2); opacity: 0; }
.tab:hover .tab-x, .tab.on .tab-x { opacity: 1; }
.tab-x:hover { background: rgba(255,255,255,0.1); color: var(--pale); }
.tab.pin { padding-right: 10px; }
.tab.pin .tab-t, .tab.pin .tab-x, .tab.pin .tab-sc { display: none; }
.tab-add { flex: none; width: 26px; height: 24px; margin-bottom: 2px; border: 0; border-radius: 0; background: none; color: var(--text2); font-size: 16px; line-height: 1; cursor: pointer; }
.tab-add:hover { background: rgba(255,255,255,0.06); color: var(--pale); }
.tabs-r { flex: none; display: flex; align-items: center; gap: 10px; align-self: center; }
.tabs-save { padding: 2px 10px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 0; background: none; color: var(--accent); font: 11px var(--mono); cursor: pointer; }
.tabs-save:hover { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.tab-menu { position: fixed; z-index: 1200; min-width: 210px; padding: 4px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: #15191e; box-shadow: 0 14px 40px rgba(0,0,0,0.6); }
.tab-menu button { display: flex; justify-content: space-between; gap: 16px; width: 100%; padding: 6px 10px; border: 0; border-radius: 0; background: none; color: var(--text); font: 12.5px var(--sans); text-align: left; cursor: pointer; }
.tab-menu button:hover { background: rgba(255,255,255,0.07); }
.tab-menu kbd { font: 10.5px var(--mono); color: var(--text2); }
.hunt-pop { position: fixed; z-index: 1200; width: 320px; padding: 14px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: #13171b; box-shadow: 0 20px 50px rgba(0,0,0,0.6); font-family: var(--sans); color: var(--text); }
.hunt-pop label { display: block; margin: 0 0 10px; font-size: var(--fs-min); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text2); }
.hunt-pop label i { font-style: normal; font-weight: 400; text-transform: none; letter-spacing: 0; margin-left: 4px; }
.hunt-pop input, .hunt-pop textarea { display: block; width: 100%; margin-top: 5px; padding: 7px 9px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: rgba(0,0,0,0.25); color: var(--pale); font: 13px var(--sans); text-transform: none; letter-spacing: 0; resize: vertical; }
.hunt-pop-i { margin: 0 0 12px; font-size: 12px; color: var(--text2); }
.hunt-pop-i b { color: var(--text); font-weight: 500; }
.hunt-pop-a { display: flex; gap: 8px; flex-wrap: wrap; }
.hunt-pop-a button { padding: 5px 11px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: none; color: var(--text); font-size: 12.5px; cursor: pointer; }
.hunt-pop-a .go { border-color: color-mix(in srgb, var(--accent) 55%, transparent); background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
/* ── saved hunts on the home screen: a list like the recent analyses, one line per hunt, every line
   the same height and the same columns whatever it holds ── */
.hunts-row { width: min(680px, 100%); }
.hunts-list { -webkit-mask-image: none; mask-image: none; }   /* every hunt shown plainly, none faded out */
.hunts-list .hl { position: relative; }
.hl-it { display: grid; grid-template-columns: 74px minmax(0, 1fr) 132px 104px 50px; align-items: center; gap: 12px;
  height: 42px; padding: 0 34px 0 10px; box-sizing: border-box; font-family: var(--mono); font-size: var(--fs-min); color: var(--text); cursor: pointer; transition: background .15s; }
.hl-it:hover, .hl-it:focus-visible { background: rgba(255,255,255,0.035); outline: none; }
.hl-dots { display: flex; align-items: center; gap: 4px; }
.hl-dots i { flex: none; width: 7px; height: 7px; border-radius: 50%; }
.hl-dots em { margin-left: 2px; font-style: normal; font-size: var(--fs-min); color: var(--text2); }
.hl-name { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.hl-name b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 500 12.5px var(--sans); color: var(--pale); }
.hl-name i { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-size: var(--fs-min); color: var(--text2); }
.hl-fams { display: flex; gap: 4px; min-width: 0; overflow: hidden; white-space: nowrap; }
.hl-fams .hunt-fam { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.hl-more { flex: none; font-size: var(--fs-min); color: var(--text2); }
.hl-news { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-min); }
.hl-news .hunt-al { margin-left: 0; }
.hl-ch { color: #f2a59d; }
.hl-quiet { color: var(--text2); opacity: .7; }
.hl-at { font-size: var(--fs-min); color: var(--text2); text-align: right; white-space: nowrap; }
.hunt-del { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); padding: 2px 4px; border: 0; background: none; color: var(--text2); font-size: 14px; line-height: 1; cursor: pointer; opacity: 0; transition: opacity .15s; }
.hl:hover .hunt-del, .hl:focus-within .hunt-del, .hunt-del.sure { opacity: 1; }
.hunt-del:hover, .hunt-del.sure { color: #f2a59d; }
.hunt-del.sure { font: 11px var(--mono); }
.hunt-fam { padding: 0 6px; border: 1px solid rgba(224,103,94,0.5); border-radius: 0; font-size: var(--fs-min); color: #f2a59d; }
.hunt-fam.new { background: rgba(224,103,94,0.14); border-color: rgba(224,103,94,0.85); }
.hunt-fam.new::after { content: ' new'; font-size: var(--fs-min); color: #ff8f86; }
@media (max-width: 700px) {
  .hl-it { grid-template-columns: 54px minmax(0, 1fr) auto; }
  .hl-fams, .hl-at { display: none; }
}
@media (max-width: 640px) { .tab { max-width: 160px; } }
/* Geo v2: zoom and pan, countries open into IPs, the panel lists what was picked */
.g-map { cursor: grab; touch-action: none; }
.g-map.dragging { cursor: grabbing; }
.g-geo-side { top: 8px; bottom: 8px; right: 8px; width: min(240px, max(170px, 28%)); padding: 10px 11px; }
.g-map .g-map-ip { cursor: pointer; }
.g-map .g-map-ip.hot circle, .g-map .g-map-ip.on circle { stroke: var(--accent); stroke-width: 1.4; }
.g-map .g-map-reset { fill: var(--accent); cursor: pointer; letter-spacing: .4px; }
.g-map .g-map-hint { fill: rgba(204,220,232,0.38); }
.gg-row { grid-template-columns: minmax(0, 1fr) auto; }
.gg-c { display: inline-flex; gap: 6px; align-items: baseline; }
.gg-c i { margin: 0; font-size: var(--fs-min); }
.gg-back { display: block; width: 100%; margin: 0 0 8px; padding: 0; border: 0; background: none; color: var(--accent); font: 11.5px var(--sans); text-align: left; cursor: pointer; }
.gg-t { font: 600 13.5px var(--sans); color: var(--pale); }
.gg-ips { display: flex; flex-direction: column; gap: 1px; margin: 4px 0 10px; }
.gg-ip { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; gap: 1px 8px; align-items: center; padding: 5px 6px; border-radius: 0; }
.gg-ip:hover, .gg-ip.on { background: rgba(255,255,255,0.05); }
.gg-dot { width: 7px; height: 7px; border-radius: 50%; }
.gg-ipv { font: 11.5px var(--mono); color: var(--pale); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gg-ipa { display: inline-flex; gap: 6px; opacity: 0; }
.gg-ip:hover .gg-ipa, .gg-ip.on .gg-ipa { opacity: 1; }
.gg-ipa button { padding: 0; border: 0; background: none; color: var(--accent); font: 10.5px var(--mono); cursor: pointer; }
.gg-ipw { grid-column: 2 / -1; font-size: var(--fs-min); color: var(--text2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gg-only { width: 100%; padding: 5px 8px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 0; background: none; color: var(--accent); font: 11.5px var(--sans); cursor: pointer; }
.gg-only:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); }
/* avatars: a preset icon on a tinted disc, an own picture, or initials */
.av { display: inline-grid; place-items: center; flex: none; width: 20px; height: 20px; border-radius: 50%; overflow: hidden; background: rgba(255,255,255,0.08); }
.av img { width: 100%; height: 100%; object-fit: cover; }
/* outline: a ring in the icon's colour on the panel, no fill */
.av-i { background: rgba(10,14,19,0.55); box-shadow: inset 0 0 0 1.5px var(--av); }
.av-i svg { width: 66%; height: 66%; fill: var(--av); fill-rule: evenodd; stroke: none; }
.av-t { font: 600 9px var(--mono); letter-spacing: 0; color: var(--pale); background: color-mix(in srgb, var(--accent) 18%, #101317); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 40%, transparent); }
.hdr-me .av { width: 18px; height: 18px; }
.hdr-me .av-t { font-size: var(--fs-min); }
.acc-avatar { background: none !important; border: 0 !important; }
.acc-avatar .av { width: 42px; height: 42px; }
.acc-avatar .av-t { font-size: 14px; }
.acc-prof-r { font: 12px var(--sans); color: var(--text); }
.acc-prof-r:empty { display: none; }
.acc-avs { display: grid; grid-template-columns: repeat(auto-fill, 36px); gap: 7px; margin: 6px 0 16px; }
.acc-av { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid transparent; border-radius: 50%; background: none; cursor: pointer; font: 600 11px var(--mono); color: var(--text2); }
.acc-av .av { width: 32px; height: 32px; }
.acc-av:hover { border-color: rgba(255,255,255,0.25); }
.acc-av.on { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent); }
.acc-av-none { border-color: rgba(255,255,255,0.12); }
.av-up { background: rgba(255,255,255,0.04); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.2); }
.av-up svg { width: 55%; height: 55%; fill: none; stroke: var(--text); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.acc-profsave { margin-top: 4px; }
.adm-who .av { width: 22px; height: 22px; margin-right: 2px; }
/* the header's right corner: the clock, then the person's menu at the edge; on the home page the
   menu stays there and the clock sits above the search, at its right */
.hdr-right { display: flex; align-items: center; gap: 14px; margin-left: 18px; flex-shrink: 0; pointer-events: all; visibility: visible !important; }
.hdr-right .hdr-clock { margin: 0; }
.hdr-right .hdr-me-wrap { margin-left: 0; }
@media (min-width: 1260px) {
  #app-header .hdr-right { position: absolute; right: 18px; top: 0; bottom: 0; margin: 0; }
  #app-header .hdr-right .hdr-clock { position: static; display: inline; }
}
body:not(.searched) #app-header .hdr-clock { display: none !important; }
.hb-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; width: min(840px, 100%); margin: -18px auto 10px; }
.hb-row .hb-greet { width: auto; margin: 0; }
.hb-clock { font-family: var(--mono); font-size: var(--fs-min); letter-spacing: .16em; text-transform: uppercase; color: var(--text2); text-shadow: var(--sub-shadow); white-space: nowrap; }
#hero.searched .hb-row { display: none; }
@media (max-width: 640px) { .hb-clock { display: none; } }
/* the per-source cards are gone from the page: Evidence opens each source's full answer */
#cards-container { display: none !important; }
.vp-ev-r { cursor: pointer; }
.vp-ev-r:hover td { background: rgba(255,255,255,0.025); }
.vp-ev-c { width: 8px; height: 5px; margin-right: 8px; fill: none; stroke: var(--text2); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; transform: rotate(-90deg); transition: transform .15s; vertical-align: middle; }
.vp-ev-r.on .vp-ev-c { transform: none; }
.vp-ev-x > td { padding: 4px 0 12px !important; border-bottom: 1px solid rgba(255,255,255,0.05); }
.vp-ev-x .card { margin: 0; border-radius: 0; box-shadow: none; }
.vp-ev-x .card .card-head { display: none; }
.vp-ev-x .card .card-body, .vp-ev-x .card.card-collapsed .card-body { display: block !important; max-height: none !important; }
.vp-ev-x .card .card-target-id, .vp-ev-x .card .card-summary { display: none; }
.vp-ev-x .card .card-body { padding: 10px 14px; }
.td-lang { display: inline-flex; gap: 2px; margin-left: 10px; vertical-align: middle; }
.td-lang button { padding: 0 6px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: none; color: var(--text2); font: 11px var(--mono); cursor: pointer; }
.td-lang button.on { border-color: color-mix(in srgb, var(--accent) 55%, transparent); color: var(--accent); }

/* the header's verdict without its dot; the summary a little lower */
.vp-head .vp-title::before { display: none; }
.vp-sum { padding-top: 12px; }
/* the facts: the name small above the value, the tile thin, the value whole on one line (the
   tiles take the width their value needs; the last row's widen to fill it) */
.vp-tile { display: block; flex: 1 1 auto; min-width: 130px; padding: 5px 12px 6px; }
.vp-tile small { display: block; margin: 0 0 1px; font-size: var(--fs-min); letter-spacing: .02em; line-height: 1.3; }
.vp-tile span { display: block; -webkit-line-clamp: unset; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13px; line-height: 1.4; }
@media (max-width: 640px) { .vp-tile { flex-basis: auto; min-width: 45%; } }
/* the timeline, one line in Footprinting */
.tl-strip { display: flex; align-items: center; gap: 10px; min-height: 18px; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); }
.tl-track { position: relative; flex: 1 1 auto; height: 14px; }
.tl-track::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: rgba(255,255,255,0.16); }
.tl-m { position: absolute; top: 50%; width: 9px; height: 9px; margin: -4.5px 0 0 -4.5px; border-radius: 50%; background: #8199ad; border: 2px solid #12161a; cursor: default; transition: transform .12s; }
.tl-m.tl-red, .tl-m.tl-bad { background: #ef7b70; }
.tl-m.tl-orange, .tl-m.tl-warn { background: #e3b36c; }
.tl-m.on { transform: scale(1.5); }
.tl-a { flex: none; }
.tl-cap { margin: 2px 0 5px; font: 12px var(--sans); color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* the trail of the hunt, in the map's toolbar */
.g-trail { display: inline-flex; align-items: center; gap: 4px; min-width: 0; max-width: 46%; overflow: hidden; white-space: nowrap; font-family: var(--mono); font-size: var(--fs-min); color: var(--text2); }
.g-trail[hidden] { display: none; }
.g-trail b { font-weight: 400; margin-right: 4px; letter-spacing: .06em; text-transform: uppercase; font-size: var(--fs-min); }
.g-trail i { font-style: normal; opacity: .6; }
.g-tools .g-trail button { padding: 0; border: 0; background: none; color: var(--text); font: 11px var(--mono); letter-spacing: 0; cursor: pointer; }
.g-tools .g-trail button:hover { color: var(--accent); }
/* the node card: was the lead useful */
.gc-fb { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: var(--fs-min); color: var(--text2); }
.gc-fb button { padding: 0 7px; border: 1px solid rgba(255,255,255,0.14); border-radius: 0; background: none; color: var(--text); font: 11px var(--mono); cursor: pointer; }
.gc-fb button:hover { border-color: color-mix(in srgb, var(--accent) 50%, transparent); color: var(--accent); }
/* fingerprint chips: put the hosts on the map */
.fp-map { padding: 0 6px; border: 0; border-left: 1px solid rgba(255,255,255,0.1); background: none; color: var(--accent); font: 11px var(--mono); cursor: pointer; }
.fp-map:disabled { opacity: .6; cursor: progress; }

/* the open tabs on the home page: a row like the recent analyses */
.tabs-home[hidden] { display: none; }
.th-list { display: flex; flex-wrap: wrap; gap: 6px; }
.th-tab { display: inline-flex; align-items: center; gap: 7px; max-width: 260px; height: 28px; padding: 0 6px 0 10px; border: 1px solid rgba(255,255,255,0.1); border-radius: 0; background: rgba(15,18,22,0.78); color: var(--text); font: 11.5px var(--mono); cursor: pointer; }
.th-tab:hover { border-color: color-mix(in srgb, var(--accent) 40%, transparent); color: var(--pale); }
.th-tab .tab-x { opacity: .7; }

/* the person's menu in the header: readable (the search narrows for it) */
.hdr-me { gap: 8px; max-width: 280px; font-size: 12px; letter-spacing: .08em; }
.hdr-me .av { width: 24px; height: 24px; }
.hdr-me .av-t { font-size: var(--fs-min); }
.hdr-me > svg { width: 10px; height: 7px; }
/* the home clock, the colour of the greeting */
.hb-clock { color: var(--pale); opacity: .9; }
/* straight edges everywhere: the round buttons too (only dots, the score ring and avatars stay round) */
.g-q, .vp-rerun, .acc-mark { border-radius: 0 !important; }
/* the header menu's picture: the drawing fills its disc like everywhere else (the chevron rules
   are for the chevron only) */
.hdr-me .av-i svg { width: 64%; height: 64%; stroke-width: 1.7; transform: none; }
/* the person's name exactly as they wrote it (no capitals forced) */
.hdr-me { text-transform: none; letter-spacing: .02em; }
/* the drawing on a picture's disc: placed by its centre, whatever the disc's size */
.av-i { position: relative; }
.av-i svg { position: absolute; left: 50%; top: 50%; width: 64%; height: 64%; transform: translate(-50%, -50%); }
.hdr-me .av-i svg { transform: translate(-50%, -50%); }
/* tabs: a hunt's tab, dragging */
.tab.hunt, .th-tab.hunt { color: var(--pale); }
.tab-hg { flex: none; width: 11px; height: 11px; fill: none; stroke: var(--accent); stroke-width: 1.3; stroke-linecap: square; }
.tab-sub { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-min); color: var(--text2); }
.tab.dragging, .th-tab.dragging { opacity: .45; }
.tab.drop-l, .th-tab.drop-l { box-shadow: inset 2px 0 0 var(--accent); }
.tab.drop-r, .th-tab.drop-r { box-shadow: inset -2px 0 0 var(--accent); }
.tab.drop-in, .th-tab.drop-in { outline: 1px dashed var(--accent); outline-offset: -2px; background: color-mix(in srgb, var(--accent) 12%, transparent); }
/* the hunt's page */
.hp { width: min(1100px, 100%); margin: 18px auto 60px; font-family: var(--sans); color: var(--text); }
.hp-wait { padding: 30px 0; color: var(--text2); }
.hp-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 14px; border: 1px solid rgba(255,255,255,0.09); background: rgba(14,17,21,0.9); }
.hp-head .tab-hg { width: 18px; height: 18px; }
.hp-name { flex: 1 1 260px; min-width: 0; padding: 2px 4px; border: 1px solid transparent; background: none; color: var(--pale); font: 600 18px var(--sans); }
.hp-name:hover, .hp-name:focus { border-color: rgba(255,255,255,0.14); outline: none; }
.hp-meta { font: 11.5px var(--mono); color: var(--text2); }
.hp-acts { display: flex; gap: 8px; margin-left: auto; }
.hp-acts button, .hs-save, .hs-back { padding: 4px 10px; border: 1px solid rgba(255,255,255,0.14); background: none; color: var(--text); font: 12px var(--sans); cursor: pointer; }
.hp-acts button:hover, .hs-save:hover, .hs-back:hover { border-color: color-mix(in srgb, var(--accent) 50%, transparent); color: var(--accent); }
.hp-notes { display: block; width: 100%; margin: 8px 0 14px; padding: 8px 12px; border: 1px solid rgba(255,255,255,0.09); background: rgba(12,15,18,0.82); color: var(--text); font: 13px/1.5 var(--sans); resize: vertical; }
.hp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 10px; }
.hp-card { display: flex; flex-direction: column; gap: 6px; padding: 11px 13px; border: 1px solid rgba(255,255,255,0.09); background: rgba(15,18,22,0.88); cursor: pointer; transition: border-color .15s; }
.hp-card:hover, .hp-card:focus-visible { border-color: color-mix(in srgb, var(--accent) 40%, transparent); outline: none; }
.hp-c1 { display: flex; align-items: center; gap: 8px; min-width: 0; }
.hp-ioc { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 600 13.5px var(--mono); color: var(--pale); }
.hp-lab { flex: none; font: 600 11px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--text2); }
.hp-sc { flex: none; font: 11px var(--mono); color: var(--text2); }
.hp-x { margin-left: auto; flex: none; padding: 0 4px; border: 0; background: none; color: var(--text2); font-size: 14px; line-height: 1; cursor: pointer; }
.hp-x:hover, .hp-x.sure { color: #f2a59d; }
.hp-x.sure { font: 11px var(--mono); }
.hp-fam { display: flex; flex-wrap: wrap; gap: 4px; }
.hp-sum { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hp-c3 { font: 11px var(--mono); color: var(--text2); }
.hp-sec { margin-top: 16px; padding: 12px 14px; border: 1px solid rgba(255,255,255,0.09); background: rgba(14,17,21,0.9); }
.hp-h { margin-bottom: 8px; font: 600 11px var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--text2); }
.hp-empty { margin: 0; font-size: 12.5px; color: var(--text2); }
.hp-rows { display: flex; flex-direction: column; gap: 6px; }
.hp-row { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 10px; align-items: baseline; }
.hp-k { font: 600 11px var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--text2); }
.hp-vs { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }
.hp-v { display: inline-flex; align-items: baseline; gap: 6px; max-width: 100%; padding: 1px 7px; border: 1px solid rgba(255,255,255,0.12); font: 11.5px var(--mono); color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hp-v i { font-style: normal; font-size: var(--fs-min); color: var(--text2); }
.hp-ties { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.hp-tie { position: relative; display: flex; flex-direction: column; gap: 3px; padding: 4px 8px 4px 16px; border: 1px solid rgba(224,103,94,0.35); background: rgba(224,103,94,0.05); min-width: 0; }
.hp-tie-i { position: relative; display: flex; align-items: flex-start; gap: 7px; min-width: 0; cursor: pointer; }
.hp-tie-i:first-child::after { content: ''; position: absolute; left: -9px; top: 9px; bottom: -9px; width: 1px; background: rgba(239,123,112,0.7); }
.hp-tie-i .tab-dot { position: relative; z-index: 1; flex: none; margin: 5px 0 0 -12px; box-shadow: 0 0 0 2px #15191e; }
.hp-tie-v { min-width: 0; font: 11.5px/17px var(--mono); color: var(--pale); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hp-tie-f { margin-top: 1px; }
.hp-tie-i:hover .hp-tie-v { color: var(--accent); }
.hp-tie-f { flex: none; padding: 0 6px; border: 1px solid rgba(239,123,112,0.45); font: 600 11px var(--mono); color: #f2a59d; white-space: nowrap; }
.hp-tie-l { border-color: rgba(255,255,255,0.14); color: var(--text2); font-weight: 400; letter-spacing: .06em; text-transform: uppercase; }
.hp-more { font: 11px var(--mono); color: var(--text2); }
.hp-famt { font-family: var(--sans); font-size: 14px; }
.hp-io { display: flex; gap: 7px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 11.5px var(--mono); color: var(--text2); }
.hp-io em { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-style: normal; }
.hp-vt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hp-io span { flex: none; font-weight: 600; font-size: var(--fs-min); letter-spacing: .08em; color: #6b7883; padding-top: 1px; }
/* the hunt's board: the graph (graph.js) and, beside it, how the indicators meet */
.hb { margin: 0 0 12px; }
.hb-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 6px 10px; border: 1px solid rgba(255,255,255,0.1); border-bottom: 0; background: rgba(14,17,21,0.92); }
.hb-t { font: 600 11px var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--text2); }
.hb-c { font: 11px var(--mono); color: var(--text); }
.hb-seg { display: inline-flex; border: 1px solid rgba(255,255,255,0.16); }
.hb-seg button { padding: 3px 10px; border: 0; background: none; color: var(--text2); font: 11.5px var(--sans); cursor: pointer; }
.hb-seg button + button { border-left: 1px solid rgba(255,255,255,0.16); }
.hb-seg button:hover:not(:disabled) { color: var(--accent); }
.hb-seg button.on { background: rgba(120,184,212,0.16); color: var(--pale); }
.hb-seg button:disabled { opacity: .4; cursor: default; }
.hb-saved { font: 11px var(--mono); color: #6fcfbf; }
.hb-tip { margin-left: auto; font: 11px var(--mono); color: var(--text2); }
.hb-body { display: grid; grid-template-columns: minmax(0, 1fr) 290px; align-items: stretch; border: 1px solid rgba(255,255,255,0.1); }
.hg-host { min-width: 0; }
.hg-host > .g-wrap { border: 0; }
.hb-side { position: relative; min-width: 0; border-left: 1px solid rgba(255,255,255,0.08); background: rgba(16,19,23,0.96); }
.hb-side-in { position: absolute; inset: 0; overflow-y: auto; padding: 10px 12px; font-size: 12.5px; }
.hb-h { margin: 10px 0 6px; font: 600 11px var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--text2); }
.hb-h:first-child { margin-top: 0; }
.hb-empty, .hb-note, .hb-help { margin: 4px 0 8px; font-size: 12px; line-height: 1.45; color: var(--text2); }
.hb-note { margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(255,255,255,0.07); font-size: var(--fs-min); }
.hb-help { margin-top: 10px; font: 11px/1.5 var(--mono); color: #66737e; }
.hb-list { display: flex; flex-direction: column; }
.hb-it { display: flex; align-items: center; gap: 7px; width: 100%; min-width: 0; padding: 4px 4px; border: 0; border-bottom: 1px solid rgba(255,255,255,0.05); background: none; color: var(--text); text-align: left; cursor: pointer; font: 11.5px var(--mono); }
.hb-it:hover { background: rgba(120,184,212,0.07); }
.hb-it2 { flex-direction: column; align-items: stretch; gap: 2px; }
.hb-it em { font: normal 11px/1.4 var(--sans); color: var(--text2); }
.hb-it em code, .hb-tie em code { font: 11px var(--mono); color: #b9c6d0; }
.hb-ty { flex: none; font: 600 9.5px var(--mono); letter-spacing: .08em; color: #6b7883; margin-right: 6px; }
.hb-v { display: flex; align-items: center; gap: 6px; min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-v b, .hb-sel b { font: 600 12.5px var(--sans); color: var(--pale); }
.hb-io { font: 11px var(--mono); color: var(--text2); overflow: hidden; text-overflow: ellipsis; }
.hb-ow { display: flex; gap: 3px; flex: none; }
.hb-tie { display: flex; flex-direction: column; gap: 3px; margin-bottom: 6px; padding: 6px 8px; border: 1px solid rgba(224,103,94,0.35); background: rgba(224,103,94,0.05); cursor: pointer; }
.hb-tie span { display: flex; align-items: center; gap: 6px; min-width: 0; white-space: nowrap; overflow: hidden; }
.hb-tie span b { font: 600 12px var(--sans); color: var(--pale); }
.hb-tie em { font: normal 11px var(--sans); color: #f2a59d; }
.hb-sel { display: flex; align-items: center; gap: 7px; margin-bottom: 6px; }
.hb-sel b { font-size: 15px; }
.hb-ioc { display: flex; align-items: flex-start; gap: 6px; margin-bottom: 6px; }
.hb-ioc code { flex: 1; min-width: 0; font: 11px/1.45 var(--mono); color: var(--text); overflow-wrap: anywhere; }
.hb-cp { flex: none; padding: 0 6px; border: 1px solid rgba(255,255,255,0.14); background: none; color: var(--text2); font: 11px var(--mono); cursor: pointer; }
.hb-cp:hover { color: var(--accent); }
.hb-meta { font: 11px var(--mono); letter-spacing: .04em; color: var(--text2); margin-bottom: 6px; }
.hb-sum { margin: 6px 0; font-size: 12px; line-height: 1.45; color: var(--text); }
.hb-acts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.hb-acts .go, .hb-a { padding: 4px 10px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); background: none; color: var(--accent); font: 12px var(--sans); cursor: pointer; text-decoration: none; }
.hb-acts .go:hover, .hb-a:hover { background: color-mix(in srgb, var(--accent) 12%, transparent); }
@media (max-width: 760px) { .hb-body { grid-template-columns: 1fr; } .hb-side { border-left: 0; border-top: 1px solid rgba(255,255,255,0.08); } .hb-side-in { position: static; max-height: 320px; } .hb-tip { display: none; } }
.vp-huntstrip { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.vp-huntstrip span b { color: var(--pale); font-weight: 600; }
.hunt-pop-l { margin: 4px 0 6px; font-size: var(--fs-min); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text2); }
.hunt-pop-l i { font-style: normal; font-weight: 400; text-transform: none; letter-spacing: 0; margin-left: 4px; }
.hunt-pop-ts { display: flex; flex-direction: column; gap: 2px; max-height: 220px; overflow-y: auto; margin-bottom: 10px; }
.hunt-pop-t { display: flex !important; align-items: center; gap: 8px; margin: 0 !important; padding: 4px 4px; font: 12px var(--mono) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--text) !important; cursor: pointer; }
.hunt-pop-t input { width: auto !important; margin: 0 !important; }
.hunt-pop-t span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hunt-pop-t em { margin-left: auto; font-style: normal; font-size: var(--fs-min); color: var(--text2); }
.hunt-pop-t.off { opacity: .6; cursor: default; }
.tab-menu kbd { margin-left: auto; }
@media (max-width: 760px) { .hp-grid { grid-template-columns: 1fr; } }

/* phones: the header's search gets the room (the person's picture only, no name; shorter labels),
   the dock keeps its icons without their words */
@media (max-width: 640px) {
  .hdr-me-n, .hdr-me > svg { display: none; }
  .hdr-me { padding: 2px; gap: 0; }
  .hdr-right { gap: 8px; margin-left: 8px; }
  .hdr-access { font-size: var(--fs-min); letter-spacing: .04em; padding: 4px 6px; margin-right: 0; }
  #app-header .brand-name { font-size: 15px; }
  #hdr-search { min-width: 120px; }
  .tabs-save { padding: 2px 7px; font-size: var(--fs-min); }
  .tabs-acts .lbl { display: none; }
}

/* the site's signature, at the end of every page: two quiet lines, no pane */
.site-foot { display: flex; flex-direction: column; align-items: center; gap: 2px; width: max-content; max-width: calc(100% - 32px); margin: 34px auto 26px; padding: 0; border: 0; background: none; font: 11px var(--mono); letter-spacing: .04em; color: var(--text2); text-shadow: 0 1px 2px rgba(0,0,0,0.9), 0 0 10px rgba(0,0,0,0.6); }
.site-foot a { color: var(--text); text-decoration: none; }
.site-foot a:hover { color: var(--accent); }
.site-foot .site-foot-url { font-size: var(--fs-min); opacity: .7; letter-spacing: .08em; }

/* a hunt's alerts: what the daily re-check found that it did not have */
.ha { margin: 0 0 12px; }
.ha-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 7px 12px; border: 1px solid rgba(255,255,255,0.1); background: rgba(14,17,21,0.92); }
.ha-bar.on { border-color: rgba(239,123,112,0.45); background: linear-gradient(90deg, rgba(224,103,94,0.12), rgba(14,17,21,0.92) 55%); }
.ha-t { display: inline-flex; align-items: center; gap: 8px; font: 12.5px var(--sans); color: var(--text); }
.ha-t svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linejoin: round; }
.ha-bar.on .ha-t { color: var(--pale); } .ha-bar.on .ha-t svg { stroke: #ef7b70; }
.ha-t b { font-weight: 600; color: #f2a59d; }
.ha-m { font: 11px var(--mono); color: var(--text2); }
.ha-acts { display: flex; gap: 6px; margin-left: auto; }
.ha-acts button, .ha-b button { padding: 3px 9px; border: 1px solid rgba(255,255,255,0.16); background: none; color: var(--text); font: 11.5px var(--sans); cursor: pointer; }
.ha-acts button:hover, .ha-b button:hover:not(:disabled) { border-color: color-mix(in srgb, var(--accent) 50%, transparent); color: var(--accent); }
.ha-b button:disabled { opacity: .55; cursor: default; }
.ha-list { border: 1px solid rgba(239,123,112,0.3); border-top: 0; background: rgba(14,17,21,0.92); max-height: 260px; overflow-y: auto; }
.ha-it { display: grid; grid-template-columns: minmax(0, 150px) auto minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 5px 12px; border-top: 1px solid rgba(255,255,255,0.05); font: 11.5px var(--mono); }
.ha-from { color: var(--text2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ha-rel { color: var(--text2); font-family: var(--sans); white-space: nowrap; }
.ha-v { color: var(--pale); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ha-v.fam { color: #f2a59d; }
.ha-at { color: var(--text2); font-size: var(--fs-min); white-space: nowrap; }
.ha-b { display: flex; gap: 6px; }
.ha-more { margin: 0; padding: 5px 12px; font: 11px var(--mono); color: var(--text2); }
.tab-al, .hunt-al { flex: none; padding: 0 5px; background: #d2504a; color: #fff; font: 600 9.5px/15px var(--mono); }
.hunt-al { margin-left: 8px; padding: 1px 6px; font-size: var(--fs-min); }
@media (max-width: 760px) { .ha-it { grid-template-columns: minmax(0, 1fr) auto; } .ha-from, .ha-rel, .ha-at { display: none; } }

/* the page starts right under the header and the tabs; the signature sits at the foot of the window
   when the page is short, and after the content when it is long */
#app-main > .main-inner { min-height: 100%; display: flex; flex-direction: column; padding-bottom: 0; }
body.searched #app-main > .main-inner { padding-top: 14px; }
#hero.searched { padding-top: 0; }
#results > .hp { margin-top: 0; }
.site-foot { margin: auto auto 14px; flex: none; }
#app-main > .main-inner > #hero { margin-bottom: 28px; }

/* The sandbox: a file's run, in the result card */
.sbx { display: flex; flex-direction: column; gap: 14px; }
.sbx-top { display: flex; align-items: center; gap: 14px; }
.sbx-score { flex: none; display: flex; align-items: baseline; gap: 2px; padding: 6px 10px; border: 1px solid rgba(255,255,255,0.14); font: 600 22px var(--mono); color: var(--pale); }
.sbx-score span { font-size: var(--fs-min); color: var(--text2); }
.sbx-score.bad { border-color: rgba(229,115,107,0.6); color: #ef7b70; } .sbx-score.warn { border-color: rgba(227,179,108,0.55); color: #e3b36c; }
.sbx-id { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.sbx-fams { display: flex; flex-wrap: wrap; gap: 4px; }
.sbx-file { font: 11px var(--mono); color: var(--text2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sbx-h { margin-bottom: 6px; font: 600 11px var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--text2); }
.sbx-cfg { padding: 10px 12px; border: 1px solid rgba(239,123,112,0.35); background: rgba(224,103,94,0.05); }
.sbx-kv { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 10px; padding: 3px 0; font-size: 12.5px; }
.sbx-kv > span { font: 11.5px var(--sans); color: var(--text2); padding-top: 2px; }
.sbx-kv code { font: 11px var(--mono); color: var(--text); overflow-wrap: anywhere; }
.sbx-c2 { display: inline-flex; align-items: baseline; margin: 0 8px 2px 0; }
.sbx-c2 i { font: normal 11px var(--mono); color: var(--text2); }
.sbx-ioc { font: 11.5px var(--mono); color: var(--pale); text-decoration: none; border-bottom: 1px dotted rgba(255,255,255,0.25); }
.sbx-ioc:hover { color: var(--accent); border-color: var(--accent); }
.sbx-sigs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.sbx-sigs li { position: relative; display: flex; align-items: center; gap: 8px; padding: 3px 8px; font-size: 12.5px; color: var(--text); }
.sbx-sigs li > i { position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); background: rgba(255,255,255,0.04); }
.sbx-sigs li > i.bad { background: rgba(224,103,94,0.13); } .sbx-sigs li > i.warn { background: rgba(227,179,108,0.11); }
.sbx-sigs li > span { position: relative; flex: 1; min-width: 0; }
.sbx-ttp { position: relative; flex: none; padding: 0 5px; border: 1px solid rgba(255,255,255,0.14); font: 10px var(--mono); color: var(--text2); text-decoration: none; }
.sbx-ttp:hover { color: var(--accent); }
.sbx-list { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.sbx-drop { font: 11.5px var(--mono); color: var(--text); } .sbx-drop i { font-style: normal; color: var(--text2); }
.sbx-tab { width: 100%; border-collapse: collapse; font-size: 12px; }
.sbx-tab td { padding: 5px 8px 5px 0; border-top: 1px solid rgba(255,255,255,0.05); vertical-align: middle; }
.sbx-tab td .hunt-fam { margin-right: 4px; }
.sbx-role { padding: 0 6px; border: 1px solid rgba(255,255,255,0.16); font: 600 11px var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--text2); }
.sbx-role.c2 { border-color: rgba(239,123,112,0.6); color: #f2a59d; }
.sbx-sc { font: 11px var(--mono); color: var(--text2); white-space: nowrap; }
.sbx-nm { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text2); }
.sbx-muted { color: var(--text2); font-size: var(--fs-min); white-space: nowrap; }
.sbx-n { margin: 6px 0 0; font-size: var(--fs-min); color: var(--text2); }
.sbx-ind { display: block; margin-top: 2px; font: 10.5px var(--mono); color: var(--text2); overflow-wrap: anywhere; }
.sbx-req { font: 11.5px var(--mono); color: var(--text); overflow-wrap: anywhere; }
.sbx-req b { font-weight: 600; color: var(--text2); } .sbx-req i { font-style: normal; color: var(--text2); }
.sbx-req code { font: 10.5px var(--mono); color: var(--text2); }
.sbx-av { font: normal 10.5px var(--mono); color: var(--amber); } .sbx-av.bad { color: #f2a59d; }
.sbx-proc { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.sbx-proc li { position: relative; padding: 3px 6px 3px calc(10px + var(--d, 0) * 16px); font-size: 12px; line-height: 1.35; }
.sbx-proc li::before { content: ''; position: absolute; left: calc(var(--d, 0) * 16px); top: 4px; bottom: 4px; width: 2px; background: rgba(255,255,255,0.14); }
.sbx-proc li.orig::before { background: var(--amber); }
.sbx-proc b { font-weight: 600; color: var(--pale); } .sbx-proc i { margin-left: 6px; font: normal 10.5px var(--mono); color: var(--text2); }
.sbx-proc code { display: block; margin-top: 1px; font: 10.5px var(--mono); color: var(--text2); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sbx-bg { margin-top: 6px; } .sbx-bg > summary { font: 11px var(--sans); color: var(--text2); } .sbx-bg code { font: 10.5px var(--mono); color: var(--text2); }
.sbx-run { margin-top: 8px; padding: 10px 12px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); }
.sbx-run.on { border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.sbx-run-t { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--text); }
.sbx-run-t b { color: var(--pale); font-weight: 600; }
.sbx-run-t span { margin-left: auto; font: 11px var(--mono); color: var(--text2); }
.sbx-go { margin-top: 8px; padding: 5px 14px; border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent); background: color-mix(in srgb, var(--accent) 10%, transparent); color: var(--accent); font: 600 12.5px var(--sans); cursor: pointer; }
.sbx-go:hover { background: color-mix(in srgb, var(--accent) 18%, transparent); }
.sbx-err { margin-left: 10px; font-size: 12px; color: #f2a59d; }
.sbx-steps { display: flex; gap: 4px; margin-top: 8px; }
.sbx-steps i { flex: 1; height: 3px; background: rgba(255,255,255,0.1); }
.sbx-steps i.done { background: color-mix(in srgb, var(--accent) 70%, transparent); }
.sbx-steps i.now { background: linear-gradient(90deg, var(--accent), rgba(255,255,255,0.1)); background-size: 200% 100%; animation: sbx-flow 1.4s linear infinite; }
@keyframes sbx-flow { from { background-position: 100% 0; } to { background-position: -100% 0; } }
.sbx-spin { width: 12px; height: 12px; border: 2px solid rgba(255,255,255,0.15); border-top-color: var(--accent); border-radius: 50%; animation: sbx-spin .9s linear infinite; }
@keyframes sbx-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .sbx-steps i.now, .sbx-spin { animation: none; } }

/* the page's own header, once scrolled away: its actions at the end of the tab strip, the verdict in the open tab */
.tabs-acts { flex: none; display: flex; align-items: center; gap: 2px; align-self: center; margin-left: 8px; animation: acts-in .18s ease-out; }
.tabs-acts[hidden] { display: none; }
@keyframes acts-in { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }
.tabs-acts .vp-act, .tabs-acts button { display: inline-flex; align-items: center; gap: 5px; height: 21px; padding: 0 8px; border: 1px solid transparent; background: none; color: var(--text2); font: 11px var(--mono); cursor: pointer; white-space: nowrap; }
.tabs-acts .vp-act:hover, .tabs-acts button:hover { color: var(--accent); border-color: rgba(255,255,255,0.12); }
.tabs-acts svg { width: 12px; height: 12px; flex: none; }
.tabs-acts [data-hp] { border-color: rgba(255,255,255,0.14); }
.tab-v { display: none; font: 600 9.5px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--text2); }
.tab-v-red { color: #ef7b70; } .tab-v-orange { color: #e3b36c; } .tab-v-teal, .tab-v-green { color: #6fcfbf; }
body.docked .tab.on .tab-v { display: inline; }
body.docked .tab.on { max-width: 340px; }
/* the home page: no slim header appears when it scrolls */
body:not(.searched).scrolled #app-header { background: transparent; border-bottom-color: transparent; box-shadow: none; }
/* a hunt's page: its parts stacked without gaps; the notes as tall as their text */
.hp > .hp-notes { margin: 0; border-top: 0; resize: none; min-height: 36px; field-sizing: content; }
.hp > .ha { margin: 0; }
.hp > .ha .ha-bar { border-top: 0; }
.hp > .hb { margin: 0 0 12px; }
.hp > .hb .hb-bar { border-top: 0; }

.hb-c em { font-style: normal; color: #f2a59d; }
.hb-new { margin-left: 6px; padding: 0 5px; border: 1px solid rgba(120,184,212,0.45); font: normal 9.5px var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--accent); }
.hb-ty.bad { color: #ef7b70; }
/* a section never makes the card wider than it is: long names, hashes and URLs wrap */
.vp-secs, .vp-sec, .vp-sec-b { min-width: 0; max-width: 100%; }
.vp-sec-b { overflow-wrap: anywhere; }
.sbx-file { white-space: normal; overflow-wrap: anywhere; }
.sbx-ioc, .sbx-drop, .sbx-kv > div, .sbx-sigs li > span { overflow-wrap: anywhere; min-width: 0; }
.sbx-fams .tag { white-space: nowrap; }
.sbx-tab { table-layout: fixed; }
.sbx-tab td:nth-child(1) { width: 72px; } .sbx-tab td:nth-child(3) { width: 52px; } .sbx-tab td:nth-child(6) { width: 88px; }
.sbx-tab td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sbx-tab td:nth-child(2) { white-space: normal; }
@media (max-width: 640px) { .sbx-top { flex-wrap: wrap; } .sbx-kv { grid-template-columns: 1fr; gap: 2px; } .sbx-tab td:nth-child(4), .sbx-tab td:nth-child(6) { display: none; } }

/* the home page: the open tabs right at the top, on the row of the person's menu */
/* a fingerprint chip in a narrow card: its parts wrap as whole words, never letter by letter */
.fp-chip { max-width: 100%; min-width: 0; }
.fp-c { flex-wrap: wrap; gap: 0 6px; min-width: 0; text-align: left; }
.fp-c b, .fp-c i { white-space: nowrap; }
/* the home page: the header stays as it is while the page scrolls, and saving a hunt belongs to a result */
body:not(.searched) #app-header, body:not(.searched).scrolled #app-header { background: transparent; border-bottom-color: transparent; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
body:not(.searched) #tab-save { display: none; }

/* the Home tab: always first, an icon only */
.tab.tab-home { flex: none; min-width: 0; width: 34px; padding: 0; justify-content: center; }
.tab.tab-home svg { width: 14px; height: 14px; }
.tab.tab-home:not(.on) { color: var(--text2); }

/* The layout, top to bottom: the open tabs (as in a browser: each tab holds a page), then the header
   (the search and the account), then the page. The same on the home page and on a result. */
body.has-tabs { --tabs-h: 30px; }
#tabs-bar { top: 0; height: var(--tabs-h); }
body.has-tabs #app-header { top: var(--tabs-h); }
body.searched #app-main { padding-top: calc(var(--tabs-h) + var(--header-h)); }
body.has-tabs:not(.searched) #app-main { padding-top: var(--tabs-h); }

/* the graph's Auto, lit while it is on */
.g-tools [data-a="auto"].on { color: var(--accent); box-shadow: inset 0 -2px 0 var(--accent); }

/* the top strip: the tabs on the left, the account and the clock on the right */
#tabs-bar .tabs-main { display: flex; align-items: flex-end; align-self: stretch; min-width: 0; flex: 1 1 auto; }
#tabs-bar .tabs-side { display: flex; align-items: center; align-self: center; gap: 14px; flex: none; padding-left: 12px; }
#tabs-bar .tabs-side .hdr-right { margin-left: 0; }
#tabs-bar .hdr-clock { margin-left: 0; }
body:not(.searched) #tabs-bar .hdr-clock { display: none; }   /* the home page shows the time by the greeting */
/* the header: the page's actions on the right (Save as hunt, a result's JSON, PDF, Share, Takedown) */
#app-header .tabs-r { margin-left: 12px; }
#app-header .tabs-acts { margin-left: 12px; }
@media (max-width: 700px) { #tabs-bar .tabs-side { gap: 8px; padding-left: 6px; } }

/* switching between the home page, a result and a hunt: no sliding, the page is simply there */
#hero, .hero-brand, .main-inner, #app-header { transition: none !important; }

/* a section's title: the same solid ground open or closed, scrolling with its section; what an open
   one holds sits on a slightly deeper ground */
.vp-sec > .vp-sec-h, .vp-sec-rel > .rel-side { background: #171b20; }   /* every section's title on the same solid ground, open or closed */
.vp-sec > .vp-sec-h:hover, .vp-sec-rel > .rel-side:hover { background: #1a1f25; }
.vp-sec.open > .vp-sec-h { border-bottom: 1px solid rgba(255,255,255,0.06); }
.vp-sec.open > .vp-sec-b { background: rgba(8,10,13,0.34); }
.vp-sec + .vp-sec { border-top: 1px solid rgba(255,255,255,0.06); }

/* Behaviour, a file's run: what it did and what it reached side by side on a wide card; thin rows,
   the severity a mark at the start of each; the first few, the rest behind "+N more" */
.sbx-cols { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@container vpcard (min-width: 760px) { .sbx-cols { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 26px; } }
.sbx-sigs { gap: 1px; }
.sbx-sigs li { padding: 3px 6px 3px 12px; font-size: 12px; line-height: 1.35; }
.sbx-sigs li:nth-child(odd) { background: rgba(255,255,255,0.018); }
.sbx-sigs li > i { left: 0; top: 4px; bottom: 4px; width: 3px; background: rgba(255,255,255,0.22); }
.sbx-sigs li > i.bad { background: #d2504a; } .sbx-sigs li > i.warn { background: #e3b36c; }
.sbx-cols .sbx-kv { grid-template-columns: 74px minmax(0, 1fr); padding: 2px 0 6px; }
.sbx-cols .sbx-list { gap: 2px 10px; }
.sbx-more { margin-top: 4px; }
.sbx-more > summary { width: max-content; cursor: pointer; list-style: none; padding: 1px 6px; border: 1px solid rgba(255,255,255,0.12); font: 11px var(--mono); color: var(--text2); }
.sbx-more > summary::-webkit-details-marker { display: none; }
.sbx-more > summary:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.sbx-more[open] > summary { margin-bottom: 4px; }
.sbx-list .sbx-more { flex-basis: 100%; }

/* bold, lighter: the faces loaded stop at Medium (IBM Plex Sans 500) and Semibold (JetBrains Mono 600);
   no thickened stand-in above that, the real weight instead */
html { font-synthesis-weight: none; }
b, strong { font-weight: 600; }

/* no tab open: no strip, only the account and the clock at the top right */
#tabs-bar { height: 30px; }
#tabs-bar.tabs-empty { background: none !important; border-bottom-color: transparent !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; }
#tabs-bar.tabs-empty .tabs-main { visibility: hidden; }

/* The home page fits the window, whatever its height: the lists (recent analyses, saved hunts) take
   the room that is left and scroll inside themselves; the page itself does not scroll */
body:not(.searched) #app-main { overflow: hidden; box-sizing: border-box; }
body:not(.searched) .main-inner { box-sizing: border-box; height: 100%; min-height: 0; display: flex; flex-direction: column; padding-top: 0; padding-bottom: 0; }
body:not(.searched) #hero { flex: 1 1 auto; height: auto; min-height: 0; padding-top: clamp(14px, 8vh, 10vh); }
body:not(.searched) .hero-brand { flex: none; }
body:not(.searched) .search-section { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
body:not(.searched) .search-section > .search-row, body:not(.searched) .search-section > .type-row { flex: none; }
body:not(.searched) .search-section > .hist-row:not([hidden]) { flex: 0 1 auto; min-height: 0; display: flex; flex-direction: column; }
body:not(.searched) .search-section > .hist-row > :last-child { min-height: 0; overflow-y: auto; scrollbar-width: thin; }
body:not(.searched) .site-foot { flex: none; margin: 10px auto 12px; }
@media (max-height: 640px) { body:not(.searched) .hero-brand { margin-bottom: 14px; } }

/* Relations: the same chevron as the other sections, at the end of its title row */
.rel-side .rel-ch { flex: none; width: 10px; height: 6px; margin-left: auto; align-self: center; fill: none; stroke: var(--text2); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.vp-sec-rel.open .rel-side .rel-ch { transform: rotate(180deg); }

/* the + menu, and the paste box it opens */
.plus-pop { position: fixed; z-index: 2000; width: 310px; padding: 6px 0; background: #12161b; border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 14px 34px rgba(0,0,0,0.45); font-family: var(--sans); }
.plus-pop > button { display: flex; align-items: center; gap: 11px; width: 100%; padding: 8px 14px; border: 0; background: none; color: var(--text); text-align: left; cursor: pointer; }
.plus-pop > button:hover, .plus-pop > button:focus-visible { background: rgba(255,255,255,0.05); outline: none; }
.plus-pop > button > svg { flex: none; width: 16px; height: 16px; fill: none; stroke: var(--text2); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.plus-pop > button:first-child > svg { stroke: var(--accent); }
.plus-pop .pp-l { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.plus-pop .pp-l b { font-size: 13px; font-weight: 500; color: var(--pale); }
.plus-pop .pp-l i { font-style: normal; font-size: var(--fs-min); color: var(--text2); }
.plus-pop .pp-hunt { padding-left: 27px; }
.plus-pop .pp-hunt b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plus-pop kbd { flex: none; font: 10.5px var(--mono); color: var(--text2); }
.plus-pop .pp-sep { margin: 6px 0; border-top: 1px solid rgba(255,255,255,0.08); }
.plus-pop .pp-h { padding: 4px 14px 2px; font: 600 11px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--text2); }
.plus-paste { width: 420px; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.pp-paste-l { font-size: 12px; color: var(--text2); }
.plus-paste textarea { width: 100%; box-sizing: border-box; resize: vertical; min-height: 110px; padding: 8px 10px; background: #0b0d10; border: 1px solid rgba(255,255,255,0.14); color: var(--pale); font: 12px/1.5 var(--mono); }
.plus-paste textarea:focus { outline: none; border-color: color-mix(in srgb, var(--accent) 55%, transparent); }
.pp-paste-a { display: flex; gap: 8px; justify-content: flex-end; }
.pp-paste-a button { padding: 5px 12px; border: 1px solid rgba(255,255,255,0.14); background: none; color: var(--text); font: 12px var(--mono); cursor: pointer; }
.pp-paste-a .go { border-color: color-mix(in srgb, var(--accent) 50%, transparent); color: var(--accent); }
@media (max-width: 640px) { .plus-pop { width: calc(100vw - 16px); } .plus-paste { width: calc(100vw - 16px); } }

/* the key an admin hands over in person when the mail could not go out */
.adm-key-pop { position: fixed; inset: 0; z-index: 4000; display: flex; align-items: center; justify-content: center; background: rgba(5,7,9,0.6); }
.adm-key-pop .akp-in { width: min(520px, calc(100vw - 32px)); padding: 18px 20px; background: #12161b; border: 1px solid rgba(255,255,255,0.14); box-shadow: 0 18px 44px rgba(0,0,0,0.5); font-family: var(--sans); }
.adm-key-pop b { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 500; color: var(--pale); }
.adm-key-pop p { margin: 0 0 12px; font-size: 13px; color: var(--text2); }
.adm-key-pop p span { color: var(--text); }
.adm-key-pop .akp-row { display: flex; gap: 8px; }
.adm-key-pop input { flex: 1; min-width: 0; padding: 7px 10px; background: #0b0d10; border: 1px solid rgba(255,255,255,0.14); color: var(--pale); font: 12px var(--mono); }
.adm-key-pop button { padding: 6px 12px; border: 1px solid rgba(255,255,255,0.14); background: none; color: var(--text); font: 12px var(--mono); cursor: pointer; }
.adm-key-pop [data-c] { border-color: color-mix(in srgb, var(--accent) 50%, transparent); color: var(--accent); }
.adm-key-pop .akp-x { margin-top: 12px; float: right; }

/* the line under the name on the home page: what the site is for */
.hb-tag { margin: 4px 0 0; font: 13px var(--sans); color: rgba(220,232,240,0.72); text-shadow: var(--sub-shadow); text-align: center; }
.hero-brand { max-height: 150px; }
.hb-row { margin-top: -8px; }   /* the greeting sits under the line, not beside it */
/* on a touch screen there is no tooltip: the actions keep their word */
@media (hover: none), (max-width: 600px) { .vp-acts { flex-wrap: wrap; } .vp-acts .vp-act .lbl { display: inline !important; } }
/* the Home tab stays in sight when the tabs scroll sideways */
#tabs-bar #tab-home { position: sticky; left: 0; z-index: 2; background: rgba(9,11,14,0.96); }

/* phones, after a search: the home tab already leads back, so the search box gets the name's room */
@media (max-width: 520px) { body.searched #app-header .brand-row { display: none; } }
/* phones: the map's tools fit one line (the snapshot stays one tap away in full screen) */
@media (max-width: 520px) { .g-tools { gap: 8px; padding-right: 8px; } .g-tools-r { gap: 11px; } .g-wrap:not(.g-full-on) .g-tools .g-cam { display: none; } }

/* ── identity ── */
/* the verdict card: a severity stripe in the verdict's colour, and the family next to the indicator */
.vp-card.vp-red, .vp-card.vp-orange, .vp-card.vp-teal, .vp-card.vp-grey { border-left: 3px solid var(--vc) !important; }
.vp-famchip { flex: none; font-family: var(--mono); font-size: var(--fs-min); letter-spacing: 0.06em; text-transform: uppercase; color: var(--vc, var(--threat)); border: 1px solid color-mix(in srgb, var(--vc, var(--threat)) 60%, transparent); padding: 1px 7px; white-space: nowrap; }


/* ── the result in columns (direction "Observatory", structure B) ──
   one column on a narrow card: findings, behaviour, footprinting, the map, the evidence;
   three on a wide one: what is known | the map | what it exposes and does */
.vp-A .vp-secs.vp-cols { display: flex; flex-direction: column; gap: 10px; }
.vp-col { display: contents; }
.vp-cols .vp-finds { order: 1; margin: 0; }
.vp-cols [data-sec="sbx"] { order: 2; }
.vp-cols [data-sec="foot"] { order: 3; }
.vp-cols [data-sec="rel"] { order: 4; }
.vp-cols [data-sec="raw"] { order: 5; }
.vp-cols .vp-note { order: 6; }
@container vpcard (min-width: 1100px) {
  .vp-A .vp-secs.vp-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.65fr) minmax(0, 1fr); align-items: start; gap: 12px; }
  .vp-col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
  .vp-cols .vp-col > * { order: 0; }
  .vp-col-c [data-sec="rel"] { position: sticky; top: 8px; }
}
/* the wide screen gives the columns room */
@media (min-width: 1280px) {
  body.searched .main-inner { width: min(calc(100vw / var(--z, 1) - 64px), 1560px); max-width: none; }
}
/* the verdict as a seal: the severity word in a plate of its colour */
.vp-head .vp-title { border: 1.5px solid var(--vc, #8595a2); padding: 3px 9px 3px 8px; font-size: 12.5px; letter-spacing: .14em; color: var(--vc, #8595a2); background: color-mix(in srgb, var(--vc, #8595a2) 10%, transparent); }

/* focus you can see: every control shows the Hail ring when reached by keyboard */
a:focus-visible, button:focus-visible, [role="button"]:focus-visible, [role="tab"]:focus-visible, [role="radio"]:focus-visible, [tabindex]:focus-visible, summary:focus-visible, select:focus-visible, input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--hail) !important; outline-offset: 2px !important;
}
.search-wrap:focus-within { border-color: var(--hail) !important; box-shadow: 0 0 0 1px var(--hail), 0 0 0 4px color-mix(in srgb, var(--hail) 22%, transparent) !important; }
#ioc-input:focus-visible { outline: none !important; }
/* targets big enough to hit: the small controls get a larger hit area without growing */
.type-chip, .vp-act, .vp-retry, .bulk-f, .tab-x { position: relative; }
.type-chip::after, .vp-act::after, .vp-retry::after, .bulk-f::after, .tab-x::after { content: ''; position: absolute; inset: 50% auto auto 50%; width: max(100%, var(--hit)); height: max(100%, var(--hit)); transform: translate(-50%, -50%); }

/* ── the Cerberus panel: the seal on top, the columns as cards, sources with severity pills ── */
.sev-pill { display: inline-flex; align-items: center; gap: 6px; padding: 1px 9px; border-radius: 999px; font: 600 var(--fs-sm) var(--sans); white-space: nowrap; color: var(--s); border: 1px solid color-mix(in srgb, var(--s) 55%, transparent); background: color-mix(in srgb, var(--s) 8%, transparent); }
.sev-pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--s); }
.sev-critical { --s: var(--sev-critical); } .sev-high { --s: var(--sev-high); } .sev-medium { --s: var(--sev-medium); } .sev-low { --s: var(--sev-low); } .sev-info { --s: var(--sev-info); }
/* evidence as a list: the source and its pill on one line, what it said under them */
.vp-ev, .vp-ev tbody { display: block; }
.vp-ev-r { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 10px; padding: 10px 2px; border-bottom: 1px solid var(--line); }
.vp-ev-r td { padding: 0 !important; border: 0 !important; width: auto !important; white-space: normal !important; background: none !important; }
.vp-ev-r td:first-child { grid-column: 1; grid-row: 1; color: var(--frost); font-size: var(--fs-body); }
.vp-ev-r td:last-child { grid-column: 2; grid-row: 1; display: flex; align-items: center; gap: 6px; text-align: right; }
.vp-ev-r td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; color: var(--mist); font-size: var(--fs-sm); margin-top: 3px; }
.vp-ev-r:hover { background: rgba(255,255,255,0.02); }
.vp-ev-x { display: block; } .vp-ev-x > td { display: block; }
.vp-ev a { margin-left: 2px; }
/* the columns as cards */
.vp-cols .vp-sec, .vp-cols .vp-finds { border: 1px solid var(--line) !important; border-radius: 8px; background: var(--slate) !important; overflow: hidden; }
.vp-cols .vp-sec-h b, .vp-cols .vp-blk-h, .vp-cols .rel-title { font-family: var(--display); font-weight: 700; letter-spacing: .02em; color: var(--frost); }
/* the seal: the verdict's colour rising from the left, the severity word in a plate */
.vp-A .vp-head { margin: 14px 20px 6px; border: 1px solid var(--line); border-radius: 8px; background: linear-gradient(90deg, color-mix(in srgb, var(--vc) 16%, var(--slate)) 0%, var(--slate) 45%); }
.vp-head .vp-title { font: 700 17px/1 var(--display); letter-spacing: .1em; padding: 9px 16px; border: 2px solid var(--vc, #8595a2); border-radius: 4px; background: color-mix(in srgb, var(--vc, #8595a2) 10%, transparent); color: var(--vc, #8595a2); }
.vp-head .vp-title::before { display: none; }
.vp-head .vp-headtarget { font-family: var(--mono); }
@media (max-width: 640px) { .vp-A .vp-head { margin: 10px 12px 4px; } .vp-head .vp-title { font-size: 14px; padding: 6px 11px; } }
/* the verdict's colour lives in the seal only: the card around it stays neutral */
.vp-card.vp-A, .vp-card.vp-A:hover { background: var(--panel-bg) !important; border-left: 1px solid var(--panel-line) !important; }
body[data-verdict] #app-main::before { opacity: 0 !important; }
.vp-A .vp-head { background: linear-gradient(90deg, color-mix(in srgb, var(--vc) 9%, var(--slate)) 0%, var(--slate) 28%) !important; border-color: var(--line) !important; box-shadow: inset 4px 0 0 var(--vc); }   /* neutral: the colour is a stripe, the plate, the ring */
/* a medium card (a tablet, a narrow window): the map across the top, the rest in two columns */
@container vpcard (min-width: 700px) and (max-width: 1099.98px) {
  .vp-A .vp-secs.vp-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 12px; }
  .vp-cols [data-sec="rel"] { grid-column: 1 / -1; grid-row: 1; }
  .vp-cols .vp-finds { grid-column: 1; grid-row: 2; }
  .vp-cols [data-sec="raw"] { grid-column: 1; grid-row: 3; }
  .vp-cols .vp-note { grid-column: 1; grid-row: 4; }
  .vp-cols [data-sec="foot"] { grid-column: 2; grid-row: 2; }
  .vp-cols [data-sec="sbx"] { grid-column: 2; grid-row: 3; }
}
/* the seal on a phone: the plate and the indicator first, the actions on their own row */
@media (max-width: 640px) {
  .vp-A .vp-head { flex-wrap: wrap; row-gap: 10px; }
  .vp-A .vp-head .vp-acts { width: 100%; justify-content: flex-start; flex-wrap: wrap; gap: 6px 14px; }
  .vp-tiles { --per: 2 !important; }
}

/* ── the result fits the window (wide and tall enough screens): the page does not scroll; the
   seal and the summary stay, and each column scrolls on its own ── */
@media (min-width: 1100px) and (min-height: 600px) {
  body.searched #app-main:has(#verdict-panel > .vp-A) { overflow: hidden; }
  body.searched #app-main:has(#verdict-panel > .vp-A) > .main-inner { height: 100%; min-height: 0; padding-bottom: 12px; display: flex; flex-direction: column; }
  body.searched #app-main:has(#verdict-panel > .vp-A) .site-foot { display: none; }
  body.searched #app-main:has(#verdict-panel > .vp-A) #hero,
  #results:has(#verdict-panel > .vp-A), #verdict-unit:has(> #verdict-panel > .vp-A), #verdict-panel:has(> .vp-A) { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; margin-bottom: 0 !important; }
  #verdict-panel > .vp-card.vp-A { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; overflow: hidden; margin: 0; }
  #verdict-panel > .vp-card.vp-A > * { flex: none; }
  #verdict-panel > .vp-card.vp-A > .vp-cols { flex: 1 1 auto; min-height: 0; padding-bottom: 14px; }
}
@container vpcard (min-width: 1100px) {
  @media (min-height: 600px) {
    #verdict-panel > .vp-card.vp-A > .vp-cols { align-items: stretch; grid-template-rows: minmax(0, 1fr); }
    .vp-cols > .vp-col { overflow-y: auto; min-height: 0; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
    .vp-cols > .vp-col > * { flex: none; }
    .vp-col-c > [data-sec="rel"] { flex: 1 1 auto; }
    .vp-col-c [data-sec="rel"] { position: static; }
  }
}
@container vpcard (min-width: 1100px) {
  @media (min-height: 600px) {
    .vp-col-c > [data-sec="rel"] { display: flex; flex-direction: column; }
    .vp-col-c > [data-sec="rel"] > * { flex: none; }
  }
}
/* Filter sits with the other tools and looks like them; its funnel says what it is */
.g-tools .g-flt-b { display: inline-flex; align-items: center; gap: 5px; }
.g-tools .g-flt-b svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; }
/* in the result's columns the column decides: positioned for measuring, and the sandbox's two
   blocks stacked, its techniques wrapping under the line instead of crushing it */
.vp-col { position: relative; }
.vp-col .sbx-cols { grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
.vp-col .sbx-sigs li { flex-wrap: wrap; }
.vp-col .sbx-sigs li > span { flex: 1 1 160px; }
.vp-col .sbx-kv { grid-template-columns: 84px minmax(0, 1fr); }
/* the sandbox runs in a narrow column: each run is two lines (role, family, score / sample, date) */
.vp-col .sbx-tab, .vp-col .sbx-tab tbody { display: block; table-layout: auto; }
.vp-col .sbx-tab tr { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 4px 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line); }
.vp-col .sbx-tab td { padding: 0 !important; border: 0 !important; width: auto !important; }
.vp-col .sbx-tab td:nth-child(1) { grid-column: 1; grid-row: 1; }
.vp-col .sbx-tab td:nth-child(2) { grid-column: 2; grid-row: 1; white-space: normal; }
.vp-col .sbx-tab td:nth-child(2) .hunt-fam { display: inline-block; white-space: nowrap; margin: 1px 4px 1px 0; }
.vp-col .sbx-tab td:nth-child(3) { grid-column: 3; grid-row: 1; }
.vp-col .sbx-tab td:nth-child(4) { display: none; }
.vp-col .sbx-tab td:nth-child(5) { grid-column: 1 / 3; grid-row: 2; color: var(--mist); }
.vp-col .sbx-tab td:nth-child(6) { display: block !important; grid-column: 3; grid-row: 2; color: var(--mist); }
/* the severity tag in the site's own manner: square, mono, upper case */
.sev-pill { border-radius: 0; font: 600 var(--fs-min) var(--mono); letter-spacing: .06em; text-transform: uppercase; padding: 2px 7px; gap: 6px; }
.sev-pill i { width: 6px; height: 6px; border-radius: 0; }

/* the globe has the canvas to itself: the indicator list tab and the legend step aside */
.g-wrap.g-map-on .g-list-tab, .g-wrap.g-map-on .g-legend, .g-wrap.g-map-on .g-list { display: none !important; }
/* the result card is glass again (the photo or texture shows through); its sections stay solid */
.vp-card.vp-A, .vp-card.vp-A:hover { background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0) 40%), rgba(13,16,20,0.62) !important; -webkit-backdrop-filter: blur(18px) saturate(1.2); backdrop-filter: blur(18px) saturate(1.2); border: 1px solid rgba(255,255,255,0.12) !important; box-shadow: var(--panel-lift), inset 0 1px 0 rgba(255,255,255,0.08); }

/* the verdict plate: black, the word and the edge in the verdict's colour */
.vp-head .vp-title { background: #050709 !important; border: 1.5px solid var(--vc, #8595a2) !important; color: var(--vc, #8595a2) !important; }
/* the severity beside a source: its word in its colour, nothing around it */
.sev-pill { border: 0 !important; background: none !important; padding: 0 !important; font: 500 var(--fs-sm) var(--sans) !important; letter-spacing: 0 !important; text-transform: none !important; }
.sev-pill i { display: none; }
/* the verdict as a word: no plate, the word itself in the verdict's colour, wide and lit */
.vp-head .vp-title { background: none !important; border: 0 !important; padding: 0 !important; font: 600 21px/1.05 var(--display) !important; letter-spacing: .16em !important; color: var(--vc, #8595a2) !important; text-shadow: 0 0 22px color-mix(in srgb, var(--vc, #8595a2) 35%, transparent); }
/* each source carries its severity as a hairline on its left edge; the word stays quiet beside it */
.vp-ev-r { --s: var(--line); border-left: 2px solid var(--s) !important; padding-left: 12px !important; margin-left: -2px; }
.vp-ev-r:has(.sev-critical) { --s: var(--sev-critical); } .vp-ev-r:has(.sev-high) { --s: var(--sev-high); } .vp-ev-r:has(.sev-medium) { --s: var(--sev-medium); } .vp-ev-r:has(.sev-low) { --s: var(--sev-low); } .vp-ev-r:has(.sev-info) { --s: var(--sev-info); }
.sev-pill { font: 500 12.5px var(--sans) !important; letter-spacing: .02em !important; opacity: .92; }
/* the card behind the sections: glass, a step darker */
.vp-card.vp-A, .vp-card.vp-A:hover { background: linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0) 40%), rgba(9,12,16,0.76) !important; }

/* the globe has the whole canvas even when the indicator list was open */
.g-wrap.g-map-on .g-body.has-list > .g-canvas { margin-left: 0 !important; }
.g-wrap.g-map-on .g-list-rs { display: none !important; }
.g-map-c.hot circle:first-child { stroke-width: 1 !important; }
/* the result fitted to the window: the columns stand still and each section scrolls inside
   itself; a section takes the room its content needs and gives some up when the column is full */
@container vpcard (min-width: 1100px) {
  @media (min-height: 600px) {
    .vp-cols > .vp-col { overflow: hidden !important; }
    .vp-cols > .vp-col > .vp-finds, .vp-cols > .vp-col > .vp-sec.open:not([data-sec="rel"]) { flex: 0 1 auto !important; min-height: 110px; display: flex; flex-direction: column; overflow: hidden; }
    .vp-cols > .vp-col > .vp-sec:not(.open) { flex: none !important; }
    .vp-cols .vp-finds > .vp-blk-h, .vp-cols .vp-sec.open > .vp-sec-h { flex: none; }
    .vp-cols .vp-finds > .vp-reasons, .vp-cols .vp-sec.open:not([data-sec="rel"]) > .vp-sec-b { flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
  }
}
/* the node card over the globe too */
.g-wrap.g-map-on .g-info { z-index: 8; }
/* the verdict header keeps the site's sharp corners */
.vp-A .vp-head { border-radius: 0 !important; }
/* footprinting lines in a narrow column: the label never breaks inside a word, and a
   fingerprint's "map" link stays one word on one line */
.vp-A .vp-line { grid-template-columns: max-content minmax(0, 1fr); }
.vp-A .vp-line > .svc-label { white-space: nowrap; }
.fp-chip { max-width: 100%; }
.fp-chip .fp-c { min-width: 0; flex-wrap: wrap; }
.fp-map, .fp-chip a { flex: none; white-space: nowrap; }

/* ── One header, the tabs on the card ──────────────────────────────────────────────────────
   The header (the name, the search, and on its right the account, the time and the place) is the
   only bar at the top. The open tabs are the top of the result's card, under the same gap as
   before; once they no longer fit they turn into a carousel with an arrow on each side. The home
   page has neither: no header, no tabs. */
:root, body.has-tabs { --tabs-h: 0px; }
body.has-tabs #app-header { top: 0; }
body.searched #app-main { padding-top: var(--header-h); }
body.has-tabs:not(.searched) #app-main { padding-top: 0; }
body:not(.searched) #tabs-bar { display: none !important; }
#tabs-bar, :root[data-bright] #tabs-bar, :root[data-bg="snow"] #tabs-bar, :root[data-theme][data-bg="snow"] #tabs-bar {
  position: relative; inset: auto; z-index: 3; flex: none; display: flex; align-items: flex-end; gap: 0; height: 34px; margin: 0; padding: 0 6px 0 8px;
  background: var(--panel-bg); border: 1px solid var(--panel-line); border-bottom: 0; box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none; font-family: var(--mono);
}
#tabs-bar + #results #verdict-panel > .vp-card { border-top-left-radius: 0; border-top-right-radius: 0; }
#tabs-bar .tabs-main { display: block; align-self: stretch; flex: 0 1 auto; min-width: 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; scroll-behavior: smooth; }
#tabs-bar .tabs-main::-webkit-scrollbar { display: none; }
#tabs-bar .tabs-strip { display: inline-flex; align-items: flex-end; height: 100%; overflow: visible; }
#tabs-bar .tab { height: 28px; }
#tabs-bar .tab.on { height: 29px; margin-bottom: -1px; background: var(--slate, #0f141a); }
#tabs-bar .tab-blank .tab-t { color: var(--pale); }
#tabs-bar .tab-add { align-self: center; margin: 0 0 0 4px; height: 26px; }
.tabs-arr { display: none; flex: none; align-self: center; width: 22px; height: 26px; padding: 0; border: 0; background: none; color: var(--text2); cursor: pointer; }
.tabs-arr svg { width: 7px; height: 11px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.tabs-arr:hover:not(:disabled) { color: var(--pale); background: rgba(255,255,255,0.06); }
.tabs-arr:disabled { opacity: .25; cursor: default; }
#tabs-bar.tabs-over .tabs-arr { display: inline-flex; align-items: center; justify-content: center; }
/* the account, the time and the place are on the header's right, as before the tab strip; on the
   home page only the account shows, at the top right */
body:not(.searched) #app-header .hdr-right { visibility: visible; pointer-events: all; }
body:not(.searched) #app-header .hdr-clock { visibility: hidden; }
/* the result still fits the window, now with the tabs on top and the Mensvr Labs line under it,
   spaced as on the home page */
@media (min-width: 1100px) and (min-height: 600px) {
  body.searched #app-main:has(#verdict-panel > .vp-A) > .main-inner { padding-bottom: 0; }
  body.searched #app-main:has(#verdict-panel > .vp-A) .site-foot { display: flex; flex: none; margin: 10px auto 12px; }
}
/* the name in the header opens a new tab (the home page), as the + does */
a.brand-name { text-decoration: none; cursor: pointer; }
a.brand-name:hover, a.brand-name:focus-visible { color: var(--frost); }
/* the evidence rows are read as they are: no fold, no hover, no pointer */
.vp-ev-r.vp-ev-flat { cursor: default; }
.vp-ev-r.vp-ev-flat:hover, .vp-ev-r.vp-ev-flat:hover td { background: none !important; }
/* the search in focus: a quieter edge, a faint halo */
.search-wrap:focus-within { border-color: color-mix(in srgb, var(--hail) 55%, var(--line)) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--hail) 8%, transparent) !important; }
[data-sec="sbx"] .vp-sec-h .vp-sec-s { white-space: normal; overflow: visible; text-overflow: clip; }
/* in a column each detonated sample is one line (role, family, hash, date), so the list fits */
.vp-col .sbx-tab tr { grid-template-columns: auto auto minmax(0, 1fr) auto; gap: 0 10px; padding: 6px 0; }
.vp-col .sbx-tab td:nth-child(1) { grid-column: 1; grid-row: 1; }
.vp-col .sbx-tab td:nth-child(2) { grid-column: 2; grid-row: 1; white-space: nowrap; }
.vp-col .sbx-tab td:nth-child(3) { display: none; }
.vp-col .sbx-tab td:nth-child(5) { grid-column: 3; grid-row: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vp-col .sbx-tab td:nth-child(6) { grid-column: 4; grid-row: 1; white-space: nowrap; }
.vp-col .sbx-n { margin: 8px 0 0; }
/* the Sköll ring beside the name, in silver as on the icons; a soft shadow keeps it off the
   picture behind on every theme */
.bh-mark { flex: none; width: 1.25em; height: 1.25em; filter: drop-shadow(0 1px 3px rgba(0,0,0,0.5)); }
a.brand-name { display: inline-flex; align-items: center; gap: .4em; }
.hb-name { display: inline-flex; align-items: center; gap: .32em; }
.hb-name .bh-mark { width: 1.3em; height: 1.3em; margin-top: -.12em; filter: drop-shadow(0 1px 6px rgba(0,0,0,0.45)); }
/* the name in the same silver as the mark */
.bh-word { background: linear-gradient(170deg, #f3f5f7 0%, #c9d0d6 40%, #9aa4ad 68%, #dde2e6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.hb-name, a.brand-name { text-shadow: none !important; }
.hb-name .bh-word, a.brand-name .bh-word { filter: drop-shadow(0 1px 4px rgba(0,0,0,0.55)); }
/* the home page's lockup: the mark on the left, as tall as the name and its line together; the
   line "Cyber Hunter" centred under the name */
.hero-brand { flex-direction: row; align-items: center; justify-content: center; gap: 14px; }
.hero-brand .hb-text { display: flex; flex-direction: column; align-items: center; gap: 0; }
.hero-brand .hb-mark { width: 64px; height: 64px; }
.hero-brand .hb-sub { padding-left: .24em; }   /* the tracking's trailing space, given back so the line centres */
@media (max-width: 640px) { .hero-brand .hb-mark { width: 44px; height: 44px; } }

/* ── A new tab (+): a real tab, named Bloodhail, whose page is the home page's content inside the
   card, under the header and the tab strip. The home page itself (the name, or the search's back
   arrow) has neither. ── */
body.newtab #app-main, body.has-tabs.newtab:not(.searched) #app-main { padding-top: var(--header-h); }
body.newtab #app-header { pointer-events: all; background: #0e1013; border-bottom-color: rgba(255,255,255,0.1); }
body.newtab #app-header .header-inner > * { visibility: visible !important; }
body.newtab #app-header #hdr-search, body.newtab #app-header .hdr-verdict { display: none; }
body.newtab #app-header .hdr-clock { display: inline-flex !important; align-items: center; align-self: stretch; visibility: visible; }
body.newtab .hb-row .hb-clock { visibility: hidden; }
body.newtab #app-main > .main-inner { padding-top: 14px; }
body.newtab #tabs-bar { display: flex !important; order: -1; align-self: stretch; width: auto; max-width: 100%; margin: 0; border: 0; border-bottom: 1px solid var(--line); }
body.newtab #hero .hero-brand { margin-top: 64px; }
body.newtab #app-main > .main-inner { width: min(calc(100vw / var(--z, 1) - 64px), 1560px); max-width: none; }
body.newtab #hero { flex: 1 1 auto; min-height: 0; margin: 0; padding: 0 0 32px; background: var(--panel-bg); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); border: 1px solid var(--panel-line); border-top-color: var(--line); box-sizing: border-box; }
/* the page's actions and Save as hunt, at the strip's right end */
#tabs-bar .tabs-r, #tabs-bar .tabs-acts { align-self: center; margin-left: auto; padding-left: 10px; }
#tabs-bar .tabs-acts:not([hidden]) ~ .tabs-r { margin-left: 6px; }
#tabs-bar .tab-add[hidden] { display: none; }
/* the new tab's page lets the theme through, as a tab's card does behind its result */
body.newtab #tabs-bar { background: var(--panel-bg); }

/* Findings show whole when they are few (up to about half the column); a long list scrolls */
@container vpcard (min-width: 1100px) {
  @media (min-height: 600px) {
    .vp-cols > .vp-col > .vp-finds { flex: 0 0 auto !important; max-height: 55%; min-height: 0; }
  }
}
/* ── The tabs, minimized: on the home page they rest as a pile at the bottom left, "N tabs" above
   it; hovering fans them out, a click opens one. Leaving a result shrinks it into the pile. ── */
#tabs-pile { position: fixed; left: 22px; bottom: 26px; z-index: 20; width: 210px; font-family: var(--mono); animation: pileIn .35s cubic-bezier(.2,.8,.2,1) both; }
#tabs-pile[hidden] { display: none; }
#tabs-pile .tp-h { margin: 0 0 8px 2px; font-size: var(--fs-min); letter-spacing: .14em; text-transform: uppercase; color: var(--pale); text-shadow: var(--sub-shadow); }
#tabs-pile .tp-cards { position: relative; height: 46px; }
#tabs-pile .tp-c { font-family: inherit; position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 7px; height: 40px; padding: 0 10px; border: 1px solid var(--panel-line); background: rgba(12,16,21,0.88); color: var(--text); font-size: 11px; cursor: pointer; transition: transform .25s ease, opacity .25s ease; }
#tabs-pile .tp-c:nth-last-child(2) { transform: translate(6px, -6px); opacity: .7; }
#tabs-pile .tp-c:nth-last-child(3) { transform: translate(12px, -12px); opacity: .45; }
#tabs-pile .tp-c:nth-last-child(n+4) { opacity: 0; }
#tabs-pile .tp-c i { flex: none; width: 6px; height: 6px; }
#tabs-pile .tp-c b { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 400; color: var(--pale); }
#tabs-pile .tp-grp:hover .tp-cards, #tabs-pile .tp-grp:focus-within .tp-cards { height: auto; display: flex; flex-direction: column-reverse; gap: 4px; }
#tabs-pile .tp-grp:hover .tp-c, #tabs-pile .tp-grp:focus-within .tp-c { position: relative; transform: none; opacity: 1; }
#tabs-pile .tp-c:hover { border-color: var(--hail); }

@keyframes pileIn { from { opacity: 0; transform: translateY(16px) scale(.9); } }
/* minimizing, as on macOS: the card narrows toward the bottom left like a funnel, slides down
   into the pile and shrinks to it (--tx/--ty: from the card's corner to the pile's, set by JS) */
body.minimizing #app-main > .main-inner { transform-origin: 0% 100%; will-change: transform, clip-path; animation: genie .34s cubic-bezier(.55,.05,.7,.4) forwards; }
body.restoring #app-main > .main-inner { transform-origin: 0% 100%; animation: genie .34s cubic-bezier(.3,.6,.45,.95) reverse both; }
@media (prefers-reduced-motion: reduce) { body.minimizing #app-main > .main-inner, #tabs-pile { animation: none; } }
@media (max-width: 700px) { #tabs-pile { left: 12px; bottom: 70px; width: 170px; } }

/* ── Minimizing, closer to macOS: the bottom narrows toward the pile first (a curved funnel), the
   card follows, squeezed taller than wide, and lands as a sliver on the pile ── */
@keyframes genie {
  0%   { transform: none; clip-path: polygon(0 0, 100% 0, 100% 70%, 100% 100%, 0 100%, 0 70%); opacity: 1; filter: none; }
  25%  { transform: translate(calc(var(--tx) * .04), calc(var(--ty) * .12)) scale(.97, .96); clip-path: polygon(0 0, 100% 0, 92% 55%, 36% 100%, 0 100%, 0 60%); }
  50%  { transform: translate(calc(var(--tx) * .22), calc(var(--ty) * .42)) scale(.74, .8); clip-path: polygon(0 4%, 88% 0, 60% 45%, 14% 100%, 0 100%, 0 50%); opacity: .95; }
  75%  { transform: translate(calc(var(--tx) * .62), calc(var(--ty) * .78)) scale(.36, .5); clip-path: polygon(0 18%, 60% 6%, 30% 50%, 6% 100%, 0 100%, 0 55%); opacity: .8; filter: blur(.4px); }
  100% { transform: translate(var(--tx), var(--ty)) scale(.1, .07); clip-path: polygon(0 40%, 30% 30%, 12% 60%, 4% 100%, 0 100%, 0 70%); opacity: .2; filter: blur(1px); }
}

/* ── The home page: no search (a tab has it); the pile at the bottom left starts one ── */
body:not(.searched):not(.newtab) #hero .search-section, body:not(.searched):not(.newtab) #hero .type-row { display: none !important; }
#tabs-pile { display: block; }
#tabs-pile .tp-c { cursor: pointer; padding-right: 6px; }
#tabs-pile .tp-x { flex: none; width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; margin-left: 4px; color: var(--text2); opacity: 0; font-size: 13px; }
#tabs-pile:hover .tp-x, #tabs-pile:focus-within .tp-x { opacity: 1; }
#tabs-pile .tp-x:hover { color: var(--pale); background: rgba(255,255,255,0.08); }
#tabs-pile .tp-new { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; height: 34px; padding: 0 14px; border: 1px solid var(--panel-line); background: rgba(12,16,21,0.7); color: var(--pale); font: 12px var(--mono); letter-spacing: .06em; cursor: pointer; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
#tabs-pile .tp-new:hover, #tabs-pile .tp-new:focus-visible { border-color: var(--hail); color: #fff; }
#tabs-pile .tp-new span { font-size: 16px; line-height: 1; color: var(--hail); }


/* ── The new tab: its own window, resizable from its corner, with minimize and close ── */
#tabs-bar .nt-ctl { display: none; align-self: center; gap: 2px; margin-left: auto; padding-left: 8px; }
body.newtab #tabs-bar .nt-ctl { display: inline-flex; }
body.newtab #tabs-bar .tabs-r, body.newtab #tabs-bar .tabs-acts { margin-left: 8px; }
#tabs-bar .nt-ctl button { width: 26px; height: 22px; border: 0; background: none; color: var(--text2); font-size: 15px; line-height: 1; cursor: pointer; }
#tabs-bar .nt-ctl button:hover { color: var(--pale); background: rgba(255,255,255,0.08); }
#tabs-bar .nt-ctl [data-ntx]:hover { color: #fff; background: rgba(224,96,90,0.55); }
body.newtab #hero { overflow: auto; align-self: center; width: 100%; max-width: 100%; min-width: 420px; min-height: 360px; }
/* the sample indicators (IP, Domain…): quieter, a line of text more than a row of buttons */
#hero .type-row .type-chip { border-color: transparent !important; background: none !important; box-shadow: none !important; color: var(--text2); opacity: .7; padding-left: 6px; padding-right: 6px; }
#hero .type-row .type-chip:hover { opacity: 1; color: var(--pale); }

/* ── Options and Admin open beside the person's menu, not over the page ── */
.acc.acc-inmenu { inset: auto; top: calc(var(--header-h) + 6px); right: 14px; left: auto; bottom: auto; display: block; padding: 0; overflow: visible; }
.acc.acc-inmenu .acc-bg, .acc.acc-inmenu .acc-brand { display: none; }
.acc.acc-inmenu .acc-panel { width: min(400px, calc(100vw - 28px)); max-height: calc(100vh - var(--header-h) - 24px); overflow-y: auto; box-shadow: 0 18px 50px rgba(0,0,0,0.55); }
.acc.acc-inmenu.acc-adm .acc-panel { width: min(760px, calc(100vw - 28px)); }
/* the access screen behind the key: the theme already on screen, set back */
.acc-bg { background: var(--night) var(--ph, url("/bg_snow_leopard.webp")) var(--bg-pos, 75% 40%) / cover no-repeat !important; }

/* ── The result: Evidence folded at the right; the map has more room (from the left column) ── */
@container vpcard (min-width: 1100px) {
  .vp-A .vp-secs.vp-cols { grid-template-columns: minmax(0, .82fr) minmax(0, 2.05fr) minmax(0, 1fr) !important; }
}
/* screens that are not so large (Edge at 100% on a laptop): the interface a step smaller, as it
   looked at 90% */
@media (min-width: 701px) and (max-width: 1700px), (min-width: 701px) and (max-height: 860px) { :root { --z: .8; } }   /* laptops: a little smaller than the rest, still easy to read */

/* ── The clock stays in the header, by the person's menu, on every page (not by the greeting) ── */
#app-header .hdr-clock, body:not(.searched) #app-header .hdr-clock, body.newtab #app-header .hdr-clock { display: inline-flex !important; align-items: center; visibility: visible !important; }
.hb-clock { display: none !important; }
/* a result's columns: what is known on the left (findings, footprinting, behaviour), the map in
   the middle with the most room, the raw evidence on the right */
@container vpcard (min-width: 1100px) {
  .vp-A .vp-secs.vp-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, .82fr) !important; }
}
/* where an action from a tab's menu answers ("Link copied"): at the click */
.ctx-anchor { position: fixed; z-index: 6000; padding: 4px 9px; border: 1px solid var(--panel-line); background: #0e1013; color: var(--pale); font: 11px var(--mono); pointer-events: none; }
.ctx-anchor:empty { width: 1px; height: 1px; padding: 0; border: 0; background: none; }
.tab-menu hr { border: 0; border-top: 1px solid var(--line); margin: 4px 0; }

/* depth on the home page: one light layer over the whole picture (a veil and a touch of frost) */
body:not(.searched)::before { -webkit-backdrop-filter: blur(1.5px) saturate(.9); backdrop-filter: blur(1.5px) saturate(.9); }
body:not(.searched)::after { background: rgba(6,8,11,0.16), radial-gradient(ellipse 120% 115% at 50% 45%, transparent 30%, rgba(4,5,7,0.5) 100%) !important; }
/* recent searches belong to the search: on a new tab, not on the home page; saved hunts are a
   menu by the open tabs */
body:not(.searched):not(.newtab) #hist-row, #hunts-row { display: none !important; }

/* ── A tab's window: minimize, expand and close at its top right, on every tab; it moves with its
   strip; expanded, it takes the whole screen under the header ── */
#tabs-bar .nt-ctl { display: inline-flex !important; }
#tabs-bar .nt-ctl svg { width: 9px; height: 9px; fill: none; stroke: currentColor; stroke-width: 1.4; }
body.searched #app-main > .main-inner, body.newtab #app-main > .main-inner { width: min(calc(100vw / var(--z, 1) - 48px), 2100px) !important; max-width: none; transform: translate(var(--wx, 0px), var(--wy, 0px)); }
#tabs-bar { cursor: grab; touch-action: none; }
#tabs-bar .tab, #tabs-bar button { cursor: pointer; }
body.win-drag, body.win-drag #tabs-bar { cursor: grabbing; user-select: none; }
body.win-max #app-main > .main-inner { width: calc(100vw / var(--z, 1) - 16px) !important; transform: none; padding-top: 6px; }
body.win-max .site-foot { display: none !important; }
body.win-max #app-main:has(#verdict-panel > .vp-A) > .main-inner { padding-bottom: 44px; }   /* room for the pile */

/* ── The pile on every page: on the home page in full (the open tabs stacked, the saved hunts,
   New tab); on a tab, a compact row at the bottom left whose lists open upward on hover ── */
#tabs-pile { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
#tabs-pile .tp-grp { position: relative; width: 100%; }
#tabs-pile .tp-new { margin-top: 0; }
#tabs-pile.compact .tp-hunts .tp-hb { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; margin: 0; border: 1px solid var(--panel-line); background: rgba(12,16,21,0.7); color: var(--pale); font: var(--fs-min) var(--mono); letter-spacing: .1em; text-transform: uppercase; cursor: default; }
#tabs-pile.compact .tp-hunts .tp-cards { display: none; position: absolute; left: 0; bottom: calc(100% + 4px); width: 240px; height: auto; flex-direction: column-reverse; gap: 4px; }
#tabs-pile.compact .tp-hunts:hover .tp-cards, #tabs-pile.compact .tp-hunts:focus-within .tp-cards { display: flex; }
#tabs-pile.compact .tp-hunts .tp-c { position: relative; transform: none !important; opacity: 1 !important; }
#tabs-pile .tp-hunts .tp-c span { color: var(--text2); }
#tabs-pile.compact { flex-direction: row; align-items: flex-end; gap: 6px; left: 16px; bottom: 9px; width: auto; animation: none; }
#tabs-pile.compact .tp-grp { width: auto; }
#tabs-pile.compact .tp-tabs .tp-h, #tabs-pile.compact .tp-hunts .tp-hb { display: inline-flex; align-items: center; height: 26px; margin: 0; padding: 0 10px; border: 1px solid var(--panel-line); background: rgba(12,16,21,0.8); text-shadow: none; }
#tabs-pile.compact .tp-tabs .tp-cards { display: none; position: absolute; left: 0; bottom: calc(100% + 4px); width: 230px; height: auto; flex-direction: column-reverse; gap: 4px; }
#tabs-pile.compact .tp-tabs:hover .tp-cards, #tabs-pile.compact .tp-tabs:focus-within .tp-cards { display: flex; }
#tabs-pile.compact .tp-tabs .tp-c { position: relative; transform: none; opacity: 1; }
#tabs-pile.compact .tp-new { height: 26px; padding: 0 10px; font-size: 11px; }
/* the result's panels have the site's square corners, like the card around them */
.vp-card.vp-A :is(.vp-sec, .vp-finds, .vp-tiles, .vp-sec-h, .vp-sec-b, .g-wrap, .g-body, .g-canvas, .g-info, .g-list, .g-tools, .rel-side, .vp-reasons, .vp-ev, .sbx, .fp-chip, .tag, .vp-blk-h, .pk-chip, .vp-head, .vp-sum) { border-radius: 0 !important; }

/* ── The live threat map (the home page) ── */
#tmap { display: block; width: min(1080px, 100%); margin: 6px auto 0; }
/* behind an open tab's window: the map where it was, set back, out of reach of the pointer */
#tmap-bg { position: fixed; z-index: 0; left: 50%; top: 20vh; width: min(1080px, 90vw); transform: translateX(-50%); pointer-events: none; opacity: .5; filter: saturate(.85); }
#tmap-bg[style*="left"] { transform: none; }
#tmap-bg #tmap { width: 100%; margin: 0; }
body:not(.searched):not(.newtab) #tmap-bg { display: none; }
body:not(.searched):not(.newtab) #hero .hb-row { display: none; }   /* the greeting is the map's title */
.tm-head { margin: 0 0 10px; text-align: left; }
.tm-title { margin: 0; font: 600 22px var(--display); letter-spacing: .03em; color: var(--pale); text-shadow: var(--sub-shadow); }
.tm-sub { display: flex; align-items: center; gap: 8px; margin: 6px 0 0; font: var(--fs-min) var(--mono); letter-spacing: .04em; color: var(--text2); text-shadow: var(--sub-shadow); }
.tm-live { flex: none; width: 7px; height: 7px; border-radius: 50%; background: #e0605a; box-shadow: 0 0 0 0 rgba(224,96,90,.6); animation: tmLive 1.8s ease-out infinite; }
#tmap.tm-off .tm-live { background: var(--text2); animation: none; }
#tmap.tm-late .tm-live { background: var(--amber); animation: none; }
@keyframes tmLive { 70% { box-shadow: 0 0 0 7px rgba(224,96,90,0); } 100% { box-shadow: 0 0 0 0 rgba(224,96,90,0); } }
.tm-body { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr); gap: 18px; align-items: stretch; padding: 16px; border: 1px solid var(--panel-line); background: rgba(9,12,16,0.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.tm-globe { position: relative; height: min(46vh, 430px); min-height: 280px; }
.tm-globe canvas { display: block; width: 100%; height: 100%; cursor: grab; touch-action: none; }
.tm-globe canvas:active { cursor: grabbing; }
.tm-tip { position: absolute; z-index: 2; display: flex; flex-direction: column; gap: 2px; min-width: 150px; padding: 8px 10px; border: 1px solid var(--panel-line); background: rgba(10,13,17,0.94); font: 11px var(--mono); color: var(--text); pointer-events: none; }
.tm-tip b { font: 600 13px var(--sans); color: var(--pale); }
.tm-tip span { color: #e0605a; }
.tm-tip em { font-style: normal; color: var(--text2); }
.tm-side { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.tm-blk h3 { margin: 0 0 8px; font: var(--fs-min) var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--text2); }
.tm-fams { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.tm-fams li { display: grid; grid-template-columns: minmax(0, 8.5em) 1fr auto; align-items: center; gap: 10px; font: 12px var(--mono); color: var(--text); }
.tm-fn { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--pale); }
.tm-bar { height: 4px; background: rgba(255,255,255,0.06); }
.tm-bar i { display: block; height: 100%; background: linear-gradient(90deg, rgba(224,96,90,.55), #e0605a); }
.tm-n { color: var(--text2); font-size: 11px; }
.tm-new { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.tm-new button { display: grid; grid-template-columns: minmax(0, 1fr) auto 2.4em; gap: 10px; width: 100%; padding: 5px 6px; border: 0; background: none; text-align: left; font: 12px var(--mono); color: var(--text); cursor: pointer; }
.tm-new button:hover, .tm-new button:focus-visible { background: rgba(255,255,255,0.05); color: var(--pale); }
.tm-ip { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-f { color: #e8a09a; }
.tm-cc { color: var(--text2); text-align: right; }
@media (max-width: 860px) { .tm-body { grid-template-columns: 1fr; } .tm-globe { height: 300px; } }
.acc.acc-inmenu[hidden], .tm-tip[hidden] { display: none !important; }

/* the home page's piles: the open tabs, and beside them (not under) the saved hunts; New tab
   under the tabs */
#tabs-pile:not(.compact) { display: grid; grid-template-columns: 210px 210px; column-gap: 18px; row-gap: 10px; align-items: end; width: auto; }
#tabs-pile:not(.compact) .tp-tabs { grid-column: 1; grid-row: 1; }
#tabs-pile:not(.compact) .tp-hunts { grid-column: 2; grid-row: 1; }
#tabs-pile:not(.compact) .tp-new { grid-column: 1; grid-row: 2; justify-self: start; }
#tabs-pile:not(.compact) .tp-hunts .tp-hb { display: block; height: auto; margin: 0 0 8px 2px; padding: 0; border: 0; background: none; font: var(--fs-min) var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--pale); text-shadow: var(--sub-shadow); }

/* ── A tab's window. Restored: a window with a margin around it, moved by its strip, resized from
   its bottom right corner. Expanded: edge to edge under the header (the pile stays reachable
   below), growing there smoothly; a drag on its strip brings it back. ── */
body:is(.searched, .newtab) #app-main > .main-inner { position: relative; width: var(--ww, min(calc(100vw / var(--z, 1) - 64px), 2100px)) !important; }
body:is(.searched, .newtab).win-sized #app-main > .main-inner { height: var(--wh) !important; }
.win-grip { display: none; position: absolute; right: -4px; bottom: 56px; z-index: 5; width: 16px; height: 16px; cursor: nwse-resize; touch-action: none;
  background: linear-gradient(135deg, transparent 50%, rgba(143,203,230,0.45) 50%, rgba(143,203,230,0.45) 58%, transparent 58%, transparent 70%, rgba(143,203,230,0.45) 70%, rgba(143,203,230,0.45) 78%, transparent 78%); }
body:is(.searched, .newtab):not(.win-max) .win-grip { display: block; }
body.win-max #app-main > .main-inner { width: calc(100vw / var(--z, 1)) !important; height: 100% !important; transform: none !important; padding: 0 0 38px !important; }
body.win-max #tabs-bar { border-left: 0; border-right: 0; border-top: 0; }
body.win-max #verdict-panel > .vp-card, body.win-max.newtab #hero { border-left: 0 !important; border-right: 0 !important; }
body.win-max .site-foot { display: none !important; }
#tabs-bar [data-ntmax] svg rect + rect { display: none; }
body.win-max #tabs-bar [data-ntmax] svg rect:first-child { transform: translate(1.5px, -1.5px) scale(.8); transform-origin: 6px 6px; }
body.win-max #tabs-bar [data-ntmax] svg rect + rect { display: block; }
#tabs-pile:not(.compact) .tp-tabs:empty + .tp-hunts { grid-column: 1; }   /* no open tabs: the hunts take their place */

/* ── A saved hunt in its tab: framed like a result (the card, square corners), fitting the window:
   the name, counts and actions; the notes; the indicators on the left, the board on the right ── */
#results > .hp { width: auto; max-width: none; margin: 0; padding: 0 0 14px; border: 1px solid var(--panel-line); border-top: 0; background: var(--panel-bg); }
.hp > .hp-head { margin: 0; padding: 12px 16px; border-bottom: 1px solid var(--line); background: var(--slate, #0f141a); }
.hp-pill { flex: none; padding: 2px 8px; border: 1px solid currentColor; font: 600 var(--fs-min) var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.hp-pill-red { color: #e0605a; } .hp-pill-orange { color: #e2b84d; } .hp-pill-teal, .hp-pill-green { color: #5cc2ae; } .hp-pill-grey { color: var(--text2); }
.hp > .hp-notes { display: block; width: calc(100% - 32px); margin: 10px 16px; min-height: 34px; resize: vertical; }
.hp-cols { display: grid; grid-template-columns: minmax(300px, .85fr) minmax(0, 2.4fr); gap: 14px; padding: 0 16px; align-items: start; }
.hp-col { min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.hp-col-l .hp-grid { grid-template-columns: 1fr; gap: 6px; }
.hp-col-l .hp-card { padding: 9px 11px; }
.hp-col-l .hp-sum { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hp-hn { margin-left: 6px; color: var(--text2); font-weight: 400; }
.hp-col-c .hb { margin: 0; }
.hp :is(.hp-card, .hb-bar, .hb-body, .hp-sec, .ha, .hp-notes) { border-radius: 0 !important; }
@media (max-width: 900px) { .hp-cols { grid-template-columns: 1fr; } }
@media (min-width: 1100px) and (min-height: 600px) {
  body.searched #app-main:has(#results > .hp) { overflow: hidden; }
  body.searched #app-main:has(#results > .hp) > .main-inner { height: 100%; min-height: 0; padding-bottom: 0; display: flex; flex-direction: column; }
  body.searched #app-main:has(#results > .hp) #hero { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; margin: 0 !important; padding-top: 0 !important; }
  body.searched #app-main:has(#results > .hp) .site-foot { display: flex; flex: none; margin: 10px auto 12px; }
  #results:has(> .hp) { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; margin: 0 !important; }
  #results > .hp { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  #results > .hp > .hp-head, #results > .hp > .hp-notes { flex: none; }
  #results > .hp > .hp-cols { flex: 1 1 auto; min-height: 0; align-items: stretch; }
  .hp-col-l { overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--line) transparent; padding-right: 2px; }
  .hp-col-c { min-height: 0; }
  .hp-col-c .hb { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
  .hp-col-c .hb-body { flex: 1 1 auto; min-height: 0; }
  .hp-col-c .hg-host, .hp-col-c .hg-host > .g-wrap { height: 100%; min-height: 0; }
}
@media (min-width: 1100px) and (min-height: 600px) {
  .hp-col-c .hg-host > .g-wrap { display: flex; flex-direction: column; }
  .hp-col-c .g-wrap > .g-body { flex: 1 1 auto; min-height: 0; }
  .hp-col-c .g-body > .g-canvas { height: 100% !important; }
}

/* the person's menu: what opens to the side shows it, an arrow on the left (where it opens) */
.hdr-menu [data-a] { display: flex; align-items: center; gap: 8px; }
.hdr-menu [data-a] .hdr-sub-ch { flex: none; margin: 0; }
.hdr-menu [data-a="exit"] { padding-left: 24px; }

/* ── The home page as the desktop: the threat map free on the picture (no frame), its feed as an
   instrument panel beside it; on a new tab the map shows through the tab's glass window; a result
   or a hunt hides it ── */
.tm-body { padding: 0; border: 0; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr); }
.tm-globe { height: min(56vh, 520px); }
#tmap-bg { opacity: 1; filter: none; }
body.searched #tmap-bg { display: none !important; }

/* the live feed beside the globe: big numbers on top (instrument style), then a terminal log */
.tm-term { gap: 12px; }
.tm-nums { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.tm-nums div { padding-left: 9px; border-left: 2px solid #e0605a; }
.tm-nums b { display: block; font: 600 26px/1.1 var(--display); color: var(--pale); text-shadow: var(--sub-shadow); }
.tm-nums span { font: 10px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--text2); }
.tm-log { border: 1px solid rgba(143,203,230,0.18); background: rgba(6,9,12,0.62); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font: 11.5px/1.7 var(--mono); }
.tm-log-bar { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-bottom: 1px solid rgba(143,203,230,0.14); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--text2); }
.tm-log-bar i { width: 7px; height: 7px; border-radius: 50%; background: #e0605a; box-shadow: 0 0 8px #e0605a; animation: tmLive 1.8s ease-out infinite; }
.tm-log-bar em { margin-left: auto; font-style: normal; text-transform: none; letter-spacing: .02em; }
.tm-new { display: block; padding: 6px 4px; }
.tm-new button { display: grid; grid-template-columns: 3.4em 2.4em minmax(0, 1fr) auto 2em; gap: 8px; width: 100%; padding: 0 6px; border: 0; background: none; text-align: left; font: inherit; color: #8fa3b2; cursor: pointer; animation: tmLine .4s ease-out both; animation-delay: calc(var(--i) * 45ms); }
.tm-new button:hover, .tm-new button:focus-visible { background: rgba(143,203,230,0.07); color: var(--pale); }
.tm-new b { font-weight: 400; color: #e0605a; }
.tm-new .tm-ip { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--pale); }
.tm-new .tm-f { color: #e8a09a; white-space: nowrap; }
.tm-new .tm-cc { color: var(--text2); text-align: right; }
@keyframes tmLine { from { opacity: 0; transform: translateX(-6px); } }
.tm-top { padding: 6px 10px; border-top: 1px dashed rgba(143,203,230,0.14); font-size: 11px; color: #8fa3b2; }
.tm-top span { color: var(--text2); letter-spacing: .1em; }
.tm-top i { font-style: normal; color: #e8a09a; }
.tm-prompt { padding: 0 10px 6px; color: var(--text2); }
.tm-cur { display: inline-block; width: 7px; height: 12px; vertical-align: -2px; background: var(--hail); animation: tmBlink 1s steps(1) infinite; }
@keyframes tmBlink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .tm-new button, .tm-cur, .tm-log-bar i { animation: none; } }

/* the name and the mark live in the header only (not a link), on every page; the home page and a
   new tab have no name of their own */
#hero .hero-brand { display: none !important; }
body:not(.searched) #app-header .brand-row { visibility: visible !important; }
body:not(.searched) #app-header { pointer-events: none; }
body:not(.searched) #app-header :is(.hdr-right, .hdr-me-wrap, #hdr-access) { pointer-events: all; }
span.brand-name { display: inline-flex; align-items: center; gap: .4em; cursor: default; }
/* the piles (tabs, hunts) and the Mensvr Labs line: on the home page and a new tab only */
body.searched #tabs-pile, body.searched .site-foot { display: none !important; }
body.searched #app-main:has(#verdict-panel > .vp-A) > .main-inner, body.searched #app-main:has(#results > .hp) > .main-inner { padding-bottom: 12px !important; }
.win-grip { bottom: 6px; }
body.newtab .win-grip { bottom: 56px; }
/* expanded: the whole screen, the header too (it comes back with the window) */
body.win-max #app-header { transform: translateY(-100%) !important; opacity: 0; pointer-events: none; visibility: hidden; }
body.win-max #app-main { padding-top: 0 !important; }
body.win-max #app-main > .main-inner { padding: 0 !important; }
body.win-max #tabs-bar { border-top: 0; }
/* a result: the map takes Evidence's room while Evidence is folded (a slim tab at the right edge);
   opening Evidence brings the three columns back */
@container vpcard (min-width: 1100px) {
  .vp-A .vp-secs.vp-cols:has(> .vp-col-r > [data-sec="raw"]:not(.open)) { grid-template-columns: minmax(0, 1fr) minmax(0, 2.9fr) 38px !important; }
  .vp-cols > .vp-col-r > [data-sec="raw"]:not(.open) { height: 100%; }
  .vp-cols > .vp-col-r > [data-sec="raw"]:not(.open) > .vp-sec-h { flex-direction: column; justify-content: flex-start; gap: 10px; height: 100%; padding: 12px 0; writing-mode: vertical-rl; }
  .vp-cols > .vp-col-r > [data-sec="raw"]:not(.open) > .vp-sec-h .vp-sec-s { display: none; }
  .vp-cols > .vp-col-r > [data-sec="raw"]:not(.open) > .vp-sec-h svg { transform: rotate(90deg); }
}

/* a new tab shows the saved hunts only (not the open tabs' pile, nor New tab); the Mensvr Labs line
   is the home page's alone */
body.newtab #tabs-pile .tp-tabs, body.newtab #tabs-pile .tp-new { display: none !important; }
body.newtab .site-foot { display: none !important; }
/* the threat map, larger */
body:not(.searched):not(.newtab) #tmap, #tmap-bg { width: min(1320px, 94vw) !important; }
.tm-globe { height: min(64vh, 600px) !important; }
.tm-body { grid-template-columns: minmax(0, 1.7fr) minmax(300px, 1fr) !important; }
/* the new tab: no greeting, the search in the middle of its window */
body.newtab #hero .hb-row { display: none !important; }
body.newtab #hero .search-section { justify-content: center; margin: 0 auto !important; }
/* the relations globe: a darker night behind it; the place in focus pinged, and lit in the panel */
.g-wrap.g-map-on .g-canvas { background: radial-gradient(ellipse 70% 80% at 38% 50%, rgba(6,9,13,0.55), rgba(1,2,4,0.82)); }
.g-map .g-map-ping circle { fill: none; stroke-width: .9; opacity: 0; transform-box: fill-box; transform-origin: center; animation: gPing 2.4s cubic-bezier(.2,.6,.35,1) infinite; }
.g-map .g-map-ping circle + circle { animation-delay: 1.2s; }
@keyframes gPing { 0% { transform: scale(.6); opacity: .85; } 100% { transform: scale(3.4); opacity: 0; } }
.gg-row.tour { background: rgba(140,200,226,0.1); box-shadow: inset 2px 0 0 var(--accent); }
@media (prefers-reduced-motion: reduce) { .g-map .g-map-ping { display: none; } }
/* the pile's New tab: inside the tabs, at the top, when they open out; alone when there are none */
#tabs-pile .tp-tabs:not(.tp-none) > .tp-new { display: none; width: 100%; height: 40px; margin: 0 0 4px; padding: 0 10px; background: rgba(12,16,21,0.88); font-size: 11px; }
#tabs-pile .tp-tabs:not(.tp-none):hover > .tp-new, #tabs-pile .tp-tabs:not(.tp-none):focus-within > .tp-new { display: flex; }
/* the mark: its outline drawn heavier at this size, so it holds */
#app-header .bh-mark { width: 1.45em; height: 1.45em; margin: -.1em 0; filter: drop-shadow(0 1px 3px rgba(0,0,0,0.6)); }
/* the person's menu: one column for the arrows, one for the words; Options and Admin open beside
   their item and look like Themes */
.hdr-menu > [data-a] { display: flex; align-items: center; justify-content: flex-start; gap: 8px; padding: 8px 10px; }
.hdr-menu > [data-a] .hdr-sub-ch { flex: none; width: 6px; margin: 0; }
.hdr-menu > [data-a="exit"] { padding-left: 10px; }
.hdr-menu > [data-a].on { background: rgba(255,255,255,0.07); color: var(--pale); }
.hdr-menu > [data-a] .hdr-pend { margin-left: auto; }
.acc.acc-inmenu .acc-x, .acc.acc-inmenu #acc-t { display: none; }
.acc.acc-inmenu .acc-panel { padding: 14px 16px 16px; background: rgba(13,15,18,0.94); border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 18px 50px rgba(0,0,0,0.55); animation: none; }
:root[data-bg] .acc.acc-inmenu .acc-panel { background-color: rgba(13,17,23,0.84); -webkit-backdrop-filter: blur(22px) saturate(1.4); backdrop-filter: blur(22px) saturate(1.4); }
.acc.acc-inmenu .acc-panel::before { content: ''; position: absolute; top: 0; left: 14px; right: 14px; height: 1px; pointer-events: none; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.28), transparent); }
/* the live map: the globe is the page. Bigger, and set apart from the photo by a soft darkness
   around it (round, fading out: no edge to see) */
body:not(.searched):not(.newtab) #tmap, #tmap-bg { width: min(1600px, 96vw) !important; }
.tm-body { grid-template-columns: minmax(0, 2.3fr) minmax(290px, 1fr) !important; }
.tm-globe { height: min(calc(100vh / var(--z, 1) - var(--header-h, 48px) - 170px), 920px) !important; min-height: 340px; }
.tm-globe::before { content: ''; position: absolute; left: 50%; top: 50%; height: 200%; aspect-ratio: 1; transform: translate(-50%, -50%); pointer-events: none; z-index: 0;
  background: radial-gradient(closest-side, rgba(2,4,7,0.7) 40%, rgba(2,4,7,0.34) 62%, rgba(2,4,7,0.1) 82%, transparent); }
.tm-globe canvas { position: relative; z-index: 1; }
.tm-term { position: relative; z-index: 1; }
.tm-side.tm-term { background: none !important; box-shadow: none !important; align-self: start; }
/* the live map, centred: the globe, the numbers under it, the feed streaming in under them */
body:not(.searched):not(.newtab) #tmap, #tmap-bg { width: min(920px, 94vw) !important; }
#tmap .tm-head { margin: 0; text-align: center; }
#tmap .tm-sub { justify-content: center; }
#tmap .tm-body { display: flex !important; flex-direction: column; align-items: center; gap: 2px; }
#tmap .tm-globe { width: 100%; height: min(calc(54vh / var(--z, 1)), 540px) !important; min-height: 300px; }
#tmap .tm-globe::before { height: 125%; background: radial-gradient(closest-side, rgba(2,4,7,0.5) 52%, rgba(2,4,7,0.26) 72%, transparent); }
#tmap .tm-side.tm-term { width: min(580px, 100%); display: flex; flex-direction: column; align-items: stretch; gap: 10px; }
#tmap .tm-nums { display: flex; justify-content: center; gap: 56px; }
#tmap .tm-nums div { padding: 0; border: 0; text-align: center; }
#tmap .tm-nums b { font-size: 28px; }
#tmap .tm-tick { display: grid; align-content: start; gap: 0; padding: 0; min-height: calc(5 * 21px); font: 11.5px/21px var(--mono); text-shadow: var(--sub-shadow); }
#tmap .tm-tick button { display: grid; grid-template-columns: 6px 7.2em 2.4em minmax(0, 1fr) auto 2em; align-items: center; gap: 8px; padding: 0 8px; animation: none; color: #8fa3b2; }
#tmap .tm-tick button i { width: 6px; height: 6px; border-radius: 50%; background: #e0605a; opacity: 0; }
#tmap .tm-tick button:first-child i { opacity: 1; box-shadow: 0 0 8px #e0605a; }
#tmap .tm-tick button:first-child { color: var(--pale); }
#tmap .tm-tick button:nth-child(3) { opacity: .8; } #tmap .tm-tick button:nth-child(4) { opacity: .6; } #tmap .tm-tick button:nth-child(5) { opacity: .4; }
#tmap .tm-tick button.in:first-child { animation: tmType .9s steps(32, end) both; }
@keyframes tmType { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
#tmap .tm-top { margin: 0; padding: 0; border: 0; text-align: center; font: 10.5px var(--mono); color: var(--text2); text-shadow: var(--sub-shadow); }
@media (prefers-reduced-motion: reduce) { #tmap .tm-tick button.in:first-child { animation: none; } }
#tmap .tm-side.tm-term { align-self: center; background-color: transparent !important; }
#tmap .tm-tick button { grid-template-columns: 6px 4.2em 2.4em 11.5em 8.5em 2em; justify-content: center; }
#tmap .tm-tick .tm-f { text-align: left; }
/* the feed's details: a port, a malware URL's line, a family often seen before ransomware */
#tmap .tm-tick .tm-ip small { font-size: .85em; color: var(--text2); }
#tmap .tm-tick button.u b { color: #7fc8e8; }
#tmap .tm-tick button.u:first-child i { background: #7fc8e8; box-shadow: 0 0 8px #7fc8e8; }
#tmap .tm-tick button.p .tm-f, #tmap .tm-pre { color: #f2a640; font-style: normal; }
#tmap .tm-tick button.p:first-child i { background: #f2a640; box-shadow: 0 0 8px #f2a640; }
#tmap .tm-tr { font-style: normal; letter-spacing: .04em; text-transform: none; margin-left: 4px; }
#tmap .tm-tr.up { color: #ef7b70; } #tmap .tm-tr.down { color: #6fcfbf; }
#tmap .tm-top a.tm-wall { color: var(--accent); text-decoration: none; }
#tmap .tm-top a.tm-wall:hover, #tmap .tm-top a.tm-wall:focus-visible { text-decoration: underline; }

/* ── the wall screen (/live): the map is the page, laid out for 16:9 and read from across a room */
html.wall, html.wall body { overflow: hidden !important; }
html.wall { zoom: var(--z) !important; }
html.wall.wall-idle, html.wall.wall-idle * { cursor: none !important; }
html.wall #app-header, html.wall #tabs-pile, html.wall .site-foot, html.wall #tabs-bar, html.wall .acc-toast, html.wall #tmap-bg { display: none !important; }
html.wall #tmap#tmap { position: fixed !important; inset: 0; z-index: 9000; width: auto !important; margin: 0 !important; padding: 18px 28px 0; box-sizing: border-box;
  display: grid !important; grid-template-columns: 320px minmax(0, 1fr) 600px; grid-template-rows: auto minmax(0, 1fr) 46px; grid-template-areas: "top top top" "left globe feed" "tick tick tick"; column-gap: 28px; row-gap: 12px;
  background: linear-gradient(rgba(3,5,8,0.84), rgba(3,5,8,0.9)), var(--bg-image, none) center / cover, #04060a; }
html.wall #tmap .tm-head { display: none; }
html.wall #tmap .tm-body { display: contents !important; }
html.wall #tmap .tm-globe { grid-area: globe; width: auto; height: auto !important; min-height: 0; }
html.wall #tmap .tm-side.tm-term { grid-area: feed; width: auto; align-self: stretch; justify-content: flex-start; gap: 6px; padding-top: 4px; min-height: 0; overflow: hidden; }
html.wall #tmap .tm-side .tm-nums { display: none; }
html.wall #tmap .tm-fh { padding: 0 8px 8px; border-bottom: 1px solid rgba(143,203,230,0.14); font: 11px var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--text2); }
html.wall #tmap .tm-tick { font-size: 14px; line-height: 31px; min-height: calc(15 * 31px); }
html.wall #tmap .tm-tick button { grid-template-columns: 7px 7.6em 3em minmax(0, 1fr) 8.5em 2.2em; justify-content: stretch; }
html.wall #tmap .tm-tick button:nth-child(n+2) { opacity: .9; } html.wall #tmap .tm-tick button:nth-child(n+5) { opacity: .7; } html.wall #tmap .tm-tick button:nth-child(n+9) { opacity: .5; } html.wall #tmap .tm-tick button:nth-child(n+12) { opacity: .32; }
html.wall #tmap .tm-top { padding: 8px; text-align: left; font-size: 11.5px; line-height: 1.6; }
html.wall #tmap .tm-top a.tm-wall { display: none; }
html.wall .tm-wtop { grid-area: top; display: flex; align-items: center; gap: 40px; padding-bottom: 14px; border-bottom: 1px solid rgba(143,203,230,0.14); }
.tm-wb { display: flex; align-items: center; gap: 10px; font: 600 21px var(--display); color: var(--pale); }
.tm-wb .bh-mark { width: 32px; height: 32px; }
.tm-wb span { margin-left: 4px; font: 12px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--text2); }
.tm-wn { display: flex; gap: 44px; margin-left: auto; }
.tm-wn b { display: block; font: 600 36px/1 var(--display); color: var(--pale); }
.tm-wn span { font: 11px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--text2); }
.tm-wn .tm-tr { font: 11px var(--mono); letter-spacing: .02em; text-transform: none; font-style: normal; }
.tm-wn .tm-tr.up { color: #ef7b70; } .tm-wn .tm-tr.down { color: #6fcfbf; }
.tm-wc { display: flex; flex-direction: column; align-items: flex-end; font: 600 22px/1.2 var(--mono); color: var(--pale); }
.tm-wc .tm-loc { font-size: 13px; font-weight: 400; color: var(--text2); }
.tm-health { display: flex; align-items: center; gap: 9px; min-width: 230px; font: 12.5px var(--mono); color: var(--text2); }
.tm-health i { flex: none; width: 10px; height: 10px; border-radius: 50%; background: #66737d; }
.tm-health.ok i { background: #5cc2ae; box-shadow: 0 0 10px #5cc2ae; }
.tm-health.warn i { background: #f2a640; box-shadow: 0 0 10px #f2a640; } .tm-health.warn { color: #f2c98a; }
.tm-health.bad i { background: #ef5a52; box-shadow: 0 0 12px #ef5a52; animation: tmBad 1s steps(2) infinite; } .tm-health.bad { color: #f39a93; }
@keyframes tmBad { 50% { opacity: .25; } }
html.wall .tm-wl { grid-area: left; display: block; min-height: 0; overflow: hidden; padding-top: 4px; }
.tm-wl h3 { display: flex; align-items: center; justify-content: space-between; margin: 18px 0 6px; font: 400 11px var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--text2); }
.tm-wl h3:first-child { margin-top: 0; }
.tm-br { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto 64px; align-items: center; gap: 10px; padding: 5px 0 8px; font: 13.5px var(--mono); color: var(--pale); }
.tm-br .tm-bn { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-br .tm-bn.tm-pre { color: #f2a640; }
.tm-br .tm-bv { color: var(--text2); }
.tm-br i { position: absolute; left: 0; bottom: 2px; width: var(--w); height: 2px; background: rgba(240,96,90,0.75); }
.tm-br i.tm-pre { background: #f2a640; }
.tm-sp { width: 64px; height: 16px; } .tm-wl h3 .tm-sp { width: 80px; height: 18px; }
.tm-sp polyline { fill: none; stroke: rgba(143,203,230,0.75); stroke-width: 1.3; stroke-linejoin: round; }
html.wall .tm-wtick { grid-area: tick; display: flex; align-items: center; overflow: hidden; margin: 0 -28px; padding: 0 28px; border-top: 1px solid rgba(143,203,230,0.14); background: rgba(3,5,8,0.6); white-space: nowrap;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.tm-wtick-in { display: inline-flex; gap: 46px; padding-right: 46px; font: 13px var(--mono); color: #b8c4cc; animation: tmMarq 120s linear infinite; }
.tm-wtick-in span { display: inline-flex; align-items: center; gap: 8px; }
.tm-wtick-in i { width: 7px; height: 7px; border-radius: 50%; background: #e0605a; } .tm-wtick-in i.p { background: #f2a640; } .tm-wtick-in i.u { background: #7fc8e8; }
.tm-wtick-in b { font-weight: 400; color: #e0605a; } .tm-wtick-in em { font-style: normal; color: #e8a09a; }
@keyframes tmMarq { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .tm-wtick-in, .tm-health i { animation: none !important; } }
#tmap .tm-tick button { grid-template-columns: 6px 7.6em 2.6em 13em 8.5em 2em; }
.tm-wn span, .tm-wb span, .tm-health span { white-space: nowrap; }
.tm-wn div { min-width: 0; }
.tm-wc span { white-space: nowrap; }
/* the home page: the globe in the middle, the feed on its right, the numbers under it */
html:not(.wall) body:not(.searched):not(.newtab) #tmap { --tw: min(1500px, calc(100vw / var(--z, 1) - 64px)); width: var(--tw) !important; margin-left: 0 !important; margin-right: 0 !important; align-self: center; }
html:not(.wall) #tmap .tm-body { display: grid !important; grid-template-columns: minmax(0, 1fr) min(560px, 40vw) minmax(0, 1fr) !important; grid-template-rows: 1fr auto auto; grid-template-areas: ". globe feed" ". globe legend" ". nums ."; column-gap: 28px; row-gap: 10px; align-items: center; }
html:not(.wall) #tmap .tm-side.tm-term { display: contents; }
html:not(.wall) #tmap .tm-globe { grid-area: globe; }
html:not(.wall) #tmap .tm-nums { grid-area: nums; margin-top: 4px; }
html:not(.wall) #tmap .tm-tick { grid-area: feed; align-self: end; justify-self: start; width: min(100%, 520px); }
html:not(.wall) #tmap .tm-tick button { grid-template-columns: 6px 7.6em 2.6em minmax(0, 1fr) 8.5em 2em; justify-content: stretch; }
html:not(.wall) #tmap .tm-top { grid-area: legend; align-self: start; justify-self: start; width: min(100%, 520px); padding: 2px 8px 0; text-align: left; line-height: 1.6; }
@media (max-width: 1100px) {
  html:not(.wall) #tmap .tm-body { grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: auto; grid-template-areas: "globe" "nums" "feed" "legend"; }
  html:not(.wall) #tmap .tm-tick, html:not(.wall) #tmap .tm-top { justify-self: center; }
}
html:not(.wall) #tmap .tm-tick { font-size: 12.5px; line-height: 23px; min-height: calc(5 * 23px); }
/* phones: the live map and the new tab fit the width; the feed keeps what matters (kind, server, family) */
@media (max-width: 700px) {
  html:not(.wall) body:not(.searched):not(.newtab) #tmap { --tw: calc(100vw - 20px); padding-bottom: 110px; }
  body:not(.searched):not(.newtab) #app-main { overflow-y: auto !important; }
  html:not(.wall) #tmap .tm-globe { height: min(48vh, 380px) !important; min-height: 260px; }
  #tmap .tm-nums { gap: 22px !important; }
  #tmap .tm-nums b { font-size: 22px !important; }
  #tmap .tm-nums .tm-tr { display: block; margin: 2px 0 0; }
  html:not(.wall) #tmap .tm-tick { width: 100% !important; font-size: 11.5px !important; }
  html:not(.wall) #tmap .tm-tick button { grid-template-columns: 6px 2.8em minmax(0, 1fr) auto 2em !important; }
  html:not(.wall) #tmap .tm-tick .tm-t { display: none; }
  html:not(.wall) #tmap .tm-top { display: none; }   /* the legend: room for the feed (and the New tab button) on a phone */
  body.newtab #hero { min-width: 0 !important; }
  body.newtab #hero .search-section, body.newtab #hero .search-row { max-width: 100%; min-width: 0; }
}
/* the home page's search: under the line that says what the map shows ("/" reaches it from anywhere) */
#tmap .tm-q { display: flex; align-items: center; gap: 8px; width: min(440px, 100%); height: 36px; margin: 14px auto 0; padding: 0 10px; box-sizing: border-box; border: 1px solid rgba(143,203,230,0.22); background: rgba(6,9,12,0.55); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
#tmap .tm-q:focus-within { border-color: var(--accent); }
#tmap .tm-q svg { flex: none; width: 14px; height: 14px; fill: none; stroke: var(--text2); stroke-width: 1.5; stroke-linecap: round; }
#tmap .tm-q input { flex: 1 1 auto; min-width: 0; height: 100%; padding: 0; border: 0; background: none; outline: none; font: 13px var(--mono); color: var(--pale); }
#tmap .tm-q input::placeholder { color: var(--text2); }
#tmap .tm-q input::-webkit-search-cancel-button { display: none; }
#tmap .tm-q kbd { flex: none; padding: 1px 6px; border: 1px solid rgba(143,203,230,0.25); font: 11px var(--mono); color: var(--text2); }
html.wall .tm-q { display: none; }
#tmap-bg .tm-head { visibility: hidden; }   /* its words gone, its room kept: the map just where it is on the home page */
#tmap .tm-lk button { padding: 0; border: 0; background: none; font: inherit; color: var(--accent); text-decoration: underline; cursor: pointer; }
/* phones: after a query the header's search is a lens, opened across the header by a tap */
#hdr-lens { display: none; }
@media (max-width: 700px) {
  body.searched:not(.hdr-q) #hdr-search { display: none !important; }
  body.searched:not(.hdr-q) #hdr-lens { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin-left: 8px; padding: 0; border: 1px solid var(--panel-line); background: rgba(12,16,21,0.7); color: var(--pale); }
  #hdr-lens svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; }
  body.searched.hdr-q #hdr-search { position: absolute; left: 8px; right: 8px; top: 50%; z-index: 60; margin: 0; transform: translateY(-50%); flex: none; }
  #tmap .tm-q kbd { display: none; }
}
/* a tab open: the window alone (the header, its search and the user's menu are on the home page) */
body:is(.searched, .newtab) #app-header { transform: translateY(-100%) !important; opacity: 0; pointer-events: none; visibility: hidden; transition: opacity .35s ease, transform .35s ease, visibility 0s .35s; }   /* (hidden: out of the keyboard's way too) */
body:is(.searched, .newtab) #app-main { padding-top: 0 !important; }
body:is(.searched, .newtab):not(.win-max) #app-main > .main-inner { padding-top: 14px !important; }
.vp-card > .vp-head { top: var(--tabs-h, 0px); }

/* depth, quietly: the globe has a little volume at its rim and sits a touch above the page; the feed
   is a faint pane of glass in front of the photo */
#tmap .tm-globe::after { content: ''; position: absolute; left: 50%; bottom: 2%; width: 46%; height: 7%; transform: translateX(-50%); z-index: 0; pointer-events: none; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(0,0,0,0.38), transparent); filter: blur(6px); }
html:not(.wall) #tmap .tm-tick, html.wall #tmap .tm-side.tm-term { padding: 8px 6px; background: linear-gradient(180deg, rgba(10,14,19,0.42), rgba(6,9,12,0.22)); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);
  border: 1px solid rgba(255,255,255,0.05); border-top-color: rgba(255,255,255,0.09); box-shadow: 0 18px 40px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.03); }
html:not(.wall) #tmap .tm-tick, html:not(.wall) #tmap .tm-top { width: min(100%, 580px); }
/* the pile, again: saved hunts above the tabs, each a small deck that opens its list to the right */
#tabs-pile, #tabs-pile:not(.compact) { display: flex !important; flex-direction: column; align-items: flex-start; gap: 14px; width: auto; }
#tabs-pile .tp-grp { position: relative; width: 210px; }
#tabs-pile.compact .tp-grp { width: auto; }
#tabs-pile .tp-hunts .tp-hb, #tabs-pile:not(.compact) .tp-hunts .tp-hb { display: block; height: auto; margin: 0 0 8px 2px; padding: 0; border: 0; background: none; font: var(--fs-min) var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--pale); text-shadow: var(--sub-shadow); cursor: default; }
#tabs-pile.compact .tp-hunts .tp-hb { display: inline-flex; align-items: center; height: 26px; margin: 0; padding: 0 10px; border: 1px solid var(--panel-line); background: rgba(12,16,21,0.8); text-shadow: none; }
#tabs-pile .tp-deck { position: relative; height: 46px; }
#tabs-pile.compact .tp-deck { display: none; }
#tabs-pile .tp-d { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 7px; height: 40px; padding: 0 10px; border: 1px solid var(--panel-line); background: rgba(12,16,21,0.88); font-size: 11px; color: var(--pale); }
#tabs-pile .tp-d:nth-last-child(2) { transform: translate(6px, -6px); opacity: .7; }
#tabs-pile .tp-d:nth-last-child(3) { transform: translate(12px, -12px); opacity: .45; }
#tabs-pile .tp-d i { flex: none; width: 6px; height: 6px; }
#tabs-pile .tp-d b { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 400; }
#tabs-pile .tp-fly { position: absolute; left: calc(100% + 10px); bottom: 0; z-index: 2; display: none; flex-direction: column; gap: 4px; width: 240px; max-height: calc(100vh / var(--z, 1) - 120px); overflow-y: auto; scrollbar-width: thin; }
#tabs-pile .tp-fly { padding-left: 10px; margin-left: -10px; }
/* it stays a moment after the pointer leaves, so the way across to it is forgiving */
#tabs-pile .tp-fly { display: flex; visibility: hidden; opacity: 0; transform: translateX(-6px); transition: opacity .16s ease, transform .16s ease, visibility 0s linear .35s; }
#tabs-pile .tp-grp:hover > .tp-fly, #tabs-pile .tp-grp:focus-within > .tp-fly { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
#tabs-pile .tp-fly .tp-c { position: relative !important; left: auto; right: auto; bottom: auto; transform: none !important; opacity: 1 !important; flex: none; }
#tabs-pile .tp-tabs:not(.tp-none) > .tp-fly > .tp-new { display: flex; width: 100%; height: 40px; margin: 0; padding: 0 10px; background: rgba(12,16,21,0.88); font-size: 11px; }
#tabs-pile .tp-grp:hover > .tp-deck .tp-d, #tabs-pile .tp-grp:focus-within > .tp-deck .tp-d { border-color: var(--hail); }
@media (prefers-reduced-motion: reduce) { #tabs-pile .tp-fly { transform: none; transition: visibility 0s linear .35s; } }
@media (max-width: 700px) { #tabs-pile .tp-grp { width: 170px; } #tabs-pile .tp-fly { left: 0; bottom: calc(100% + 6px); width: min(240px, calc(100vw - 24px)); padding-left: 0; margin-left: 0; } }
#tabs-pile .tp-d:not(:last-child) b, #tabs-pile .tp-d:not(:last-child) i { visibility: hidden; }   /* the cards behind: edges only */
/* the relations graph: shared infrastructure (a CDN's address, a crowded host) a step back */
.g-n.g-sh { opacity: .55; }
.g-n.g-sh .g-frame { stroke-dasharray: 2 2; }
/* the live map's two ways (Flat, Globe) and the wall screen: quietly, in the bottom right corner */
#tmap .tm-ctl { position: absolute; right: 0; bottom: 0; z-index: 3; display: flex; align-items: center; opacity: .6; transition: opacity .2s ease; }
#tmap .tm-globe:hover .tm-ctl, #tmap .tm-ctl:focus-within { opacity: 1; }
#tmap .tm-mode { display: flex; }
#tmap .tm-ctl :is(button, a) { display: inline-flex; align-items: center; min-height: 28px; padding: 0 9px; border: 0; background: none; font: 11px var(--mono); letter-spacing: .06em; color: var(--text2); text-decoration: none; cursor: pointer; }
#tmap .tm-mode button[aria-pressed="true"] { color: var(--pale); text-decoration: underline; text-underline-offset: 5px; text-decoration-color: rgba(176,224,244,0.5); }
#tmap .tm-ctl .tm-wall { margin-left: 6px; padding-left: 12px; border-left: 1px solid rgba(143,203,230,0.16); }
#tmap .tm-ctl :is(button, a):hover, #tmap .tm-ctl :is(button, a):focus-visible { color: var(--pale); }
#tmap-bg .tm-ctl, html.wall #tmap .tm-ctl .tm-wall { display: none; }
html.wall #tmap .tm-ctl { right: 6px; bottom: 6px; }
#tmap .tm-ctl [hidden] { display: none; }
html.wall #tmap .tm-ctl .tm-bgb { margin-left: 8px; padding-left: 14px; border-left: 1px solid rgba(143,203,230,0.16); }
html.wall #tmap .tm-ctl :is(button, a) { min-height: 32px; font-size: 12.5px; }
html.wall.wall-idle #tmap .tm-ctl:not(:has(:focus-visible)) { opacity: 0; pointer-events: none; }
/* the maps' glass: the page behind blurred, cut to the map's edge (js/threatmap.js, tmDockAt) */
#tmap .tm-sheet { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(10,14,19,var(--tm-sheet-a, 0.5)), rgba(6,9,12,calc(var(--tm-sheet-a, 0.5) - 0.08))); -webkit-backdrop-filter: blur(var(--tm-sheet-blur, 7px)); backdrop-filter: blur(var(--tm-sheet-blur, 7px)); }
#tmap[data-mode="globe"] .tm-sheet { display: none; }
#tmap:not([data-mode="globe"]) .tm-globe canvas { cursor: default; }
/* the flat map on the home page: the whole width, the numbers over its straight top edge, the
   three newest under its bottom edge, nothing boxed; the script sets the height and the edges */
#tmap#tmap.tm-dock .tm-body { display: block !important; position: relative; }
#tmap#tmap.tm-dock .tm-globe { width: 100%; height: var(--tm-h, 560px) !important; min-height: 0; max-height: none; aspect-ratio: auto; }
#tmap#tmap.tm-dock .tm-globe::before, #tmap#tmap.tm-dock .tm-globe::after { display: none; }
#tmap#tmap.tm-dock .tm-top { display: none !important; }
#tmap#tmap.tm-dock .tm-nums { position: absolute; z-index: 2; left: var(--tm-cx, 50%); top: calc(var(--tm-ty, 70px) - 64px); transform: translateX(-50%); display: flex; justify-content: center; gap: 54px; margin: 0; white-space: nowrap; }
#tmap#tmap.tm-dock .tm-nums > div { padding: 0; border: 0; text-align: center; }
#tmap#tmap.tm-dock .tm-nums b { font-size: 26px; font-weight: 500; }
#tmap#tmap.tm-dock .tm-nums span { display: block; margin-top: 4px; font-size: 10px; letter-spacing: .16em; opacity: .85; }
#tmap#tmap.tm-dock .tm-nums .tm-tr { display: none; }
#tmap#tmap.tm-dock .tm-tick { position: absolute; z-index: 2; left: var(--tm-cx, 50%); top: calc(var(--tm-by, 100%) + 14px); transform: translateX(-50%); width: min(480px, 100%); min-height: 0; padding: 0; border: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; font-size: 13px; line-height: 26px; }
#tmap#tmap.tm-dock .tm-tick button { grid-template-columns: 6px 3.4em 2.8em minmax(0, 1fr) auto 1.8em; justify-content: stretch; opacity: 1; }
#tmap#tmap.tm-dock .tm-tick button:nth-child(2) { opacity: .78; }
#tmap#tmap.tm-dock .tm-tick button:nth-child(3) { opacity: .62; }
#tmap#tmap.tm-dock .tm-tick button:nth-child(n+4) { display: none; }
/* under the map's corners, level with the feed's last line: the switch on the right, the wall screen on the left */
#tmap#tmap.tm-dock .tm-ctl { left: calc(var(--tm-cx, 50%) - var(--tm-mw, 100%) / 2); right: calc(100% - var(--tm-cx, 50%) - var(--tm-mw, 100%) / 2); top: calc(var(--tm-by, 100%) + 65px); bottom: auto; flex-direction: row-reverse; justify-content: space-between; pointer-events: none; }
#tmap#tmap.tm-dock .tm-ctl > * { pointer-events: auto; }
#tmap#tmap.tm-dock .tm-ctl .tm-wall { margin: 0; padding-left: 0; border: 0; }
@media (max-width: 1100px) { #tmap#tmap.tm-dock .tm-ctl { top: auto; bottom: 0; } }
#tmap#tmap.tm-dock .tm-tick button:not(.old) .tm-dd, #tmap#tmap.tm-dock .tm-tick button.old .tm-hm { display: none; }
@media (max-width: 860px) {
  #tmap#tmap.tm-dock .tm-nums { gap: 22px !important; }
  #tmap#tmap.tm-dock .tm-nums b { font-size: 22px !important; }
  #tmap#tmap.tm-dock .tm-nums span { font-size: 9.5px; letter-spacing: .12em; }
  #tmap#tmap.tm-dock .tm-tick { width: 100% !important; font-size: 12px !important; line-height: 25px; }
  #tmap#tmap.tm-dock .tm-tick button { grid-template-columns: 6px 2.8em minmax(0, 1fr) auto 1.8em !important; }
  #tmap .tm-ctl { opacity: .8; }
}
/* the feed's ransomware claims: purple */
#tmap .tm-tick button.w b, #tmap .tm-rw { color: #cc80e8; font-style: normal; }
#tmap .tm-tick button.w .tm-f { color: #d9a8ee; }
#tmap .tm-tick button.w:first-child i { background: #cc80e8; box-shadow: 0 0 8px #cc80e8; }
#tmap .tm-tick button.w small { color: var(--text2); }
.tm-wtick-in i.w { background: #cc80e8; } .tm-wtick-in b.w { color: #cc80e8; }
.tm-wl-rw .tm-br i { background: #cc80e8 !important; }
/* the wall with a map: the map wide on top, the panels side by side under it, the feed on the right */
html.wall #tmap#tmap:not([data-mode="globe"]) { grid-template-columns: minmax(0, 1fr) 560px; grid-template-rows: auto minmax(0, 1fr) auto 46px; grid-template-areas: "top top" "globe feed" "left feed" "tick tick"; }
html.wall #tmap:not([data-mode="globe"]) .tm-wl { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); grid-auto-flow: column; gap: 28px; padding-top: 10px; border-top: 1px solid rgba(143,203,230,0.1); }
html.wall #tmap:not([data-mode="globe"]) .tm-wl h3 { margin-top: 0; }
html.wall #tmap:not([data-mode="globe"]) .tm-wl .tm-br:nth-of-type(n+6) { display: none; }
.tm-wl section + section h3 { margin-top: 18px; }
html.wall #tmap:not([data-mode="globe"]) .tm-wl section + section h3 { margin-top: 0; }

/* the profile icons fill their circle a little more (each drawing framed alike, js/access.js avFit) */
.av-i svg { width: 72%; height: 72%; }
.hdr-me .av-i svg { width: 70%; height: 70%; }
/* the globe on the home page: the numbers under it each on one line, the trend under its number */
html:not(.wall) #tmap[data-mode="globe"] .tm-nums { justify-self: center; gap: 44px; }
html:not(.wall) #tmap[data-mode="globe"] .tm-nums span { white-space: nowrap; }
html:not(.wall) #tmap[data-mode="globe"] .tm-nums .tm-tr { display: block; margin-top: 2px; }
/* the result map's panel: what the places say (the worst first), the tags on an address, what to block */
.gg-sig { margin: 0 0 10px; padding: 0; list-style: none; display: grid; gap: 6px; }
.gg-sig li { position: relative; padding-left: 12px; font-size: 11.5px; line-height: 1.45; color: var(--text); }
.gg-sig li::before { content: ''; position: absolute; left: 0; top: .5em; width: 6px; height: 6px; border-radius: 50%; background: #8fb4c9; }
.gg-sig li.bad::before { background: #ff5a52; box-shadow: 0 0 6px rgba(255,90,82,0.6); }
.gg-sig li.warn::before { background: #f0883e; }
.gg-sig b { color: var(--pale); font-weight: 600; }
.gg-tag { margin-left: 6px; padding: 0 4px; border: 1px solid rgba(143,203,230,0.25); font: 9.5px var(--mono); font-style: normal; color: var(--text2); vertical-align: 1px; }
.gg-tag.b { border-color: rgba(255,90,82,0.5); color: #ff8a82; }
.gg-blk { margin: 0 0 4px; }
.gg-bi { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 1px 7px; align-items: start; padding: 5px 2px; border-bottom: 1px solid rgba(255,255,255,0.05); cursor: pointer; }
.gg-bi input { grid-row: 1 / span 3; margin: 2px 0 0; accent-color: #ff5a52; }
.gg-bv { font: 11.5px var(--mono); color: var(--pale); overflow-wrap: anywhere; }
.gg-bv small { font: 10px var(--sans); color: var(--text2); }
.gg-bw { font-size: 11px; line-height: 1.35; color: var(--text); }
.gg-bn { font-size: 10.5px; line-height: 1.35; color: var(--text2); }
.gg-bf { display: flex; gap: 2px; margin: 12px 0 6px; }
.gg-bf button { flex: 1; min-height: 26px; padding: 0 6px; border: 1px solid rgba(255,255,255,0.1); background: none; color: var(--text2); font: 11px var(--mono); cursor: pointer; }
.gg-bf button[aria-pressed="true"] { border-color: color-mix(in srgb, var(--accent) 55%, transparent); color: var(--pale); background: color-mix(in srgb, var(--accent) 12%, transparent); }
.gg-ba { display: flex; gap: 6px; }
.gg-ba button { flex: 1; min-height: 28px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); background: none; color: var(--accent); font: 11.5px var(--sans); cursor: pointer; }
.gg-ba button:hover, .gg-bf button:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); }
/* how the map's addresses are tied to the indicator: a switch for each way, coloured as its lines */
.gg-roles { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 6px; }
.gg-role { display: inline-flex; align-items: center; gap: 5px; min-height: 24px; padding: 0 7px; border: 1px solid rgba(255,255,255,0.12); background: none; color: var(--text); font: 11px var(--sans); cursor: pointer; }
.gg-role b { font-weight: 600; color: var(--pale); }
.gg-role i { width: 12px; height: 0; border-top: 2px solid #b0bac4; }
.gg-role.r-c2 i { border-color: #ff5a52; } .gg-role.r-contact i { border-color: #f0a050; } .gg-role.r-dns i { border-color: #78b8d4; } .gg-role.r-seen i { border-top-style: dashed; border-color: #b0bac4; }
.gg-role[aria-pressed="false"] { opacity: .45; } .gg-role[aria-pressed="false"] b { color: var(--text2); }
.gg-role:hover { border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
/* a word about what was typed, right under the search */
.ioc-msg { max-width: 560px; margin: 10px 0 0; font: 12.5px/1.5 var(--sans); color: #ff9a92; text-align: left; text-shadow: var(--sub-shadow); }
.ioc-msg b { font-family: var(--mono); font-weight: 500; color: var(--pale); }
.ioc-msg.info { color: var(--text); }
body.searched .ioc-msg { display: none; }

/* ── Typography: labels are written, not shouted ─────────────────────────────────────────────
   Labels, headings of panels, buttons and chips read in sentence case at their natural spacing
   (a family keeps its own casing: AsyncRAT, not ASYNCRAT). Capitals stay for the verdict's
   headline only, and for what is written in capitals (C2, IPv4, MD5). */
:is(.ioc-type-tag, .drop-sub, .drop-close, .sl, .svc-label, .hb-sub, .vp-headtarget i, .hv-label, .bulk-group, .bulk-kind, .g-count, .cert-head, .g-list-tab, .g-list-h, .vp-diff .vp-diff-k, .hist-k, .hist-kind, .hist-v, .tlp-pick-h, .bulk-common-h, .bc-k, .vp-kb, .vp-atk-k, .bulk-rel-k, .bulk-rel-h b, .hdr-access, .acc-brand small, .acc h2, .acc-l, .acc-go, .hdr-me, .hb-greet, .adm-tabs button, .adm-pill, .adm-acts button, .vp-shared b, .acc-mini, .adm-acts a, .adm-sample span, .adm-dbtn, .g-lg-t, .vp-sec-h b, .g-peek .pk-label, .pk-head .pk-label, .rel-title, .vp-next-k, .vp-blk-h, .gc-k, .td-l, .gg-h, .hunt-pop label, .g-trail b, .hp-lab, .hp-h, .hp-k, .hp-tie-l, .hb-t, .hb-h, .hunt-pop-l, .sbx-h, .sbx-kv > span, .sbx-role, .tab-v, .hb-new, .plus-pop .pp-h, .vp-famchip, .sev-pill, #tabs-pile .tp-h, #tabs-pile.compact .tp-hunts .tp-hb, .tm-blk h3, #tabs-pile:not(.compact) .tp-hunts .tp-hb, .hp-pill, .tm-nums span, .tm-log-bar, html.wall #tmap .tm-fh, .tm-wb span, .tm-wn span, .tm-wl h3, #tabs-pile .tp-hunts .tp-hb) { text-transform: none !important; letter-spacing: .01em !important; }
/* labels and controls in the text face; the monospace is for what is data (addresses, hashes, times, counts) */
#tmap .tm-nums span, #tmap .tm-ctl :is(button, a), .gg-h, .gg-role, .gg-bf button, .g-tools button, .tm-wn span, .tm-wl h3 { font-family: var(--sans) !important; }
#tmap .tm-nums span { font-size: 11px; opacity: .8; }
.vp-famchip .vp-famn { margin-left: 6px; font-style: normal; font-size: .85em; opacity: .7; }

/* MalwareBazaar: what each sandbox and engine calls the file; its similarity hashes */
.mb-vend { display: grid; gap: 2px; margin: 2px 0 8px; }
.mb-vend > div { display: grid; grid-template-columns: minmax(90px, auto) minmax(0, 1fr) auto 16px; gap: 10px; align-items: baseline; padding: 2px 0; font-size: 12px; border-top: 1px solid rgba(255,255,255,0.05); }
.mb-vend span { color: var(--text2); } .mb-vend b { font-weight: 600; color: var(--pale); overflow-wrap: anywhere; } .mb-vend i { font-style: normal; font-size: var(--fs-min); color: var(--text2); }
.mb-fz { display: grid; gap: 2px; margin: 2px 0 8px; }
.mb-fz > div { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 10px; font-size: 12px; }
.mb-fz span { color: var(--text2); } .mb-fz code { font: 11px var(--mono); color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; user-select: all; }
.note-text.r { color: #f2a59d; }

/* the flat map: zoom, the open country (js/threatmap.js, tmPanel) */
#tmap .tm-zoom { display: inline-flex; align-items: center; margin-right: 6px; padding-right: 8px; border-right: 1px solid rgba(143,203,230,0.16); }
#tmap .tm-zoom button { min-width: 26px; justify-content: center; }
#tmap[data-mode="globe"] .tm-zoom { display: none; }
#tmap.tm-zoomed:not([data-mode="globe"]) .tm-globe canvas { cursor: grab; }
#tmap .tm-tip .tm-tip-h { margin-top: 3px; color: var(--text2); font: 10.5px var(--sans); }
#tmap .tm-cpan { position: absolute; z-index: 3; left: calc(var(--tm-lx, 0px) + 12px); top: calc(var(--tm-ty, 0px) + 12px); width: min(380px, 66%); max-height: calc(var(--tm-by, 100%) - var(--tm-ty, 0px) - 24px); overflow: auto; display: flex; flex-direction: column; gap: 8px; padding: 10px 12px 12px;
  border: 1px solid rgba(160,214,238,0.22); background: rgba(8,11,15,0.86); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: 0 10px 30px rgba(0,0,0,0.4); }
#tmap .tm-cpan[hidden] { display: none; }
#tmap .tm-cpan header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#tmap .tm-cpan header b { font: 600 15px var(--sans); color: var(--pale); }
#tmap .tm-cpan header button { width: 26px; height: 26px; border: 0; background: none; color: var(--text2); font-size: 18px; line-height: 1; cursor: pointer; }
#tmap .tm-cpan header button:hover, #tmap .tm-cpan header button:focus-visible { color: var(--pale); }
#tmap .tm-cpan .tm-cn { margin: 0; font: 12px var(--sans); color: var(--text); }
#tmap .tm-cfam { display: flex; flex-wrap: wrap; gap: 4px 10px; font: 11.5px var(--mono); color: #f0a49c; }
#tmap .tm-cfam .tm-pre { color: #f2bf7a; } #tmap .tm-cfam i { font-style: normal; color: var(--text2); }
#tmap .tm-crec { display: flex; flex-direction: column; border-top: 1px solid rgba(143,203,230,0.12); }
#tmap .tm-crec { max-height: 260px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(143,203,230,0.2) transparent; }
#tmap .tm-crec button { display: grid; grid-template-columns: minmax(10.5em, max-content) minmax(0, 1fr) minmax(0, 0.8fr) 3.4em; gap: 8px; font-size: 11px !important; align-items: baseline; padding: 5px 0; border: 0; border-bottom: 1px solid rgba(143,203,230,0.07); background: none; font: 11.5px var(--mono); color: var(--text); text-align: left; cursor: pointer; }
#tmap .tm-crec button:hover, #tmap .tm-crec button:focus-visible { color: var(--pale); background: rgba(143,203,230,0.05); }
#tmap .tm-crec b { font-weight: 600; color: #e0605a; } #tmap .tm-crec b.u { color: #7fc8e8; } #tmap .tm-crec b.w { color: #cc80e8; }
#tmap .tm-crec button[hidden] { display: none; }
#tmap .tm-crec :is(span, i, em) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #tmap .tm-crec small { color: var(--text2); font-size: 10px; }
#tmap .tm-crec i { font-style: normal; color: #f0a49c; } #tmap .tm-crec em { font-style: normal; color: var(--text2); } #tmap .tm-crec time { color: var(--text2); text-align: right; }
#tmap .tm-ctabs { display: flex; gap: 14px; border-bottom: 1px solid rgba(143,203,230,0.12); }
#tmap .tm-ctabs button { padding: 4px 0 6px; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; background: none; font: 12px var(--sans); color: var(--text2); cursor: pointer; }
#tmap .tm-ctabs button[aria-selected="true"] { color: var(--pale); border-bottom-color: rgba(176,224,244,0.6); } #tmap .tm-ctabs button:disabled { opacity: .45; cursor: default; }
#tmap .tm-ctabs i { font-style: normal; font-family: var(--mono); font-size: 11px; color: var(--text2); }
#tmap .tm-cq { width: 100%; padding: 5px 8px; border: 1px solid rgba(143,203,230,0.18); background: rgba(255,255,255,0.03); font: 12px var(--sans); color: var(--text); }
#tmap .tm-cq:focus-visible { outline: none; border-color: rgba(176,224,244,0.5); }
#tmap .tm-cact { display: flex; align-items: center; gap: 12px; }
#tmap .tm-cact button { padding: 0; border: 0; background: none; font: 12px var(--sans); color: var(--accent); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
#tmap .tm-cact .tm-cshown { margin-left: auto; font: 11px var(--sans); color: var(--text2); }
#tmap .tm-cnone { margin: 0; font: 11.5px var(--sans); color: var(--text2); }
#tmap#tmap.tm-dock .tm-ctl { flex-direction: row; justify-content: flex-start; }
#tmap#tmap.tm-dock .tm-ctl .tm-wall { order: -1; }
#tmap#tmap.tm-dock .tm-ctl .tm-zoom { margin-left: auto; }
/* the result: Findings a band across the top (its lines in three columns), under it Footprinting and
   Behaviour on the left and the relations on the right; Evidence at the right edge (folded: a slim
   tab), the whole height */
@container vpcard (min-width: 1100px) {
  .vp-A .vp-secs.vp-cols.vp-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 0.9fr) !important; grid-template-rows: auto auto minmax(0, 1fr) auto; }
  .vp-A .vp-secs.vp-cols.vp-cols:has(> .vp-col-r > [data-sec="raw"]:not(.open)) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) 38px !important; }
  .vp-cols > .vp-col-l, .vp-cols > .vp-col-c { display: contents; }
  .vp-cols .vp-finds.vp-finds { grid-column: 1 / 3; grid-row: 1; max-height: none; min-height: 0; }
  .vp-cols .vp-finds > .vp-reasons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 28px; max-height: 24vh; }
  .vp-cols [data-sec="foot"] { grid-column: 1; grid-row: 2; min-height: 0; max-height: 36vh; }
  .vp-cols [data-sec="sbx"] { grid-column: 1; grid-row: 3; min-height: 0; }
  .vp-cols [data-sec="sbx"].open { align-self: stretch; }
  .vp-cols .vp-note { grid-column: 1; grid-row: 4; }
  .vp-cols [data-sec="rel"] { grid-column: 2; grid-row: 2 / 5; min-height: 0; }
  .vp-cols > .vp-col-r { grid-column: 3; grid-row: 1 / 5; min-height: 0; }
}
@container vpcard (max-width: 1500px) {
  .vp-cols .vp-finds > .vp-reasons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* the result's globe: its sphere and land on a canvas under the map's points and labels (js/graph.js, graphMap) */
.g-wrap.g-map-on .g-map { position: relative; }
.g-map-cv { position: absolute; pointer-events: none; display: none; }
.g-wrap.g-map-on .g-map-cv { display: block; }
/* the window's place and size, and the minimize flight: set on the window alone, not inherited, so moving
   or sizing it does not restyle everything inside it on each step of the drag */
@property --wx { syntax: '<length>'; inherits: false; initial-value: 0px; }
@property --wy { syntax: '<length>'; inherits: false; initial-value: 0px; }
@property --tx { syntax: '<length>'; inherits: false; initial-value: 0px; }
@property --ty { syntax: '<length>'; inherits: false; initial-value: 0px; }
@property --ww { syntax: '*'; inherits: false; }
@property --wh { syntax: '*'; inherits: false; }
/* a fact cut short ("+17"): the chip opens the whole list in place, a small window that scrolls */
.fact-all { display: inline; }
.fact-all > summary { display: inline-flex; align-items: center; padding: 0 6px; margin-left: 2px; border: 1px solid rgba(143,203,230,0.28); font: 11px var(--mono); color: var(--accent); cursor: pointer; list-style: none; vertical-align: baseline; }
.fact-all > summary::-webkit-details-marker { display: none; }
.fact-all > summary:hover, .fact-all > summary:focus-visible { background: rgba(143,203,230,0.1); }
.fact-all[open] { display: block; margin-top: 6px; }
.fact-all[open] > summary { margin: 0 0 4px; }
.fact-all[open] > summary { font-size: 0; } .fact-all[open] > summary::after { content: 'Show fewer'; font: 11px var(--sans); }
.fact-list { display: block; max-height: 160px; overflow-y: auto; padding: 6px 8px; border: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.25); font: 12px var(--mono); color: var(--text); scrollbar-width: thin; overflow-wrap: anywhere; }
.fact-list > span, .vp-tile .fact-list > span { display: block; padding: 1px 0; font: 12px/1.55 var(--mono); color: var(--text); }
/* the live map's still layers (frame, land) under the moving one (js/threatmap.js) */
.tm-globe canvas.tm-base { position: absolute; left: 0; top: 0; z-index: 0; pointer-events: none; }
#tmap[data-mode="globe"] .tm-globe canvas.tm-base { display: none; }
/* how sure the verdict is, beside it (core.js computeVerdict: conf, agree, against) */
.vp-conf { font-family: var(--sans); font-size: var(--fs-min); color: var(--mist); white-space: nowrap; cursor: help; }
.vp-conf.c3 { color: var(--frost); }
.vp-against > span b { color: var(--mist); font-weight: 600; }
/* the Radar's legend: the kinds of line (js/graph.js, gLegend) */
.g-legend .lg-line { width: 22px; height: 6px; flex: none; }
/* where a name's pages lived, capture by capture (urlscan's history; js/app.js hostedOn) */
.vp-hosts { display: grid; gap: 3px; }
.vp-host { display: grid; grid-template-columns: minmax(120px, auto) minmax(0, 1fr) auto; gap: 12px; align-items: baseline; font: 12px/1.5 var(--mono); color: var(--text); }
.vp-host > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vp-host-d { color: var(--mist); }
/* the threat reports that name it (OTX pulses; js/app.js otxReports) */
.vp-reps { display: grid; gap: 3px; }
.vp-rep { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: baseline; font-size: 12.5px; }
.vp-rep > a { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.vp-rep > a:hover { color: var(--accent); }
.vp-rep-m { font: 12px var(--mono); color: var(--mist); white-space: nowrap; }