:root {
  /* Dark greyscale palette (no solid black) */
  --content-width: 1000px;
  --content-inset: 0px;    /* keep zero so legacy calc() references stay valid */
  --bg: #121418;          /* page background */
  --panel: #1a1d23;       /* cards/panels */
  --panel-elev: #1f2229;  /* elevated elements */
  --text: #e7e9ee;        /* primary text */
  --muted: #a6a9b2;       /* secondary text */
  --line: #2a2e36;        /* separators */
  --gray: #8e8e93;        /* accents */
  --danger: #e5484d;      /* error */
  --danger-line: #6b2b2f; /* error border */
  --shadow: 0 10px 26px rgba(0,0,0,0.30);
  --radius-lg: 18px;
  --radius: 12px;
  --radius-sm: 10px;
  --speed: 180ms;
  --seed-grid-primary: 1fr;
  --seed-grid-primary-age: 1fr;
  --seed-grid-extra: minmax(140px, 1fr) minmax(200px, 2fr);
}

* { box-sizing: border-box; }
html, body { height: 100%; }
html {
  overflow-y: scroll; /* always reserve vertical scrollbar to keep layout width stable */
  overflow-x: clip; /* clip prevents scrollbar but allows box-shadow/outlines to paint beyond viewport */
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, Apple Color Emoji, Segoe UI Emoji;
  -webkit-font-smoothing: antialiased;
  min-height: calc(100vh + 1px); /* ensure at least 1px overflow so scrollbar width stays constant */
}
.page { width: 100%; max-width: var(--content-width); margin: 0 auto; padding: 24px 16px; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.page-shell { width: 100%; max-width: var(--content-width); margin: 0 auto; display: flex; flex-direction: column; align-items: stretch; }
.page-shell > * { width: 100%; }

body::after {
  content: "";
  display: block;
  height: 1px;
}

.brand { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 2px 4px 18px; }
.brand { place-self: center; text-align: center; }
.brand .mark { display: none; }
.brand .name { color: var(--muted); letter-spacing: 0.3px; font-size: 16px; font-weight: 600; }
.hero { width: 100%; max-width: var(--content-width); display: grid; gap: 8px; align-items: start; transition: transform var(--speed) ease, margin var(--speed) ease, padding var(--speed) ease; margin-left: auto; margin-right: auto; }
.search { display: flex; flex-direction: column; gap: 8px; align-items: stretch; }
.seed-stack { display: flex; flex-direction: column; gap: 8px; }
.seed-row { display: grid; grid-template-columns: 1fr; gap: 10px; align-items: center; }
.seed-row.primary-row { gap: 12px; grid-template-columns: var(--seed-grid-primary); }
.seed-row.extra-placeholder { grid-template-columns: var(--seed-grid-extra); opacity: 0.5; }
.seed-row.extra-row { grid-template-columns: var(--seed-grid-extra) 48px; }
.seed-row.add-row { grid-template-columns: var(--seed-grid-extra) 48px; align-items: center; }
.extra-seeds { display: flex; flex-direction: column; gap: 8px; padding: 4px; margin: -4px; }
.extra-seeds:empty { display: none; }
/* Only enable scrolling when many rows are present (document upload) */
.extra-seeds.scrollable { max-height: 360px; overflow: auto; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.extra-seeds.scrollable::-webkit-scrollbar { width: 6px; }
.extra-seeds.scrollable::-webkit-scrollbar-thumb { background: var(--line); border-radius: 3px; }
.extra-seeds.scrollable::-webkit-scrollbar-track { background: transparent; }

.seed-select, .case-input, .seed-input, .age-input { display: block; position: relative; }
.seed-select .control, .case-input .control, .seed-input .control, .age-input .control { width: 100%; }
.age-input[hidden] { display: none; }
.seed-row.primary-row.has-age { grid-template-columns: var(--seed-grid-primary-age); }
/* Ensure enhanced select wrapper fills the seed-select container */
.seed-select .select-wrap { width: 100%; }

.control { appearance: none; border: 1px solid var(--line); background: var(--panel-elev); color: var(--text); border-radius: var(--radius-lg); padding: 0 14px; height: 48px; outline: none; box-shadow: var(--shadow); transition: border-color var(--speed), transform var(--speed), background-color var(--speed); }
.control.small { padding: 10px 12px; border-radius: var(--radius); }
.control:hover { border-color: #3a3f49; }
.control:focus { border-color: var(--gray); box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.control.invalid { border-color: var(--danger-line); box-shadow: 0 0 0 3px rgba(229,72,77,0.22), var(--shadow); }
.select { cursor: pointer; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-color: var(--panel-elev); position: relative; padding-right: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2371767b' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
.select option { background: #0f131b; color: #e8ecf5; padding: 10px 12px; }
.select-field { position: relative; display: block; }
.select-field::after { display: none; }
.text { font-size: 16px; }
.action { height: 48px; width: 48px; border-radius: 14px; border: 1px solid var(--line); background: var(--panel-elev); box-shadow: var(--shadow); display: inline-grid; place-items: center; cursor: pointer; transition: transform var(--speed), background-color var(--speed), border-color var(--speed); }
.action:hover { border-color: #3a3f49; background: #232832; box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.action:active { box-shadow: var(--shadow); }
.icon { width: 22px; height: 22px; fill: #b9bcc5; display: block; }
.icon-cancel path { stroke: #b9bcc5; stroke-width: 1.8; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.add-seed-slot { display: flex; align-items: center; justify-content: center; }
.action.add-seed { width: 48px; height: 48px; border-radius: 14px; border: 1px dashed #2f333d; background: #1d2027; color: #b9bcc5; font-size: 20px; font-weight: 600; box-shadow: none; }
.action.add-seed:hover { border-color: #3a3f49; background: #232832; }
.action.add-seed:active { box-shadow: none; }
.action.remove-seed { width: 48px; height: 48px; border-radius: 14px; border: 1px solid var(--line); background: var(--panel-elev); color: #b9bcc5; font-size: 20px; font-weight: 600; box-shadow: var(--shadow); }
.action.remove-seed:hover { border-color: #3a3f49; background: #232832; color: #c6c9d2; box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.action.remove-seed:active { box-shadow: none; }
.add-symbol { display: inline-block; line-height: 1; transform: translateY(-1px); }
.ghost-field { height: 48px; border-radius: var(--radius-lg); border: 1px dashed #2a2e36; background: #161921; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02); }
.ghost-field.wide { grid-column: span 1; }

/* Subtle shake for empty validation */
@keyframes shake {
  0% { transform: translateX(0); }
  20% { transform: translateX(-2px); }
  40% { transform: translateX(2px); }
  60% { transform: translateX(-1px); }
  80% { transform: translateX(1px); }
  100% { transform: translateX(0); }
}
.shake { animation: shake 180ms ease-in-out; }

.options-block { position: relative; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); overflow: visible; margin-top: 0; }
.options-block > summary { list-style: none; cursor: pointer; padding: 12px 16px; color: var(--muted); font-size: 14px; letter-spacing: 0.3px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top-left-radius: var(--radius-lg); border-top-right-radius: var(--radius-lg); background-clip: padding-box; }
.summary-caret { width: 10px; height: 10px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(-45deg) translateY(-1px); transition: transform var(--speed), border-color var(--speed); }
.options-block[open] > summary .summary-caret { transform: rotate(45deg) translateY(-1px); }
.summary-label { font-weight: 600; color: #c6c9d2; }
.advanced[open] > summary .summary-caret { transform: rotate(45deg) translateY(-1px); }
.options-block[open] > summary { border-bottom: 1px solid var(--line); background: rgba(255,255,255,0.02); }
.summary-actions { display: inline-flex; align-items: center; gap: 12px; margin-left: auto; }
#terminalBlock > summary { padding-top: 10px; padding-bottom: 10px; }
.terminal-toggle { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px; border: 1px solid var(--line); border-radius: 999px; background: #181b22; color: #c6c9d2; font-size: 11px; letter-spacing: 0.2px; box-shadow: var(--shadow); cursor: pointer; transition: border-color var(--speed), background-color var(--speed), transform var(--speed); }
.terminal-toggle:hover { border-color: #3a3f49; background: #1f222a; box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.terminal-toggle:focus-within { border-color: #3a3f49; box-shadow: 0 0 0 3px rgba(96,165,250,0.18), var(--shadow); }
.terminal-toggle-label { font-weight: 600; color: #cfd2da; font-size: 11px; }
.terminal-toggle input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; margin: 0; }
.toggle-visual { width: 26px; height: 14px; border-radius: 999px; background: #222631; border: 1px solid #2f333d; display: inline-flex; align-items: center; padding: 0 2px; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04); transition: background-color var(--speed), border-color var(--speed); }
.toggle-thumb { width: 10px; height: 10px; border-radius: 50%; background: #cfd2da; transform: translateX(0); transition: transform var(--speed), background-color var(--speed); }
.terminal-toggle input:checked + .toggle-visual { background: #2c3a2f; border-color: #3e5444; }
.terminal-toggle input:checked + .toggle-visual .toggle-thumb { transform: translateX(10px); background: #a4f1b7; }
.artifact-search { appearance: none; height: 24px; padding: 0 10px; font-size: 11px; letter-spacing: 0.2px; color: var(--text); background: #181b22; border: 1px solid var(--line); border-radius: 999px; box-shadow: var(--shadow); outline: none; width: 200px; max-width: 40vw; transition: border-color var(--speed), background-color var(--speed), box-shadow var(--speed); }
.artifact-search::placeholder { color: var(--muted); }
.artifact-search:hover { border-color: #3a3f49; background: #1f222a; }
.artifact-search:focus { border-color: #3a3f49; box-shadow: 0 0 0 3px rgba(96,165,250,0.18), var(--shadow); }
.artifact-search::-webkit-search-cancel-button { -webkit-appearance: none; }
.artifact.art-hidden { display: none; }
.artifact.art-raw-match { border-color: #a78bfa; box-shadow: 0 0 0 2px rgba(167,139,250,0.25); }
.artifact.art-raw-match::after { content: "raw match"; position: absolute; top: 4px; right: 8px; font-size: 9px; color: #a78bfa; text-transform: uppercase; letter-spacing: 0.5px; opacity: 0.85; }
.options-grid { padding: 18px; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.opt { min-height: 44px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--line); background: #20242c; display: flex; align-items: center; gap: 10px; transition: background-color var(--speed), border-color var(--speed), transform var(--speed); white-space: normal; overflow-wrap: anywhere; position: relative; }
.opt:hover { background: #232832; border-color: #3a3f49; box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.opt input { accent-color: #c0c3cc; }
.opt.auto-enabled { border-color: #5b7a3a; background: rgba(91,122,58,0.08); }
.opt-compound { justify-content: flex-start; }
.opt-compound-main { display: flex; align-items: center; gap: 10px; flex: 1; cursor: pointer; }
.opt-compound-loud { display: flex; flex-direction: column; align-items: center; margin-left: auto; gap: 1px; position: relative; top: 2px; }
.opt-compound-loud input { accent-color: #c0c3cc; margin: 0; }
.opt-compound-loud-text { font-size: 9px; font-weight: 600; letter-spacing: 0.5px; color: var(--muted); line-height: 1; }
.opt-compound.opt-knock-disabled .opt-compound-loud { opacity: 0.25; pointer-events: none; }

.advanced { margin-top: 8px; }
.advanced > summary { cursor: pointer; color: var(--muted); font-size: 13px; padding: 10px 16px; border-radius: var(--radius); display: flex; align-items: center; justify-content: space-between; }
.advanced > summary .summary-caret { border-right-color: #8f949d; border-bottom-color: #8f949d; }
.adv-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px 16px; margin-top: 8px; padding: 10px 18px 14px; }
.adv { display: grid; gap: 6px; font-size: 13px; color: var(--muted); }
.adv span { color: var(--muted); }
.help { display: inline-grid; place-items: center; width: 16px; height: 16px; margin-left: 6px; border-radius: 50%; background: #2a2e36; color: #cfd2d9; font-size: 11px; font-weight: 700; box-shadow: inset 0 0 0 1px #3a3f49; opacity: 0.85; }

.run-panels { display: grid; gap: 14px; margin-top: 14px; width: 100%; max-width: var(--content-width); margin-left: auto; margin-right: auto; }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 12px; }
.panel:empty { display: none; }
.options-block > .collapsible .panel { border-radius: 0; }
/* Add spacing between stacked detail entries */
#artifactDetailsList > .panel { margin-top: 10px; }
#artifactDetailsList > .panel.details { max-width: min(1100px, 100%); width: 100%; overflow: hidden; }
#artifactDetailsList .details-head { flex-wrap: wrap; }
#artifactDetailsList .details-list { max-width: 100%; max-height: 500px; overflow: auto; word-break: break-word; }
/* Screenshot gallery grid inside artifact details */
.screenshots-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
.screenshots-gallery .screenshot-item { position: relative; border-radius: var(--radius); overflow: hidden; background: #0d1117; border: 1px solid var(--line); cursor: pointer; }
.screenshots-gallery .screenshot-item img { width: 100%; height: auto; display: block; object-fit: contain; }
.screenshots-gallery .screenshot-label { font-size: 11px; color: var(--muted); padding: 4px 8px; background: rgba(0,0,0,0.6); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Enrichment text above image in gallery item */
.screenshot-enrichment { font-size: 11px; color: #a5b4c8; padding: 6px 8px; background: rgba(30,41,59,0.85); white-space: pre-wrap; line-height: 1.5; border-bottom: 1px solid rgba(255,255,255,0.06); max-height: 120px; overflow-y: auto; }
/* Fullscreen overlay for screenshot zoom */
.screenshot-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.85); display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: zoom-out; gap: 12px; }
.screenshot-overlay img { max-width: 90vw; max-height: 80vh; border-radius: var(--radius); box-shadow: 0 4px 24px rgba(0,0,0,0.5); }
.screenshot-overlay-enrichment { font-size: 13px; color: #c8d6e5; background: rgba(30,41,59,0.9); padding: 12px 18px; border-radius: var(--radius); white-space: pre-wrap; line-height: 1.6; max-width: 80vw; max-height: 20vh; overflow-y: auto; }
/* PDF/document gallery — mirrors screenshot gallery layout */
.pdf-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
.pdf-item { position: relative; border-radius: var(--radius); overflow: hidden; background: #0d1117; border: 1px solid var(--line); cursor: pointer; transition: border-color var(--speed); }
.pdf-item:hover { border-color: #3a3f49; }
.pdf-item.pdf-hidden { display: none; }
.screenshot-item.screenshot-hidden { display: none; }
.pdf-enrichment { font-size: 11px; color: #a5b4c8; padding: 6px 8px; background: rgba(30,41,59,0.85); white-space: pre-wrap; line-height: 1.5; border-bottom: 1px solid rgba(255,255,255,0.06); max-height: 80px; overflow-y: auto; }
.pdf-icon-area { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 18px 12px; background: #161b22; min-height: 80px; gap: 8px; }
.pdf-icon-area svg { width: 36px; height: 36px; color: #e74c3c; opacity: 0.8; }
.pdf-filename { font-size: 11px; color: var(--muted); text-align: center; word-break: break-all; max-width: 100%; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.pdf-label { font-size: 11px; color: var(--muted); padding: 4px 8px; background: rgba(0,0,0,0.6); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* "Show more" button — matches raw output "Load More" (.btn.secondary) styling */
.pdf-show-more { grid-column: 1 / -1; margin-top: 4px; }
/* Fullscreen PDF viewer overlay */
.pdf-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.9); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 20px; }
.pdf-overlay-enrichment { font-size: 13px; color: #c8d6e5; background: rgba(30,41,59,0.9); padding: 10px 16px; border-radius: var(--radius); white-space: pre-wrap; line-height: 1.5; max-width: 80vw; text-align: center; }
.pdf-viewer-frame { width: 90vw; height: 78vh; border: none; border-radius: var(--radius); background: #fff; }
/* "Open in New Tab" button — shared across PDF and image overlays */
.overlay-open-tab { text-decoration: none !important; font-size: 13px; letter-spacing: 0.3px; cursor: pointer !important; }
.screenshot-overlay .overlay-open-tab, .pdf-overlay .overlay-open-tab { display: inline-block; }
/* ── Media Panel: Face Clusters & Domain Groups ──────────────── */
.face-cluster-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; margin-bottom: 12px; }
.face-cluster-header { display: flex; align-items: baseline; gap: 10px; margin-bottom: 4px; flex-wrap: wrap; }
.face-cluster-title { font-size: 13px; font-weight: 600; color: var(--text); }
.face-cluster-meta { font-size: 11px; color: var(--muted); }
.face-cluster-usernames { font-size: 11px; color: var(--muted); margin-bottom: 8px; }
.face-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 8px; }
.face-thumb { display: flex; flex-direction: column; align-items: center; gap: 4px; cursor: pointer; }
.face-thumb img { width: 64px; height: 64px; object-fit: cover; border-radius: 50%; border: 2px solid var(--line); background: #0d1117; transition: border-color var(--speed); }
.face-thumb:hover img { border-color: var(--text); }
.face-label { font-size: 10px; color: var(--muted); text-align: center; max-width: 80px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.face-similarity { font-size: 9px; color: var(--muted); opacity: 0.7; }
.media-domain-group { border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 8px; overflow: hidden; }
.media-domain-group > summary { list-style: none; padding: 8px 12px; font-size: 13px; color: var(--text); cursor: pointer; background: rgba(255,255,255,0.02); display: flex; align-items: center; justify-content: space-between; }
.media-domain-group > summary::-webkit-details-marker { display: none; }
.media-domain-group[open] > summary { border-bottom: 1px solid var(--line); }
.house-group .screenshots-gallery { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.house-group .screenshot-item img { border-radius: 4px; }
.house-zpid { font-size: 10px; color: var(--muted); opacity: 0.6; margin-left: 8px; font-family: var(--mono, monospace); }
.house-info { padding: 6px 0 8px; margin-bottom: 4px; display: flex; flex-direction: column; gap: 3px; }
.house-info-line { font-size: 12px; color: var(--muted); }
.house-info-label { font-weight: 600; color: var(--muted); }
.house-info-link { color: #5b8def; text-decoration: none; }
.house-info-link:hover { text-decoration: underline; }
.media-domain-count { font-size: 11px; color: var(--muted); margin-left: auto; }
.media-domain-content { padding: 10px; }
.media-section-label { font-size: 11px; font-weight: 600; color: var(--muted); margin: 8px 0 6px; text-transform: uppercase; letter-spacing: 0.5px; }
.media-section-label:first-child { margin-top: 0; }
.social-image-row { display: flex; align-items: flex-start; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.social-image-row:last-child { border-bottom: none; }
.social-image-avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 2px solid var(--line); background: #0d1117; flex-shrink: 0; cursor: pointer; }
.social-image-info { flex: 1; min-width: 0; }
.social-image-platform { font-size: 12px; font-weight: 600; color: var(--text); }
.social-image-username { font-size: 11px; color: var(--muted); }
.social-image-posts { display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 6px; margin-top: 6px; }
.social-image-posts .screenshot-item { border-radius: var(--radius); overflow: hidden; background: #0d1117; border: 1px solid var(--line); cursor: pointer; }
.social-image-posts .screenshot-item img { width: 100%; height: 64px; object-fit: cover; display: block; }
.media-favicon { display: inline-flex; align-items: center; gap: 8px; padding: 4px 0; }
.media-favicon img { width: 32px; height: 32px; border-radius: 4px; background: #0d1117; }
.media-favicon-hash { font-size: 11px; color: var(--muted); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.media-pages-list { display: flex; flex-direction: column; gap: 2px; }
.media-page-item { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.media-page-item > summary { list-style: none; padding: 6px 10px; font-size: 12px; cursor: pointer; display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,0.02); }
.media-page-item > summary::-webkit-details-marker { display: none; }
.media-page-item[open] > summary { border-bottom: 1px solid var(--line); }
.media-page-path { flex: 1; color: var(--text); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.media-page-words { font-size: 11px; color: var(--muted); white-space: nowrap; }
.media-page-tool { font-size: 10px; color: var(--muted); opacity: 0.7; white-space: nowrap; }
.media-page-text { padding: 10px 12px; font-size: 12px; line-height: 1.6; color: var(--text); white-space: pre-wrap; word-break: break-word; max-height: 400px; overflow-y: auto; background: rgba(0,0,0,0.15); }
.media-file-item { display: flex; align-items: center; gap: 8px; padding: 5px 10px; font-size: 12px; border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 4px; background: rgba(255,255,255,0.02); }
.media-file-icon { font-size: 14px; flex-shrink: 0; }
.media-file-name { flex: 1; color: var(--text); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.media-file-size { font-size: 11px; color: var(--muted); white-space: nowrap; }
.media-file-type { font-size: 10px; color: var(--muted); opacity: 0.7; white-space: nowrap; }
.media-file-link { font-size: 11px; color: var(--link); text-decoration: none; }
.media-file-link:hover { text-decoration: underline; }
.media-file-play { font-size: 11px; }
.media-unclustered-label { font-size: 12px; font-weight: 600; color: var(--muted); margin: 16px 0 8px; }
/* ── Media Panel: Geotagged Images ──────────────────────────── */
.geo-card { display: flex; gap: 14px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; margin-bottom: 10px; align-items: flex-start; }
.geo-card-image { flex-shrink: 0; width: 160px; height: 120px; border-radius: var(--radius); overflow: hidden; background: #0d1117; border: 1px solid var(--line); cursor: pointer; }
.geo-card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.geo-card-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.geo-card-coords { display: flex; flex-direction: column; gap: 2px; }
.geo-card-coords-label { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.5px; }
.geo-card-coords-value { font-size: 14px; font-weight: 600; color: var(--text); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.geo-card-location { font-size: 13px; color: var(--text); display: flex; align-items: center; gap: 4px; }
.geo-card-location-icon { font-size: 14px; flex-shrink: 0; }
.geo-card-location-value { font-weight: 500; }
.geo-card-meta { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.geo-card-method { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.4px; padding: 2px 6px; border-radius: 4px; background: rgba(91,141,239,0.15); color: #5b8def; }
.geo-method-exif { background: rgba(34,197,94,0.15); color: #22c55e; }
.geo-method-vlm { background: rgba(168,85,247,0.15); color: #a855f7; }
.geo-card-confidence { font-size: 11px; color: var(--muted); }
.geo-card-radius { font-size: 11px; color: var(--muted); }
.geo-card-provenance { font-size: 12px; color: var(--text); display: flex; align-items: center; gap: 4px; }
.geo-card-provenance-icon { font-size: 13px; flex-shrink: 0; }
.geo-card-provenance-value { font-weight: 500; }
.geo-card-device { font-size: 11px; color: var(--muted); }
.geo-card-device-label { font-weight: 600; color: var(--text); opacity: 0.7; }
.geo-card-device-sw { opacity: 0.6; }
.geo-card-dim { font-size: 11px; color: var(--muted); }
.geo-card-extras { font-size: 11px; color: var(--muted); line-height: 1.5; padding-top: 2px; border-top: 1px solid var(--line); margin-top: 2px; }
.geo-card-map-link { font-size: 11px; color: #5b8def; text-decoration: none; display: inline-flex; align-items: center; gap: 3px; margin-top: 2px; }
.geo-card-map-link:hover { text-decoration: underline; }
#mediaTabs .nri-tab { padding: 5px 14px; font-size: 12px; }
#mediaTabs .social-fp-toggle { margin-left: auto; margin-top: -2px; margin-bottom: 2px; }
/* Document badge inherits from .artifact-badges container above */
/* Subtle hover on action buttons */
.btn { transition: transform var(--speed), background-color var(--speed), border-color var(--speed); }
.btn:hover { border-color: #3a3f49; background: #232832; box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.telemetry { max-height: 280px; overflow: auto; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; line-height: 1.45; }
.telemetry .line { padding: 4px 6px; border-radius: 8px; overflow-wrap: anywhere; word-break: break-word; white-space: normal; }
.telemetry .line + .line { margin-top: 4px; }
.telemetry .event { color: var(--muted); }
.telemetry .ts { color: #b0b2b9; }
.telem-vpad { margin: 0; padding: 0; border: none; }

.artifacts { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; position: relative; z-index: 30; }
.artifact { position: relative; border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 12px; background: #20242c; transition: transform var(--speed), box-shadow var(--speed), border-color var(--speed), background-color var(--speed); z-index: 31; }
.artifact:hover { box-shadow: 0 0 0 3px rgba(142,142,147,0.22), 0 6px 18px rgba(0,0,0,0.24); z-index: 1000002; }
.artifact.details-open { background: #232832; border-color: #3a3f49; }
/* Priority tier indicators - left border color */
.artifact[data-priority-tier="1"] { border-left: 3px solid #22c55e; } /* Identity - green */
.artifact[data-priority-tier="2"] { border-left: 3px solid #3b82f6; } /* Contact - blue */
.artifact[data-priority-tier="3"] { border-left: 3px solid #a855f7; } /* Social - purple */
.artifact[data-priority-tier="4"] { border-left: 3px solid #f97316; } /* High confidence / owned - orange */
.artifact[data-priority-tier="5"] { border-left: 3px solid #eab308; } /* Research / medium confidence - yellow */
.artifact[data-priority-tier="6"] { border-left: 3px solid #6b7280; } /* Infrastructure - gray */
.artifact[data-priority-tier="7"] { border-left: 3px solid #94a3b8; } /* Technical - light gray */
.artifact[data-priority-tier="8"] { border-left: 3px solid #475569; } /* Noise - slate */
.artifact .type { font-size: 12px; color: var(--muted); margin-bottom: 6px; }
/* Badge container — both icons sit side-by-side at top-right */
.artifact .artifact-badges { position: absolute; top: 6px; right: 8px; display: flex; gap: 4px; align-items: center; line-height: 1; opacity: 0.5; }
.artifact .artifact-badges svg { width: 12px; height: 12px; }
.artifact .value { font-weight: 600; word-break: break-word; }

/* During runs, keep inputs non-sticky to avoid covering terminal */
body.running .hero { position: static; top: auto; padding-top: 0; z-index: auto; }
body.running .search .control, body.running .search .action, body.running .options-block { filter: saturate(0.96); }
body.running .search .control[readonly] { background: #22262e; cursor: not-allowed; }

/* Responsive tweaks */
@media (min-width: 780px) {
  /* Seed small, Case same size, Value fills, Action fixed */
  :root { --seed-grid-primary: 160px 160px minmax(400px, 1fr) 48px; --seed-grid-primary-age: 160px 160px minmax(300px, 1fr) 140px 48px; --seed-grid-extra: 160px minmax(300px, 1fr); }
  .seed-row.primary-row { align-items: center; column-gap: 12px; }
  .seed-row.add-row { column-gap: 12px; }
}

/* Enhanced Select (custom dropdown) */
.select-wrap { position: relative; display: block; }
.select-display { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; border: 1px solid var(--line); background: var(--panel-elev); color: var(--text); border-radius: var(--radius-lg); height: 48px; padding: 0 14px; box-shadow: var(--shadow); cursor: pointer; transition: border-color var(--speed), background-color var(--speed), transform var(--speed); position: relative; }
.select-display.small { height: auto; padding: 10px 12px; border-radius: var(--radius); }
.select-display:hover { border-color: #3a3f49; background: #232832; box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.select-display:focus { border-color: var(--gray); box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); outline: none; }
.select-display::after { content: ""; width: 6px; height: 6px; border-right: 2px solid #b9bcc5; border-bottom: 2px solid #b9bcc5; transform: rotate(45deg); margin-left: auto; transition: transform var(--speed), filter var(--speed); }
.select-wrap.open .select-display::after { transform: rotate(-135deg); filter: brightness(1.1); }
.select-wrap.invalid .select-display { border-color: var(--danger-line); box-shadow: 0 0 0 3px rgba(229,72,77,0.22), var(--shadow); }
.select-menu { position: absolute; left: 0; top: calc(100% + 6px); width: 100%; max-height: 320px; overflow: hidden auto; background: var(--panel); color: var(--text); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); z-index: 2000000; padding: 6px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.select-menu::-webkit-scrollbar { width: 6px; }
.select-menu::-webkit-scrollbar-thumb { background: var(--line); border-radius: 3px; }
.select-menu::-webkit-scrollbar-track { background: transparent; }
.select-group { font-size: 12px; color: var(--muted); padding: 4px 6px; margin-top: 6px; }
.select-option { padding: 8px 10px; border-radius: 8px; cursor: pointer; border: 1px solid transparent; }
.select-option:hover, .select-option.active { background: #232832; border-color: #3a3f49; }
.select-option.selected { background: #20242c; border-color: #3a3f49; }
.select-display.disabled { opacity: 0.6; pointer-events: none; cursor: not-allowed; }
select.control:disabled { cursor: not-allowed; }
/* Re-enable native number spinners for better UX on numeric fields */
input[type=number].control::-webkit-outer-spin-button,
input[type=number].control::-webkit-inner-spin-button { -webkit-appearance: auto; margin: 0; }
input[type=number].control { -moz-appearance: auto; }

/* Tooltips (attribute-driven) */
.has-tip { position: relative; }
.has-tip::after, .has-tip::before { opacity: 0; pointer-events: none; transition: opacity 120ms ease, transform 120ms ease; }
.has-tip:hover { z-index: 999999; }
.has-tip:hover::after, .has-tip:focus-within::after { content: attr(data-tip); position: absolute; left: 0; top: calc(100% + 8px); width: max-content; max-width: min(320px, 85vw); background: #0f1116; color: #dfe2e8; border: 1px solid var(--line); padding: 8px 12px; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,0.4); font-size: 12px; line-height: 1.5; z-index: 1000000; white-space: pre-line; overflow-wrap: anywhere; transform: translateY(-2px); opacity: 1; transition-delay: 140ms; }
.has-tip:hover::before, .has-tip:focus-within::before { content: ""; position: absolute; left: 12px; top: 100%; width: 10px; height: 10px; background: #0f1116; border-left: 1px solid var(--line); border-top: 1px solid var(--line); transform: translateY(0) rotate(45deg); z-index: 1000000; opacity: 1; transition-delay: 140ms; }
/* Prevent sticky tooltips on Options when checkbox holds focus (but allow hover) */
.options-grid .opt.has-tip:focus-within:not(:hover)::after, .options-grid .opt.has-tip:focus-within:not(:hover)::before { content: none !important; opacity: 0 !important; pointer-events: none !important; }

/* Layering: ensure dropdowns and hovers paint above panels below */
#options { position: relative; z-index: 100; }
#llmChatBlock { position: relative; z-index: 50; }
#discoveriesBlock { position: relative; z-index: 40; }
#discoveriesBlock[open] > .collapsible { max-height: none; overflow: visible; }
#infoBlock { position: relative; z-index: 20; }
#detailsBlock { position: relative; z-index: 10; }
#detailsBlock[open] > .collapsible { max-height: none; overflow: visible; }
#detailsBlock .details { position: relative; z-index: 1; }

/* Layering: ensure Approvals hover sits above Errors/Warnings */
#terminalBlock { position: relative; z-index: 50; }
#termApprovals { position: relative; z-index: 45; }
.approvals { position: relative; z-index: 46; }

/* Remove inner box around Terminal and Artifacts content inside collapsible blocks */
#terminalBlock > .collapsible > .panel,
#discoveriesBlock > .collapsible > .panel { border: none; background: transparent; box-shadow: none; padding: 0; }

/* Help badge-specific tooltips (open above to avoid clipping near bottom) */
.help-tip { position: relative; cursor: help; z-index: 50; isolation: isolate; }
.help-tip:hover, .help-tip:focus-visible { z-index: 200002; }
.help-tip:hover::after, .help-tip:focus-visible::after { content: attr(data-tip); position: absolute; left: 50%; top: calc(100% + 10px); transform: translate(-50%, 0); width: max-content; min-width: 240px; max-width: min(520px, 92vw); background: #0f1116; color: #dfe2e8; border: 1px solid var(--line); padding: 10px 12px; border-radius: 12px; box-shadow: var(--shadow); font-size: 12.5px; line-height: 1.5; z-index: 200000; white-space: pre-line; }
.help-tip:hover::before, .help-tip:focus-visible::before { content: ""; position: absolute; left: 50%; top: 100%; width: 12px; height: 12px; background: #0f1116; border-left: 1px solid var(--line); border-top: 1px solid var(--line); transform: translate(-50%, -2px) rotate(45deg); z-index: 200001; }

/* Collapsible content animation */
.collapsible { max-height: 0; opacity: 0; transform: translateY(-4px); overflow: hidden; transition: max-height 240ms ease, opacity 180ms ease, transform 240ms ease; }
.options-block > .collapsible { padding: 8px; }
.options-block[open] > .collapsible { max-height: 2000px; opacity: 1; transform: translateY(0); overflow: visible; }
.options-block[open] > .collapsible { animation: fadeSlide 220ms ease; }
.advanced .collapsible { max-height: 0; opacity: 0; transform: translateY(-4px); overflow: hidden; transition: max-height 220ms ease, opacity 170ms ease, transform 220ms ease; }
.advanced[open] .collapsible { max-height: 2000px; opacity: 1; transform: translateY(0); overflow: visible; }
.advanced[open] .collapsible { animation: fadeSlide 200ms ease; }
@keyframes fadeSlide { from { opacity: 0; transform: translateY(-6px);} to { opacity: 1; transform: translateY(0);} }

/* Disabled panel during analysis (correlation + AI Analysis) */
.options-block.analyzing > summary { cursor: not-allowed; opacity: 0.7; }
.options-block.analyzing > summary * { pointer-events: none; }

/* Stats row cards */
.stats-row { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.stat-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 12px 14px; display: grid; gap: 4px; align-content: center; justify-items: start; }
.stat-title { font-size: 12px; color: var(--muted); }
.stat-value { font-size: 18px; font-weight: 700; letter-spacing: 0.3px; }

/* Approvals panel */
#termApprovals { width: 100%; box-sizing: border-box; }
.approvals { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 4px; margin-top: 12px; max-width: 100%; max-height: 70vh; display: flex; flex-direction: column; }
.approvals-header { font-size: 13px; color: var(--muted); margin: 2px 2px 10px; font-weight: 600; }
/* Two-column grid on wide screens; single column on small — scrolls when many items */
.approvals-grid { column-count: 2; column-gap: 12px; padding: 8px; width: 100%; overflow-y: auto; flex: 1; min-height: 0; }
@media (max-width: 840px) {
  .approvals-grid { column-count: 1; }
}
/* Uniform checklist chips */
.approval-chip { display: grid; grid-template-columns: 22px 1fr auto; align-items: center; gap: 12px; border: 1px solid var(--line); background: #20242c; padding: 12px 14px; border-radius: 12px; min-height: 56px; box-shadow: var(--shadow); word-break: break-word; cursor: pointer; }
.approval-chip input { accent-color: #c0c3cc; width: 18px; height: 18px; cursor: pointer; }
.approval-title { font-size: 13px; font-weight: 600; color: #cfd2da; line-height: 1.2; display: flex; align-items: center; gap: 5px; overflow: visible; min-width: 0; }
/* Info icon shown inline after tool name in approval chips */
.approval-info-icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 16px; height: 16px; border-radius: 50%; background: rgba(80,120,180,0.15); color: #6a9fd8; font-size: 9px; font-style: normal; cursor: default; transition: background var(--speed); }
.approval-info-icon:hover { background: rgba(80,120,180,0.3); }
/* Engagement info icon inside audience quality badge (same pattern as approval info icon) */
.engagement-info-icon { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 16px; height: 16px; border-radius: 50%; background: rgba(80,120,180,0.15); color: #6a9fd8; font-size: 9px; font-style: normal; cursor: help; transition: background var(--speed); }
.engagement-info-icon:hover { background: rgba(80,120,180,0.3); }
/* Tooltip rendered via JS position:fixed (see _initApprovalTips in app.js) — CSS ::after clips inside overflow:auto */
/* Video download tool prefix label */
.channel-tool-prefix { font-size: 9px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #6a9fd8; background: rgba(80,120,180,0.15); border-radius: 3px; padding: 1px 5px; flex-shrink: 0; margin-right: 2px; }
.approval-meta { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.approval-expand-arrow { display: inline-block; width: 8px; height: 8px; border-right: 2px solid #9aa0aa; border-bottom: 2px solid #9aa0aa; transform: rotate(-45deg); transition: transform var(--speed), border-color var(--speed); flex-shrink: 0; }
.approval-expand-arrow.open { transform: rotate(45deg); }
.approval-meta:hover .approval-expand-arrow { border-color: #fff; }
/* Expandable domain list below chip */
.approval-wrapper { display: flex; flex-direction: column; break-inside: avoid; margin-bottom: 12px; }
.approval-wrapper.expanded .approval-chip { border-radius: 12px 12px 0 0; border-bottom-color: transparent; }
.approval-domains-list { background: #1a1e25; border: 1px solid var(--line); border-top: none; border-radius: 0 0 10px 10px; padding: 6px 8px; max-height: 280px; overflow-y: auto; }
.approval-domain-row { display: grid; grid-template-columns: 18px 1fr auto; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 6px; cursor: default; transition: background var(--speed); }
.approval-domain-row:hover { background: rgba(255,255,255,0.04); }
.approval-domain-cb { accent-color: #c0c3cc; width: 16px; height: 16px; cursor: pointer; }
.approval-domain-name { font-size: 12px; color: #d0d3da; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.approval-domain-badge { font-size: 11px; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.approval-domain-badge.owned { background: rgba(52,199,89,0.15); color: #34c759; }
.approval-domain-badge.probable { background: rgba(255,214,10,0.12); color: #ffd60a; }
.approval-domain-badge.unknown { background: rgba(142,142,147,0.12); color: #8e8e93; }
.approval-domain-badge.unlikely { background: rgba(255,69,58,0.10); color: #ff453a; }
.approvals-actions { display: flex; gap: 10px; justify-content: end; padding: 4px 8px 8px; flex-shrink: 0; }

/* Video download channel approval chip */
.approval-chip-channel { border-color: #3a3040; background: #221e2c; }
.approval-chip-channel:hover { border-color: #5a4060; }
.approval-title-channel { display: flex; align-items: center; gap: 6px; }
.channel-icon { color: #ff4444; font-size: 10px; flex-shrink: 0; }
.approval-videodl-details { padding: 10px 12px; background: #1e1a28; border-color: #3a3040; }
.approval-videodl-count-row { display: flex; align-items: center; gap: 8px; padding: 6px 0; flex-wrap: wrap; }
.approval-videodl-label { font-size: 12px; color: #9aa0aa; white-space: nowrap; }
.approval-videodl-num { width: 60px; padding: 4px 8px; border-radius: 6px; border: 1px solid var(--line); background: #2a2e36; color: var(--text); font-size: 13px; font-weight: 600; text-align: center; -moz-appearance: textfield; }
.approval-videodl-num::-webkit-outer-spin-button, .approval-videodl-num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.approval-videodl-num:focus { outline: none; border-color: #5a4060; }
.approval-videodl-estimate { font-size: 11px; color: #7a7e86; padding: 2px 8px; background: rgba(255,255,255,0.04); border-radius: 999px; }
.approval-videodl-disc-header { font-size: 11px; color: #7a7e86; padding: 6px 0 2px; border-top: 1px solid rgba(255,255,255,0.06); margin-top: 6px; }
.approval-videodl-channel.expanded .approval-chip-channel { border-radius: 12px 12px 0 0; border-bottom-color: transparent; }

/* Archive cap-override approval cards */
.approval-cap-override .approval-chip { border-color: #4a4020; background: #2a2820; }
.approval-cap-override .approval-chip:hover { border-color: #6a6030; }
.cap-tool-prefix { color: #ffd60a; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.04em; margin-right: 0.4em; }
.approval-cap-num { width: 60px; padding: 4px 8px; border-radius: 6px; border: 1px solid var(--line); background: #2a2e36; color: var(--text); font-size: 13px; font-weight: 600; text-align: center; -moz-appearance: textfield; }
.approval-cap-num::-webkit-outer-spin-button, .approval-cap-num::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.approval-cap-num:focus { outline: none; border-color: #6a6030; }
.approval-cap-meta { font-size: 0.8rem; color: #9aa0aa; }

/* Warning cards — matches approval-chip grid layout */
.approval-warning-item { break-inside: avoid; }
.approval-warning-item .approval-chip { grid-template-columns: 22px 1fr auto; border-color: var(--line); background: #20242c; }
.approval-warning-icon { color: #f0c040; font-size: 16px; text-align: center; }
.approval-warning-summary { font-size: 13px; font-weight: 600; color: #cfd2da; line-height: 1.3; }
.btn-override { background: var(--panel-elev); color: #f0c040; border: 1px solid var(--line); border-radius: 8px; padding: 6px 12px; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.btn-override:hover { border-color: #f0c040; background: #2a2e36; }

/* Low-yield case guidance panel */
.low-yield-suggestions { background: var(--panel); border: 1px solid #4a4020; border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 4px; margin-bottom: 12px; max-width: 100%; display: flex; flex-direction: column; }
.low-yield-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px 0; }
.low-yield-title { color: #ffd60a; font-weight: 600; font-size: 14px; }
.low-yield-header .btn-dismiss { background: none; border: none; color: var(--muted); font-size: 18px; cursor: pointer; padding: 0 4px; line-height: 1; }
.low-yield-header .btn-dismiss:hover { color: var(--text); }
.low-yield-explainer { color: var(--muted); font-size: 12px; line-height: 1.5; padding: 4px 14px 8px; margin: 0; }
.low-yield-hints { padding: 4px 10px 10px; display: flex; flex-direction: column; gap: 6px; }
.low-yield-hint { display: grid; grid-template-columns: 28px 1fr; gap: 10px; align-items: start; padding: 10px 12px; background: #1a1e25; border: 1px solid var(--line); border-radius: 8px; }
.low-yield-hint-icon { font-size: 16px; text-align: center; padding-top: 1px; }
.low-yield-hint-body { min-width: 0; }
.low-yield-hint-title { font-size: 13px; font-weight: 600; color: var(--text); margin-bottom: 2px; }
.low-yield-hint-msg { font-size: 12px; color: var(--muted); line-height: 1.45; }

/* Fanout spike pause modal overlay — matches diff-modal conventions */
.frontier-cap-overlay { position: fixed; inset: 0; z-index: 9000; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.6); backdrop-filter: blur(3px); }
.frontier-cap-modal { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-sm); width: min(92vw, 640px); max-height: 85vh; overflow-y: auto; display: flex; flex-direction: column; box-shadow: 0 8px 32px rgba(0,0,0,0.4); }
.frontier-cap-header { display: flex; align-items: center; gap: 10px; padding: 16px 20px; font-size: 16px; font-weight: 700; color: var(--text); border-bottom: 1px solid var(--line); }
.frontier-cap-icon { font-size: 1.4rem; color: #f0c040; }
.frontier-cap-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
.frontier-cap-detail { font-size: 14px; color: var(--text); background: var(--panel-elev); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 10px 14px; margin: 0 0 14px; line-height: 1.5; }
.frontier-cap-explain { font-size: 14px; color: var(--muted); line-height: 1.5; margin: 0 0 14px; }
.frontier-cap-info { font-size: 13px; color: var(--muted); background: var(--panel-elev); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 12px 16px; margin: 0 0 14px; }
.frontier-cap-info strong { color: var(--text); }
.frontier-cap-info ul { margin: 6px 0 0 16px; padding: 0; }
.frontier-cap-info li { margin-bottom: 6px; line-height: 1.4; }
.frontier-cap-info em { color: #f0c040; font-style: normal; font-weight: 600; }
.frontier-cap-actions { display: flex; gap: 8px; padding: 12px 20px; border-top: 1px solid var(--line); justify-content: flex-end; flex-shrink: 0; }

/* SocialEnsemble social profile approval cards */
.approval-chip-edata { border-color: var(--line); background: #20242c; }
.approval-chip-edata:hover { border-color: #4a4e58; }
.approval-chip-edata[data-edata-platform="instagram"] { border-color: #4a2040; background: #2c1e2a; }
.approval-chip-edata[data-edata-platform="instagram"]:hover { border-color: #6a3060; }
.approval-chip-edata[data-edata-platform="tiktok"] { border-color: #1a3a40; background: #1a2a2c; }
.approval-chip-edata[data-edata-platform="tiktok"]:hover { border-color: #2a5a60; }
.approval-chip-edata[data-edata-platform="twitter"] { border-color: #1a3050; background: #1a2430; }
.approval-chip-edata[data-edata-platform="twitter"]:hover { border-color: #2a5070; }
.approval-chip-edata[data-edata-platform="snapchat"] { border-color: #3a3820; background: #2a2820; }
.approval-chip-edata[data-edata-platform="snapchat"]:hover { border-color: #5a5830; }
.approval-chip-edata[data-edata-platform="threads"] { border-color: #3a3a3a; background: #242424; }
.approval-chip-edata[data-edata-platform="threads"]:hover { border-color: #5a5a5a; }
.edata-platform-prefix { font-size: 9px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; border-radius: 3px; padding: 1px 5px; flex-shrink: 0; margin-right: 2px; }
.edata-platform-prefix[data-platform="instagram"] { color: #e1306c; background: rgba(225,48,108,0.15); }
.edata-platform-prefix[data-platform="tiktok"] { color: #00f2ea; background: rgba(0,242,234,0.12); }
.edata-platform-prefix[data-platform="twitter"] { color: #1d9bf0; background: rgba(29,155,240,0.15); }
.edata-platform-prefix[data-platform="snapchat"] { color: #fffc00; background: rgba(255,252,0,0.12); }
.edata-platform-prefix[data-platform="threads"] { color: #c8c8c8; background: rgba(200,200,200,0.10); }
.approval-title-edata { display: flex; align-items: center; gap: 6px; }
.approval-meta-edata { display: flex; align-items: center; gap: 6px; }
.approval-edata-details { padding: 10px 12px; }
.approval-edata-details[data-platform="instagram"] { background: #261a28; border-color: #4a2040; }
.approval-edata-details[data-platform="tiktok"] { background: #182628; border-color: #1a3a40; }
.approval-edata-details[data-platform="twitter"] { background: #18202c; border-color: #1a3050; }
.approval-edata-details[data-platform="snapchat"] { background: #26241c; border-color: #3a3820; }
.approval-edata-details[data-platform="threads"] { background: #202020; border-color: #3a3a3a; }
.approval-edata-op-row { display: flex; align-items: center; gap: 8px; padding: 5px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04); }
.approval-edata-op-row:last-of-type { border-bottom: none; }
.approval-edata-op-cb { accent-color: #c0c3cc; width: 16px; height: 16px; cursor: pointer; flex-shrink: 0; }
.approval-edata-op-name { font-size: 12px; color: #d0d3da; flex: 1; min-width: 0; white-space: nowrap; }
.approval-edata-slider { width: 80px; height: 4px; -webkit-appearance: none; appearance: none;
  background: var(--line); border-radius: 2px; cursor: pointer; border: none; outline: none; }
.approval-edata-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px;
  border-radius: 50%; background: var(--muted); cursor: pointer; border: none; }
.approval-edata-slider::-webkit-slider-thumb:hover { background: var(--text); }
.approval-edata-slider::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%;
  background: var(--muted); cursor: pointer; border: none; }
.approval-edata-slider:disabled { opacity: 0.3; cursor: not-allowed; }
.approval-edata-slider-val { font-size: 11px; color: var(--muted); min-width: 20px; text-align: right; }
.approval-edata-units { font-size: 11px; color: #7a7e86; padding: 2px 8px;
  background: rgba(255,255,255,0.04); border-radius: 999px; white-space: nowrap; min-width: 55px; text-align: center; }
.approval-edata-total-row { display: flex; align-items: center; gap: 8px; padding: 8px 0 2px;
  border-top: 1px solid rgba(255,255,255,0.08); margin-top: 4px; }
.approval-edata-total-row > span:first-child { font-size: 12px; color: #9aa0aa; font-weight: 600; flex: 1; }
.approval-edata-total { font-size: 12px; font-weight: 700; color: var(--text); padding: 2px 10px;
  background: rgba(255,255,255,0.06); border-radius: 999px; }
.approval-edata-presets { display: flex; gap: 6px; padding: 6px 0 8px; }
.approval-edata-preset-btn { font-size: 10px; padding: 3px 10px; border-radius: 6px; border: 1px solid var(--line);
  background: rgba(255,255,255,0.04); color: var(--muted); cursor: pointer; transition: all var(--speed); }
.approval-edata-preset-btn:hover { background: rgba(255,255,255,0.08); color: var(--text); border-color: #4a4e58; }
.approval-edata-preset-btn.active { background: rgba(90,130,200,0.15); color: #7ab3ff; border-color: #3a5080; }
.approval-edata-url-row { padding: 4px 0; }
.approval-edata-url-row a { color: #7ab3ff; text-decoration: none; font-size: 11px; }
.approval-edata-url-row a:hover { text-decoration: underline; }
.approval-edata-discovered { font-size: 11px; color: #7a7e86; padding: 2px 0; }
.approval-edata-budget { display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  background: rgba(90,130,200,0.08); border: 1px solid rgba(90,130,200,0.2); border-radius: 8px;
  margin-bottom: 10px; column-span: all; }
.approval-edata-budget-label { font-size: 11px; color: var(--muted); white-space: nowrap; }
.approval-edata-budget-value { font-size: 12px; font-weight: 600; color: var(--text); white-space: nowrap; }
.approval-edata-budget-bar { flex: 1; height: 4px; background: var(--line); border-radius: 2px; overflow: hidden; }
.approval-edata-budget-fill { height: 100%; background: #5b8def; border-radius: 2px; transition: width var(--speed); }
.approval-edata-budget.low .approval-edata-budget-value { color: #ff9f0a; }
.approval-edata-budget.low .approval-edata-budget-fill { background: #ff9f0a; }
.approval-edata-budget.critical .approval-edata-budget-value { color: #ff453a; }
.approval-edata-budget.critical .approval-edata-budget-fill { background: #ff453a; }
.approval-edata-profile.expanded .approval-chip-edata { border-radius: 12px 12px 0 0; border-bottom-color: transparent; }

/* Approved summary (after confirm) */
.approvals-summary { border: 1px dashed var(--line); border-radius: 12px; padding: 10px 12px; background: #1b1f26; }
.approvals-summary-title { font-size: 12px; color: var(--muted); margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.3px; }
.approvals-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.approval-pill { background: #242a33; border: 1px solid var(--line); color: #d7dae2; border-radius: 999px; padding: 6px 10px; font-size: 12px; box-shadow: var(--shadow); }
.btn { border-radius: 10px; padding: 10px 14px; border: 1px solid var(--line); background: var(--panel-elev); color: var(--text); cursor: pointer; box-shadow: var(--shadow); }
.btn[disabled] { opacity: 0.5; cursor: not-allowed; }
.btn.primary { border-color: #3a3f49; }
.btn.secondary { background: #20242c; }

/* Post-run actions */
.post-run-actions { display: flex; gap: 12px; justify-content: center; align-items: center; margin-top: 16px; flex-wrap: wrap; }
.post-run-actions .btn { height: 44px; padding: 12px 18px; font-size: 13px; font-weight: 600; text-decoration: none; }
.btn.prompt-action { min-width: 5.5em; text-align: center; }

/* Post-run monitoring button — matches .post-run-actions .btn sizing */
.btn.monitoring-btn { display: inline-flex; align-items: center; gap: 8px; border-color: #3c845a; background: rgba(60,132,90,0.12); color: #9fddb8; }
.btn.monitoring-btn:hover { background: rgba(239,68,68,0.12); border-color: rgba(239,68,68,0.5); color: #fca5a5; }
.btn.monitoring-btn:hover .monitoring-dot { background: #ef4444; animation: none; }
.monitoring-dot { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; flex-shrink: 0; animation: pulse-dot 2s ease-in-out infinite; }

/* Change detected button — amber variant */
.btn.changes-btn { display: inline-flex; align-items: center; gap: 8px; border-color: #b8860b; background: rgba(184,134,11,0.15); color: #f0c040; }
.btn.changes-btn:hover { background: rgba(184,134,11,0.25); border-color: #d4a017; color: #f5d060; }
.changes-dot { width: 8px; height: 8px; border-radius: 50%; background: #d4a017; flex-shrink: 0; animation: pulse-dot 1.2s ease-in-out infinite; }
.btn.danger-subtle { color: #ef4444; border-color: rgba(239,68,68,0.3); background: transparent; font-size: 0.85rem; padding: 4px 12px; }
.btn.danger-subtle:hover { background: rgba(239,68,68,0.1); }

/* Diff viewer modal */
.diff-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 9000; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(3px); }
.diff-modal { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-md, 10px); width: min(90vw, 800px); max-height: 80vh; display: flex; flex-direction: column; box-shadow: 0 8px 32px rgba(0,0,0,0.4); }
.diff-modal-header { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.diff-modal-header h3 { margin: 0; font-size: 16px; color: #f0c040; }
.diff-modal-close { background: none; border: none; color: var(--muted); font-size: 24px; cursor: pointer; padding: 0 4px; line-height: 1; }
.diff-modal-close:hover { color: var(--text); }
.diff-modal-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
.diff-watch-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.diff-watch-item { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 6px; background: var(--panel-elev); border: 1px solid var(--line); cursor: pointer; transition: all 0.15s; }
.diff-watch-item:hover, .diff-watch-item.active { border-color: #b8860b; background: rgba(184,134,11,0.08); }
.diff-watch-item .watch-url { font-size: 13px; color: var(--text); flex: 1; }
.diff-watch-item .watch-changed { font-size: 11px; color: var(--muted); }
.diff-content { background: #0d1117; border: 1px solid var(--line); border-radius: 6px; padding: 14px; font-family: var(--font-mono, 'SF Mono', 'Fira Code', monospace); font-size: 12px; line-height: 1.5; color: #c9d1d9; white-space: pre-wrap; word-break: break-word; overflow-x: auto; max-height: 400px; overflow-y: auto; }
.diff-content .diff-add { color: #3fb950; }
.diff-content .diff-del { color: #f85149; }
.diff-content .diff-hdr { color: #58a6ff; }
.diff-modal-footer { display: flex; gap: 8px; justify-content: flex-end; padding: 12px 20px; border-top: 1px solid var(--line); }

/* Group membership badge on case viewer */
.group-membership-badge {
  display: inline-flex; align-items: center; gap: 5px;
  margin-top: 8px; padding: 3px 10px;
  font-size: 11px; color: var(--muted);
  border-radius: 999px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
}
.group-membership-badge a {
  color: #60a5fa; text-decoration: none; font-weight: 500;
}
.group-membership-badge a:hover { text-decoration: underline; }
.group-membership-badge .group-icon {
  width: 12px; height: 12px; opacity: 0.5; flex-shrink: 0;
}

/* Modal overlay for Spiderweb */
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.55); display: grid; place-items: center; z-index: 2000000; }
.modal { width: min(96vw, 1100px); height: min(90vh, 820px); background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); display: flex; flex-direction: column; overflow: hidden; }
.modal-header { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,0.02); }
.modal-title { font-weight: 600; color: #c6c9d2; }
.modal-actions { display: flex; align-items: center; gap: 8px; }
.icon-btn { height: 36px; width: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; border: 1px solid var(--line); background: var(--panel-elev); box-shadow: var(--shadow); cursor: pointer; transition: transform var(--speed), background-color var(--speed), border-color var(--speed); line-height: 0; padding: 0; }
.icon-btn:hover { border-color: #3a3f49; background: #232832; box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.icon-btn.small { height: 28px; width: 28px; border-radius: 6px; }
.modal-body { flex: 1; display: grid; }
.spiderweb-container { width: 100%; height: 100%; }

/* Graph overlay (Spiderweb filters) */
.graph-shell { position: relative; }
.graph-overlay-root { position: absolute; top: 10px; left: 10px; z-index: 1100000; display: grid; gap: 8px; }
.graph-overlay-panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); min-width: 220px; overflow: hidden; }
.graph-overlay-panel.collapsed .overlay-body { display: none; }
.graph-overlay-panel .overlay-toggle { width: 100%; background: var(--panel-elev); color: var(--text); border: 0; border-bottom: 1px solid var(--line); padding: 8px 10px; display: inline-flex; align-items: center; gap: 8px; font-weight: 600; cursor: pointer; }
.graph-overlay-panel .overlay-toggle .caret { width: 10px; height: 10px; margin-left: auto; border-right: 2px solid #9aa0aa; border-bottom: 2px solid #9aa0aa; transform: rotate(-45deg) translateY(-1px); transition: transform var(--speed), border-color var(--speed); opacity: 0.9; }
.graph-overlay-panel .overlay-toggle[aria-expanded="true"] .caret { transform: rotate(45deg) translateY(-1px); }
.graph-overlay-panel .overlay-toggle .dot { width: 8px; height: 8px; border-radius: 50%; background: #60a5fa; display: inline-block; box-shadow: 0 0 0 2px rgba(96,165,250,0.25); }
.graph-overlay-panel .overlay-body { padding: 8px; display: grid; gap: 10px; max-height: 44vh; overflow: auto; background: var(--panel); }
.graph-overlay-panel .overlay-section { display: grid; gap: 6px; }
.graph-overlay-panel .section-title { color: #c6c9d2; font-weight: 600; font-size: 12px; letter-spacing: .3px; opacity: .9; padding: 0 2px; }
.graph-overlay-panel .tier-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.graph-overlay-panel .type-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.graph-overlay-panel .util-list { display: grid; gap: 8px; }
.graph-overlay-panel .overlay-chip { display: grid; grid-template-columns: 18px 1fr auto; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 10px; border: 1px solid var(--line); background: #20242c; }
.graph-overlay-panel .overlay-chip:hover { background: #232832; border-color: #3a3f49; }
.graph-overlay-panel .overlay-row { display: grid; grid-template-columns: 18px 1fr auto; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 10px; border: 1px solid var(--line); background: #20242c; }
.graph-overlay-panel .overlay-row:hover { background: #232832; border-color: #3a3f49; }
.graph-overlay-panel .overlay-row .count { color: var(--muted); font-style: normal; font-size: 12px; }

/* Overlay panel - section header with quick actions */
.graph-overlay-panel .section-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.graph-overlay-panel .section-header .section-title { margin: 0; }
.graph-overlay-panel .quick-actions { display: flex; gap: 4px; }
.graph-overlay-panel .action-btn { padding: 3px 8px; font-size: 11px; font-weight: 500; color: #9aa0aa; background: #20242c; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; transition: background var(--speed), border-color var(--speed); }
.graph-overlay-panel .action-btn:hover { background: #292e38; border-color: #3a3f49; color: #c6c9d2; }

/* Overlay panel - compact section */
.graph-overlay-panel .overlay-section.compact { padding-top: 4px; border-top: 1px solid var(--line); margin-top: 2px; }

/* Overlay panel - advanced filters accordion */
.graph-overlay-panel .overlay-details { border-top: 1px solid var(--line); margin-top: 4px; padding-top: 6px; }
.graph-overlay-panel .details-toggle { font-size: 12px; font-weight: 500; color: #7a8090; cursor: pointer; padding: 4px 0; display: flex; align-items: center; gap: 6px; }
.graph-overlay-panel .details-toggle::before { content: "▸"; font-size: 10px; transition: transform var(--speed); }
.graph-overlay-panel .overlay-details[open] .details-toggle::before { transform: rotate(90deg); }
.graph-overlay-panel .details-toggle:hover { color: #9aa0aa; }
.graph-overlay-panel .overlay-details > .overlay-section { margin-top: 8px; }

/* Sidebar backdrop */
.sidebar-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 1190000; opacity: 0; pointer-events: none; transition: opacity var(--speed); }
.sidebar-open .sidebar-backdrop { opacity: 1; pointer-events: auto; }

/* Sidebar (collapsible) */
.sidebar { position: fixed; top: 0; left: 0; bottom: 0; width: 240px; background: var(--panel); border-right: 1px solid var(--line); box-shadow: 4px 0 24px rgba(0,0,0,0.35); z-index: 1200000; transform: translateX(0); transition: transform var(--speed) ease; border-top-right-radius: var(--radius-lg); border-bottom-right-radius: var(--radius-lg); overflow: hidden; display: flex; flex-direction: column; padding: 0; }
.sidebar.collapsed { transform: translateX(-100%); }

/* Sidebar header */
.sidebar .sidebar-header { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 12px; border-bottom: 1px solid var(--line); }
.sidebar .sidebar-title { font-weight: 600; font-size: 14px; color: var(--text); letter-spacing: 0.3px; }
.sidebar .sidebar-close { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; border: 1px solid var(--line); background: var(--panel-elev); cursor: pointer; transition: background-color var(--speed), border-color var(--speed); padding: 0; line-height: 0; }
.sidebar .sidebar-close:hover { border-color: #3a3f49; background: #232832; }
.sidebar .sidebar-close .icon { width: 14px; height: 14px; }

/* Sidebar nav */
.sidebar-nav { display: flex; flex-direction: column; gap: 2px; padding: 8px; flex: 1; }
.sidebar .nav-btn { text-decoration: none; display: block; text-align: left; padding: 9px 12px; border: none; border-radius: 8px; background: transparent; color: var(--muted); font-size: 13px; font-weight: 500; transition: background-color var(--speed), color var(--speed); }
.sidebar .nav-btn:hover { background: var(--panel-elev); color: var(--text); }
.sidebar .nav-btn.active { background: var(--panel-elev); color: var(--text); box-shadow: inset 3px 0 0 var(--muted); }

/* Sidebar FAB (hamburger toggle) */
.sidebar-fab { position: fixed; top: 14px; left: 14px; z-index: 1250000; width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; border: 1px solid var(--line); background: var(--panel-elev); box-shadow: var(--shadow); cursor: pointer; transition: transform var(--speed), background-color var(--speed), border-color var(--speed), opacity var(--speed); padding: 0; line-height: 0; color: #b9bcc5; }
.sidebar-fab:hover { border-color: #3a3f49; background: #232832; box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.sidebar-open .sidebar-fab { opacity: 0; pointer-events: none; }

/* Spiderweb toolbar sizing + error text */
.toolbar .control.small { height: 40px; }
.toolbar .btn { height: 40px; display: inline-flex; align-items: center; }
.toolbar .opt { height: 40px; min-height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel-elev); box-shadow: var(--shadow); display: inline-flex; align-items: center; gap: 8px; color: #c6c9d2; }
.toolbar .opt input[type="checkbox"] { width: 16px; height: 16px; margin: 0; }
.error-msg { color: var(--danger); font-size: 12px; margin-left: 8px; }

/* Ensure elements with hidden attribute are not displayed */
[hidden] { display: none !important; }
.options-block > summary::-webkit-details-marker { display: none; }
.options-block > summary::marker { content: ""; }
summary::-webkit-details-marker { display: none; }
summary::marker { content: ""; }
summary { list-style: none; }
details.locked > summary { cursor: not-allowed; opacity: 0.7; pointer-events: none; }
details.locked > summary * { pointer-events: none; }
details > summary::marker, details::marker { content: none; }

/* Contain Warnings pane inside Information panel */
#nriWarnings > .panel { max-height: 35vh; overflow: auto; border: none; background: transparent; box-shadow: none; padding: 0; }
.error-row { padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: #1e2128; margin: 4px 0; font-size: 12.5px; color: #d3d6dd; }
div.error-row { display: flex; align-items: center; gap: 6px; }
.error-row summary { cursor: pointer; outline: none; display: flex; align-items: center; gap: 6px; }
.error-summary-text { flex: 1; min-width: 0; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.error-row .error-toggle { width: 10px; height: 10px; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; line-height: 1; color: #b9bcc5; }
.error-row summary .error-toggle { margin-left: auto; flex-shrink: 0; }
.error-row[open] .error-toggle::before { content: "-"; }
.error-row:not([open]) .error-toggle::before { content: "+"; }
/* Tool name in summary */
.error-tool { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 340px; }
/* Status badge pill */
.error-badge { font-size: 10.5px; font-weight: 600; letter-spacing: 0.3px; padding: 1px 7px; border-radius: 4px; white-space: nowrap; text-transform: uppercase; }
.error-badge--error { background: rgba(235,87,87,0.18); color: #f47272; }
.error-badge--warn { background: rgba(235,180,60,0.16); color: #eab43c; }
.error-badge--transient { background: rgba(90,160,235,0.15); color: #6eb4f7; }
.error-badge--config { background: rgba(180,130,230,0.15); color: #c49def; }
.error-badge--info { background: rgba(140,160,180,0.12); color: #8ca0b4; }
.error-badge--default { background: rgba(160,165,175,0.12); color: #a0a5af; }
/* Target chip (input:value) */
.error-target { font-size: 11px; color: #8a9bb0; background: rgba(120,145,175,0.10); padding: 1px 6px; border-radius: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 480px; font-family: var(--mono, 'Fira Code', monospace); }
/* Shrink target when an override/investigate button is present */
.error-row:has(.egress-override-btn) .error-target { max-width: 320px; }
/* Count multiplier */
.error-mult { font-size: 11px; color: #8a8f9a; font-weight: 500; }
/* Expanded detail lines */
.error-detail { padding: 3px 0 3px 4px; margin-top: 2px; font-size: 12px; color: #a3a8b2; line-height: 1.45; border-left: 2px solid rgba(120,145,175,0.18); padding-left: 10px; }
.error-detail:first-child { margin-top: 8px; }
/* Egress override button */
.btn.tiny.egress-override-btn { flex-shrink: 0; font-size: 10px; padding: 1px 6px; line-height: 1.4; border-radius: 3px; background: rgba(91,141,239,0.15); color: #7baaf7; border: 1px solid rgba(91,141,239,0.3); cursor: pointer; white-space: nowrap; font-weight: 500; transition: background 0.15s; }
.egress-override-btn:hover:not(:disabled) { background: rgba(91,141,239,0.28); }
.egress-override-btn:disabled { opacity: 0.6; cursor: default; }
.egress-override-btn.egress-override-done { background: rgba(106,213,157,0.15); color: #6ad59d; border-color: rgba(106,213,157,0.3); }
.egress-override-btn.egress-override-failed { background: rgba(235,87,87,0.15); color: #f47272; border-color: rgba(235,87,87,0.3); }

/* Minimal stepper for Advanced numeric inputs */
.control.small { height: 40px; }
.adv .num-wrap { position: relative; }
.adv .control { width: 100%; }
.adv .num-wrap .control.small[type="number"] { padding-right: 56px; height: 40px; width: 100%; }
.stepper { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); display: inline-flex; gap: 6px; }
.stepper .step { height: 22px; width: 22px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; border: 1px solid var(--line); background: #232832; color: #c6c9d2; cursor: pointer; box-shadow: var(--shadow); font-weight: 700; line-height: 1; }
.stepper .step:hover { background: #262b35; border-color: #3a3f49; box-shadow: 0 0 0 2px rgba(142,142,147,0.22); }
.stepper .step:active { box-shadow: none; }

/* Hide native number spinners to avoid bright white arrows */
input[type=number].control::-webkit-outer-spin-button,
input[type=number].control::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number].control { -moz-appearance: textfield; }

/* Spiderweb Diagnostics grid: two per row */
.graph-overlay-panel .diag-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }


.keys-page { max-width: 1200px; margin: 0 auto; padding-bottom: 40px; }
.keys-hero .brand .name { font-size: 26px; }
.keys-toolbar { display: flex; flex-direction: column; gap: 10px; margin: 18px 0 16px; }
.keys-toolbar-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.keys-toolbar-row .control { flex: 1; min-width: 240px; }
.toolbar-right { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.keys-meta { font-size: 13px; color: var(--muted); }
.chip-switch { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 999px; background: #191d24; padding: 6px 12px; font-size: 13px; color: #e0e3ec; cursor: pointer; box-shadow: var(--shadow); }
.chip-switch input { width: 16px; height: 16px; margin: 0; accent-color: #9fb8ff; }
.stack { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--muted); }
.stack > span { font-weight: 600; font-size: 13px; color: #d7dae4; }
.stack .control { width: 100%; }
.stack.select-field select.control { padding-right: 42px; }

.empty-state { padding: 16px; border: 1px dashed var(--line); border-radius: var(--radius); text-align: center; color: var(--muted); background: rgba(255,255,255,0.02); }

.proxies-page { align-items: stretch; }
.proxies-hero { gap: 8px; width: 100%; }
.proxies-hero > * + * { margin-top: 8px; }
.proxy-info { width: 100%; line-height: 1.5; }
.proxy-info h2 { margin: 0 0 8px; font-size: 18px; color: #e6e8ef; }
.proxy-info ul { margin: 0 0 10px; padding-left: 20px; color: #c4c7d2; }
.proxy-info li { margin-bottom: 6px; }
.proxy-info .disclaimer { margin: 8px 0 0; font-size: 13px; color: var(--gray); }

.section-title { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 4px; }
.section-title h2,
.section-title h3 { margin: 0; }
.section-title p { margin: 4px 0 0; font-size: 13px; color: var(--muted); }
.section-title-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

.proxy-global { width: 100%; display: flex; flex-direction: column; gap: 16px; }
.proxy-global + .panel.proxy-actions { margin-top: 32px; }

.proxy-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); width: 100%; }
.proxy-card { border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--panel); box-shadow: var(--shadow); padding: 16px; display: flex; flex-direction: column; gap: 12px; position: relative; z-index: 0; overflow: visible; }
.proxy-card:has(.select-wrap.open) { z-index: 10; }
.proxy-card-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.proxy-card h3 { margin: 0; font-size: 16px; color: #e8eaef; }
.proxy-card .hint { margin: 4px 0 0; font-size: 12.5px; color: var(--muted); }
.proxy-card .mini-hint { font-size: 12px; color: var(--gray); margin: 0; }
.inherit-note button { background: none; border: none; color: #9fb8ff; cursor: pointer; font-size: 12px; padding: 0 0 0 6px; }
.inherit-note button:hover { text-decoration: underline; }
.proxy-card.is-disabled { opacity: 0.65; }
.card-actions { display: flex; gap: 8px; align-items: center; }
.remove-btn { color: #e85d5d; }
.remove-btn:hover { color: #ff7070; background: rgba(232, 93, 93, 0.12); }
.proxy-check { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.chip-switch.compact { padding: 4px 8px; }
.chip-switch.compact input { margin: 0; width: 18px; height: 18px; accent-color: #c0c3cc; }
.btn.tiny { padding: 6px 10px; font-size: 12px; border-radius: 8px; }
.check-status { font-size: 11.5px; color: var(--muted); margin: 0; min-height: 14px; }
.check-status.ok { color: #6ad59d; }
.check-status.error { color: var(--danger); }
.proxy-fallback-controls { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.proxy-options { display: flex; flex-direction: column; gap: 8px; }
.option-row { display: flex; gap: 10px; flex-wrap: wrap; }

.overrides-panel { width: 100%; display: flex; flex-direction: column; gap: 16px; }
.overrides-panel > .hint { margin: 0; font-size: 12.5px; color: var(--muted); }
.overrides-panel > .hint + .hint { margin-top: -10px; }
.overrides-list { display: grid; gap: 14px; }
.override-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; background: #191d24; box-shadow: var(--shadow); }
.override-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.override-title { margin: 0; font-size: 15px; color: #e8eaef; }
.override-meta { font-size: 12.5px; color: var(--muted); margin-top: 4px; }
.override-card.highlight { outline: 2px solid #4d6bff; }
.override-adder { display: flex; gap: 10px; flex-wrap: wrap; align-items: stretch; }
.override-search { position: relative; flex: 1; min-width: 220px; }
.override-search .control { width: 100%; padding-right: 48px; }
.dropdown-btn { position: absolute; right: 8px; top: 0; bottom: 0; width: 34px; border: none; background: none; padding: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.dropdown-btn::after { content: ""; width: 8px; height: 8px; border-right: 2px solid #b9bcc5; border-bottom: 2px solid #b9bcc5; transform: rotate(45deg); transition: transform var(--speed), border-color var(--speed); }
.dropdown-btn:hover::after { border-color: #fff; }
.dropdown-btn.open::after { transform: rotate(-135deg); }
.override-results { position: absolute; left: 0; top: calc(100% + 6px); width: 100%; max-height: 320px; overflow: auto; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); z-index: 40; display: grid; gap: 0; }
.override-results button { appearance: none; border: none; background: none; text-align: left; padding: 10px 12px; color: var(--text); cursor: pointer; font: inherit; }
.override-results button:hover, .override-results button:focus-visible { background: #232832; outline: none; }
.override-results .result-title { font-weight: 600; font-size: 13px; text-transform: uppercase; letter-spacing: 0.4px; }
.override-results .result-meta { font-size: 12px; color: var(--muted); }

.proxy-transfer { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.proxy-transfer .transfer-copy { flex: 1; min-width: 220px; font-size: 13px; color: var(--muted); }
.proxy-transfer .transfer-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.proxy-transfer .transfer-status { flex-basis: 100%; font-size: 12.5px; color: var(--muted); }

#proxyToast { position: fixed; bottom: 24px; right: 24px; background: #232832; border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 16px; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transition: opacity var(--speed); z-index: 99999; }
#proxyToast.visible { opacity: 1; }
.pill-toggle { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 999px; background: #181b22; padding: 6px 12px; color: #cfd2da; cursor: pointer; box-shadow: var(--shadow); }
.pill-toggle .pill-indicator { width: 30px; height: 16px; border-radius: 999px; background: #2b2f3a; position: relative; transition: background-color var(--speed); }
.pill-toggle .pill-indicator::after { content: ""; position: absolute; width: 12px; height: 12px; top: 2px; left: 2px; border-radius: 50%; background: #cfd2da; transition: transform var(--speed); }
.pill-toggle.on .pill-indicator { background: #3c845a; }
.pill-toggle.on .pill-indicator::after { transform: translateX(12px); }

.import-export { display: flex; flex-wrap: wrap; gap: 20px; align-items: stretch; margin-bottom: 18px; padding: 12px; }
.import-copy { flex: 1; min-width: 260px; display: flex; flex-direction: column; gap: 12px; justify-content: center; }
.import-actions { display: flex; flex-direction: column; gap: 10px; min-width: 200px; justify-content: center; }
.dropzone { border: 1px dashed var(--line); border-radius: var(--radius-lg); padding: 14px 16px; background: #151821; display: flex; flex-direction: column; gap: 4px; cursor: pointer; transition: border-color var(--speed), background-color var(--speed); }
.dropzone strong { font-size: 13px; }
.dropzone.drag-active { border-color: #7d87ff; background: #1f2430; }
.dropzone:focus { outline: 2px solid #8892ff; outline-offset: 2px; }

/* Document upload zone in seed input */
.doc-upload-zone { min-height: 0; align-items: center; justify-content: center; text-align: center; padding: 6px 16px; flex-direction: row; gap: 6px; }
.doc-upload-zone .doc-upload-hint { font-size: 12px; color: var(--muted); margin-left: 6px; }
.doc-upload-zone.parsing { pointer-events: none; opacity: 0.7; }
.doc-upload-zone.invalid { border-color: #ff6060; }
.doc-parse-error { color: #ff9090; font-size: 13px; }
.doc-import-summary { display: flex; align-items: center; gap: 10px; padding: 8px 14px; font-size: 13px; background: rgba(42,107,60,0.1); border: 1px solid rgba(42,107,60,0.3); border-radius: var(--radius); color: var(--text); margin-top: 4px; }
.doc-import-summary .btn { flex-shrink: 0; }
.doc-import-warnings { font-size: 12px; color: #b58900; padding: 6px 0; }

/* Contextual entities panel (read-only, never submitted as seeds) */
.doc-contextual-panel { margin-top: 8px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel-elev); overflow: hidden; }
.doc-contextual-header { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--muted); padding: 6px 12px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,0.02); }
.doc-contextual-list { max-height: 180px; overflow-y: auto; scrollbar-width: thin; }
.doc-contextual-item { display: grid; grid-template-columns: 100px 1fr 1fr; gap: 8px; padding: 4px 12px; font-size: 12px; border-bottom: 1px solid rgba(255,255,255,0.03); }
.doc-contextual-item:last-child { border-bottom: none; }
.doc-ctx-type { color: var(--muted); font-family: monospace; font-size: 11px; }
.doc-ctx-value { color: var(--text); font-weight: 500; }
.doc-ctx-context { color: var(--muted); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Confidence badge in extra seed rows */
.seed-confidence { display: inline-flex; align-items: center; font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 3px; text-transform: uppercase; white-space: nowrap; cursor: help; align-self: center; }
.seed-confidence.conf-high { background: rgba(42,107,60,0.2); color: #3dba64; }
.seed-confidence.conf-med  { background: rgba(181,137,0,0.15); color: #b58900; }
.seed-confidence.conf-low  { background: rgba(91,141,239,0.15); color: #5b8def; }
.seed-row.extra-row.has-confidence { grid-template-columns: var(--seed-grid-extra) 48px; }
.seed-row.extra-row.has-confidence .seed-confidence { position: absolute; top: 2px; right: 2px; z-index: 1; }
.seed-row.extra-row.has-confidence .seed-input { position: relative; }

.import-note { font-size: 13px; color: var(--muted); }
.keys-message { font-size: 13px; min-height: 18px; color: var(--muted); }
.keys-message.error { color: #ff9090; }
.btn.tertiary { border-color: #2a2f38; background: transparent; color: #9fb8ff; }

.keys-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.key-card { border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--panel-elev); box-shadow: var(--shadow); padding: 16px; display: flex; flex-direction: column; gap: 12px; min-height: 100%; }
.key-card-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.key-category { font-size: 12px; color: var(--muted); letter-spacing: 0.08em; text-transform: uppercase; }
.key-title { font-size: 18px; font-weight: 600; color: #e6e9f0; letter-spacing: 0.06em; }
.premium-note { font-size: 11px; color: #e5a33d; margin-top: 2px; font-weight: 500; }
.key-notes { font-size: 11px; color: #8b9ab5; margin-top: 4px; line-height: 1.4; }
.key-card-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.key-link { font-size: 13px; color: #9fb8ff; text-decoration: none; }
.key-link:hover { text-decoration: underline; }
.key-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; border: 1px solid var(--line); background: #1a1f29; color: #c3c6cf; }
.tag.success { border-color: #3c845a; color: #9fddb8; }
.tag.muted { border-color: #2a2f38; color: #8d919c; }
.key-notes { font-size: 12.5px; color: #b9bdc7; margin: 0; line-height: 1.4; word-break: break-word; }
.key-fields { display: flex; flex-direction: column; gap: 12px; flex: 1; }
.key-field { border: 1px solid var(--line); border-radius: var(--radius); padding: 10px; background: #151a22; display: flex; flex-direction: column; gap: 6px; }
.key-field.field-browser { border-color: #3c845a; }
.field-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.field-label { font-size: 13px; font-weight: 600; color: #dfe2e8; }
.field-actions { display: flex; align-items: center; gap: 6px; }
.key-input-row { display: flex; align-items: center; gap: 8px; }
.key-input-row .key-input { flex: 1; }
.key-input-row .select-field { flex: 1; min-width: 0; }
.key-input-row .select-wrap { flex: 1; min-width: 0; }
.ghost-btn { border: 1px solid #2a2f38; background: transparent; color: #9fb8ff; font-size: 11px; padding: 4px 8px; border-radius: var(--radius); cursor: pointer; letter-spacing: 0.08em; text-transform: uppercase; }
.ghost-btn:hover { border-color: #3a3f49; background: #232832; }
.text-btn { background: transparent; border: none; color: #9fb8ff; cursor: pointer; padding: 4px 6px; border-radius: var(--radius); font-size: 13px; }
.text-btn:hover:not(:disabled) { background: #232832; }
.text-btn:disabled { opacity: 0.45; cursor: not-allowed; }
.text-btn.tiny { font-size: 12px; padding: 2px 6px; }
.optional-toggle { align-self: flex-start; margin: 4px 0 -4px; font-size: 12px; padding: 2px 6px; color: #cfd2da; }
.field-source { font-size: 12px; color: var(--muted); }
.keys-grid .empty-state { grid-column: 1 / -1; }

/* ── Cookie management page ────────────────────────────────────── */
.cookie-page-toggle { margin: 18px auto 0; max-width: 1200px; padding: 0 20px; box-sizing: border-box; }
.cookie-card.cookie-missing-required { border-left: 3px solid #e5a33d; }
.cookie-card.cookie-saved { border-left: 3px solid #3c845a; }
.tag.cookie-required { border-color: #b5542a; color: #f0a882; background: rgba(42,24,16,0.6); }
.tag.cookie-recommended { border-color: #2a5ab5; color: #82b0f0; background: rgba(16,24,42,0.6); }
.cookie-gated { font-size: 12px; color: var(--muted); margin-top: 4px; line-height: 1.4; }
.cookie-gated-label { font-weight: 600; color: #b9bcc5; margin-right: 4px; }
.cookie-input { width: 100%; box-sizing: border-box; resize: vertical; min-height: 60px; font-family: var(--font-mono, monospace); font-size: 12px; padding: 8px 10px; }
.cookie-actions-row { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.cookie-status { font-size: 12px; color: var(--muted); }
.cookie-status.saved { color: #9fddb8; }
#cookiesAllWrap { margin-top: 24px; max-width: 1200px; }
.cookies-all-summary { font-size: 16px; font-weight: 600; color: #e6e9f0; cursor: pointer; padding: 12px 0; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cookies-all-summary:hover { color: #fff; }
.cookies-all-summary .summary-caret { width: 10px; height: 10px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(-45deg) translateY(-1px); transition: transform var(--speed), border-color var(--speed); }
#cookiesAllWrap[open] > .cookies-all-summary .summary-caret { transform: rotate(45deg) translateY(-1px); }

.keys-toast,
.toast { position: fixed; top: 18px; left: 50%; transform: translateX(-50%); background: rgba(23, 26, 34, 0.96); color: #e6e9f0; padding: 10px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.1); box-shadow: var(--shadow); opacity: 0; pointer-events: none; transition: opacity 180ms ease, transform 180ms ease; z-index: 1400000; font-size: 13px; }
.keys-toast.visible,
.toast.visible { opacity: 1; transform: translate(-50%, 0); }

.toggles-page .toggles-hero { margin-bottom: 18px; }
.toggles-toolbar { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 14px; }
.toggles-toolbar .control.text { flex: 1; min-width: 240px; }
.toggles-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.toggles-actions .btn { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; }
.toggles-meta { font-size: 0.9rem; color: #b9bcc5; margin-top: 6px; }
.toggle-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 18px; width: 100%; max-width: 1200px; margin: 0 auto; }
.toggle-card { display: flex; flex-direction: column; gap: 10px; }
.toggle-card-header { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 0.9rem; color: #b9bcc5; }
.toggle-card-header h3 { margin: 0; font-size: 1rem; color: #e6e9f0; }
.toggle-card-body { display: flex; flex-direction: column; gap: 6px; }
.toggle-row { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
.toggle-row:last-child { border-bottom: none; }
.toggle-row-optional { border-left: 2px solid #2a2f38; padding-left: 10px; }
.toggle-row-optional .toggle-name .tag { margin-left: 6px; vertical-align: middle; }
.toggle-row-main { display: flex; flex-direction: column; gap: 2px; }
.toggle-name { font-weight: 600; font-size: 0.92rem; color: #f4f7ff; letter-spacing: 0.04em; }
.toggle-id { font-size: 0.8rem; color: #9096a6; word-break: break-word; }
.toggle-switch { display: flex; align-items: center; gap: 10px; }
.toggle-status { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.08em; color: #8ee69c; }
.toggle-status[data-state="off"] { color: #f7a4a4; }
.toggle-input { width: 1.2rem; height: 1.2rem; cursor: pointer; }
.toggle-groups .panel.empty-state { grid-column: 1 / -1; }

/* ── Cases page ──────────────────────────────────────────── */
.cases-page { max-width: var(--content-width); padding: 24px 16px; margin: 0 auto; justify-content: flex-start; align-items: stretch; }
.cases-hero { display: flex; flex-direction: column; align-items: center; gap: 14px; margin-bottom: 14px; }

.cases-toolbar { display: flex; align-items: center; justify-content: center; gap: 10px; }

.cases-search-pill { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 999px; background: var(--panel); padding: 3px 3px 3px 16px; gap: 8px; transition: border-color var(--speed); }
.cases-search-pill:focus-within { border-color: #3a4050; }
.cases-search-pill svg { width: 16px; height: 16px; stroke: var(--muted); fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.cases-search-pill input { border: none; background: transparent; color: var(--text); font-size: 14px; font-weight: 500; font-family: inherit; outline: none; padding: 8px 20px 8px 0; width: 180px; }
.cases-search-pill input::placeholder { color: var(--muted); }
.cases-search-pill input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }

.segment-toggle { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; background: var(--panel); padding: 3px; gap: 2px; }
.segment-toggle button { padding: 8px 24px; border-radius: 999px; border: none; background: transparent; color: var(--muted); font-size: 14px; font-weight: 500; cursor: pointer; transition: all var(--speed); font-family: inherit; }
.segment-toggle button:hover { color: var(--text); }
.segment-toggle button.active { background: var(--panel-elev); color: var(--text); box-shadow: 0 2px 8px rgba(0,0,0,0.2); }

.cases-meta { font-size: 13px; color: var(--muted); margin-bottom: 12px; }

.cases-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; padding: 4px; margin: -4px; }
.cases-grid.capped { max-height: calc(100vh - 240px); overflow: hidden; overflow: clip; -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%); mask-image: linear-gradient(to bottom, black 80%, transparent 100%); }
html:has(body.cases-capped) { overflow: hidden !important; }
body.cases-capped { overflow: hidden; min-height: 100vh; max-height: 100vh; }

.case-card { position: relative; display: flex; flex-direction: row; align-items: center; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; text-decoration: none; color: inherit; transition: all var(--speed); cursor: pointer; gap: 16px; }
.case-card:hover { border-color: #3a4050; box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.case-card-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }

/* changedetection.io monitoring — green glow on cards with active watchers.
   Add .monitored class to case-card when changedetection has active watches for this case.
   Future: wire to /api/case/{id}/state → has_changedetection or a dedicated endpoint. */
.case-card.monitored { border-color: #3c845a; }
.case-card.monitored:hover { border-color: #4da66a; box-shadow: 0 0 0 3px rgba(60,132,90,0.25), var(--shadow); }
.case-card.monitored .case-monitor-badge { display: inline-flex; }
.case-monitor-badge { display: none; align-items: center; gap: 4px; font-size: 11px; color: #9fddb8; letter-spacing: 0.04em; margin-top: 2px; }
.case-monitor-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #3c845a; animation: pulse-dot 2s ease-in-out infinite; }

/* Change detected variant — amber */
.case-card.monitored.has-changes { border-color: #b8860b; }
.case-card.monitored.has-changes:hover { border-color: #d4a017; box-shadow: 0 0 0 3px rgba(184,134,11,0.25), var(--shadow); }
.case-card.monitored.has-changes .case-monitor-badge { color: #f0c040; }
.case-card.monitored.has-changes .case-monitor-badge::before { background: #d4a017; }

.case-card-icon { width: 72px; height: 72px; display: flex; align-items: center; justify-content: center; border-radius: var(--radius-sm); background: var(--panel-elev); flex-shrink: 0; }
.case-card-icon svg { width: 36px; height: 36px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

.case-card-name { font-size: 14px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.case-card-seed { font-size: 13px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.case-card-footer { display: flex; gap: 12px; margin-top: 4px; font-size: 12px; color: var(--muted); }

/* Report/spiderweb quick-links */
.card-links { display: flex; gap: 6px; margin-top: 6px; }
.card-link { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 6px; border: 1px solid var(--line); background: var(--panel-elev); color: var(--muted); text-decoration: none; transition: all var(--speed); }
.card-link:hover { border-color: #3a4050; color: var(--text); background: #232832; box-shadow: 0 0 0 2px rgba(142,142,147,0.18); }
.card-link svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.card-link[role="link"] { cursor: pointer; }
.mini-card .card-links { margin-top: 4px; }
.mini-card .card-link { width: 22px; height: 22px; border-radius: 5px; }
.mini-card .card-link svg { width: 12px; height: 12px; }

.case-status { font-size: 11px; font-weight: 500; letter-spacing: 0.04em; margin-top: 4px; }
.case-status.complete { color: #22c55e; }
.case-status.running { color: #3b82f6; }
.case-status.stale { color: #eab308; }

.case-status.running::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; margin-right: 5px; vertical-align: middle; animation: pulse-dot 1.5s ease-in-out infinite; }
.case-status.complete::before,
.case-status.stale::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; margin-right: 5px; vertical-align: middle; }
@keyframes pulse-dot { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }

.cases-load-wrap { display: flex; justify-content: center; margin-top: 14px; }

.cases-empty { text-align: center; padding: 48px 16px; color: var(--muted); }
.cases-empty a { color: #9fb8ff; text-decoration: none; }
.cases-empty a:hover { text-decoration: underline; }

/* ── "+" button on individual cards (group selection trigger) */
.case-card-group-btn { position: absolute; top: 8px; right: 8px; width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; border-radius: 6px; border: 1px solid var(--line); background: var(--panel-elev); color: var(--muted); padding: 0; cursor: pointer; opacity: 0; transition: opacity var(--speed), background-color var(--speed), border-color var(--speed); z-index: 3; }
.case-card-group-btn svg { width: 11px; height: 11px; }
.case-card:hover .case-card-group-btn { opacity: 1; }
.case-card-group-btn:hover { border-color: #3a4050; background: #232832; color: var(--text); box-shadow: 0 0 0 2px rgba(142,142,147,0.22); }

/* ── Selection mode (multi-select for grouping) */
.case-card-checkbox { position: absolute; top: 8px; right: 8px; width: 18px; height: 18px; accent-color: #9fb8ff; cursor: pointer; z-index: 3; display: none; }
.selection-mode .case-card-group-btn { display: none; }
.selection-mode .case-card-checkbox { display: block; }
.selection-mode .case-card { opacity: 0.55; }
.selection-mode .case-card.selectable { opacity: 1; pointer-events: auto; }
.selection-mode .case-card.selected { border-color: #9fb8ff; box-shadow: 0 0 0 3px rgba(159,184,255,0.25); }
.selection-mode .card-links { opacity: 0.25; pointer-events: none; }

/* ── Bottom action bar (group creation) */
.group-action-bar { position: fixed; bottom: 0; left: 0; right: 0; background: var(--panel); border-top: 1px solid var(--line); box-shadow: 0 -4px 20px rgba(0,0,0,0.3); padding: 14px 24px; display: flex; align-items: center; gap: 16px; z-index: 1300000; transform: translateY(100%); transition: transform 200ms ease; }
.group-action-bar.visible { transform: translateY(0); }
.group-action-bar .selection-count { font-size: 13px; color: var(--muted); flex-shrink: 0; min-width: 80px; }
.group-action-bar .group-name-input { flex: 1; max-width: 320px; appearance: none; border: 1px solid var(--line); background: var(--panel-elev); color: var(--text); border-radius: var(--radius); padding: 8px 12px; font-size: 14px; font-family: inherit; outline: none; transition: border-color var(--speed); }
.group-action-bar .group-name-input:focus { border-color: var(--gray); box-shadow: 0 0 0 3px rgba(142,142,147,0.22); }
.group-action-bar .group-name-input::placeholder { color: var(--muted); }
.group-action-bar .bar-actions { display: flex; gap: 10px; margin-left: auto; }

/* ── Case Groups (full-width group cards) */
.group-card { grid-column: 1 / -1; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; transition: all var(--speed); }
.group-card:hover { border-color: #3a4050; box-shadow: 0 0 0 3px rgba(142,142,147,0.12), var(--shadow); }

.group-card-header { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.group-card-name { font-size: 15px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.group-card-meta { display: flex; align-items: center; gap: 10px; margin-left: auto; flex-shrink: 0; }
.group-shared-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--muted); background: var(--panel-elev); border: 1px solid var(--line); border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.group-shared-badge svg { width: 12px; height: 12px; stroke: var(--muted); fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.group-card-actions { display: flex; gap: 8px; flex-shrink: 0; }
.group-action-link { font-size: 11px; color: #22c55e; text-decoration: none; padding: 3px 8px; border-radius: 6px; border: 1px solid rgba(34,197,94,0.3); transition: all var(--speed); }
.group-action-link:hover { background: rgba(34,197,94,0.1); border-color: #22c55e; }

/* Member sub-grid: flexbox so incomplete rows are centered */
.group-members-grid { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.group-members-grid > .mini-card { flex: 0 0 calc((100% - 20px) / 3); min-width: 0; }

/* Mini member card (compact version of case-card) */
.mini-card { position: relative; display: flex; flex-direction: row; align-items: center; background: var(--panel-elev); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 12px; text-decoration: none; color: inherit; transition: all var(--speed); cursor: pointer; gap: 12px; }
.mini-card:hover { border-color: #3a4050; box-shadow: 0 0 0 2px rgba(142,142,147,0.18); }
.mini-card-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }

.mini-card-icon { width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; border-radius: 8px; background: var(--panel); flex-shrink: 0; }
.mini-card-icon svg { width: 28px; height: 28px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.mini-card-name { font-size: 12px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mini-card-seed { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mini-card-footer { display: flex; gap: 8px; font-size: 10px; color: var(--muted); margin-top: 2px; }
.mini-card-status { font-size: 10px; font-weight: 500; letter-spacing: 0.04em; margin-top: 2px; }
.mini-card-status.complete { color: #22c55e; }
.mini-card-status.running { color: #3b82f6; }
.mini-card-status.stale { color: #eab308; }
.mini-card-status::before { content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: currentColor; margin-right: 4px; }
.mini-card-status.running::before { animation: pulse-dot 1.5s ease-in-out infinite; }

/* Mini-card monitoring states */
.mini-card.monitored { border-color: #3c845a; }
.mini-card.monitored .case-monitor-badge { display: inline-flex; font-size: 10px; }
.mini-card.monitored.has-changes { border-color: #b8860b; }
.mini-card.monitored.has-changes .case-monitor-badge { color: #f0c040; }
.mini-card.monitored.has-changes .case-monitor-badge::before { background: #d4a017; }

/* Remove button on mini cards: visible on hover */
.mini-card-remove { position: absolute; top: 6px; right: 6px; width: 20px; height: 20px; display: none; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid var(--line); background: var(--panel); color: var(--muted); padding: 0; cursor: pointer; transition: all var(--speed); z-index: 2; }
.mini-card-remove svg { width: 10px; height: 10px; }
.mini-card:hover .mini-card-remove { display: flex; }
.mini-card-remove:hover { border-color: var(--danger-line); color: var(--danger); background: rgba(229,72,77,0.1); }

@media (max-width: 900px) {
  .group-members-grid > .mini-card { flex: 0 0 calc((100% - 10px) / 2); }
}
@media (max-width: 580px) {
  .group-members-grid > .mini-card { flex: 0 0 100%; }
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 1180px) {
  .keys-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  .keys-toolbar-row { flex-direction: column; align-items: stretch; }
  .toolbar-right { justify-content: flex-start; }
  .key-card-head { flex-direction: column; }
  .import-export { flex-direction: column; }
}

/* ============================================
   Correlation Analysis Panel
   ============================================ */
#correlationBlock {
  position: relative;
  z-index: 35;
  /* Prevent horizontal overflow */
  max-width: 100%;
  overflow: hidden;
}
#correlationBlock .collapsible {
  max-width: 100%;
  overflow: hidden;
}
#relativeCorrelationBlock {
  position: relative;
  z-index: 34;
  max-width: 100%;
  overflow: hidden;
}
#relativeCorrelationBlock .collapsible {
  max-width: 100%;
  overflow: hidden;
}
#cryptoFlowBlock {
  position: relative;
  z-index: 33;
  max-width: 100%;
  overflow: hidden;
}
#cryptoFlowBlock .collapsible {
  max-width: 100%;
  overflow: hidden;
}
.correlation-stats { font-size: 12px; color: var(--muted); margin-left: auto; }
.llm-analysis-status { font-size: 12px; color: var(--muted); margin-left: auto; }

.correlation-panel {
  max-height: 500px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: #2a2e36 transparent;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  /* Constrain width to prevent horizontal page stretch */
  max-width: 100%;
  width: 100%;
}

.correlation-scroll {
  display: flex;
  flex-direction: row;
  gap: 12px;
  padding: 12px;
  overflow-x: auto;
  overflow-y: auto;  /* Allow vertical scroll too */
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: #3a3f49 transparent;
  /* Critical: Constrain the scroll container */
  max-width: 100%;
  max-height: 450px;
}

.correlation-scroll::-webkit-scrollbar { height: 8px; }
.correlation-scroll::-webkit-scrollbar-track { background: transparent; }
.correlation-scroll::-webkit-scrollbar-thumb { background: #3a3f49; border-radius: 4px; }
.correlation-scroll::-webkit-scrollbar-thumb:hover { background: #4a5060; }

.correlation-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 120px;
  width: 100%;
  color: var(--muted);
  font-size: 13px;
  text-align: center;
  padding: 20px;
}

/* Domain Column — overflow visible so tooltips aren't clipped */
.correlation-column {
  flex: 0 0 auto;
  width: 200px;
  min-width: 180px;
  max-width: 240px;
  max-height: 420px;
  display: flex;
  flex-direction: column;
  background: #1e2228;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  transition: border-color var(--speed), box-shadow var(--speed);
}

.correlation-column:hover {
  border-color: #3a4050;
  box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}

.correlation-column.highlight {
  border-color: #60a5fa;
  box-shadow: 0 0 0 2px rgba(96,165,250,0.25);
}

/* Column Header */
.correlation-header {
  padding: 10px 12px;
  background: linear-gradient(135deg, #252a33 0%, #1e2228 100%);
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-radius: var(--radius) var(--radius) 0 0;
  overflow: hidden;
}

.correlation-domain {
  font-size: 13px;
  font-weight: 600;
  color: #e8eaef;
  word-break: break-all;
  line-height: 1.3;
}

.correlation-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.correlation-score {
  font-size: 12px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  background: #2a3040;
  color: #a0a8b8;
}

.correlation-favicon {
  width: 16px;
  height: 16px;
  margin-left: auto;
  border-radius: 3px;
  object-fit: contain;
  flex-shrink: 0;
}

.correlation-score.high { background: #1a3a2a; color: #6ad59d; }
.correlation-score.strong { background: #2a3a3a; color: #60c0c0; }
.correlation-score.weak { background: #3a3020; color: #d0a060; }
.correlation-score.reject { background: #3a2020; color: #e07070; }

.correlation-class {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}

.correlation-class.owned { color: #6ad59d; }
.correlation-class.probable { color: #60c0c0; }
.correlation-class.discontinued {
  background: #dc2626; color: #fff; font-size: 8px; font-weight: 600;
  padding: 0px 4px; border-radius: 2px; letter-spacing: 0;
  margin-left: 2px; line-height: 14px; vertical-align: middle;
}

/* Signals List */
.correlation-signals {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #3a3f49 transparent;
}

.correlation-signals::-webkit-scrollbar { width: 6px; }
.correlation-signals::-webkit-scrollbar-track { background: transparent; }
.correlation-signals::-webkit-scrollbar-thumb { background: #3a3f49; border-radius: 3px; }

/* Signal Chip */
.correlation-signal {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  background: #252a33;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 11px;
  color: #c0c4cc;
  transition: background-color var(--speed), border-color var(--speed), transform var(--speed), box-shadow var(--speed);
  cursor: pointer;
  user-select: none;
}

.correlation-signal:hover {
  background: #2a3040;
  border-color: #3a4050;
}

/* Shared signals - bright, clickable */
.correlation-signal.shared {
  background: #1a2a3a;
  border-color: #2a4a6a;
  color: #80b0e0;
  cursor: pointer;
}

.correlation-signal.shared:hover {
  background: #1d3345;
  border-color: #3a5a7a;
  color: #90c0f0;
}

/* Unique signals - muted/gray to show they contribute to score but aren't correlated */
.correlation-signal.unique {
  background: #1a1e24;
  border-color: #2a2e34;
  color: #6a7080;
  opacity: 0.75;
}

.correlation-signal.unique .signal-indicator {
  background: #4a5060;
  box-shadow: none;
}

.correlation-signal.unique:hover {
  opacity: 0.9;
  background: #1d2128;
  border-color: #2d3238;
}

/* Hover highlight (temporary, on hover) */
.correlation-signal.hover-highlight {
  background: #1a3a4a;
  border-color: #4a7aa0;
  color: #a0d0ff;
  box-shadow: 0 0 8px rgba(96,165,250,0.4);
}

/* Pinned highlight (persistent, on click) */
.correlation-signal.pinned {
  background: #1a3a4a;
  border-color: #60a5fa;
  color: #a0d0ff;
  transform: translateX(2px);
  box-shadow: 0 0 12px rgba(96,165,250,0.6);
}

.correlation-signal.pinned .signal-indicator {
  animation: pulse 1.5s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.7; transform: scale(1.2); }
}

.signal-indicator {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4a5060;
  flex-shrink: 0;
}

.correlation-signal.shared .signal-indicator {
  background: #60a5fa;
  box-shadow: 0 0 4px rgba(96,165,250,0.5);
}

.signal-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.signal-count {
  font-size: 10px;
  color: var(--muted);
  background: #1a1e24;
  padding: 2px 6px;
  border-radius: 999px;
}

/* Tooltip positioning for correlation signals — bottom-right, matching platform default */
.correlation-signal.has-tip:hover::after {
  min-width: 160px;
  max-width: 280px;
  text-align: left;
  font-size: 11.5px;
  line-height: 1.45;
}

.correlation-signal.shared .signal-count {
  background: rgba(0,0,0,0.3);
  color: inherit;
  opacity: 0.85;
}

/* No signals state */
.correlation-no-signals {
  padding: 12px;
  text-align: center;
  color: var(--muted);
  font-size: 11px;
  font-style: italic;
}

/* ── Crypto Flow Analysis Panel ──────────────────────────────────── */

/* Chain badge dots */
.chain-badge { display: inline-flex; width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; align-self: center; margin-right: 4px; }
.chain-badge.eth, .chain-badge.ethereum { background: #3b82f6; }
.chain-badge.btc, .chain-badge.bitcoin { background: #f97316; }
.chain-badge.sol, .chain-badge.solana { background: #a855f7; }
.chain-badge.tron { background: #e5484d; }
.chain-badge.ton { background: #22d3ee; }
.chain-badge.bsc { background: #f0b90b; }
.chain-badge.polygon, .chain-badge.matic { background: #8247e5; }
.chain-badge.arbitrum { background: #28a0f0; }
.chain-badge.optimism { background: #ff0420; }
.chain-badge.base { background: #0052ff; }
.chain-badge.multi { background: linear-gradient(135deg, #3b82f6, #f97316); }

/* Risk-inverted score bands (high risk = red, not green) */
.correlation-score.risk-low { background: #1a3a2a; color: #6ad59d; }
.correlation-score.risk-med { background: #2a3a3a; color: #60c0c0; }
.correlation-score.risk-high { background: #3a3020; color: #d0a060; }
.correlation-score.risk-critical { background: #3a2020; color: #e07070; }
.correlation-score.risk-none { background: #1e2128; color: #6a7080; }

/* In crypto address cards, signals section should not grow — let flow section take remaining space */
/* Crypto address grid: responsive grid, no horizontal scroll */
#cryptoFlowScroll { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); overflow-x: hidden; overflow-y: auto; }
#cryptoFlowScroll .correlation-column { width: auto; min-width: 0; max-width: none; }
#cryptoFlowScroll .correlation-signals { flex: 0 0 auto; }
/* Allow signal tooltips to escape card overflow */
#cryptoFlowScroll .crypto-signal.has-tip { position: relative; z-index: 1; }
#cryptoFlowScroll .crypto-signal.has-tip:hover { z-index: 999999; }

/* Crypto signal categories */
.crypto-signal .signal-indicator { background: #4a5060; }
.crypto-signal.cat-sanctions .signal-indicator { background: #e5484d; box-shadow: 0 0 4px rgba(229,72,77,0.5); }
.crypto-signal.cat-mixer .signal-indicator { background: #f97316; box-shadow: 0 0 4px rgba(249,115,22,0.5); }
.crypto-signal.cat-risk .signal-indicator { background: #d0a060; box-shadow: 0 0 4px rgba(208,160,96,0.4); }
.crypto-signal.cat-bridge .signal-indicator { background: #a855f7; box-shadow: 0 0 4px rgba(168,85,247,0.4); }
.crypto-signal.cat-exchange .signal-indicator { background: #22c55e; box-shadow: 0 0 4px rgba(34,197,94,0.4); }
.crypto-signal.cat-heuristic .signal-indicator { background: #60c0c0; box-shadow: 0 0 4px rgba(96,192,192,0.3); }
.crypto-signal.cat-compliance .signal-indicator { background: #e5484d; box-shadow: 0 0 4px rgba(229,72,77,0.5); }
.crypto-signal.cat-wallet_type .signal-indicator { background: #3b82f6; box-shadow: 0 0 4px rgba(59,130,246,0.4); }

/* Flow summary lines */
.crypto-flow-section { margin-top: 6px; padding: 6px 8px 0; border-top: 1px solid var(--line); flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #2a2e36 transparent; }
.crypto-flow-section-title { font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); margin-bottom: 4px; }
.crypto-flow-line { display: flex; gap: 6px; font-size: 11px; padding: 2px 0; color: #a0a8b8; align-items: center; }
.crypto-flow-line .flow-arrow { font-weight: 700; flex-shrink: 0; width: 14px; text-align: center; }
.crypto-flow-line .flow-arrow.inflow { color: #22c55e; }
.crypto-flow-line .flow-arrow.outflow { color: #e5484d; }
.crypto-flow-line .flow-addr { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: monospace; font-size: 10px; }
.crypto-flow-line .flow-amount { font-weight: 600; color: #c0c4cc; flex-shrink: 0; font-size: 10px; }
.crypto-flow-divider { border-top: 1px dotted var(--line); margin: 5px 0 3px; }

/* Seed column highlight */
.correlation-column.crypto-seed { border-color: #f97316; box-shadow: 0 0 0 2px rgba(249,115,22,0.25); }
.correlation-column.crypto-highlight { border-color: #60a5fa; box-shadow: 0 0 0 2px rgba(96,165,250,0.25); }

/* Crypto card — avatar and ENS */
.crypto-avatar-row { display: flex; justify-content: center; padding: 4px 0 2px; }
.crypto-avatar { width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--line); object-fit: cover; }
.crypto-ens-label { font-size: 11px; color: #60a5fa; font-weight: 500; margin-top: 1px; text-align: center; }
.crypto-addr-label { font-size: 11px; color: var(--text); margin-top: 1px; text-align: center; }
#cryptoFlowScroll .correlation-domain { text-align: center; }
#cryptoFlowScroll .correlation-header { min-height: 64px; justify-content: center; align-items: center; gap: 3px; }
#cryptoFlowScroll .correlation-score { align-self: center; }

/* Crypto address stats row */
.crypto-addr-stats { display: flex; gap: 10px; font-size: 11px; color: var(--muted); padding: 6px 12px; flex-wrap: wrap; }
.crypto-addr-stats .stat-item { display: flex; gap: 4px; align-items: center; }
.crypto-addr-stats .stat-value { color: var(--text); font-weight: 600; font-size: 12px; }

/* Case-level insights banner */
.crypto-insights-banner {
  display: flex; flex-direction: column; gap: 4px;
  padding: 8px 10px; margin: 0 12px 8px;
  background: #1a1e26; border: 1px solid var(--line); border-radius: 6px;
}
.crypto-insight-item {
  display: flex; align-items: center; gap: 6px;
  font-size: 11px; color: var(--text);
}
.crypto-insight-item .insight-icon { font-size: 13px; flex-shrink: 0; }
.crypto-insight-item .insight-text { flex: 1; }
.crypto-insight-item .insight-conf {
  font-size: 10px; color: var(--muted);
  background: rgba(255,255,255,0.05); padding: 1px 6px; border-radius: 3px;
}

/* Routing notes banner (exchange suppression, etc.) */
.crypto-routing-banner {
  display: flex; flex-direction: column; gap: 4px;
  padding: 8px 10px; margin: 0 12px 8px;
  background: rgba(245,158,11,0.08); border: 1px solid rgba(245,158,11,0.25); border-radius: 6px;
}
.crypto-routing-note {
  display: flex; align-items: flex-start; gap: 6px;
  font-size: 11px; color: #f59e0b; line-height: 1.4;
}
.crypto-routing-note .routing-icon { font-size: 13px; flex-shrink: 0; }
.crypto-routing-note .routing-text { flex: 1; color: var(--text); }

/* ── Crypto Timeline ─────────────────────────────────────────────────────── */
.crypto-timeline-list { display: flex; flex-direction: column; max-height: 420px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #2a2e36 transparent; }
.crypto-timeline-controls { display: flex; align-items: center; justify-content: space-between; padding: 4px 10px 6px; gap: 8px; }
.crypto-timeline-filters { display: flex; gap: 0; }
.crypto-timeline-filter {
  background: none; border: 1px solid var(--line); color: var(--muted); font-size: 10px;
  padding: 3px 10px; cursor: pointer; transition: all var(--speed);
}
.crypto-timeline-filter:first-child { border-radius: 4px 0 0 4px; }
.crypto-timeline-filter:last-child { border-radius: 0 4px 4px 0; }
.crypto-timeline-filter:not(:first-child) { margin-left: -1px; }
.crypto-timeline-filter:hover { color: var(--text); }
.crypto-timeline-filter.active { background: rgba(255,255,255,0.06); color: var(--text); border-color: var(--text); position: relative; z-index: 1; }
.crypto-timeline-sort { background: none; border: 1px solid var(--line); color: var(--muted); font-size: 10px; padding: 3px 8px; border-radius: 4px; cursor: pointer; transition: color var(--speed), border-color var(--speed); min-width: 120px; text-align: center; }
.crypto-timeline-sort:hover { color: var(--text); border-color: var(--text); }
.crypto-timeline-row {
  display: flex; align-items: center; gap: 6px; padding: 5px 10px;
  border-bottom: 1px solid var(--line); font-size: 12px; color: var(--text);
  transition: background var(--speed); min-height: 36px; box-sizing: border-box;
}
.crypto-timeline-row:hover { background: var(--panel-elev, #1e2128); }
.crypto-timeline-row.highlighted { background: rgba(59,130,246,0.08); border-left: 2px solid #3b82f6; }
.crypto-timeline-ts { flex: 0 0 120px; font-family: monospace; font-size: 11px; color: var(--muted); white-space: nowrap; }
.crypto-timeline-flow { display: flex; align-items: center; gap: 4px; flex: 1; min-width: 0; }
.crypto-timeline-addr {
  font-family: monospace; font-size: 11px; cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  max-width: 150px; transition: color var(--speed);
}
.crypto-timeline-addr:hover { color: #3b82f6; }
.crypto-timeline-addr.is-seed { color: #f97316; font-weight: 600; }
.crypto-timeline-amount { font-weight: 600; flex-shrink: 0; text-align: right; min-width: 60px; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; min-height: 26px; }
.crypto-timeline-native { font-size: 9px; font-weight: 400; color: var(--muted); }
.crypto-timeline-chain { flex-shrink: 0; }
.crypto-timeline-bridge { display: inline-block; font-size: 10px; padding: 1px 6px; border-radius: 3px; background: rgba(168,85,247,0.15); color: #a855f7; flex-shrink: 0; }
.crypto-timeline-type { display: inline-block; font-size: 10px; padding: 1px 6px; border-radius: 3px; flex-shrink: 0; background: rgba(255,255,255,0.05); color: var(--muted); }
.crypto-timeline-type.token { background: rgba(59,130,246,0.12); color: #60a5fa; }
.crypto-timeline-type.sanctions { background: rgba(229,72,77,0.15); color: #e5484d; }
.crypto-timeline-type.mixer { background: rgba(249,115,22,0.15); color: #f97316; }

/* ── Crypto Counterparties ───────────────────────────────────────────────── */
.crypto-counterparty-list { display: flex; flex-direction: column; max-height: 420px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #2a2e36 transparent; }
.crypto-counterparty-header {
  display: grid; grid-template-columns: 2fr 1fr 70px 70px 40px 60px 100px; gap: 6px;
  padding: 4px 10px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--muted); border-bottom: 1px solid var(--line); position: sticky; top: 0; background: var(--panel, #1a1d23); z-index: 1;
}
.crypto-counterparty-row {
  display: grid; grid-template-columns: 2fr 1fr 70px 70px 40px 60px 100px; gap: 6px;
  padding: 7px 10px; align-items: center; font-size: 12px;
  border-bottom: 1px solid var(--line); transition: background var(--speed);
  min-height: 38px; box-sizing: border-box;
}
.crypto-counterparty-row:hover { background: var(--panel-elev, #1e2128); }
.crypto-counterparty-row.highlighted { background: rgba(59,130,246,0.08); border-left: 2px solid #3b82f6; }
.crypto-cp-addr { font-family: monospace; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; transition: color var(--speed); display: flex; align-items: center; gap: 3px; }
.crypto-cp-addr:hover { color: #3b82f6; }
.crypto-cp-flag { display: inline-block; width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.crypto-cp-flag.sanctions { background: #e5484d; box-shadow: 0 0 4px rgba(229,72,77,0.5); }
.crypto-cp-flag.mixer { background: #f97316; box-shadow: 0 0 4px rgba(249,115,22,0.5); }
.crypto-cp-flag.risk { background: #d0a060; box-shadow: 0 0 4px rgba(208,160,96,0.4); }
.crypto-cp-label { font-size: 11px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crypto-cp-vol-in { font-size: 11px; color: #22c55e; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crypto-cp-vol-out { font-size: 11px; color: #e5484d; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crypto-cp-bar { height: 4px; border-radius: 2px; display: flex; overflow: hidden; background: #1a1d23; }
.crypto-cp-bar-in { background: #22c55e; }
.crypto-cp-bar-out { background: #e5484d; }

/* Counterparty tier badges (Stage 4) */
.crypto-cp-tier { display: inline-flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 700; width: 18px; height: 14px; border-radius: 3px; margin-right: 4px; letter-spacing: 0.02em; flex-shrink: 0; cursor: default; }
.crypto-cp-tier.t0 { background: rgba(234,179,8,0.18); color: #d4a017; }
.crypto-cp-tier.t1 { background: rgba(249,115,22,0.18); color: #f97316; }
.crypto-cp-tier.t2 { background: rgba(229,72,77,0.20); color: #e5484d; }
.crypto-cp-tier.skip { background: rgba(142,142,147,0.12); color: var(--muted); }

/* Entity-type badges (Stage 4) */
.crypto-cp-entity { display: inline-block; font-size: 9px; padding: 1px 5px; border-radius: 999px; margin-left: 4px; font-weight: 600; letter-spacing: 0.03em; vertical-align: middle; }
.crypto-cp-entity.et-exchange  { background: rgba(34,197,94,0.12); color: #22c55e; }
.crypto-cp-entity.et-mixer     { background: rgba(249,115,22,0.15); color: #f97316; }
.crypto-cp-entity.et-ransomware{ background: rgba(229,72,77,0.15); color: #e5484d; }
.crypto-cp-entity.et-protocol  { background: rgba(59,130,246,0.12); color: #3b82f6; }
.crypto-cp-entity.et-defi      { background: rgba(168,85,247,0.12); color: #a855f7; }

/* Score/investigate column (replaces bar when triage available) */
.crypto-cp-score-cell { display: flex; align-items: center; gap: 4px; }
.crypto-cp-score-wrap { flex: 1; height: 4px; background: rgba(255,255,255,0.06); border-radius: 2px; overflow: hidden; }
.crypto-cp-score-bar { display: block; height: 100%; background: #3b82f6; border-radius: 2px; }
.crypto-cp-investigate { background: transparent; border: 1px solid rgba(59,130,246,0.35); color: #3b82f6; border-radius: 3px; font-size: 10px; padding: 1px 4px; cursor: pointer; line-height: 1.2; flex-shrink: 0; transition: background 0.1s; }
.crypto-cp-investigate:hover { background: rgba(59,130,246,0.12); }

/* Flash animation for pre-filled seed input */
@keyframes prefilled-flash { 0% { outline: 2px solid rgba(59,130,246,0.8); } 100% { outline: 2px solid transparent; } }
.prefilled-flash { animation: prefilled-flash 1.2s ease-out forwards; }

/* ── Actions column (Stage 7) ────────────────────────────────────────────── */
.crypto-cp-actions { display: flex; align-items: center; gap: 3px; flex-wrap: nowrap; }
.crypto-ancestor-select { width: 13px; height: 13px; cursor: pointer; flex-shrink: 0; accent-color: var(--accent, #3b82f6); }
.crypto-trace-btn { font-size: 0.68rem; padding: 1px 5px; line-height: 1.4; opacity: 0.70; white-space: nowrap; }
.crypto-trace-btn:hover { opacity: 1; }

/* ── Trace result panel ──────────────────────────────────────────────────── */
.crypto-trace-panel {
  padding: 8px 16px 10px; background: var(--bg-alt, #141618);
  border-bottom: 1px solid var(--line); border-left: 2px solid #5b8def;
}
.crypto-trace-result { display: flex; flex-direction: column; gap: 6px; }
.trace-header { font-size: 0.72rem; color: var(--muted); }
.crypto-trace-hops { display: flex; align-items: flex-start; gap: 4px; flex-wrap: wrap; }
.trace-hop {
  border: 1px solid var(--line); border-radius: 6px; padding: 6px 8px 4px;
  font-size: 0.70rem; min-width: 76px; position: relative;
  background: var(--panel, #1a1d23);
}
.trace-hop.status-TERMINAL_ENTITY { border-color: #888; background: rgba(136,136,136,0.08); }
.trace-hop.status-DEAD_END { border-color: #e5484d; }
.trace-hop.status-DEPTH_LIMIT { border-color: #f97316; }
.trace-hop .depth-badge {
  position: absolute; top: -8px; left: 6px;
  background: var(--accent, #3b82f6); color: white;
  border-radius: 50%; width: 16px; height: 16px;
  font-size: 0.60rem; line-height: 16px; text-align: center; font-weight: 700;
}
.trace-hop-arrow { color: var(--muted); font-size: 1.1rem; align-self: center; }
.trace-hop .confidence-bar { height: 2px; background: #4caf50; border-radius: 1px; margin-top: 4px; }
.trace-footer { margin-top: 4px; }
.spinner-inline { display: inline-block; width: 12px; height: 12px; border: 2px solid rgba(255,255,255,0.15); border-top-color: var(--accent, #3b82f6); border-radius: 50%; animation: spin 0.7s linear infinite; vertical-align: middle; margin-right: 6px; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Common ancestor bar & result (Stage 7) ──────────────────────────────── */
#crypto-ancestor-bar {
  display: none; align-items: center; gap: 10px;
  padding: 7px 14px; margin: 6px 0;
  background: var(--panel, #1a1d23);
  border: 1px solid var(--accent, #3b82f6); border-radius: 6px;
  position: sticky; bottom: 6px; z-index: 5;
  font-size: 0.75rem;
}
.crypto-ancestor-count { color: var(--muted); }
.crypto-ancestor-result { padding: 10px 4px; display: flex; flex-direction: column; gap: 8px; }
.ancestor-result-header { font-size: 11px; color: var(--muted); margin-bottom: 4px; }
.convergence-point {
  border: 1px solid var(--line); border-radius: 7px;
  padding: 10px 12px; background: var(--panel, #1a1d23);
}
.convergence-point.score-high { border-color: #e5484d; border-width: 2px; }
.convergence-point.score-medium { border-color: #f97316; }
.sybil-signals { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px; }
.sybil-chip {
  font-size: 0.65rem; padding: 2px 7px; border-radius: 10px;
  background: rgba(249,115,22,0.12); color: #f97316;
  border: 1px solid rgba(249,115,22,0.25);
}

/* Crypto flow limit selector — compact inline dropdown */
.crypto-flow-limit-wrap { margin-left: auto; align-self: center; position: relative; margin-bottom: 2px; }
.crypto-flow-limit-wrap .select-wrap { display: inline-block; }
.crypto-flow-limit-wrap .select-display { height: 24px; padding: 2px 8px; font-size: 11px; border-radius: var(--radius); box-shadow: none; white-space: nowrap; min-width: 0; }
.crypto-flow-limit-wrap .select-display::after { width: 5px; height: 5px; margin-left: 4px; }
.crypto-flow-limit-wrap .select-menu { min-width: 80px; font-size: 11px; border-radius: var(--radius); }
.crypto-flow-limit-wrap .select-option { padding: 4px 8px; font-size: 11px; border-radius: var(--radius-sm, 4px); }

/* ── Crypto NFTs ─────────────────────────────────────────────────────────── */
.crypto-nft-grid {
  display: flex; flex-wrap: nowrap; gap: 12px;
  padding: 10px; max-height: 420px; overflow-x: auto; overflow-y: hidden;
  scrollbar-width: thin; scrollbar-color: #2a2e36 transparent;
}
.crypto-nft-card {
  flex: 0 0 180px; width: 180px;
  background: var(--panel-elev, #1e2128); border: 1px solid var(--line); border-radius: 8px;
  overflow: hidden; transition: border-color var(--speed), box-shadow var(--speed);
}
.crypto-nft-card:hover { border-color: #60a5fa; box-shadow: 0 0 0 1px rgba(96,165,250,0.2); }
.crypto-nft-img-wrap { width: 100%; aspect-ratio: 1; overflow: hidden; background: #12151a; }
.crypto-nft-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.crypto-nft-placeholder {
  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
  font-size: 14px; color: var(--muted); background: #1a1d23;
}
.crypto-nft-info { padding: 8px; }
.crypto-nft-title {
  font-size: 12px; font-weight: 600; color: var(--text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.crypto-nft-collection {
  font-size: 10px; color: #60a5fa; margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.crypto-nft-meta {
  font-size: 10px; color: var(--muted); margin-top: 3px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Protocol type pills in timeline */
.crypto-timeline-type.protocol { background: rgba(100,116,139,0.15); color: #94a3b8; }
.crypto-timeline-type.exchange { background: rgba(34,197,94,0.12); color: #22c55e; font-weight: 600; }

/* ══════════ Social Profiles Panel ══════════ */
#socialProfilePanel {
  max-height: 700px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: #2a2e36 transparent;
}
.social-profile-pane { padding: 10px 0; }
.social-username-group { margin-bottom: 20px; }
.social-username-group:last-child { margin-bottom: 0; }
/* Profile card rounding */
.social-username-group > .social-profile-card { border-radius: 12px; margin-bottom: 4px; }

/* ── Profile card (shared base) ── */
.social-profile-card {
  position: relative; overflow: hidden;
  padding: 0; margin-bottom: 2px;
  background: #16181c; border: 1px solid #2a2e36;
  border-radius: 12px 12px 0 0;
}
.social-profile-card-inner {
  padding: 0 16px 14px;
}
.social-profile-banner {
  width: 100%; height: 80px; object-fit: cover; display: block;
  background: linear-gradient(135deg, #1a1e24 0%, #1e2228 100%);
}
.social-profile-avatar-wrap {
  margin-top: -34px; margin-left: 0; position: relative; z-index: 1;
}
.social-profile-avatar {
  width: 68px; height: 68px; border-radius: 50%; object-fit: cover;
  border: 3px solid #16181c; background: #12151a;
}
.social-profile-avatar-placeholder {
  width: 68px; height: 68px; border-radius: 50%; background: #1a1d23;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; color: #71767b; border: 3px solid #16181c;
}
.social-profile-avatar--small {
  width: 40px; height: 40px; border-width: 0;
}
.social-profile-avatar-placeholder--small {
  width: 40px; height: 40px; border-width: 0; font-size: 16px;
}
.social-profile-name-row {
  display: flex; align-items: center; gap: 4px; margin: 8px 0 2px; flex-wrap: wrap;
}
.social-profile-displayname {
  font-size: 15px; font-weight: 700; color: #d0d3da;
}
.social-profile-username {
  font-size: 13px; color: #71767b;
}
.social-profile-verified {
  color: #1d9bf0; font-size: 15px; line-height: 1;
}
.social-profile-bio {
  font-size: 13px; color: #c0c3cc; line-height: 1.5; margin: 6px 0;
  white-space: pre-wrap; word-break: break-word;
}
.social-profile-meta-row {
  display: flex; align-items: center; gap: 12px; margin-top: 4px;
  font-size: 12px; color: #71767b; flex-wrap: wrap;
}
.social-profile-meta-row a {
  color: #1d9bf0; text-decoration: none;
}
.social-profile-meta-row a:hover { text-decoration: underline; }
.social-profile-stats {
  display: flex; gap: 16px; font-size: 13px; color: #71767b; margin-top: 10px;
}
.social-profile-stats strong { color: #d0d3da; font-weight: 600; }
/* Profile card external link icon — bottom-right, matches post ext-link */
.social-profile-ext-link {
  position: absolute; bottom: 10px; right: 10px; z-index: 2;
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 6px;
  border: 1px solid #2a2e36; color: #71767b;
  text-decoration: none; font-size: 13px;
  background: #16181c;
  transition: color var(--speed), border-color var(--speed), background var(--speed);
}
.social-profile-ext-link:hover {
  color: #d0d3da; border-color: #4a4e58; background: rgba(255,255,255,0.04);
}

/* Snapchat snapcode */
.social-profile-snapcode {
  width: 120px; height: 120px; border-radius: 8px; margin: 10px 0;
  background: #fffc00; padding: 4px;
}

/* ── Posts grid (2 columns, zig-zag: newest top-left → top-right → next row) ── */
.social-posts-grid {
  column-count: 2;
  column-gap: 8px;
  padding: 8px 0;
}
.social-posts-grid > * {
  break-inside: avoid;
  margin-bottom: 8px;
}
@media (max-width: 700px) {
  .social-posts-grid { column-count: 1; }
}

/* ── Post cards — platform-specific mock screenshots ── */

/* Twitter/X post card */
.social-post-card-twitter {
  background: #16181c; border: 1px solid #2a2e36; border-radius: 10px;
  padding: 12px 16px; overflow: hidden;
}
.social-post-twitter-header {
  display: flex; align-items: center; gap: 10px;
}
.social-post-twitter-header-text { flex: 1; min-width: 0; }
.social-post-twitter-author {
  display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
}
.social-post-twitter-name {
  font-size: 14px; font-weight: 700; color: #d0d3da;
}
.social-post-twitter-handle {
  font-size: 13px; color: #71767b;
}
.social-post-twitter-date {
  font-size: 13px; color: #71767b;
}
.social-post-twitter-body {
  font-size: 14px; color: #d0d3da; line-height: 1.5;
  white-space: pre-wrap; word-break: break-word;
  margin: 8px 0;
}
.social-post-twitter-metrics {
  display: flex; gap: 20px; margin-top: 8px; padding-top: 8px;
  border-top: 1px solid #2a2e36; font-size: 13px; color: #71767b;
}
.social-post-twitter-metric {
  display: flex; align-items: center; gap: 5px; cursor: default;
}
.social-post-twitter-metric .metric-icon { font-size: 15px; }
.social-post-twitter-metric .metric-icon-reply { color: #71767b; }
.social-post-twitter-metric .metric-icon-rt { color: #00ba7c; }
.social-post-twitter-metric .metric-icon-like { color: #f91880; }
.social-post-twitter-metric .metric-icon-view { color: #1d9bf0; }
.social-post-twitter-link {
  display: inline-block;
  font-size: 12px; color: #7ab3ff; text-decoration: none;
}
.social-post-twitter-link:hover { text-decoration: underline; }

/* TikTok post card */
.social-post-card-tiktok {
  background: #16181c; border: 1px solid #2a2e36; border-radius: 10px;
  padding: 12px 16px; overflow: hidden;
}
.social-post-tiktok-header {
  display: flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 600; color: #d0d3da; margin-bottom: 8px;
}
.social-post-tiktok-music-icon { color: #00f2ea; font-size: 16px; }
.social-post-tiktok-handle { color: #d0d3da; }
.social-post-tiktok-body {
  font-size: 14px; color: #d0d3da; line-height: 1.5;
  white-space: pre-wrap; word-break: break-word;
  margin-bottom: 10px;
}
.social-post-tiktok-metrics {
  display: flex; gap: 18px; font-size: 13px; color: #8a8b91;
  padding-top: 8px; border-top: 1px solid #2a2e36;
}
.social-post-tiktok-metric {
  display: flex; align-items: center; gap: 4px;
}
.social-post-tiktok-metric .metric-icon-play { color: #d0d3da; }
.social-post-tiktok-metric .metric-icon-like { color: #fe2c55; }
.social-post-tiktok-metric .metric-icon-comment { color: #8a8b91; }
.social-post-tiktok-metric .metric-icon-share { color: #8a8b91; }
.social-post-tiktok-link {
  display: inline-block;
  font-size: 12px; color: #7ab3ff; text-decoration: none;
}
.social-post-tiktok-link:hover { text-decoration: underline; }

/* Instagram post card */
.social-post-card-instagram {
  background: #16181c; border: 1px solid #2a2e36; border-radius: 10px;
  padding: 0; overflow: hidden;
}
.social-post-ig-header {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px; font-size: 13px;
}
.social-post-ig-header-username {
  font-weight: 600; color: #d0d3da;
}
.social-post-ig-header-dot { color: #71767b; }
.social-post-ig-header-time { color: #71767b; font-size: 12px; }
.social-post-ig-media-bar {
  padding: 6px 14px; background: #1a1d23;
  font-size: 12px; color: #71767b; border-top: 1px solid #2a2e36;
  border-bottom: 1px solid #2a2e36;
}
.social-post-ig-media {
  position: relative; width: 100%; max-height: 400px; overflow: hidden;
  background: #0d1117; border-top: 1px solid #2a2e36; border-bottom: 1px solid #2a2e36;
}
.social-post-ig-media img {
  width: 100%; height: auto; display: block; object-fit: cover; max-height: 400px;
}
.social-post-media-badge {
  position: absolute; top: 8px; right: 8px;
  font-size: 11px; color: #fff; background: rgba(0,0,0,0.6);
  padding: 2px 8px; border-radius: 4px; pointer-events: none;
}
.social-post-ig-footer {
  padding: 10px 14px;
}
.social-post-ig-likes {
  font-size: 13px; font-weight: 600; color: #d0d3da; margin-bottom: 4px;
}
.social-post-ig-caption {
  font-size: 13px; color: #d0d3da; line-height: 1.5;
  white-space: pre-wrap; word-break: break-word;
}
.social-post-ig-caption-user {
  font-weight: 600; color: #d0d3da; margin-right: 4px;
}
.social-post-ig-comments {
  font-size: 12px; color: #71767b; margin-top: 4px; cursor: default;
}
.social-post-ig-link {
  display: inline-block;
  font-size: 12px; color: #7ab3ff; text-decoration: none;
}
.social-post-ig-link:hover { text-decoration: underline; }

/* Threads post card */
.social-post-card-threads {
  background: #16181c; border: 1px solid #2a2e36; border-radius: 10px;
  padding: 12px 16px; margin-bottom: 2px;
}
.social-post-card-threads + .social-post-card-threads { border-top: none; }
.social-post-threads-header {
  display: flex; align-items: flex-start; gap: 10px;
}
.social-post-threads-header-text { flex: 1; min-width: 0; }
.social-post-threads-author {
  display: flex; align-items: center; gap: 6px;
}
.social-post-threads-username {
  font-size: 14px; font-weight: 600; color: #d0d3da;
}
.social-post-threads-time {
  font-size: 13px; color: #71767b;
}
.social-post-threads-body {
  font-size: 14px; color: #d0d3da; line-height: 1.5;
  white-space: pre-wrap; word-break: break-word;
  margin: 8px 0;
}
.social-post-threads-metrics {
  display: flex; gap: 18px; font-size: 13px; color: #71767b;
  padding-top: 8px; border-top: 1px solid #2a2e36;
}
.social-post-threads-metric {
  display: flex; align-items: center; gap: 4px;
}

/* No-posts message */
.social-posts-empty {
  font-size: 12px; color: #71767b; padding: 12px 16px; text-align: center;
  background: #16181c; border: 1px solid #2a2e36; border-top: none;
  border-radius: 0 0 12px 12px;
}

/* Fetch more control bar */
.social-fetch-bar {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 0; margin: 8px auto 0;
  width: fit-content;
}
.social-fetch-select { display: none; }
.social-fetch-bar .select-wrap { min-width: 160px; }
.social-fetch-bar .select-display {
  height: 28px !important; padding: 0 10px !important;
  font-size: 12px !important; border-radius: 6px !important;
}
.social-fetch-bar .select-display::after {
  width: 5px; height: 5px; border-width: 1.5px;
}
.social-fetch-bar .select-menu {
  font-size: 12px;
}
.social-fetch-bar .select-option {
  padding: 5px 10px;
}
.social-fetch-count {
  width: 50px; font-size: 12px; padding: 6px 10px; border-radius: 8px;
  background: #1a1d23; color: var(--text); border: 1px solid var(--line);
  text-align: center; font-family: inherit; height: auto; outline: none;
  -moz-appearance: textfield;
}
.social-fetch-count:focus { border-color: #4a4e58; }
.social-fetch-count::-webkit-outer-spin-button,
.social-fetch-count::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.social-fetch-btn { font-size: 11px !important; padding: 4px 14px !important; }
.social-fetch-status {
  font-size: 11px; color: var(--muted); margin-left: auto;
  transition: color 0.3s;
}

/* Per-post action buttons */
/* Actions row: comment button left, external link icon right */
.social-post-actions-row {
  display: flex; align-items: center; gap: 8px;
  padding: 4px;
}
/* External link icon button */
.social-post-ext-link {
  margin-left: auto; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 6px;
  border: 1px solid #2a2e36; color: #71767b;
  text-decoration: none; font-size: 13px;
  transition: color var(--speed), border-color var(--speed), background var(--speed);
}
.social-post-ext-link:hover {
  color: #d0d3da; border-color: #4a4e58; background: rgba(255,255,255,0.04);
}
/* Load comments button */
.social-post-action-btn {
  display: inline-flex; align-items: center; padding: 4px 10px; height: 26px;
  font-size: 11px; color: #71767b; background: none; border: 1px solid #2a2e36;
  border-radius: 6px; cursor: pointer; font-family: inherit;
  transition: color var(--speed), border-color var(--speed);
  margin: 0;
}
.social-post-action-btn:hover { color: #d0d3da; border-color: #4a4e58; }
.social-post-action-btn:disabled { opacity: 0.5; cursor: wait; }

/* Inline comments below posts */
.social-post-comments {
  margin-top: 8px; padding: 8px 0 0; border-top: 1px solid #2a2e36;
  max-height: 200px; overflow-y: auto;
  scrollbar-width: thin; scrollbar-color: #2a2e36 transparent;
}
.social-comment {
  padding: 4px 0; font-size: 12px; line-height: 1.5;
  border-bottom: 1px solid rgba(255,255,255,0.03);
}
.social-comment:last-child { border-bottom: none; }
.social-comment-author { font-weight: 600; color: #7ab3ff; margin-right: 4px; }
.social-comment-text { color: #c0c3cc; }

/* Platform-tinted profile cards */
.social-profile-card[data-platform="twitter"] { border-color: #2a2e36; }
.social-profile-card[data-platform="tiktok"] { border-color: #2a2e36; }
.social-profile-card[data-platform="instagram"] { border-color: #2a2e36; }
.social-profile-card[data-platform="threads"] { border-color: #2a2e36; }
.social-profile-card[data-platform="snapchat"] { border-color: #2a2e36; }

/* ── Universal post card (social-scrape generic renderer) ── */
.social-post-card-universal {
  background: #16181c; border: 1px solid #2a2e36; border-radius: 10px;
  padding: 12px 16px; overflow: hidden; position: relative;
}
.social-universal-header {
  display: flex; align-items: center; gap: 6px; margin-bottom: 6px;
}
.social-universal-title {
  font-size: 14px; font-weight: 600; color: #d0d3da; margin-bottom: 4px;
  line-height: 1.4;
}
.social-universal-body {
  font-size: 13px; color: #c0c3cc; white-space: pre-wrap; word-break: break-word;
  line-height: 1.5; margin-bottom: 8px;
}
.social-universal-media {
  width: 100%; max-height: 300px; object-fit: cover; border-radius: 8px;
  margin: 8px 0;
}
/* Video thumbnail with download overlay */
.social-video-thumb {
  position: relative; aspect-ratio: 16/9; overflow: hidden; border-radius: 8px;
  margin: 4px 0 8px; background: #0a0b0d;
}
.social-video-thumb img {
  width: 100%; height: 100%; object-fit: cover;
}
.social-video-download-btn {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(0, 0, 0, 0.7); color: #fff; border: 2px solid rgba(255,255,255,0.5);
  font-size: 18px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s, transform 0.15s;
}
.social-video-download-btn:hover {
  background: rgba(91, 141, 239, 0.85); border-color: #5b8def;
  transform: translate(-50%, -50%) scale(1.1);
}
.social-video-comments-row {
  display: flex; align-items: center; gap: 6px; margin-top: 6px;
  cursor: pointer;
}
.social-video-comments-cb {
  width: 16px; height: 16px; accent-color: #c0c3cc; cursor: pointer;
}
.social-video-bulk-controls {
  display: flex; align-items: center; gap: 8px; margin-top: 8px;
}
.social-video-bulk-controls input[type="number"] {
  width: 42px; padding: 2px 4px; border-radius: 4px;
  background: #1e2028; border: 1px solid #2a2e36; color: var(--text); font-size: 11px;
  text-align: center; -moz-appearance: textfield;
}
.social-video-bulk-controls input[type="number"]::-webkit-inner-spin-button,
.social-video-bulk-controls input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none; margin: 0;
}
.social-video-bulk-controls .btn.tiny { font-size: 11px; padding: 3px 10px; }
.social-universal-metrics {
  display: flex; gap: 12px; font-size: 12px; color: #71767b; margin-top: 8px;
}
.social-universal-metric {
  display: flex; align-items: center; gap: 3px;
}
.social-universal-tags {
  display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px;
}
.social-universal-tag {
  font-size: 11px; padding: 2px 8px; background: rgba(91,141,239,0.12);
  color: #5b8def; border-radius: 10px;
}
.social-universal-tech {
  margin-top: 6px; padding-top: 6px; border-top: 1px solid #2a2e36;
}

/* Social Profiles tab bar — wrapping + compact for 77+ platforms */
#socialProfileTabs {
  flex-wrap: wrap; max-height: 180px; overflow-y: auto;
  scrollbar-width: thin; scrollbar-color: #2a2e36 transparent;
}
#socialProfileTabs .nri-tab {
  padding: 5px 12px; font-size: 12px; white-space: nowrap;
}

/* Platform search input */
.social-platform-search {
  width: 100%; padding: 6px 10px; font-size: 12px; font-family: inherit;
  background: var(--bg-block); border: 1px solid var(--line); border-radius: 6px;
  color: var(--text); margin-bottom: 6px; outline: none;
}
.social-platform-search:focus { border-color: #4a4e58; }
.social-platform-search::placeholder { color: #71767b; }

/* Probe-only tab styling */
.social-probe-tab { opacity: 0.6; font-style: italic; }
/* Tab-level dim only fires when EVERY profile on the tab is AI-flagged
   (NO_MATCH or UNCERTAIN). Mixed tabs stay bright; per-card corner badges
   (below) mark the flagged profiles inside. */
.social-fp-dimmed { color: var(--line) !important; border-bottom-color: transparent !important; }
.social-fp-dimmed.active { border-bottom-color: var(--line) !important; }
.social-fp-dimmed-soft { color: #555 !important; border-bottom-color: transparent !important; }
.social-fp-dimmed-soft.active { border-bottom-color: #555 !important; }
/* Corner "FP" badge on individual profile cards. Anchored top-right,
   high-contrast so it reads at a glance even when the tab is not dimmed. */
.social-profile-card { position: relative; }
.social-fp-corner-badge {
  position: absolute; top: 8px; right: 8px; z-index: 3;
  padding: 2px 6px; border-radius: 4px;
  background: rgba(236, 72, 100, 0.22);
  color: #f4b8c3; border: 1px solid rgba(236, 72, 100, 0.45);
  font-size: 10px; font-weight: 600; letter-spacing: 0.04em;
  pointer-events: auto; cursor: help;
}
.social-fp-corner-badge-soft {
  background: rgba(234, 180, 60, 0.18);
  color: #f0d093; border-color: rgba(234, 180, 60, 0.45);
}
.social-fp-toggle { flex-shrink: 0; }
.social-search-row {
  display: flex; align-items: center; gap: 8px; margin-bottom: 6px;
}
.social-search-row .social-platform-search {
  flex: 1; min-width: 0; margin-bottom: 0;
}
.social-search-row .social-fp-toggle {
  height: 28px; display: inline-flex; align-items: center;
}
.media-fp-dimmed { opacity: 0.25 !important; }
.media-fp-dimmed-soft { opacity: 0.45 !important; }

/* Probe card */
.social-probe-card { border-left: 3px solid #eab43c; }
.social-enrich-btn { background: #2a4a7f; color: #d0d3da; }
.social-enrich-btn:hover { background: #3a5a9f; }

/* Discovery signals now use same chip style as other signals */

/* Unscored domains section */
.correlation-unscored {
  padding-top: 8px;
  border-left: 1px dashed var(--line);
  display: flex;
  flex-direction: column;
  min-width: 180px;
  flex: 1 0 auto;
  align-self: stretch;
}
/* When unscored is the only child, fill the panel and use a readable list layout */
.correlation-scroll > .correlation-unscored:first-child:last-child {
  border-left: none;
  width: 100%;
  min-width: 0;
}
.correlation-scroll > .correlation-unscored:first-child:last-child .correlation-unscored-list {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 80px;
  max-height: 300px;
}

.correlation-unscored-title {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 4px 12px;
  margin-bottom: 4px;
}

.correlation-unscored-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 0 12px 12px;
  flex: 1 1 0;
  overflow-y: auto;
}

.correlation-unscored-item {
  font-size: 11px;
  color: #808890;
  background: #1a1e24;
  padding: 4px 8px;
  border-radius: 6px;
  border: 1px solid #2a2e36;
}
/* Unscored tooltips render above to avoid clipping at panel bottom */
.correlation-unscored-item.has-tip:hover::after {
  top: auto; bottom: calc(100% + 8px);
}
.correlation-unscored-item.has-tip:hover::before {
  top: auto; bottom: 100%;
  transform: translateY(0) rotate(225deg);
}
.correlation-unscored-title.has-tip:hover::after {
  top: auto; bottom: calc(100% + 8px);
  min-width: 200px; max-width: 320px;
}
.correlation-unscored-title.has-tip:hover::before {
  top: auto; bottom: 100%;
  transform: translateY(0) rotate(225deg);
}
button.unscored-show-more {
  font-family: inherit;
  font-style: italic;
  color: #a0a8b4;
  background: #1a1e24;
  border-color: #3a3f48;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
button.unscored-show-more:hover {
  background: #252a32;
  color: #c8cdd4;
}

/* Signal Categories - Color coded indicators */
.correlation-signal.cat-whois .signal-indicator {
  background: #f0b040;
  box-shadow: 0 0 4px rgba(240,176,64,0.5);
}
.correlation-signal.cat-whois.shared .signal-indicator {
  background: #ffc060;
  box-shadow: 0 0 6px rgba(255,192,96,0.6);
}

.correlation-signal.cat-identity .signal-indicator {
  background: #a080f0;
  box-shadow: 0 0 4px rgba(160,128,240,0.5);
}
.correlation-signal.cat-identity.shared .signal-indicator {
  background: #c0a0ff;
  box-shadow: 0 0 6px rgba(192,160,255,0.6);
}

.correlation-signal.cat-tracking .signal-indicator {
  background: #60c080;
  box-shadow: 0 0 4px rgba(96,192,128,0.5);
}
.correlation-signal.cat-tracking.shared .signal-indicator {
  background: #80e0a0;
  box-shadow: 0 0 6px rgba(128,224,160,0.6);
}

/* IP / Hosting Signals (BLUE) */
.correlation-signal.cat-ip .signal-indicator {
  background: #60a5fa;
  box-shadow: 0 0 4px rgba(96,165,250,0.5);
}
.correlation-signal.cat-ip.shared .signal-indicator {
  background: #80c0ff;
  box-shadow: 0 0 6px rgba(128,192,255,0.6);
}
.correlation-signal.cat-ip.shared {
  background: #1a2535;
  border-color: #2a4060;
  color: #a0c8ff;
}
.correlation-signal.cat-ip.hover-highlight,
.correlation-signal.cat-ip.pinned {
  background: #1a3050;
  border-color: #60a5fa;
  color: #b0d8ff;
  box-shadow: 0 0 12px rgba(96,165,250,0.5);
}

/* Nameserver Signals (TEAL) */
.correlation-signal.cat-nameserver .signal-indicator {
  background: #20c0c0;
  box-shadow: 0 0 4px rgba(32,192,192,0.5);
}
.correlation-signal.cat-nameserver.shared .signal-indicator {
  background: #40e0e0;
  box-shadow: 0 0 6px rgba(64,224,224,0.6);
}
.correlation-signal.cat-nameserver.shared {
  background: #162828;
  border-color: #204848;
  color: #80e0e0;
}
.correlation-signal.cat-nameserver.hover-highlight,
.correlation-signal.cat-nameserver.pinned {
  background: #1a3838;
  border-color: #20c0c0;
  color: #90f0f0;
  box-shadow: 0 0 12px rgba(32,192,192,0.5);
}

/* Mail/MX Signals (INDIGO) */
.correlation-signal.cat-mail .signal-indicator {
  background: #8080f0;
  box-shadow: 0 0 4px rgba(128,128,240,0.5);
}
.correlation-signal.cat-mail.shared .signal-indicator {
  background: #a0a0ff;
  box-shadow: 0 0 6px rgba(160,160,255,0.6);
}
.correlation-signal.cat-mail.shared {
  background: #202030;
  border-color: #303050;
  color: #b0b0f0;
}
.correlation-signal.cat-mail.hover-highlight,
.correlation-signal.cat-mail.pinned {
  background: #282848;
  border-color: #8080f0;
  color: #c0c0ff;
  box-shadow: 0 0 12px rgba(128,128,240,0.5);
}

/* DNS Zone Signals (SLATE BLUE) */
.correlation-signal.cat-dns .signal-indicator {
  background: #80a0b8;
  box-shadow: 0 0 4px rgba(128,160,184,0.5);
}
.correlation-signal.cat-dns.shared .signal-indicator {
  background: #a0c0d8;
  box-shadow: 0 0 6px rgba(160,192,216,0.6);
}
.correlation-signal.cat-dns.shared {
  background: #1a2230;
  border-color: #2a3848;
  color: #b0c8d8;
}
.correlation-signal.cat-dns.hover-highlight,
.correlation-signal.cat-dns.pinned {
  background: #202838;
  border-color: #80a0b8;
  color: #c0d8e8;
  box-shadow: 0 0 12px rgba(128,160,184,0.5);
}

/* SSL Certificate Signals (SKY BLUE) */
.correlation-signal.cat-ssl .signal-indicator {
  background: #50c0e0;
  box-shadow: 0 0 4px rgba(80,192,224,0.5);
}
.correlation-signal.cat-ssl.shared .signal-indicator {
  background: #70e0ff;
  box-shadow: 0 0 6px rgba(112,224,255,0.7);
}
.correlation-signal.cat-ssl.shared {
  background: #182a35;
  border-color: #2a5568;
  color: #a0e8ff;
}
.correlation-signal.cat-ssl.hover-highlight,
.correlation-signal.cat-ssl.pinned {
  background: #1c3548;
  border-color: #50c0e0;
  color: #b8f0ff;
  box-shadow: 0 0 12px rgba(80,192,224,0.6);
}

.correlation-signal.cat-contact .signal-indicator {
  background: #e07090;
  box-shadow: 0 0 4px rgba(224,112,144,0.5);
}
.correlation-signal.cat-contact.shared .signal-indicator {
  background: #f090b0;
  box-shadow: 0 0 6px rgba(240,144,176,0.6);
}

.correlation-signal.cat-registration .signal-indicator {
  background: #80c0c0;
  box-shadow: 0 0 4px rgba(128,192,192,0.5);
}
.correlation-signal.cat-registration.shared .signal-indicator {
  background: #a0e0e0;
  box-shadow: 0 0 6px rgba(160,224,224,0.6);
}

.correlation-signal.cat-content .signal-indicator {
  background: #a0a8b0;
  box-shadow: 0 0 4px rgba(160,168,176,0.5);
}

/* Signal value - not displayed inline, only in tooltip */
.signal-value {
  display: none;
}

/* Seed signal styling */
.correlation-signal.seed {
  background: #1a2a1a;
  border-color: #2a4a2a;
  color: #a8d8a8;
  opacity: 1;
}

.correlation-signal.seed .signal-indicator {
  background: #70d070;
  box-shadow: 0 0 4px rgba(112,208,112,0.5);
}

/* Enhanced category backgrounds for better visual grouping */
.correlation-signal.cat-whois.shared {
  background: #2a2620;
  border-color: #4a3820;
  color: #e0c080;
}
.correlation-signal.cat-whois.hover-highlight {
  background: #352c24;
  border-color: #6a5020;
  color: #f0d090;
  box-shadow: 0 0 12px rgba(240,176,64,0.5);
}
/* Historical signals — styled identically to other signals in their category. */
.correlation-signal.cat-whois.pinned {
  background: #3a3020;
  border-color: #f0b040;
  color: #ffe0a0;
  box-shadow: 0 0 16px rgba(240,176,64,0.6);
}

.correlation-signal.cat-identity.shared {
  background: #252030;
  border-color: #3a2850;
  color: #c0a0f0;
}
.correlation-signal.cat-identity.hover-highlight,
.correlation-signal.cat-identity.pinned {
  background: #2a2540;
  border-color: #a080f0;
  color: #d0b0ff;
  box-shadow: 0 0 12px rgba(160,128,240,0.5);
}

.correlation-signal.cat-tracking.shared {
  background: #1a2620;
  border-color: #2a3a28;
  color: #90d0a0;
}
.correlation-signal.cat-tracking.hover-highlight,
.correlation-signal.cat-tracking.pinned {
  background: #1a2e20;
  border-color: #60c080;
  color: #a0e0b0;
  box-shadow: 0 0 12px rgba(96,192,128,0.5);
}

/* Kinship category — EMERALD GREEN (primary family relationship type) */
.correlation-signal.cat-kinship .signal-indicator {
  background: #4caf7d;
  box-shadow: 0 0 4px rgba(76,175,125,0.5);
}
.correlation-signal.cat-kinship.shared .signal-indicator {
  background: #6dd49a;
  box-shadow: 0 0 6px rgba(109,212,154,0.6);
}
.correlation-signal.cat-kinship.shared {
  background: #162818;
  border-color: #264830;
  color: #88d8a8;
}
.correlation-signal.cat-kinship.hover-highlight,
.correlation-signal.cat-kinship.pinned {
  background: #1a3020;
  border-color: #4caf7d;
  color: #a0f0c0;
  box-shadow: 0 0 12px rgba(76,175,125,0.5);
}

.correlation-signal.cat-contact.shared {
  background: #261a22;
  border-color: #3a2830;
  color: #f0a0b8;
}
.correlation-signal.cat-contact.hover-highlight,
.correlation-signal.cat-contact.pinned {
  background: #2e2028;
  border-color: #e07090;
  color: #f8b8cc;
  box-shadow: 0 0 12px rgba(224,112,144,0.5);
}

.correlation-signal.cat-registration.shared {
  background: #1a2626;
  border-color: #2a3838;
  color: #90d0d0;
}
.correlation-signal.cat-registration.hover-highlight,
.correlation-signal.cat-registration.pinned {
  background: #1a2e2e;
  border-color: #80c0c0;
  color: #a0e0e0;
  box-shadow: 0 0 12px rgba(128,192,192,0.5);
}

/* Discovery signals - Orange */
.correlation-signal.cat-discovery .signal-indicator {
  background: #f08040;
  box-shadow: 0 0 6px rgba(240,128,64,0.6);
}
.correlation-signal.cat-discovery.shared {
  background: #2a2218;
  border-color: #4a3420;
  color: #f0a060;
}
.correlation-signal.cat-discovery.hover-highlight,
.correlation-signal.cat-discovery.pinned {
  background: #322818;
  border-color: #f08040;
  color: #ffb080;
  box-shadow: 0 0 12px rgba(240,128,64,0.5);
}

/* Content signals (WARM GRAY) */
.correlation-signal.cat-content.shared {
  background: #1e2228;
  border-color: #303840;
  color: #b8c4d0;
}
.correlation-signal.cat-content.shared .signal-indicator {
  background: #b0bcc8;
  box-shadow: 0 0 4px rgba(176,188,200,0.5);
}
.correlation-signal.cat-content.hover-highlight,
.correlation-signal.cat-content.pinned {
  background: #242a32;
  border-color: #a0aab4;
  color: #d0d8e0;
  box-shadow: 0 0 12px rgba(160,170,180,0.5);
}

/* Other / uncategorized signals (SLATE) */
.correlation-signal.cat-other .signal-indicator {
  background: #607080;
  box-shadow: 0 0 4px rgba(96,112,128,0.4);
}
.correlation-signal.cat-other.shared {
  background: #1c2028;
  border-color: #2c3038;
  color: #a0a8b0;
}
.correlation-signal.cat-other.hover-highlight,
.correlation-signal.cat-other.pinned {
  background: #242830;
  border-color: #607080;
  color: #b0b8c0;
  box-shadow: 0 0 12px rgba(96,112,128,0.4);
}

/* Artifacts section within correlation columns */
.correlation-artifacts {
  border-top: 1px dashed var(--line);
  padding: 8px;
  background: rgba(0,0,0,0.15);
  margin-top: auto; /* Push to bottom of column */
  border-radius: 0 0 var(--radius) var(--radius);
}

.correlation-artifacts-header {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin-bottom: 6px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  transition: color 0.15s ease;
}

.correlation-artifacts-header:hover {
  color: var(--text);
}

.correlation-artifacts-header .caret-icon {
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.correlation-artifacts:not(.collapsed) .caret-icon {
  transform: rotate(90deg);
}

.correlation-artifacts.collapsed .correlation-artifacts-list {
  display: none;
}

.correlation-artifacts:not(.collapsed) .correlation-artifacts-header {
  margin-bottom: 6px;
}

.correlation-artifacts.collapsed .correlation-artifacts-header {
  margin-bottom: 0;
}

.correlation-artifacts-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 150px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #3a3f49 transparent;
}

.correlation-artifacts-list::-webkit-scrollbar { width: 5px; }
.correlation-artifacts-list::-webkit-scrollbar-track { background: transparent; }
.correlation-artifacts-list::-webkit-scrollbar-thumb { background: #3a3f49; border-radius: 3px; }

.correlation-artifact-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 6px;
  background: #1a1e24;
  border-radius: 6px;
  font-size: 10px;
  overflow: hidden;
}

/* Shared/correlated artifacts get a subtle blue-tinted background */
.correlation-artifact-item.shared {
  background: #161e28;
  border-left: 2px solid #3a5a7a;
}

.correlation-artifact-item .artifact-type {
  color: #808890;
  flex-shrink: 0;
  min-width: 40px;
  max-width: 80px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-transform: capitalize;
  font-size: 9px;
  font-weight: 500;
}
.correlation-artifact-item.shared .artifact-type {
  color: #90a8c0;
}

.correlation-artifact-item .artifact-value {
  color: #b0b8c0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Code', monospace;
  font-size: 10px;
}
.correlation-artifact-item.shared .artifact-value {
  color: #c0d0e0;
}

.correlation-artifact-more {
  font-size: 10px;
  color: var(--muted);
  font-style: italic;
  text-align: center;
  padding: 4px;
}

/* Total artifacts count — always shown at bottom of expand section */
.correlation-artifact-total {
  font-size: 10px;
  color: #708090;
  text-align: center;
  padding: 6px 4px 2px;
  border-top: 1px dashed rgba(255,255,255,0.06);
  margin-top: 4px;
  font-weight: 500;
  letter-spacing: 0.02em;
}

/* Tooltips in correlation artifacts area — render ABOVE to avoid clipping off bottom */
.correlation-artifacts-header.has-tip:hover::after,
.correlation-artifact-item.has-tip:hover::after,
.correlation-artifact-total.has-tip:hover::after {
  top: auto;
  bottom: calc(100% + 8px);
  min-width: 140px;
  max-width: 280px;
  font-size: 11px;
  line-height: 1.45;
}
.correlation-artifacts-header.has-tip:hover::before,
.correlation-artifact-item.has-tip:hover::before,
.correlation-artifact-total.has-tip:hover::before {
  top: auto;
  bottom: 100%;
  transform: translateY(0) rotate(225deg);
}

/* ── Correlation Analysis: Relatives ────────────────────────────────────── */

/* Relative correlation — level text colors (reuse .correlation-class structure) */
#relativeCorrelation .correlation-class.close   { color: #6ad59d; } /* green — mirrors 'owned' */
#relativeCorrelation .correlation-class.extended { color: #60c0c0; } /* teal — mirrors 'probable' */
#relativeCorrelation .correlation-class.spouse   { color: #60a5fa; } /* blue — confirmed spouse */
/* .distant falls through to default var(--muted) — intentionally dimmed */

/* Distant relatives compact section: override score badge to use correlation-score styles */
.relative-distant-row .correlation-score {
  font-size: 11px;
  padding: 1px 5px;
}

/* Distant relatives compact section — mirrors .correlation-unscored containment */
.relative-distant-section {
  padding-top: 8px;
  border-left: 1px dashed var(--line);
  display: flex;
  flex-direction: column;
  min-width: 220px;
  align-self: stretch;
}
.relative-distant-title {
  font-size: 11px; font-weight: 600; color: var(--muted);
  text-transform: uppercase; letter-spacing: 0.05em;
  padding: 4px 12px 6px;
}
.relative-distant-list {
  flex: 1 1 0;
  overflow-y: auto;
  padding: 0 12px 12px;
}
.relative-distant-row {
  display: flex; align-items: center; gap: 8px;
  padding: 3px 0; font-size: 12px; color: var(--text);
  border-bottom: 1px solid #1e2228;
}
.relative-distant-row:last-of-type { border-bottom: none; }
.relative-distant-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.relative-distant-score { flex-shrink: 0; }
.relative-distant-year {
  font-size: 11px; color: var(--muted); flex-shrink: 0;
}
.relative-distant-more {
  margin-top: 6px; padding: 4px 0; font-size: 12px; color: var(--muted);
  cursor: pointer; background: none; border: none; font-family: inherit;
  width: 100%; text-align: left;
}
.relative-distant-more:hover { color: var(--text); }

/* ── Correlation Matrix Views ─────────────────────────────────────────── */
/* View toggle bar (Columns | Matrix) */
.corr-view-tabs {
  display: flex; align-items: center; gap: 0;
  border-bottom: 1px solid var(--line); margin: 0 0 0 0; padding: 0 12px;
}
.corr-view-tab {
  background: none; border: none; padding: 7px 18px; font-size: 13px;
  color: var(--muted); cursor: pointer; border-bottom: 2px solid transparent;
  font-family: inherit; transition: color var(--speed), border-color var(--speed);
}
.corr-view-tab:hover { color: var(--text); }
.corr-view-tab.active { color: var(--text); border-bottom-color: var(--text); }

/* Matrix content container */
.corr-matrix-content {
  padding: 12px; overflow: auto; max-height: 460px;
}

/* ── Domain Signal Matrix ── */
.corr-signal-matrix { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 11px; }
.corr-signal-matrix thead th {
  position: sticky; top: 0; background: #1e2228; z-index: 3;
  padding: 6px 0; font-weight: 600; color: var(--text);
  border-bottom: 2px solid var(--line); vertical-align: bottom;
  width: 32px; min-width: 32px; max-width: 32px;
  text-align: center;
}
.corr-signal-matrix .col-header {
  writing-mode: vertical-rl; transform: rotate(180deg);
  display: inline-block; max-height: 140px;
  overflow: hidden; text-overflow: ellipsis;
  font-size: 10px; white-space: nowrap;
  line-height: 1.2;
}
.corr-signal-matrix td {
  padding: 4px 0; text-align: center; border-bottom: 1px solid #2a2e34;
  width: 32px; min-width: 32px; max-width: 32px;
}
.corr-signal-matrix .row-label {
  text-align: left; padding-left: 8px; white-space: nowrap;
  max-width: 180px; overflow: hidden; text-overflow: ellipsis;
  position: sticky; left: 0; background: #1e2228; z-index: 1;
  font-weight: 500;
}
/* Corner cell needs highest z-index (sticky both ways) */
.corr-signal-matrix thead th:first-child {
  z-index: 4; left: 0; position: sticky;
  width: auto; min-width: 140px; max-width: none;
  text-align: left;
}
/* Row-label cells need auto width too */
.corr-signal-matrix td:first-child {
  width: auto; min-width: 140px; max-width: 180px;
}
.corr-signal-matrix .cell-present { color: #6ad59d; font-size: 14px; }
.corr-signal-matrix .cell-empty { color: #2a2e34; }
.corr-signal-matrix tr.row-highlight td { background: rgba(96,165,250,0.08); }

/* ── Relative Compact Table ── */
.corr-compact-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12px; }
.corr-compact-table thead th {
  position: sticky; top: 0; background: #1e2228; z-index: 2;
  padding: 8px 6px; text-align: left; font-weight: 600;
  border-bottom: 2px solid var(--line); cursor: pointer;
  user-select: none; color: var(--text); white-space: nowrap;
}
/* Cover the 12px container padding above the sticky header so rows don't clip through */
.corr-compact-table thead th::before {
  content: ''; position: absolute; top: -12px; left: 0; right: 0; height: 12px;
  background: var(--panel, #1a1d23);
}
.corr-compact-table thead th:hover { color: #60a5fa; }
.corr-compact-table .sort-arrow { font-size: 9px; margin-left: 4px; opacity: 0.5; }
.corr-compact-table thead th.sorted .sort-arrow { opacity: 1; color: #60a5fa; }
.corr-compact-table td {
  padding: 6px; border-bottom: 1px solid #2a2e34; color: #c0c8d4;
}
.corr-compact-table tr:hover td { background: #252a33; }
.corr-compact-table .conf-high { color: #6ad59d; }
.corr-compact-table .conf-med { color: #60c0c0; }
.corr-compact-table .conf-low { color: #d0a060; }
.corr-compact-table .level-spouse { color: #f472b6; }
.corr-compact-table .level-close { color: #6ad59d; }
.corr-compact-table .level-extended { color: #60c0c0; }
.corr-compact-table .level-distant { color: #d0a060; opacity: 0.7; }
.corr-compact-table .shared-data { font-size: 11px; color: var(--muted); max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── Association Matrix (OSINT triangular link matrix) ────────────────── */
.assoc-matrix { border-collapse: separate; border-spacing: 0; font-size: 11px; }

/* Column headers — rotated text */
.assoc-matrix thead th {
  position: sticky; top: 0; background: #1e2228; z-index: 3;
  padding: 4px 0; width: 24px; min-width: 24px; max-width: 24px;
  text-align: center; border-bottom: 2px solid var(--line); vertical-align: bottom;
}
.assoc-matrix .col-header {
  writing-mode: vertical-rl; transform: rotate(180deg);
  display: inline-block; max-height: 120px;
  overflow: hidden; text-overflow: ellipsis;
  font-size: 10px; white-space: nowrap; line-height: 1.2;
}

/* Row labels — sticky left */
.assoc-matrix .row-label {
  position: sticky; left: 0; background: #1e2228; z-index: 1;
  text-align: right; padding-right: 8px; white-space: nowrap;
  max-width: 140px; overflow: hidden; text-overflow: ellipsis;
  font-weight: 500; font-size: 10px; border-right: 2px solid var(--line);
}

/* Corner cell — sticky both axes */
.assoc-matrix thead th.corner-cell {
  position: sticky; left: 0; top: 0; z-index: 5; background: #1e2228;
  width: auto; min-width: 140px; max-width: none; border-right: 2px solid var(--line);
}

/* Data cells */
.assoc-matrix td {
  width: 24px; min-width: 24px; max-width: 24px; height: 24px;
  text-align: center; vertical-align: middle;
  border-bottom: 1px solid #2a2e34; border-right: 1px solid #2a2e34;
  font-size: 14px; cursor: default; padding: 0;
}
.assoc-matrix .diag-cell { background: #252a33; font-size: 9px; font-weight: 600; }
.assoc-matrix .upper-cell { visibility: hidden; }
.assoc-matrix .conn-confirmed { color: #6ad59d; }
.assoc-matrix .conn-suspected { color: #60c0c0; }
.assoc-matrix .conn-empty { color: transparent; }

/* Connection count column — sticky right so it never clips */
.assoc-matrix .conn-count {
  position: sticky; right: 0; z-index: 1; background: #1e2228;
  width: 32px; min-width: 32px; font-size: 10px; font-weight: 600;
  color: var(--muted); text-align: center; border-left: 2px solid var(--line);
}
.assoc-matrix .count-header {
  position: sticky; right: 0; z-index: 4; background: #1e2228;
  width: 32px; min-width: 32px; font-size: 10px; font-weight: 600;
  color: var(--muted); border-left: 2px solid var(--line);
}

/* Cross-highlight on hover */
.assoc-matrix td.col-highlight,
.assoc-matrix td.row-highlight { background: rgba(96, 165, 250, 0.06); }
.assoc-matrix td.col-highlight.row-highlight { background: rgba(96, 165, 250, 0.14); }
.assoc-matrix .row-label.row-highlight { color: #60a5fa !important; }
.assoc-matrix thead th.col-highlight .col-header { color: #60a5fa !important; }

/* Tooltip */
.assoc-matrix-tooltip {
  position: absolute; background: #252a33; border: 1px solid var(--line);
  border-radius: 6px; padding: 8px 12px; font-size: 11px; color: var(--text);
  z-index: 10; pointer-events: none; max-width: 280px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.4); white-space: pre-line; line-height: 1.5;
}

/* Controls bar */
.assoc-matrix-controls {
  display: flex; align-items: center; gap: 12px; padding: 8px 12px;
  font-size: 11px; color: var(--muted); border-bottom: 1px solid var(--line);
}
.assoc-matrix-controls .select-field { min-width: 120px; }
.assoc-matrix-controls .select-wrap .select-display.small { height: auto; padding: 4px 10px; font-size: 11px; }
.assoc-matrix-controls .select-menu { min-width: 120px; }
.assoc-matrix-controls label {
  display: flex; align-items: center; gap: 4px; cursor: pointer;
}
.assoc-matrix-summary { margin-left: auto; font-style: italic; }

/* Disable outer scroll layers when assoc matrix is visible — single scroll only */
#relativeAssocMatrixContent.corr-matrix-content { overflow: visible; max-height: none; }
#relativeCorrelation:has(#relativeAssocMatrixPane:not([hidden])) { max-height: none; overflow: visible; }

/* Scroll container — single scroll region for the entire matrix */
.assoc-matrix-scroll { overflow: auto; max-height: 460px; position: relative; }

/* Compact: 25-40 relatives */
.assoc-matrix-compact td,
.assoc-matrix-compact thead th:not(.corner-cell):not(.count-header) {
  width: 20px; min-width: 20px; max-width: 20px; height: 20px;
}
.assoc-matrix-compact td { font-size: 12px; }
.assoc-matrix-compact .col-header { font-size: 9px; max-height: 100px; }
.assoc-matrix-compact .row-label { font-size: 9px; max-width: 120px; }
.assoc-matrix-compact .diag-cell { font-size: 8px; }

/* Very compact: 40+ relatives */
.assoc-matrix-very-compact td,
.assoc-matrix-very-compact thead th:not(.corner-cell):not(.count-header) {
  width: 18px; min-width: 18px; max-width: 18px; height: 18px;
}
.assoc-matrix-very-compact td { font-size: 11px; }
.assoc-matrix-very-compact .col-header { font-size: 8px; max-height: 80px; }
.assoc-matrix-very-compact .row-label { font-size: 8px; max-width: 100px; }
.assoc-matrix-very-compact .diag-cell { font-size: 7px; }

/* ── End Correlation Matrix Views ─────────────────────────────────────── */

/* ── Information panel ──────────────────────────────────────────────────── */
.nri-tabs { display: flex; align-items: center; gap: 0; border-bottom: 1px solid var(--line); margin-bottom: 10px; }
.nri-tab {
  background: none; border: none; padding: 7px 18px; font-size: 13px;
  color: var(--muted); cursor: pointer; border-bottom: 2px solid transparent;
  font-family: inherit; transition: color var(--speed), border-color var(--speed);
}
.nri-tab:hover { color: var(--text); }
.nri-tab.active { color: var(--text); border-bottom-color: var(--text); }
.nri-pane { padding: 2px 0 6px; }
.nri-tab[data-badge]:not([data-badge=""])::after {
  content: attr(data-badge); font-size: 10px; min-width: 16px; height: 16px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--danger); color: #fff; border-radius: 8px;
  padding: 0 4px; margin-left: 5px; font-weight: 600;
}

/* Gate Log — LLM Pivot Gate override events */
.gate-event { display: flex; gap: 0.5em; padding: 4px 8px; border-bottom: 1px solid var(--line); font-size: 0.85em; align-items: baseline; }
.gate-event .gate-action { font-weight: 600; min-width: 7ch; }
.gate-reject .gate-action { color: var(--danger); }
.gate-recover .gate-action { color: #2ecc71; }
.gate-approve .gate-action { color: var(--muted); }
.gate-event .gate-tool { font-family: monospace; min-width: 18ch; color: var(--text); }
.gate-event .gate-input { color: var(--muted); max-width: 20ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gate-event .gate-reason { color: var(--muted); flex: 1; }
.gate-override .gate-action { color: #f39c12; }
.gate-override-btn { padding: 2px 8px !important; font-size: 11px !important; border-radius: 6px; background: var(--panel); border: 1px solid var(--line); color: var(--text); cursor: pointer; white-space: nowrap; transition: background 0.15s, border-color 0.15s; }
.gate-override-btn:hover { background: var(--danger); border-color: var(--danger); color: #fff; }
.gate-overridden { font-size: 11px; color: #f39c12; font-style: italic; white-space: nowrap; }
.gate-empty-msg { padding: 1em; color: var(--muted); font-style: italic; text-align: center; font-size: 0.85em; }

.case-notes {
  width: 100%; resize: vertical; min-height: 80px; max-height: 400px;
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 10px 12px; font: inherit; font-size: 13px; color: var(--text); line-height: 1.5;
}
.case-notes::placeholder { color: var(--muted); opacity: .6; }
.case-notes:focus { outline: none; border-color: var(--muted); }
.notes-status { font-size: 11px; color: var(--muted); text-align: right; margin-top: 4px; min-height: 16px; opacity: .7; }

.runinfo-summary {
  font-size: 13px; color: var(--muted); padding: 4px 0 10px;
  display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline;
}
.runinfo-summary .ri-stat { white-space: nowrap; }
.runinfo-summary .ri-val { color: var(--text); font-weight: 600; }
.runinfo-summary .ri-err { color: var(--danger); }
.runinfo-summary .ri-skip { color: var(--muted); }
.runinfo-grid {
  display: flex; flex-direction: column; gap: 1px;
  max-height: 320px; overflow-y: auto; overflow-x: hidden;
}
.runinfo-header, .runinfo-row {
  display: grid; grid-template-columns: minmax(200px, 1fr) 52px 52px 50px 14px;
  align-items: center; gap: 8px; padding: 3px 2px;
  font-size: 11px; font-family: 'SF Mono', 'Menlo', 'Consolas', monospace;
}
.runinfo-header {
  color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em;
  border-bottom: 1px solid var(--line); padding-bottom: 4px; margin-bottom: 2px;
}
.runinfo-header span:not(:first-child) { text-align: right; }
.runinfo-row:hover { background: var(--line); border-radius: 3px; }
.runinfo-tool {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--text); font-size: 11px;
}
.ri-live, .ri-cache {
  text-align: right; font-variant-numeric: tabular-nums;
}
.ri-live { color: var(--text); }
.ri-cache { color: var(--muted); }
.ri-rate {
  text-align: right; font-variant-numeric: tabular-nums;
  font-size: 10px; font-weight: 500; border-radius: 3px; padding: 1px 4px;
}
.ri-rate-zero { color: #7a8799; background: rgba(122, 135, 153, 0.12); }
.ri-rate-low  { color: #7a9bb5; background: rgba(122, 155, 181, 0.11); }
.ri-rate-mid  { color: #6eaed6; background: rgba(110, 174, 214, 0.12); }
.ri-rate-high { color: #5b9ed6; background: rgba(91, 158, 214, 0.14); }
.ri-edot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--danger);
  display: inline-block; justify-self: center;
}
.ri-edot-none { width: 6px; height: 6px; display: inline-block; }
.runinfo-toggle {
  background: none; border: none; color: var(--muted); cursor: pointer;
  font-size: 11px; padding: 6px 0; text-align: left;
}
.runinfo-toggle:hover { color: var(--text); }

/* Ghost rows: disabled tools in run info */
.runinfo-ghost { opacity: 0.45; }
.runinfo-ghost .runinfo-tool { text-decoration: line-through; color: var(--muted); }
.ri-ghost-count {
  grid-column: 2 / 5; text-align: left;
  font-size: 10px; color: var(--muted); font-style: italic;
}
.ri-ghost-icon {
  width: 6px; height: 6px; border-radius: 50%;
  border: 1px solid var(--muted);
  display: inline-block; justify-self: center;
  position: relative;
}
.ri-ghost-icon::after {
  content: ''; position: absolute;
  top: 50%; left: -1px; right: -1px;
  height: 1px; background: var(--muted);
  transform: rotate(-45deg);
}
.ri-ghost-stat { opacity: 0.6; font-style: italic; }

/* ── LLM Chat panel ───────────────────────────────────────────────────── */
.llm-chat-body {
  display: flex; flex-direction: column; gap: 0;
  max-height: 500px;
}
.llm-messages {
  flex: 1; overflow-y: auto; overflow-x: hidden; padding: 12px;
  display: flex; flex-direction: column; gap: 6px;
  min-height: 120px; max-height: 400px;
  scroll-behavior: smooth;
}
.llm-messages:empty::after {
  content: "No messages yet. Ask a question about the case data.";
  color: var(--muted); font-size: 13px; opacity: 0.6;
  text-align: center; padding: 24px;
}

/* Message bubbles */
.llm-msg { max-width: 85%; }
.llm-msg-user {
  align-self: flex-end;
  background: #2a3040; border: 1px solid #353d4f;
  border-radius: 14px 14px 4px 14px;
  padding: 8px 14px;
}
.llm-msg-assistant {
  align-self: flex-start;
  background: var(--panel-elev); border: 1px solid var(--line);
  border-radius: 14px 14px 14px 4px;
  padding: 8px 14px;
}
.llm-msg-system {
  align-self: center; max-width: 90%;
  background: rgba(255, 170, 50, 0.08); border: 1px solid rgba(255, 170, 50, 0.25);
  border-radius: 10px; padding: 14px 18px;
  font-size: 13px; line-height: 1.55; color: var(--muted);
}
.llm-msg-system strong { color: #ffaa32; }
.llm-msg-system code { background: rgba(255,255,255,0.06); padding: 1px 5px; border-radius: 4px; font-size: 12px; }
.llm-msg-content {
  font-size: 13px; line-height: 1.55; color: var(--text);
  word-break: break-word; overflow-wrap: anywhere;
}
.llm-msg-content p { margin: 0 0 6px; }
.llm-msg-content p:last-child { margin-bottom: 0; }
.llm-msg-content .llm-hr { border: none; border-top: 1px solid var(--line); margin: 10px 0; }
.llm-msg-meta {
  font-size: 10px; color: var(--muted); margin-top: 4px; opacity: 0.6;
}

/* Tables in assistant messages (markdown-rendered) */
.llm-msg-content table {
  width: 100%; border-collapse: collapse; margin: 8px 0;
  font-size: 12px; table-layout: auto;
}
.llm-msg-content th, .llm-msg-content td {
  padding: 4px 8px; border: 1px solid var(--line);
  text-align: left; vertical-align: top;
}
.llm-msg-content th {
  background: rgba(255,255,255,0.04); font-weight: 600;
  white-space: nowrap;
}
/* First column (domain names) — prevent line-wrap on short domains */
.llm-msg-content td:first-child {
  white-space: nowrap; min-width: 140px;
}

/* Markdown rendering in assistant messages */
.llm-h { font-size: 14px; font-weight: 600; color: #d0d3da; margin: 8px 0 3px; }
h2.llm-h { font-size: 15px; }
.llm-list { margin: 4px 0 6px; padding-left: 22px; }
.llm-list li { margin: 3px 0; }
.llm-list + .llm-list { margin-top: 0; }
.llm-list + p { margin-top: 0; }
p + .llm-list { margin-top: 0; }
.llm-code {
  background: #0d1117; border: 1px solid #21262d;
  border-radius: 6px; padding: 8px 10px; margin: 6px 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px; overflow-x: auto; white-space: pre;
}
.llm-inline-code {
  background: #21262d; padding: 1px 5px; border-radius: 4px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
}
/* Tables in LLM messages */
.llm-table {
  width: 100%; border-collapse: collapse; margin: 8px 0; font-size: 12px;
}
.llm-table th {
  background: rgba(255,255,255,0.04); border: 1px solid var(--line);
  padding: 5px 8px; text-align: left; font-weight: 600; color: #d0d3da;
  white-space: nowrap;
}
.llm-table td {
  border: 1px solid var(--line); padding: 4px 8px; color: var(--text);
}
.llm-table tr:hover td { background: rgba(255,255,255,0.02); }
.llm-list .llm-sub { margin-left: 16px; font-size: 12.5px; }

/* Typing indicator */
.llm-typing {
  color: var(--muted); font-style: italic; font-size: 13px;
}
@keyframes llm-pulse { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } }
.llm-typing { animation: llm-pulse 1.5s ease-in-out infinite; }

/* Error message */
.llm-error { color: var(--danger); font-size: 12px; font-style: italic; }

/* Input area */
.llm-input-row {
  display: flex; gap: 8px; align-items: center;
  padding: 8px 12px; border-top: 1px solid var(--line);
  background: var(--panel);
}
.llm-input-row textarea {
  flex: 1; resize: none; min-height: 36px; max-height: 120px;
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 8px 10px; font: inherit; font-size: 13px; color: var(--text);
  line-height: 1.4; outline: none; box-shadow: var(--shadow);
  transition: border-color var(--speed), transform var(--speed), background-color var(--speed);
}
.llm-input-row textarea::placeholder { color: var(--muted); opacity: 0.6; }
.llm-input-row textarea:hover { border-color: #3a3f49; }
.llm-input-row textarea:focus { border-color: var(--gray); box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); }
.llm-input-row textarea:disabled { opacity: 0.5; cursor: not-allowed; }
.llm-upload-btn {
  width: 36px; height: 36px; border-radius: 8px;
  border: 1px solid var(--line); background: transparent;
  color: var(--muted); cursor: pointer; display: grid; place-items: center;
  transition: color var(--speed), border-color var(--speed), background-color var(--speed);
  flex-shrink: 0;
}
.llm-upload-btn:hover { color: var(--text); border-color: #3a3f49; background: var(--panel-elev); }
.llm-upload-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.llm-upload-btn svg { width: 15px; height: 15px; }
.llm-upload-btn.uploading { pointer-events: none; opacity: 0.5; }
/* Inline model tier select on chat bar */
.llm-input-row > select#llmModelTier { display: none; /* hidden; enhanced via JS into .select-wrap */ }
.llm-input-row > .select-wrap { flex-shrink: 0; width: auto; }
.llm-input-row > .select-wrap .select-display { height: 36px; padding: 6px 10px; font-size: 12px; border-radius: 8px; box-shadow: none; white-space: nowrap; min-width: 0; }
.llm-input-row > .select-wrap .select-display::after { margin-left: 6px; }
.llm-input-row > .select-wrap .select-menu { min-width: 0; width: 100%; font-size: 12px; }
.llm-input-row > .select-wrap .select-option { padding: 6px 10px; font-size: 12px; }
.llm-upload-notice {
  margin: 4px 12px 0; padding: 4px 8px; border-radius: var(--radius-sm);
  background: rgba(91, 141, 239, 0.08); font-size: 11px; color: var(--muted);
  display: flex; align-items: center; gap: 6px;
}
.llm-upload-notice .upload-filename { color: var(--text); font-weight: 500; }
.llm-send-btn {
  width: 36px; height: 36px; border-radius: 10px;
  border: 1px solid var(--line); background: var(--panel-elev);
  color: var(--text); cursor: pointer; display: grid; place-items: center;
  transition: background-color var(--speed), border-color var(--speed);
  flex-shrink: 0;
}
.llm-send-btn:hover:not(:disabled) { background: #232832; border-color: #3a3f49; }
.llm-send-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.llm-send-btn svg { width: 16px; height: 16px; fill: var(--text); }

/* Status / budget bar */
.llm-footer {
  display: flex; justify-content: space-between; align-items: center;
  padding: 4px 12px; font-size: 10px; color: var(--muted);
  border-top: 1px solid var(--line);
}
.llm-clear-btn {
  background: none; border: none; color: var(--muted); cursor: pointer;
  font-size: 10px; padding: 2px 6px; border-radius: 4px;
  transition: color var(--speed), background-color var(--speed);
}
.llm-clear-btn:hover { color: var(--danger); background: rgba(229, 72, 77, 0.1); }

/* Model tier selector — custom enhanced select in compact footer */
/* Tooltips in chat footer + input row — show ABOVE since they're at the bottom */
.llm-footer .has-tip:hover::after, .llm-input-row .has-tip:hover::after {
  top: auto; bottom: calc(100% + 8px); left: 0; right: auto;
}
.llm-footer .has-tip:hover::before, .llm-input-row .has-tip:hover::before {
  top: auto; bottom: 100%; left: 12px;
  transform: translateY(0) rotate(225deg);
}
/* Right-align footer tooltip */
.llm-footer #llmStatus.has-tip:hover::after { left: 0; right: auto; }

/* Compression notification */
.llm-compression-notice {
  margin: 6px 12px; padding: 6px 10px; border-radius: var(--radius-sm);
  background: rgba(91, 141, 239, 0.1); border-left: 3px solid var(--accent);
  font-size: 11px; color: var(--muted); line-height: 1.4;
}

/* ── LLM Tool Execution (Stage 4) ──────────────────────────────────────── */
.llm-tool-request {
  margin: 8px 0; padding: 10px 12px; border-radius: var(--radius-sm);
  background: var(--panel-elev); border-left: 3px solid #5b8def;
  font-size: 13px; line-height: 1.5;
}
.llm-tool-header { margin-bottom: 6px; }
.llm-tool-header strong { color: #5b8def; }
.llm-tool-input { color: var(--muted); font-size: 12px; }
.llm-tool-rationale { color: var(--muted); font-style: italic; margin-bottom: 8px; font-size: 12px; }
.llm-tool-actions { display: flex; gap: 8px; margin-top: 8px; }
.llm-tool-approve {
  background: #2a6b3c; color: #e7e9ee; border: none; border-radius: 6px;
  padding: 5px 16px; cursor: pointer; font-size: 12px; font-weight: 600;
  transition: background var(--speed);
}
.llm-tool-approve:hover { background: #358a4e; }
.llm-tool-deny {
  background: none; color: var(--muted); border: 1px solid var(--line); border-radius: 6px;
  padding: 5px 16px; cursor: pointer; font-size: 12px;
  transition: color var(--speed), border-color var(--speed);
}
.llm-tool-deny:hover { color: var(--danger); border-color: var(--danger); }
.llm-tool-status { font-size: 12px; color: var(--muted); margin-top: 4px; }
.llm-tool-executing {
  margin: 6px 0; padding: 8px 12px; font-size: 12px;
  color: var(--muted); background: var(--panel-elev); border-radius: 8px;
}
.llm-tool-result {
  margin: 6px 0; padding: 8px 12px; font-size: 12px;
  border-radius: 8px; background: var(--panel-elev);
}
.llm-tool-result-ok { border-left: 3px solid #2a6b3c; }
.llm-tool-result-error { border-left: 3px solid var(--danger); color: var(--danger); }

/* ── ESRC Briefing Card ────────────────────────────────────────────────── */
.llm-briefing-card {
  margin: 8px 0 12px; padding: 12px 14px; border-radius: var(--radius-sm);
  background: var(--panel-elev); border-left: 3px solid #5b8def;
  font-size: 13px; line-height: 1.5;
  min-width: 0; overflow-wrap: break-word; word-wrap: break-word;
}
/* Pipeline segmented bar */
.llm-pipeline-bar {
  display: flex; align-items: stretch; gap: 2px;
  margin-bottom: 8px; height: 24px; border-radius: 4px;
  overflow: hidden;
}
.llm-pipeline-seg {
  flex: 1; display: grid; place-items: center;
  background: var(--panel-elev); border: 1px solid var(--line);
  transition: background var(--speed), border-color var(--speed);
  min-width: 0;
}
.llm-pipeline-seg:first-child { border-radius: 4px 0 0 4px; }
.llm-pipeline-seg:last-of-type { border-radius: 0 4px 4px 0; }
.llm-pipeline-seg.done {
  background: rgba(61, 220, 132, 0.15); border-color: rgba(61, 220, 132, 0.35);
}
.llm-pipeline-seg-label {
  font-size: 9px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.3px; color: var(--muted); white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; padding: 1px 4px 0;
  line-height: 1;
}
.llm-pipeline-seg.done .llm-pipeline-seg-label { color: #3ddc84; }
.llm-pipeline-seg.failed {
  background: rgba(220, 61, 76, 0.18); border-color: rgba(220, 61, 76, 0.45);
}
.llm-pipeline-seg.failed .llm-pipeline-seg-label { color: #ff6c7c; }
.llm-pipeline-seg.skipped {
  background: rgba(180, 180, 80, 0.12); border-color: rgba(180, 180, 80, 0.35);
}
.llm-pipeline-seg.skipped .llm-pipeline-seg-label { color: #d4c75e; }
.llm-pipeline-seg.running {
  background: rgba(91, 141, 239, 0.15); border-color: rgba(91, 141, 239, 0.4);
  animation: llm-pipeline-pulse 1.4s ease-in-out infinite;
}
.llm-pipeline-seg.running .llm-pipeline-seg-label { color: #5b8def; }
@keyframes llm-pipeline-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.55; }
}
/* Retry button sits centered BELOW the pipeline bar */
.llm-pipeline-retry-overlay {
  display: flex; justify-content: center;
  margin: 4px 0 6px;
}
.llm-pipeline-retry-btn {
  background: rgba(91, 141, 239, 0.22);
  border: 1px solid rgba(91, 141, 239, 0.5);
  color: var(--text);
  padding: 3px 14px;
  font-size: 10px;
  font-weight: 600;
  border-radius: 4px;
  cursor: pointer;
  transition: background var(--speed), border-color var(--speed);
}
.llm-pipeline-retry-btn:hover:not(:disabled) {
  background: rgba(91, 141, 239, 0.4);
  border-color: rgba(91, 141, 239, 0.7);
}
.llm-pipeline-retry-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.llm-pipeline-conf {
  display: flex; align-items: center; justify-content: center;
  padding: 0 8px; font-size: 14px; font-weight: 700;
  white-space: nowrap; flex-shrink: 0;
}
.llm-pipeline-conf.high { color: #3ddc84; }
.llm-pipeline-conf.med  { color: #b58900; }
.llm-pipeline-conf.low  { color: var(--danger); }
.llm-briefing-summary {
  font-size: 12px; color: var(--muted); margin-bottom: 10px;
  padding-bottom: 8px; border-bottom: 1px solid var(--line);
}
.llm-briefing-section { margin-top: 8px; }
.llm-briefing-section-title {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.5px; color: var(--muted); margin-bottom: 4px;
}
.llm-briefing-finding {
  padding: 3px 0; font-size: 12px; color: var(--text);
  display: flex; align-items: baseline; gap: 6px;
}
.llm-briefing-gap {
  padding: 5px 0; font-size: 12px; color: var(--text);
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.llm-briefing-gap:last-child { border-bottom: none; }
.llm-briefing-gap-text { color: var(--text); }
.llm-briefing-gap-tool { font-size: 11px; color: var(--muted); margin-top: 2px; }
.llm-gap-actions { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 4px; }
.llm-briefing-run-tool {
  background: #2a6b3c; color: #e7e9ee; border: none; border-radius: 6px;
  padding: 3px 9px; cursor: pointer; font-size: 11px; font-weight: 600;
  transition: background var(--speed);
}
.llm-briefing-run-tool:hover { background: #358a4e; }
.llm-briefing-run-tool:disabled { opacity: 0.5; cursor: not-allowed; }
.llm-btn-done { background: #1e3a2a; color: var(--muted); }
/* Lateral findings — collapsible details */
.llm-briefing-lateral {
  padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 12px;
}
.llm-briefing-lateral:last-child { border-bottom: none; }
.llm-briefing-lateral-summary {
  cursor: pointer; list-style: none; display: flex; flex-wrap: wrap;
  align-items: baseline; gap: 4px; min-width: 0;
}
.llm-briefing-lateral-summary::-webkit-details-marker { display: none; }
.llm-briefing-lateral-summary::before {
  content: '▸'; font-size: 10px; color: var(--muted); margin-right: 2px;
  transition: transform 0.15s;
}
.llm-briefing-lateral[open] > .llm-briefing-lateral-summary::before {
  transform: rotate(90deg);
}
.llm-briefing-lateral-type {
  font-size: 10px; font-weight: 600; color: #5b8def;
  text-transform: uppercase; letter-spacing: 0.3px;
  background: rgba(91,141,239,0.12); padding: 1px 6px; border-radius: 3px;
}
.llm-briefing-lateral-body {
  margin: 6px 0 2px 16px; padding-left: 8px;
  border-left: 2px solid rgba(91,141,239,0.25);
}
.llm-lateral-detail {
  font-size: 11px; color: var(--muted); margin-bottom: 4px; line-height: 1.45;
}
.llm-lateral-detail strong { color: var(--text); font-weight: 600; }
/* Status badges */
.badge-verified {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; text-transform: uppercase;
  background: rgba(42,107,60,0.2); color: #3dba64;
}
.badge-unverified {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; text-transform: uppercase;
  background: rgba(181,137,0,0.15); color: #b58900;
}
.badge-contradicted {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; text-transform: uppercase;
  background: rgba(229,72,77,0.15); color: var(--danger);
}
.badge-inferred {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; text-transform: uppercase;
  background: rgba(91,141,239,0.15); color: #5b8def;
}
.badge-importance-high {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; text-transform: uppercase;
  background: rgba(229,72,77,0.15); color: var(--danger);
}
.badge-importance-med {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; text-transform: uppercase;
  background: rgba(181,137,0,0.15); color: #b58900;
}
.badge-importance-low {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; text-transform: uppercase;
  background: rgba(91,141,239,0.1); color: var(--muted);
}

/* ── Embedded mode (iframe inside group.html) ──────────────────────────── */
body.embedded .hero,
body.embedded .sidebar,
body.embedded .sidebar-fab,
body.embedded .brand { display: none !important; }
body.embedded .page { padding: 8px 12px; min-height: auto; justify-content: flex-start; }
body.embedded .run-panels { margin-top: 4px; }
body.embedded .post-run-actions .btn:last-child { display: none; /* hide Clear Case */ }

/* ═══════════════════════════════════════════════════════════════
   SECURITY POSTURE PANEL — all 3 layout variants
   ═══════════════════════════════════════════════════════════════ */

/* Grade badges */
.sec-grade-row { display: flex; gap: 10px; flex-wrap: wrap; align-items: stretch; }
.sec-grade-card {
  flex: 1; min-width: 100px; max-width: 160px;
  background: var(--panel-elev); border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 12px; text-align: center; display: flex; flex-direction: column; gap: 2px;
}
.sec-grade-label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--muted); font-weight: 600; }
.sec-grade-letter { font-size: 28px; font-weight: 800; line-height: 1.1; }
.sec-grade-score { font-size: 11px; color: var(--muted); }
.sec-grade-letter.grade-a { color: #3dba64; }
.sec-grade-letter.grade-b { color: #5b8def; }
.sec-grade-letter.grade-c { color: #b58900; }
.sec-grade-letter.grade-d { color: #e5484d; }
.sec-grade-letter.grade-f { color: #e5484d; }

/* Severity bar (shared) */
.sec-severity-bar-wrap { margin: 8px 0; }
.sec-severity-bar {
  display: flex; height: 8px; border-radius: 4px; overflow: hidden; gap: 1px;
  background: var(--panel-elev);
}
.sec-severity-bar > span { transition: flex var(--speed); min-width: 2px; }
.sec-severity-bar .sev-critical { background: #e5484d; }
.sec-severity-bar .sev-high { background: #f97316; }
.sec-severity-bar .sev-medium { background: #b58900; }
.sec-severity-bar .sev-low { background: #5b8def; }
.sec-severity-bar .sev-info { background: var(--muted); }
.sec-severity-legend {
  display: flex; gap: 10px; flex-wrap: wrap; margin-top: 4px;
  font-size: 11px; color: var(--muted);
}
.sec-severity-legend span { display: flex; align-items: center; gap: 3px; }
.sec-severity-dot { width: 8px; height: 8px; border-radius: 2px; flex-shrink: 0; }

/* Finding rows (shared) */
.sec-finding-row {
  display: flex; align-items: baseline; gap: 8px; padding: 4px 0;
  font-size: 12px; line-height: 1.5; border-bottom: 1px solid rgba(255,255,255,0.03);
}
.sec-finding-row:last-child { border-bottom: none; }
.sec-sev-pill {
  font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.3px;
  padding: 1px 5px; border-radius: 3px; flex-shrink: 0; min-width: 38px; text-align: center;
}
.sec-sev-pill.critical { background: rgba(229,72,77,0.15); color: #e5484d; }
.sec-sev-pill.high { background: rgba(249,115,22,0.15); color: #f97316; }
.sec-sev-pill.medium { background: rgba(181,137,0,0.15); color: #b58900; }
.sec-sev-pill.low { background: rgba(91,141,239,0.1); color: #5b8def; }
.sec-sev-pill.info { background: rgba(166,169,178,0.1); color: var(--muted); }
.sec-finding-title { color: var(--text); flex: 1; overflow: hidden; text-overflow: ellipsis; }
.sec-finding-domain { font-size: 11px; color: var(--muted); white-space: nowrap; }
.sec-cat-tag {
  font-size: 9px; font-weight: 600; padding: 1px 4px; border-radius: 3px;
  background: rgba(255,255,255,0.05); color: var(--muted); white-space: nowrap;
}

/* Domain chips (Layout C) */
.sec-domain-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.sec-domain-chip {
  font-size: 11px; padding: 3px 8px; border-radius: 6px;
  background: var(--panel-elev); border: 1px solid var(--line);
  color: var(--text); cursor: default;
}
.sec-domain-chip .chip-count {
  font-weight: 700; margin-left: 4px; color: var(--muted);
}

/* Domain group (Layout B) */
.sec-domain-group { margin-bottom: 10px; }
.sec-domain-header {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px; font-weight: 600; color: var(--text);
  padding: 4px 0; border-bottom: 1px solid var(--line); margin-bottom: 4px;
}
.sec-domain-count { font-size: 11px; color: var(--muted); font-weight: 400; }

/* Section titles (shared) */
.sec-section-title {
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--muted); margin: 10px 0 4px;
}

/* Summary stat (Layout A) */
.sec-total-stat {
  font-size: 14px; font-weight: 600; color: var(--text);
  display: flex; align-items: center; gap: 6px;
}

/* Grades inline (Layout B header bar) */
.sec-grades-inline {
  display: flex; gap: 8px; align-items: center; padding: 6px 0;
  font-size: 12px; color: var(--muted);
}
.sec-grades-inline .grade-chip {
  font-weight: 700; padding: 1px 5px; border-radius: 3px;
}
.sec-grades-inline .grade-chip.grade-a { color: #3dba64; background: rgba(61,186,100,0.12); }
.sec-grades-inline .grade-chip.grade-b { color: #5b8def; background: rgba(91,141,239,0.12); }
.sec-grades-inline .grade-chip.grade-c { color: #b58900; background: rgba(181,137,0,0.12); }
.sec-grades-inline .grade-chip.grade-d { color: #e5484d; background: rgba(229,72,77,0.12); }
.sec-grades-inline .grade-chip.grade-f { color: #e5484d; background: rgba(229,72,77,0.12); }

/* Expand link */
/* Inline expand/collapse links (override native <summary> styling) */
#securityPostureContent details { margin: 0; border: none; background: none; box-shadow: none; }
#securityPostureContent details > summary {
  list-style: none; display: inline-block; margin-top: 4px; font-size: 11px;
  color: #5b8def; cursor: pointer; border: none; background: none; padding: 0;
  border-bottom: none;
}
#securityPostureContent details > summary::-webkit-details-marker { display: none; }
#securityPostureContent details > summary::marker { display: none; content: ''; }
#securityPostureContent details > summary:hover { text-decoration: underline; }
#securityPostureContent details.sec-expandable[open] > summary { margin-top: 4px; margin-bottom: 0; }

/* Override max-height for security panel (can exceed 2000px with many domains) */
#securityPostureBlock[open] > .collapsible { max-height: none; overflow: visible; }

/* Footer line */
.sec-footer { font-size: 11px; color: var(--muted); margin-top: 8px; padding-top: 6px;
  border-top: 1px solid rgba(255,255,255,0.04); }

/* ══════════ Dorking Audit Panel ══════════ */
#dorkingTabs {
  flex-wrap: wrap; max-height: 200px; overflow-y: auto; overflow-x: auto;
  scrollbar-width: thin; scrollbar-color: #2a2e36 transparent;
}
#dorkingTabs .nri-tab {
  padding: 5px 12px; font-size: 12px; white-space: nowrap;
  max-width: 220px; overflow: hidden; text-overflow: ellipsis;
}
.dorking-query-header {
  padding: 8px 12px; background: var(--bg-block); border-radius: 6px;
  margin-bottom: 10px; border-left: 3px solid var(--primary);
}
.dorking-query-meta { display: flex; gap: 8px; align-items: center; margin-bottom: 4px; }
.dorking-input-badge {
  font-size: 11px; padding: 2px 6px; border-radius: 4px;
  background: #1e2a3a; color: #7eb8da; font-family: monospace;
}
.dorking-query-string {
  font-family: monospace; font-size: 12px; color: var(--text);
  word-break: break-all; margin: 4px 0;
}
.dorking-query-counts { font-size: 11px; color: var(--muted); }

/* Individual search result cards — Google-style layout */
.dorking-result {
  padding: 10px 12px; border-bottom: 1px solid var(--line);
}
.dorking-result:last-child { border-bottom: none; }
.dorking-pivoted { border-left: 3px solid #2ecc71; padding-left: 9px; }
.dorking-result-title {
  font-size: 14px; color: #8ab4f8; text-decoration: none;
  display: block; margin-bottom: 2px; line-height: 1.3;
}
.dorking-result-title:hover { text-decoration: underline; }
.dorking-result-url {
  font-size: 12px; color: #8a9a5b; margin-bottom: 3px;
  word-break: break-all; line-height: 1.2;
}
.dorking-result-snippet {
  font-size: 12px; color: var(--muted); line-height: 1.4; margin-bottom: 6px;
}
.dorking-result-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.dorking-cls-badge {
  font-size: 10px; padding: 1px 6px; border-radius: 3px;
  background: #1a1f29; border: 1px solid var(--line);
  color: #c3c6cf; text-transform: uppercase; letter-spacing: 0.05em;
}
.dorking-cls-document { border-color: #c0392b; color: #e74c3c; }
.dorking-cls-social_profile { border-color: #2980b9; color: #3498db; }
.dorking-cls-news_article { border-color: #8e44ad; color: #9b59b6; }
.dorking-cls-code_repo { border-color: #27ae60; color: #2ecc71; }
.dorking-cls-paste_site { border-color: #d35400; color: #e67e22; }
.dorking-cls-court_record { border-color: #c0392b; color: #e74c3c; }
.dorking-cls-government { border-color: #16a085; color: #1abc9c; }
.dorking-cls-databroker { border-color: #f39c12; color: #f1c40f; }
.dorking-cls-forum { border-color: #7f8c8d; color: #95a5a6; }
.dorking-cls-document_sharing { border-color: #2980b9; color: #5dade2; }
.dorking-cls-archive { border-color: #8e6f3e; color: #d4a855; }
.dorking-cls-gaming_platform { border-color: #6c3483; color: #a569bd; }
.dorking-cls-payment_platform { border-color: #1e8449; color: #58d68d; }
.dorking-cls-messaging_platform { border-color: #2471a3; color: #5499c7; }
.dorking-pivoted-badge {
  font-size: 10px; padding: 1px 6px; border-radius: 3px;
  background: #1a3a2a; border: 1px solid #2ecc71; color: #2ecc71;
}
.dorking-skip-badge {
  font-size: 10px; padding: 1px 6px; border-radius: 3px;
  background: #2a2216; border: 1px solid #a08050; color: #d0a060;
  font-style: italic;
}
.dorking-danger-badge {
  font-size: 10px; padding: 1px 6px; border-radius: 3px;
  background: #3a1a1a; border: 1px solid #e74c3c; color: #e74c3c;
}
.dorking-empty-notice {
  padding: 12px; color: var(--muted); font-style: italic; font-size: 12px;
}

/* ── Tool Runner panel ── */
/* Elevate stacking context when the custom dropdown is open so the menu
   paints above sibling panels (Artifacts, etc.) below it. */
#toolRunnerBlock { position: relative; z-index: 1; }
#toolRunnerBlock:has(.select-wrap.open) { z-index: 2000001; }
#toolRunnerBlock .select-wrap.open { z-index: 2000001; }
.tr-body { padding: 8px 12px; }
.tr-input-row { display: grid; grid-template-columns: 180px 1fr; gap: 10px; align-items: center; padding-bottom: 10px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.tr-input-row .select-field { width: 100%; }
@media (max-width: 600px) { .tr-input-row { grid-template-columns: 1fr; } }
.tr-tool-grid { padding: 8px 0; max-height: 50vh; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.tr-tool-group { margin-bottom: 14px; }
.tr-tool-group-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: var(--muted); padding: 4px 0; border-bottom: 1px solid var(--line); margin-bottom: 6px; }
.tr-tool-chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; }
.tr-chip { display: grid; grid-template-columns: 22px 1fr; align-items: center; gap: 10px; border: 1px solid var(--line); background: #20242c; padding: 10px 12px; border-radius: 12px; cursor: pointer; transition: border-color var(--speed), background-color var(--speed); user-select: none; }
.tr-chip:hover { border-color: #3a3f49; background: #232832; }
.tr-chip.selected { border-color: #3c845a; background: rgba(60,132,90,0.08); }
.tr-chip.running { border-color: #5b8def; }
.tr-chip.done { opacity: 0.7; }
.tr-chip.error { border-color: var(--danger-line); }
.tr-chip input[type="checkbox"] { accent-color: #c0c3cc; width: 16px; height: 16px; cursor: pointer; }
.tr-chip-info { display: flex; flex-direction: column; gap: 2px; overflow: hidden; }
.tr-chip-label { font-size: 12px; color: #cfd2da; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr-chip-result { font-size: 11px; color: var(--muted); }
.tr-chip-result.success { color: #9fddb8; }
.tr-chip-result.error { color: #f47272; }
.tr-chip-spinner { display: inline-block; width: 14px; height: 14px; border: 2px solid var(--line); border-top-color: #5b8def; border-radius: 50%; animation: spin 0.8s linear infinite; vertical-align: middle; }
.tr-actions { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; border-top: 1px solid var(--line); margin-top: 8px; flex-wrap: wrap; gap: 10px; }
.tr-actions-left { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.tr-select-all-label { font-size: 13px; color: var(--muted); cursor: pointer; display: flex; align-items: center; gap: 6px; }
.tr-select-all-label input { accent-color: #c0c3cc; width: 16px; height: 16px; cursor: pointer; }
.tr-count { font-size: 12px; color: var(--muted); }
.tr-fanout-label { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 4px; cursor: pointer; }
.tr-fanout-label input { accent-color: #c0c3cc; width: 14px; height: 14px; cursor: pointer; }
.tr-llm-gate-label { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 4px; cursor: pointer; }
.tr-llm-gate-label input { accent-color: #c0c3cc; width: 14px; height: 14px; cursor: pointer; }
.tr-llm-gate-label.disabled { opacity: 0.45; pointer-events: none; }
.tr-gate-badge { font-size: 10px; padding: 1px 5px; border-radius: 3px; margin-left: 6px; font-weight: 600; }
.tr-gate-badge.gate-safe { background: #1a3d2a; color: #6fcf97; }
.tr-gate-badge.gate-review { background: #3d2a1a; color: #f2994a; }
.tr-progress { display: flex; align-items: center; gap: 10px; padding: 8px 0; }
.tr-progress-bar { flex: 1; height: 6px; background: var(--line); border-radius: 3px; overflow: hidden; }
.tr-progress-fill { height: 100%; background: #3c845a; border-radius: 3px; transition: width 300ms ease; width: 0%; }
.tr-progress-label { font-size: 12px; color: var(--muted); white-space: nowrap; }
.tr-results { max-height: 400px; overflow-y: auto; padding: 4px 0; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.tr-result-row { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 6px; background: #20242c; font-size: 12px; }
.tr-result-tool { font-weight: 600; color: #cfd2da; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr-result-artifacts { color: var(--muted); white-space: nowrap; }
/* Fanout approval reuses .approvals-grid + .approval-chip from the approval system */
#trFanoutApproval .approvals-header { font-size: 13px; color: var(--muted); margin: 8px 0; font-weight: 600; }
#trFanoutApproval .approvals-grid { max-height: 50vh; overflow-y: auto; }
#trFanoutApproval .approvals-actions { margin-top: 8px; }

/* ── Key Identifiers Zone ── */
.ki-card {
  background: #16181c;
  border: 1px solid #2a2e36;
  border-radius: 12px;
  padding: 0;
  overflow: hidden;
}
.ki-subject-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--line);
}
.ki-subject-name {
  font-size: 15px;
  font-weight: 700;
  color: #d0d3da;
  letter-spacing: 0.2px;
}
.ki-subject-meta {
  font-size: 11px;
  font-weight: 600;
  color: #b0b2b9;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.025);
  white-space: nowrap;
  flex: 0 0 auto;
}
.ki-grid {
  padding: 4px 0;
}
.ki-row {
  display: grid;
  grid-template-columns: 24px 140px 1fr;
  align-items: baseline;
  padding: 8px 16px;
  gap: 10px;
  transition: background var(--speed);
}
.ki-row:hover {
  background: rgba(255, 255, 255, 0.02);
}
.ki-row + .ki-row {
  border-top: 1px solid rgba(255, 255, 255, 0.03);
}
.ki-icon {
  font-size: 14px;
  text-align: center;
  line-height: 1;
}
.ki-label {
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  white-space: nowrap;
}
.ki-value {
  font-size: 13px;
  color: #c0c3cc;
  word-break: break-word;
  line-height: 1.4;
}
.ki-badge {
  display: inline-block;
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 4px;
  font-weight: 600;
  letter-spacing: 0.3px;
  vertical-align: middle;
  margin-left: 4px;
}
.ki-badge-verified {
  color: #30d158;
  border: 1px solid rgba(48, 209, 88, 0.3);
  background: rgba(48, 209, 88, 0.08);
}
.ki-row[data-type="family"] .ki-icon { opacity: 0.6; }

/* ── Key Identifiers placeholder (locked while spiderweb is finalizing) ── */
.ki-placeholder {
  display: flex; align-items: center; gap: 16px;
  padding: 24px 18px; color: var(--muted);
  border: 1px dashed var(--line); border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.015);
}
.ki-placeholder-spinner {
  width: 22px; height: 22px; border-radius: 50%;
  border: 2px solid rgba(91, 141, 239, 0.18);
  border-top-color: #5b8def;
  animation: ki-spin 1s linear infinite;
  flex: 0 0 auto;
}
@keyframes ki-spin { to { transform: rotate(360deg); } }
.ki-placeholder-text { font-size: 13px; color: var(--text); line-height: 1.4; }
.ki-placeholder-sub { font-size: 11px; color: var(--muted); margin-top: 4px; }

/* ── Maps Panel (case-end interactive map widget) ─────────────────────────── */
/* Wrapper enforces the right-side width cap. Without explicit max-width / min-width
 * on a flex/grid child the MapLibre canvas reports its own intrinsic size and the
 * .options-block expands horizontally past the page width on first open. */
#mapsBlock .correlation-panel {
  max-height: none;
  overflow: hidden;
  padding: 0;
}
.maps-canvas-wrap {
  position: relative;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}
.maps-fp-toggle {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
}
.maps-canvas {
  width: 100%;
  height: 520px;
  min-width: 0;
  background: #0f1116;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}
.maps-canvas .maplibregl-canvas { outline: none; }
.maps-canvas .maplibregl-ctrl-attrib {
  background: rgba(15, 17, 22, 0.78) !important;
  color: #b9bcc5 !important;
}
.maps-canvas .maplibregl-ctrl-attrib a { color: #c8d2e0 !important; }
.maps-canvas .maplibregl-ctrl-group {
  background: rgba(15, 17, 22, 0.85) !important;
  border: 1px solid var(--line) !important;
}
.maps-canvas .maplibregl-ctrl-group button {
  background-color: transparent !important;
  filter: invert(0.92) hue-rotate(180deg);
}
.maps-canvas .maplibregl-ctrl-scale {
  background: rgba(15, 17, 22, 0.78) !important;
  color: #b9bcc5 !important;
  border: 1px solid var(--line) !important;
  border-top: none !important;
  font-size: 11px !important;
  padding: 2px 6px !important;
  border-radius: 0 6px 0 0;
  box-shadow: var(--shadow);
}
.maps-canvas .maplibregl-popup-content {
  background: #161922 !important;
  color: var(--text) !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5) !important;
  font-family: inherit;
  font-size: 12px;
  padding: 10px 12px;
}
.maps-canvas .maplibregl-popup-tip {
  border-top-color: #161922 !important;
  border-bottom-color: #161922 !important;
}
.maps-popup-title {
  font-weight: 600;
  color: var(--text);
  margin-bottom: 4px;
  font-size: 12px;
}
.maps-popup-meta {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}
/* MapLibre's default close button is a tiny dim glyph that's invisible on
 * a dark popup.  Force a high-contrast circle with a clear "x". */
.maps-canvas .maplibregl-popup-close-button {
  color: #e6e8ee !important;
  font-size: 18px !important;
  line-height: 18px !important;
  width: 22px !important;
  height: 22px !important;
  padding: 0 !important;
  top: 4px !important;
  right: 4px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--line) !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 120ms ease, color 120ms ease;
}
.maps-canvas .maplibregl-popup-close-button:hover {
  background: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
}
/* Hover popups float without grabbing pointer events so the cursor can
 * still target the underlying marker. */
.maps-canvas .maplibregl-popup.maps-popup-hover {
  pointer-events: none;
}

/* ── Image Forensics Panel ────────────────────────────────────────────────── */
.forensics-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.92);
  display: grid; place-items: center; }
.forensics-panel { width: min(96vw, 1400px); height: min(92vh, 900px); background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow);
  display: flex; flex-direction: column; overflow: hidden; }
.forensics-header { display: flex; align-items: center; justify-content: space-between;
  padding: 10px 16px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,0.02);
  flex-shrink: 0; }
.forensics-title { font-weight: 600; font-size: 14px; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.forensics-header-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.forensics-header-btn { height: 36px; width: 36px; display: inline-flex; align-items: center;
  justify-content: center; border-radius: 8px; border: 1px solid var(--line);
  background: var(--panel-elev); box-shadow: var(--shadow); cursor: pointer;
  transition: transform var(--speed), background-color var(--speed), border-color var(--speed);
  line-height: 0; padding: 0; color: var(--muted); text-decoration: none; }
.forensics-header-btn:hover { border-color: #3a3f49; background: #232832;
  box-shadow: 0 0 0 3px rgba(142,142,147,0.22), var(--shadow); color: var(--text); }
.forensics-header-btn svg { width: 16px; height: 16px; }
.forensics-body { display: flex; flex: 1; overflow: hidden; }
/* Sidebar */
.forensics-sidebar { width: 200px; overflow-y: auto; border-right: 1px solid var(--line);
  padding: 8px; display: flex; flex-direction: column; gap: 2px; flex-shrink: 0; }
.forensics-tool-btn { display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 8px 12px; border-radius: var(--radius-sm); border: 1px solid transparent;
  background: transparent; color: var(--muted); cursor: pointer; font-size: 13px;
  font-family: inherit; text-align: left;
  transition: background-color var(--speed), border-color var(--speed), color var(--speed); }
.forensics-tool-btn:hover { background: var(--panel-elev); border-color: var(--line);
  color: var(--text); }
.forensics-tool-btn.active { background: var(--panel-elev); border-color: #3a3f49;
  color: var(--text); box-shadow: inset 3px 0 0 var(--text); }
.forensics-tool-icon { width: 16px; height: 16px; flex-shrink: 0; color: currentColor; }
.forensics-tool-icon svg { width: 16px; height: 16px; display: block; }
.forensics-tool-label { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; }
.forensics-tool-badge { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
  display: none; }
.forensics-tool-btn[data-mode="server"] .forensics-tool-badge { display: block;
  background: var(--muted); }
.forensics-tool-btn[data-mode="server"].forensics-cached .forensics-tool-badge {
  background: #3c845a; }
.forensics-tool-btn[data-mode="server"].forensics-running .forensics-tool-badge {
  background: #eab43c; animation: forensics-pulse 1s ease-in-out infinite; }
@keyframes forensics-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.3; } }
.forensics-tool-divider { height: 1px; background: var(--line); margin: 4px 8px; }
/* Workspace */
.forensics-workspace { flex: 1; display: flex; flex-direction: column; overflow: hidden;
  min-width: 0; }
.forensics-canvas-wrap { flex: 1; position: relative; overflow: hidden; background: #0d1117; }
.forensics-canvas-inner { position: absolute; top: 50%; left: 50%;
  transform-origin: 0 0; line-height: 0; }
.forensics-canvas-inner img { display: block; user-select: none; -webkit-user-drag: none; }
.forensics-canvas-inner canvas { position: absolute; top: 0; left: 0;
  width: 100%; height: 100%; pointer-events: none; }
.forensics-controls { border-top: 1px solid var(--line); padding: 0; max-height: 0;
  overflow: hidden; transition: max-height 240ms ease, padding 240ms ease, opacity 180ms ease;
  opacity: 0; }
.forensics-controls.open { max-height: 300px; padding: 12px 16px; opacity: 1; overflow-y: auto; }
.forensics-control-row { display: flex; align-items: center; gap: 10px; }
.forensics-control-label { font-size: 12px; color: var(--muted); min-width: 100px; }
.forensics-slider { width: 120px; height: 4px; -webkit-appearance: none; appearance: none;
  background: var(--line); border-radius: 2px; cursor: pointer; border: none; outline: none; }
.forensics-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px;
  border-radius: 50%; background: var(--muted); cursor: pointer; border: none; }
.forensics-slider::-webkit-slider-thumb:hover { background: var(--text); }
.forensics-slider::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%;
  background: var(--muted); cursor: pointer; border: none; }
.forensics-slider-val { font-size: 11px; color: var(--muted); min-width: 28px; text-align: right; }
.forensics-slider-units { font-size: 11px; color: #7a7e86; padding: 2px 8px;
  background: rgba(255,255,255,0.04); border-radius: 999px; white-space: nowrap; }
/* Footer */
.forensics-footer { display: flex; align-items: center; justify-content: space-between;
  padding: 8px 16px; border-top: 1px solid var(--line); flex-shrink: 0; }
.forensics-image-info { font-size: 12px; color: var(--muted); }
.forensics-tool-status { font-size: 12px; color: var(--muted); }
/* Loading overlay (server-side tools) */
.forensics-loading { position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; background: rgba(18,20,24,0.75);
  gap: 12px; border-radius: var(--radius); z-index: 1; }
.forensics-loading-spinner { width: 32px; height: 32px; border: 3px solid var(--line);
  border-top-color: var(--text); border-radius: 50%; animation: forensics-spin 0.8s linear infinite; }
@keyframes forensics-spin { to { transform: rotate(360deg); } }
.forensics-loading-text { font-size: 13px; color: var(--muted); }
/* Magnifier loupe */
.forensics-magnifier-loupe { width: 180px; height: 180px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.5); box-shadow: 0 4px 16px rgba(0,0,0,0.5);
  pointer-events: none; position: absolute; display: none; overflow: hidden;
  image-rendering: pixelated; z-index: 2; }
.forensics-magnifier-loupe canvas { width: 100%; height: 100%; display: block; }
/* Placeholder for unimplemented tools */
.forensics-placeholder { display: flex; align-items: center; justify-content: center;
  flex: 1; color: var(--muted); font-size: 13px; }
/* Responsive: tablet */
@media (max-width: 900px) {
  .forensics-sidebar { flex-direction: row; width: 100%; height: 48px; overflow-x: auto;
    overflow-y: hidden; border-right: none; border-bottom: 1px solid var(--line);
    padding: 4px 8px; gap: 4px; flex-shrink: 0; }
  .forensics-body { flex-direction: column; }
  .forensics-tool-label { display: none; }
  .forensics-tool-btn { padding: 6px 10px; justify-content: center; min-width: 36px; }
  .forensics-tool-divider { width: 1px; height: 24px; margin: 0 4px; }
}
/* Responsive: phone */
@media (max-width: 600px) {
  .forensics-panel { width: 100vw; height: 100vh; border-radius: 0; }
}
/* Forensics: compact custom dropdown */
.forensics-controls .select-wrap { display: inline-block; min-width: 110px; }
.forensics-controls .select-display { height: auto; padding: 4px 10px; font-size: 11px;
  border-radius: 6px; min-height: 0; gap: 6px; }
.forensics-controls .select-display::after { width: 5px; height: 5px; border-width: 1.5px; }
.forensics-controls .select-menu { border-radius: 8px; max-height: 180px; padding: 4px; }
.forensics-controls .select-option { padding: 5px 8px; font-size: 11px; border-radius: 5px; }
/* Forensics: horizontal checkbox row */
.forensics-checkbox-row { display: flex; align-items: center; gap: 12px;
  flex-wrap: wrap; padding-top: 2px; }
/* Forensics: control row spacing */
.forensics-controls-inner { display: flex; flex-direction: column; gap: 8px; }
/* Forensics: quantization table grid (JPEG Analysis) */
.forensics-qt-container { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 8px; }
.forensics-qt-wrap { }
.forensics-qt-title { font-size: 12px; color: var(--muted); margin-bottom: 4px; }
.forensics-qt-grid { display: inline-grid; grid-template-columns: repeat(8, 28px);
  gap: 1px; background: var(--line); border-radius: 4px; overflow: hidden; }
.forensics-qt-cell { font-size: 10px; font-family: monospace; text-align: center;
  padding: 3px 0; background: var(--panel-elev); }
/* Forensics: strings output */
.forensics-strings-list { font-family: monospace; font-size: 11px; line-height: 1.7;
  max-height: 260px; overflow-y: auto; }
.forensics-string-offset { color: var(--muted); display: inline-block; min-width: 70px;
  user-select: none; }
/* Forensics: marker table (JPEG Analysis) */
.forensics-marker-table { width: 100%; font-size: 11px; font-family: monospace;
  border-collapse: collapse; }
.forensics-marker-table td { padding: 2px 8px; border-bottom: 1px solid var(--line); }
.forensics-marker-table td:first-child { color: var(--muted); }
/* Forensics: info note */
.forensics-info-note { font-size: 12px; color: var(--muted); padding: 4px 0; font-style: italic; }
/* Forensics: AI detection results card */
.forensics-ai-result { padding: 12px; background: var(--panel-elev); border: 1px solid var(--line);
  border-radius: var(--radius); }
.forensics-ai-score-bar { height: 8px; border-radius: 4px; background: var(--line);
  overflow: hidden; margin: 8px 0; }
.forensics-ai-score-fill { height: 100%; border-radius: 4px; transition: width 300ms ease; }
.forensics-ai-label { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.forensics-ai-detail { font-size: 12px; color: var(--muted); }
.forensics-ai-detail code { font-size: 11px; background: rgba(255,255,255,0.06); padding: 1px 4px;
  border-radius: 3px; }
.forensics-ai-warning { font-size: 11px; color: var(--muted); font-style: italic; margin-top: 8px;
  padding-top: 8px; border-top: 1px solid var(--line); }

/* ════════════════════════════════════════════════════════════════════════
   Breaches Zone — tier-9 breach exposure aggregations
   Mirrors the structure of Social Profiles / Dorking zones with tabs
   per breach and a content pane.  Severity badges + credential rendering
   with the analyst-mandated "PW (unauth login = felony):" warning prefix.
   ════════════════════════════════════════════════════════════════════════ */
#breachesTabs {
  flex-wrap: wrap; max-height: 180px; overflow-y: auto;
}
#breachesTabs .nri-tab { padding: 5px 14px; font-size: 12px; }

.breach-pane { padding: 12px; }
.breach-pane-header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-bottom: 12px;
  padding-bottom: 10px; border-bottom: 1px solid var(--line);
}
.breach-pane-title { font-size: 16px; font-weight: 700; color: var(--text); }
.breach-sev-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: 999px; font-size: 11px;
  font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase;
}
.breach-sev-badge.high { background: rgba(220,38,38,0.15); color: #fca5a5; border: 1px solid rgba(220,38,38,0.4); }
.breach-sev-badge.medium { background: rgba(245,158,11,0.15); color: #fbbf24; border: 1px solid rgba(245,158,11,0.4); }
.breach-sev-badge.low { background: rgba(100,116,139,0.15); color: var(--muted); border: 1px solid rgba(100,116,139,0.4); }
.breach-sev-badge.skipped { background: rgba(100,116,139,0.1); color: var(--muted); border: 1px solid rgba(100,116,139,0.3); font-style: italic; }
.breach-sev-skipped { opacity: 0.85; }

/* Breach view toggle (Confirmed / Skipped) */
.breach-view-toggle { display: flex; justify-content: center; gap: 0; margin-bottom: 8px; }
.breach-toggle-btn {
  padding: 4px 14px; font-size: 12px; font-weight: 500;
  background: transparent; border: 1px solid var(--line);
  color: var(--muted); cursor: pointer; transition: background 0.15s, color 0.15s;
}
.breach-toggle-btn:first-child { border-radius: 4px 0 0 4px; }
.breach-toggle-btn:last-child { border-radius: 0 4px 4px 0; margin-left: -1px; }
.breach-toggle-btn.active { background: rgba(100,116,139,0.2); color: var(--text); border-color: var(--text); position: relative; z-index: 1; }
.breach-toggle-btn:hover:not(.active) { color: var(--text); }

/* Disambig info block within skipped breach panes */
.breach-disambig-info { border: 1px dashed var(--line); border-radius: 4px; padding: 8px; }

.breach-meta-grid {
  display: grid; grid-template-columns: max-content 1fr; gap: 6px 12px;
  font-size: 12px; margin-bottom: 12px;
}
.breach-meta-key { color: var(--muted); font-weight: 500; }
.breach-meta-val { color: var(--text); word-break: break-word; }
.breach-meta-val .breach-source-chip {
  display: inline-block; padding: 1px 8px; margin-right: 4px;
  background: rgba(255,255,255,0.06); border: 1px solid var(--line);
  border-radius: 3px; font-size: 10px; color: var(--text);
}

.breach-section-title {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.6px; color: var(--muted); margin: 12px 0 6px;
}

.breach-linked-list {
  display: flex; flex-direction: column; gap: 4px;
  font-size: 12px; max-height: 240px; overflow-y: auto;
}
.breach-linked-row {
  display: grid; grid-template-columns: 80px 1fr; gap: 12px;
  padding: 4px 8px; background: rgba(255,255,255,0.02);
  border-left: 2px solid var(--line); border-radius: 2px;
}
.breach-linked-row .breach-linked-type {
  color: var(--muted); font-size: 10px; text-transform: uppercase;
  font-weight: 600; align-self: center;
}
.breach-linked-row .breach-linked-val { color: var(--text); word-break: break-all; }

.breach-credentials {
  display: flex; flex-direction: column; gap: 6px;
  padding: 8px; background: rgba(220,38,38,0.04);
  border-left: 3px solid #dc2626; border-radius: 3px;
  max-height: 320px; overflow-y: auto;
}
.breach-cred-row { font-size: 11px; }
.breach-cred-id { color: var(--muted); margin-bottom: 2px; }
.breach-cred-pw {
  font-family: monospace; color: #fca5a5; word-break: break-all;
}
.breach-cred-hash {
  font-family: monospace; color: #94a3b8; font-size: 10px; word-break: break-all;
}

.breach-description {
  font-size: 11px; color: var(--muted); line-height: 1.5;
  padding: 8px; background: rgba(255,255,255,0.02);
  border-radius: 3px; max-height: 160px; overflow-y: auto;
  white-space: pre-wrap;
}

.breach-data-class-chip {
  display: inline-block; padding: 1px 8px; margin: 0 4px 4px 0;
  background: rgba(255,255,255,0.04); border: 1px solid var(--line);
  border-radius: 3px; font-size: 10px; color: var(--text);
}