@font-face {
  font-family: "Inter Variable";
  src: url("fonts/InterVariable.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Inter Variable";
  src: url("fonts/InterVariable-Italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  color-scheme: dark;
  --bg: #0b1118;
  --panel: #121a24;
  --panel-2: #172230;
  --panel-3: #1d2a38;
  --line: #293849;
  --line-soft: #202d3b;
  --text: #edf4fa;
  --muted: #93a5b5;
  --subtle: #6f8293;
  --accent: #4dc6c6;
  --accent-strong: #72dddd;
  --blue: #58a6ff;
  --red: #ff6b75;
  --amber: #efb64c;
  --green: #50cf8f;
  --purple: #a78bfa;
  --shadow: 0 18px 55px rgba(0, 0, 0, .34);
  --radius: 12px;
}

* { box-sizing: border-box; }
html { font-family: "Inter Variable", "Segoe UI Variable Text", "Segoe UI", system-ui, sans-serif; background: var(--bg); color: var(--text); font-synthesis: none; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { margin: 0; min-width: 320px; background: radial-gradient(circle at 78% -10%, rgba(77,198,198,.09), transparent 28%), var(--bg); }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; top: -48px; left: 20px; background: var(--accent); color: #061213; padding: 10px 16px; border-radius: 0 0 8px 8px; font-weight: 700; }
.skip-link:focus { top: 0; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 250px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 22px 16px; background: #0e161f; border-right: 1px solid var(--line-soft); }
.brand { display: flex; align-items: center; gap: 12px; padding: 4px 8px 26px; border-radius: 8px; color: var(--text); text-decoration: none; }
.brand:hover strong { color: var(--accent); }
.brand:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 15px; letter-spacing: .01em; }
.brand small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.brand-mark { width: 34px; height: 34px; position: relative; flex: 0 0 auto; }
.brand-mark span { position: absolute; width: 23px; height: 7px; background: var(--accent); border-radius: 2px; transform: skewX(-28deg); left: 5px; }
.brand-mark span:nth-child(1) { top: 4px; opacity: .55; }.brand-mark span:nth-child(2) { top: 13px; opacity: .78; }.brand-mark span:nth-child(3) { top: 22px; }
.sidebar nav { display: grid; gap: 5px; }
.nav-item { width: 100%; display: grid; grid-template-columns: 25px 1fr auto; align-items: center; gap: 7px; padding: 10px 11px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--muted); text-align: left; cursor: pointer; font-size: 13px; }
.nav-item:hover { background: var(--panel-2); color: var(--text); }
.nav-item.active { color: var(--text); background: linear-gradient(90deg, rgba(77,198,198,.16), rgba(77,198,198,.05)); border-color: rgba(77,198,198,.18); }
.nav-icon { color: var(--accent); font-size: 16px; text-align: center; }
.nav-count { color: var(--subtle); font-size: 11px; background: var(--panel-3); padding: 2px 7px; border-radius: 10px; }
.sidebar-section { border-top: 1px solid var(--line-soft); margin-top: 22px; padding-top: 16px; }
.sidebar-section > p { margin: 0 11px 8px; color: #607485; text-transform: uppercase; letter-spacing: .13em; font-size: 9px; font-weight: 700; }
.sidebar-foot { margin-top: auto; display: flex; align-items: center; gap: 10px; padding: 14px 10px 2px; border-top: 1px solid var(--line-soft); }
.sidebar-foot strong, .sidebar-foot small { display: block; font-size: 11px; }.sidebar-foot small { color: var(--muted); margin-top: 2px; }
.privacy-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(80,207,143,.12); }

.workspace { min-width: 0; }
.topbar { height: 66px; display: flex; align-items: center; gap: 18px; padding: 0 30px; background: rgba(11,17,24,.9); border-bottom: 1px solid var(--line-soft); position: sticky; top: 0; z-index: 15; backdrop-filter: blur(12px); }
.mobile-menu { display: none; border: 0; background: none; font-size: 20px; }
.search-wrap { flex: 1; max-width: 680px; display: flex; align-items: center; gap: 10px; color: var(--subtle); }
.search-wrap input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 13px; }
.search-wrap input::placeholder { color: #607384; }
kbd { border: 1px solid var(--line); background: var(--panel); color: var(--subtle); padding: 3px 7px; border-radius: 5px; font: 10px "Segoe UI", sans-serif; white-space: nowrap; }
.top-actions { margin-left: auto; display: flex; align-items: center; gap: 15px; }
.connection { color: var(--muted); font-size: 11px; display: flex; align-items: center; gap: 7px; }.connection i { width: 7px; height: 7px; background: var(--amber); border-radius: 50%; }.connection.online i { background: var(--green); }.connection.offline i { background: var(--red); }
.icon-button, .close-button { border: 1px solid var(--line); background: var(--panel); border-radius: 8px; cursor: pointer; }
.icon-button { width: 36px; height: 36px; color: var(--muted); font-size: 18px; }.icon-button:hover { color: var(--accent); border-color: var(--accent); }
.analyst { display: flex; align-items: center; gap: 9px; padding-left: 15px; border-left: 1px solid var(--line); }
.analyst > span { display: grid; place-items: center; width: 33px; height: 33px; border-radius: 50%; background: linear-gradient(135deg, #214d57, #1b303c); color: var(--accent-strong); font-size: 11px; font-weight: 700; }
.analyst strong, .analyst small { display: block; white-space: nowrap; }.analyst strong { font-size: 11px; }.analyst small { color: var(--muted); font-size: 10px; margin-top: 2px; }

main { padding: 33px 34px 55px; max-width: 1620px; margin: 0 auto; }
.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.eyebrow { margin: 0 0 7px; color: var(--accent); font-size: 10px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
h1 { margin: 0; font-size: clamp(26px, 3vw, 38px); letter-spacing: -.035em; font-weight: 650; }
.page-heading p:last-child { margin: 8px 0 0; color: var(--muted); font-size: 13px; }
.primary-button, .secondary-button { min-height: 39px; border-radius: 8px; padding: 0 15px; cursor: pointer; font-weight: 700; font-size: 12px; }
.primary-button { border: 1px solid var(--accent); color: #061415; background: var(--accent); box-shadow: 0 7px 22px rgba(77,198,198,.13); }.primary-button:hover { background: var(--accent-strong); }.primary-button span { font-size: 17px; margin-right: 6px; }
.secondary-button { border: 1px solid var(--line); background: var(--panel); color: var(--muted); }.secondary-button:hover { border-color: #577087; color: var(--text); }
.notice { display: flex; align-items: center; gap: 12px; padding: 12px 15px; border: 1px solid rgba(88,166,255,.18); background: rgba(88,166,255,.06); border-radius: 9px; margin-bottom: 20px; }
.notice > span { display: grid; place-items: center; width: 20px; height: 20px; flex: 0 0 auto; border: 1px solid var(--blue); color: var(--blue); border-radius: 50%; font-weight: 700; font-size: 11px; }
.notice p { margin: 0; color: #b8c7d4; font-size: 11px; line-height: 1.5; }

.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin-bottom: 18px; }
.metric-grid article { padding: 17px 18px; background: linear-gradient(145deg, var(--panel), #101820); border: 1px solid var(--line-soft); border-radius: var(--radius); }
.metric-label { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .07em; }
.metric-icon { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 6px; font-weight: 800; }.metric-icon.blue { color: var(--blue); background: rgba(88,166,255,.1); }.metric-icon.red { color: var(--red); background: rgba(255,107,117,.1); }.metric-icon.amber { color: var(--amber); background: rgba(239,182,76,.1); }.metric-icon.green { color: var(--green); background: rgba(80,207,143,.1); }
.metric-grid article > strong { display: block; font-size: 28px; margin: 13px 0 2px; font-variant-numeric: tabular-nums; }.metric-grid article > small { color: var(--subtle); font-size: 10px; }

.queue-card { background: var(--panel); border: 1px solid var(--line-soft); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.queue-toolbar { min-height: 75px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px 18px; border-bottom: 1px solid var(--line-soft); }.queue-toolbar > div:first-child { flex: 0 0 125px; }
.queue-toolbar h2 { margin: 0; font-size: 15px; }.queue-toolbar p { margin: 4px 0 0; color: var(--subtle); font-size: 10px; }
.filters { display: flex; align-items: end; justify-content: flex-end; flex-wrap: wrap; gap: 9px; }.filters label { display: grid; gap: 4px; }.filters label span { color: var(--subtle); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
select, input, textarea { color: var(--text); background: #0e1720; border: 1px solid var(--line); border-radius: 7px; outline: none; }
select:focus, input:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(77,198,198,.08); }
.filters select { min-width: 110px; height: 35px; padding: 0 25px 0 9px; color: var(--muted); font-size: 11px; }.queue-toolbar .secondary-button { padding: 0 10px; }
#queueSort { min-width: 150px; color: var(--text); }
.query-toggle { white-space: nowrap; }.query-toggle span { display: inline-grid; min-width: 18px; height: 18px; margin-left: 5px; place-items: center; border-radius: 9px; background: var(--panel-3); color: var(--subtle); font-size: 8px; }.query-toggle.active { border-color: rgba(77,198,198,.5); color: var(--accent); }.query-toggle.active span { background: rgba(77,198,198,.14); color: var(--accent); }
.query-builder { margin: 0 18px 18px; padding: 16px; border: 1px solid rgba(77,198,198,.22); border-radius: 9px; background: rgba(9,16,23,.72); }
.query-builder-heading, .query-builder-footer { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }.query-builder-heading h3 { margin: 2px 0 5px; font-size: 14px; }.query-builder-heading > div > p:last-child { margin: 0; color: var(--subtle); font-size: 9px; }.query-rows { display: grid; gap: 8px; margin: 15px 0; }.query-row { display: grid; grid-template-columns: 74px minmax(145px,1fr) minmax(140px,.8fr) minmax(190px,1.25fr) 34px; gap: 8px; align-items: center; }.query-row select, .query-row input { width: 100%; height: 36px; padding: 0 10px; color: var(--muted); font-size: 10px; }.query-value { min-width: 0; }.query-where, .query-no-value { color: var(--subtle); font-size: 9px; font-weight: 750; letter-spacing: .07em; }.query-where { padding-left: 9px; }.query-no-value { display: flex; min-height: 36px; align-items: center; padding: 0 10px; border: 1px dashed var(--line); border-radius: 6px; font-weight: 500; letter-spacing: 0; }.query-remove { width: 34px; height: 34px; border: 1px solid transparent; background: transparent; color: var(--subtle); font-size: 18px; cursor: pointer; }.query-remove:hover { border-color: rgba(255,107,117,.35); color: var(--red); }.query-empty { padding: 16px; border: 1px dashed var(--line); border-radius: 7px; color: var(--subtle); font-size: 10px; text-align: center; }
.query-builder-footer { padding-top: 13px; border-top: 1px solid var(--line-soft); align-items: center; }.query-builder-footer > div:last-child { display: flex; gap: 8px; flex: 0 0 auto; }.query-expression { min-width: 0; color: #a9bac7; font: 9px/1.55 ui-monospace, "Cascadia Mono", Consolas, monospace; overflow-wrap: anywhere; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 11px; }
th { padding: 11px 14px; color: var(--subtle); background: #101821; text-align: left; text-transform: uppercase; letter-spacing: .07em; font-size: 9px; border-bottom: 1px solid var(--line-soft); }
td { padding: 14px; border-bottom: 1px solid var(--line-soft); color: #b8c7d3; vertical-align: middle; }
tbody tr { cursor: pointer; transition: background .15s ease; } tbody tr:hover { background: rgba(77,198,198,.035); } tbody tr:last-child td { border-bottom: 0; }
.incident-number { color: var(--accent); font-weight: 700; font-variant-numeric: tabular-nums; }.incident-title { color: var(--text); font-weight: 600; width: 34%; max-width: 350px; }.incident-title small { display: block; color: var(--subtle); font-weight: 400; margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.incident-title-line { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 7px; min-width: 0; }
.incident-title-copy { min-width: 0; overflow-wrap: anywhere; }
.origin-badge { display: inline-flex; flex: 0 0 auto; align-items: center; width: max-content; padding: 3px 7px; border: 1px solid rgba(167,139,250,.32); border-radius: 10px; background: rgba(167,139,250,.09); color: #c4afff; font-size: 8px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.badge { display: inline-flex; align-items: center; gap: 5px; border: 1px solid; border-radius: 12px; padding: 4px 8px; font-size: 9px; font-weight: 750; white-space: nowrap; }.badge::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }.critical { color: var(--red); border-color: rgba(255,107,117,.28); background: rgba(255,107,117,.07); }.high { color: #ff985f; border-color: rgba(255,152,95,.28); background: rgba(255,152,95,.07); }.medium { color: var(--amber); border-color: rgba(239,182,76,.28); background: rgba(239,182,76,.07); }.low { color: var(--blue); border-color: rgba(88,166,255,.28); background: rgba(88,166,255,.07); }.informational { color: var(--muted); border-color: var(--line); }.status-badge { color: #aab9c6; border-color: var(--line); background: #111b25; }.status-badge.resolved, .status-badge.closed { color: var(--green); border-color: rgba(80,207,143,.24); background: rgba(80,207,143,.07); }
.empty-state { min-height: 390px; display: grid; place-items: center; align-content: center; text-align: center; padding: 48px 20px; }
.empty-state h3 { margin: 22px 0 8px; font-size: 17px; }.empty-state p { max-width: 470px; margin: 0 0 20px; color: var(--muted); line-height: 1.6; font-size: 12px; }
.empty-illustration { width: 94px; height: 74px; border: 1px solid var(--line); border-radius: 9px; position: relative; background: #0e1720; box-shadow: 14px 12px 0 -5px #121d27, 14px 12px 0 -4px var(--line); }.empty-illustration::before { content: ""; position: absolute; inset: 10px 11px auto; height: 6px; border-radius: 3px; background: rgba(77,198,198,.35); }.empty-illustration span { position: absolute; left: 12px; right: 12px; height: 5px; background: var(--line); border-radius: 3px; }.empty-illustration span:nth-child(1) { top: 31px; }.empty-illustration span:nth-child(2) { top: 43px; right: 30px; }.empty-illustration span:nth-child(3) { top: 55px; right: 20px; }

.modal-backdrop, .drawer-backdrop { position: fixed; inset: 0; z-index: 40; background: rgba(3,8,13,.78); backdrop-filter: blur(3px); }
.modal-backdrop { display: grid; place-items: center; padding: 24px; }
.editor-modal, .kb-editor-modal { width: min(1180px, 96vw); height: min(850px, 94vh); display: flex; flex-direction: column; background: var(--panel); border: 1px solid #334659; border-radius: 14px; box-shadow: 0 30px 90px rgba(0,0,0,.58); overflow: hidden; }
.kb-editor-modal { width: min(980px, 96vw); }
.editor-modal > header, .kb-editor-modal > header, .detail-drawer > header { display: flex; align-items: center; justify-content: space-between; padding: 18px 21px; border-bottom: 1px solid var(--line); background: #111a23; }.editor-modal h2, .kb-editor-modal h2, .detail-drawer h2 { margin: 0; font-size: 19px; }.editor-modal .eyebrow, .kb-editor-modal .eyebrow, .detail-drawer .eyebrow { margin-bottom: 4px; }
.close-button { width: 34px; height: 34px; color: var(--muted); font-size: 22px; line-height: 1; }.close-button:hover { color: var(--text); border-color: var(--subtle); }
.editor-layout { display: grid; grid-template-columns: 205px minmax(0,1fr); min-height: 0; flex: 1; }
.form-nav { background: #0f1821; border-right: 1px solid var(--line); padding: 16px 11px; display: flex; flex-direction: column; gap: 5px; }
.form-nav button { display: flex; align-items: center; gap: 10px; padding: 11px 10px; border: 1px solid transparent; border-radius: 7px; color: var(--muted); background: transparent; cursor: pointer; text-align: left; font-size: 11px; }.form-nav button span { color: var(--subtle); font-size: 9px; }.form-nav button.active { color: var(--text); background: var(--panel-3); border-color: var(--line); }.form-nav button.active span { color: var(--accent); }
#incidentForm, #knowledgeForm { display: flex; min-height: 0; flex-direction: column; flex: 1; }
.form-section { display: none; flex: 1; overflow-y: auto; padding: 27px 30px 35px; }.form-section.active { display: block; }
.section-intro { padding-bottom: 18px; margin-bottom: 20px; border-bottom: 1px solid var(--line-soft); }.section-intro h3 { margin: 0 0 5px; font-size: 16px; }.section-intro p { margin: 0; color: var(--muted); font-size: 11px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 15px; }.form-grid.three { grid-template-columns: repeat(3, minmax(0,1fr)); }.field { margin-bottom: 16px; }.field.full { width: 100%; }
.field label { display: block; color: #bdcad5; font-size: 10px; font-weight: 700; margin: 0 0 6px; }.field label em { color: var(--accent); font-style: normal; font-size: 8px; text-transform: uppercase; margin-left: 4px; }.field input, .field select, .field textarea { width: 100%; padding: 10px 11px; font-size: 11px; }.field input, .field select { height: 38px; }.field textarea { min-height: 95px; resize: vertical; line-height: 1.6; }.field small { display: block; color: var(--subtle); font-size: 9px; margin-top: 6px; }
.integrity-check { display: flex; align-items: flex-start; gap: 10px; padding: 14px; border: 1px solid rgba(77,198,198,.2); background: rgba(77,198,198,.05); border-radius: 8px; color: #c7d5df; font-size: 11px; line-height: 1.5; }.integrity-check input { width: 16px; height: 16px; margin: 1px 0 0; accent-color: var(--accent); }
.form-footer { min-height: 67px; flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); padding: 12px 20px; background: #101821; }.form-footer > span { color: var(--subtle); font-size: 10px; }.form-footer > div { display: flex; gap: 9px; }

.drawer-backdrop { display: flex; justify-content: flex-end; }
.detail-drawer { width: min(760px, 96vw); height: 100%; overflow-y: auto; background: var(--panel); border-left: 1px solid #334659; box-shadow: -25px 0 70px rgba(0,0,0,.4); }
.detail-drawer > header { position: sticky; top: 0; z-index: 2; }
.detail-body { padding: 24px; }.detail-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }.detail-actions .secondary-button { min-height: 34px; }
.source-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.source-link.wazuh-link { border-color: #5a7ff0; color: #b7c7ff; }
.source-link.splunk-link { border-color: #4da96f; color: #a7e8bd; }
.detail-section-heading { display: grid; gap: 10px; margin-bottom: 10px; }
.detail-section-heading h3 { margin: 0; }
.relation-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.compact-button { min-height: 31px; padding: 0 10px; }
.detail-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 9px; margin-bottom: 23px; }.detail-summary div { padding: 11px; border: 1px solid var(--line-soft); background: #0f1821; border-radius: 7px; }.detail-summary span, .detail-section h3 { color: var(--subtle); text-transform: uppercase; letter-spacing: .08em; font-size: 8px; font-weight: 800; }.detail-summary strong { display: block; font-size: 11px; margin-top: 5px; overflow-wrap: anywhere; }
.detail-section { padding: 18px 0; border-top: 1px solid var(--line-soft); }.detail-section h3 { margin: 0 0 10px; color: var(--accent); }.detail-section p { color: #bdcbd6; font-size: 11px; line-height: 1.65; margin: 0; white-space: pre-wrap; }.detail-section.empty p { color: var(--subtle); font-style: italic; }
.record-integrity { display: flex; gap: 9px; align-items: center; padding: 12px; margin-top: 18px; border-radius: 7px; background: rgba(80,207,143,.06); border: 1px solid rgba(80,207,143,.18); color: #b9ddca; font-size: 10px; }
.record-hash { display: grid; gap: 6px; padding: 12px; margin-top: 9px; border: 1px solid var(--line); border-radius: 7px; background: #0f1821; color: var(--muted); font-size: 9px; line-height: 1.5; overflow-wrap: anywhere; }
.record-hash strong { color: var(--text); font-size: 10px; }
.record-hash code { color: var(--subtle); font: 8px ui-monospace, "Cascadia Mono", Consolas, monospace; word-break: break-all; }
.record-hash.verified { border-color: rgba(80,207,143,.22); background: rgba(80,207,143,.045); }
.record-hash.verified strong { color: var(--green); }
.record-hash.mismatch { border-color: rgba(255,107,117,.4); background: rgba(255,107,117,.08); }
.record-hash.mismatch strong { color: var(--red); }
.record-hash.not-generated strong { color: var(--amber); }
.provenance-block { margin: 0 0 18px; padding: 15px; border: 1px solid rgba(167,139,250,.3); border-radius: 9px; background: linear-gradient(135deg, rgba(167,139,250,.09), rgba(88,166,255,.035)); }
.provenance-label { display: flex; align-items: center; gap: 9px; }
.provenance-label strong { font-size: 11px; }
.provenance-block > p { margin: 11px 0 9px; color: #c7d2dc; font-size: 10px; line-height: 1.6; }
.provenance-facts { display: flex; flex-wrap: wrap; gap: 7px; }
.provenance-facts span { padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; background: rgba(11,17,24,.45); color: var(--muted); font-size: 8px; overflow-wrap: anywhere; }
.provenance-block small { display: block; margin-top: 10px; color: var(--subtle); font-size: 8px; }
.audit-section { overflow: hidden; }
.audit-list { list-style: none; margin: 13px 0 0; padding: 0; }
.audit-list li { position: relative; display: grid; grid-template-columns: 12px minmax(0,1fr); gap: 9px; padding: 0 0 18px; }
.audit-list li:last-child { padding-bottom: 0; }
.audit-list li:not(:last-child)::before { content: ""; position: absolute; left: 5px; top: 11px; bottom: 0; width: 1px; background: var(--line); }
.audit-node { position: relative; z-index: 1; width: 11px; height: 11px; margin-top: 3px; border: 2px solid var(--accent); border-radius: 50%; background: var(--panel); }
.audit-entry { min-width: 0; }
.audit-entry-head { display: grid; gap: 3px; }
.audit-entry-head strong { color: var(--text); font-size: 10px; }
.audit-entry-head time { color: var(--subtle); font-size: 8px; font-variant-numeric: tabular-nums; }
.audit-actor { display: block; margin-top: 5px; color: var(--accent); font-size: 9px; overflow-wrap: anywhere; }
.audit-entry p { margin: 5px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.evidence-upload-panel { margin: 2px 0 20px; padding: 17px; border: 1px solid rgba(88,166,255,.24); border-radius: 9px; background: rgba(88,166,255,.045); }
.evidence-upload-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.evidence-upload-heading h4 { margin: 0 0 5px; font-size: 12px; }
.evidence-upload-heading p { max-width: 680px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.evidence-limit { flex: 0 0 auto; padding: 4px 8px; border: 1px solid var(--line); border-radius: 12px; color: var(--blue); font-size: 8px; font-weight: 750; }
.evidence-upload-controls { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 9px; align-items: center; margin-top: 14px; }
.evidence-upload-controls input[type="file"] { width: 100%; min-height: 39px; padding: 8px; color: var(--muted); font-size: 10px; }
.evidence-upload-controls input[type="file"]::file-selector-button { margin-right: 10px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 5px; background: var(--panel-2); color: var(--text); cursor: pointer; }
.evidence-upload-note, .evidence-loading, .evidence-empty, .evidence-error { margin: 9px 0 0; color: var(--subtle); font-size: 9px; line-height: 1.5; }
.evidence-error { color: var(--red); }
.evidence-file-list { display: grid; gap: 8px; margin-top: 12px; }
.evidence-file { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: 11px; align-items: center; padding: 11px; border: 1px solid var(--line); border-radius: 8px; background: #0e1720; }
.evidence-file-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 7px; background: rgba(88,166,255,.1); color: var(--blue); font-size: 8px; font-weight: 800; }
.evidence-file-copy { min-width: 0; display: grid; gap: 4px; }
.evidence-file-copy strong { overflow: hidden; color: var(--text); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.evidence-file-copy span { color: var(--muted); font-size: 8px; }
.evidence-file-copy code { overflow: hidden; color: var(--subtle); font: 8px ui-monospace, "Cascadia Mono", Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.evidence-file .secondary-button { min-height: 32px; }

.knowledge-view { display: grid; gap: 18px; }
.kb-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding: 20px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: linear-gradient(145deg, var(--panel), #101820); }
.kb-toolbar h2 { margin: 0; font-size: 24px; letter-spacing: -.025em; }
.kb-toolbar > div > p:last-child { margin: 6px 0 0; color: var(--subtle); font-size: 10px; }
.kb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(315px, 1fr)); gap: 14px; }
.kb-card { min-height: 220px; padding: 19px; display: flex; flex-direction: column; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--panel); box-shadow: 0 12px 34px rgba(0,0,0,.2); cursor: pointer; transition: border-color .15s ease, transform .15s ease, background .15s ease; }
.kb-card:hover, .kb-card:focus { border-color: rgba(77,198,198,.48); background: #14202b; transform: translateY(-2px); outline: none; }
.kb-card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.kb-card h3 { margin: 18px 0 9px; font-size: 16px; line-height: 1.35; }
.kb-card > p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.kb-card-meta { display: flex; flex-wrap: wrap; gap: 7px 13px; margin-top: auto; padding-top: 19px; color: var(--subtle); font-size: 9px; }
.kb-tag-filter { display: flex; align-items: center; gap: 9px; margin: 0 0 14px; padding: 10px 12px; border: 1px solid rgba(77,198,198,.25); border-radius: 8px; background: rgba(77,198,198,.055); }
.kb-tag-filter span { color: var(--subtle); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.kb-tag-filter strong { color: var(--accent); font-size: 10px; }
.kb-tag-filter button { margin-left: auto; padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel-2); color: var(--muted); cursor: pointer; font-size: 9px; }
.kb-tag-filter button:hover { border-color: var(--accent); color: var(--text); }
.kb-status { padding: 4px 8px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: #101923; font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.kb-status.test { color: var(--amber); border-color: rgba(239,182,76,.28); background: rgba(239,182,76,.07); }
.kb-status.published { color: var(--green); border-color: rgba(80,207,143,.24); background: rgba(80,207,143,.07); }
.kb-status.draft { color: var(--blue); border-color: rgba(88,166,255,.28); background: rgba(88,166,255,.07); }
.kb-status.retired { color: var(--subtle); }
.kb-form-body { flex: 1; min-height: 0; overflow-y: auto; padding: 26px 30px 40px; }
.form-block { padding-bottom: 8px; margin-bottom: 26px; border-bottom: 1px solid var(--line-soft); }
.form-block:last-child { border-bottom: 0; margin-bottom: 0; }
.form-block > h3 { margin: 0 0 18px; font-size: 15px; }
.relation-picker { max-height: 190px; overflow-y: auto; display: grid; gap: 7px; padding: 9px; border: 1px solid var(--line); border-radius: 8px; background: #0e1720; }
.relation-picker > p { margin: 7px; color: var(--subtle); font-size: 10px; }
.relation-option { display: flex !important; align-items: flex-start; gap: 10px; padding: 9px; margin: 0 !important; border: 1px solid transparent; border-radius: 6px; cursor: pointer; }
.relation-option:hover { border-color: var(--line); background: var(--panel-2); }
.relation-option input { width: 15px; height: 15px; margin: 1px 0 0; flex: 0 0 auto; accent-color: var(--accent); }
.relation-option span { display: grid; gap: 3px; color: var(--muted); font-size: 10px; font-weight: 450; }
.relation-option strong { color: var(--accent); font-size: 9px; letter-spacing: .03em; }
.relation-chips { display: grid; gap: 7px; }
.relation-chips > p { color: var(--subtle); font-style: italic; }
.relation-chip { display: grid; grid-template-columns: 105px 1fr; gap: 10px; align-items: center; width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: 7px; background: #0f1821; color: var(--muted); cursor: pointer; text-align: left; font-size: 10px; }
.relation-chip:hover { border-color: var(--accent); color: var(--text); }
.relation-chip strong { color: var(--accent); font-size: 9px; }

.knowledge-article-view, .incident-record-view { display: grid; gap: 18px; }
.kb-page-header { padding: 24px 27px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: linear-gradient(145deg, var(--panel), #101820); }
.kb-back { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 22px; padding: 0; border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 11px; font-weight: 650; }
.kb-back:hover { color: var(--accent); }
.kb-back span { font-size: 16px; }
.kb-page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.kb-page-heading h1 { max-width: 1050px; font-size: clamp(26px, 3.4vw, 43px); line-height: 1.12; }
.kb-page-header .detail-actions { margin: 22px 0 0; }
.kb-page-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.kb-page-summary > div { min-height: 70px; padding: 14px; border: 1px solid var(--line-soft); border-radius: 8px; background: var(--panel); }
.kb-page-summary span { color: var(--subtle); text-transform: uppercase; letter-spacing: .08em; font-size: 8px; font-weight: 800; }
.kb-page-summary strong { display: block; margin-top: 8px; font-size: 11px; overflow-wrap: anywhere; }
.kb-page-summary > .state-tile { border-left: 3px solid var(--state-color, var(--line)); padding-left: 12px; }
.severity-critical { --state-color: var(--red); }.severity-high { --state-color: #ff985f; }.severity-medium { --state-color: var(--amber); }.severity-low { --state-color: var(--blue); }.severity-informational { --state-color: #738495; }
.status-new { --state-color: var(--blue); }.status-in-progress { --state-color: var(--amber); }.status-contained, .status-monitoring { --state-color: var(--accent); }.status-resolved, .status-closed { --state-color: var(--green); }.status-draft { --state-color: #738495; }
.classification-true-positive { --state-color: rgba(80,207,143,.72); }.classification-false-positive, .classification-benign-true-positive, .classification-expected-test-activity { --state-color: rgba(88,166,255,.55); }.classification-unclassified { --state-color: #52616e; }
.confidence-high { --state-color: rgba(80,207,143,.7); }.confidence-moderate { --state-color: rgba(239,182,76,.62); }.confidence-low { --state-color: rgba(255,107,117,.58); }.confidence-not-assessed { --state-color: #52616e; }
.incident-page-summary { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.summary-group { --group-color: 88,166,255; position: relative; overflow: hidden; padding: 15px; border: 1px solid rgba(var(--group-color),.2); border-radius: 10px; background: linear-gradient(145deg, rgba(var(--group-color),.055), rgba(16,25,35,.88) 46%); box-shadow: 0 12px 28px rgba(0,0,0,.14); }
.summary-group::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, rgba(var(--group-color),.9), rgba(var(--group-color),0)); }
.summary-group > h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; color: rgba(var(--group-color),.92); font-size: 9px; text-transform: uppercase; letter-spacing: .11em; }
.summary-group > h2 > span { width: 7px; height: 7px; border: 1px solid rgba(var(--group-color),.85); border-radius: 2px; background: rgba(var(--group-color),.18); }
.summary-group-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.summary-item { min-height: 67px; padding: 13px; border: 1px solid rgba(var(--group-color),.13); border-radius: 8px; background: rgba(7,14,21,.46); }
.summary-item > span { color: rgba(var(--group-color),.72); text-transform: uppercase; letter-spacing: .08em; font-size: 8px; font-weight: 800; }
.summary-item > strong { display: block; margin-top: 8px; color: var(--text); font-size: 11px; overflow-wrap: anywhere; }
.summary-item.state-tile { border-left: 3px solid var(--state-color, var(--line)); padding-left: 11px; background: linear-gradient(110deg, rgba(255,255,255,.022), rgba(7,14,21,.48)); }
.summary-group-state { --group-color: 201,154,82; }
.summary-group-context { --group-color: 88,166,255; }
.summary-group-ownership { --group-color: 167,139,250; }
.summary-group-scope { --group-color: 77,198,198; }
.mitre-combobox { display: grid; grid-template-columns: minmax(0,1fr) max-content; gap: 9px; }
.mitre-combobox .secondary-button { height: 38px; }
.mitre-chip-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 10px; align-items: start; }
.mitre-chip-list.editor { min-height: 56px; margin-top: 10px; padding: 11px; border: 1px solid var(--line-soft); border-radius: 8px; background: #0f1821; }
.mitre-empty { align-self: center; margin: 0; color: var(--subtle); font-size: 10px; font-style: italic; }
.mitre-chip { --tech: #77bdfb; display: grid; grid-template-columns: minmax(0,1fr) max-content max-content; align-items: center; min-width: 0; min-height: 66px; padding: 0; overflow: hidden; border: 1px solid color-mix(in srgb, var(--tech) 40%, transparent); border-left: 3px solid var(--tech); border-radius: 9px; background: #111c26; color: #d5e1e9; transition: border-color .16s ease, background .16s ease, transform .16s ease; }
.mitre-chip.suggested { border-style: dashed; border-left-style: solid; opacity: .78; }
.mitre-chip:has(.mapping-reference-link:hover), .mitre-chip:has(.mapping-reference-link:focus-visible) { border-color: var(--tech); background: color-mix(in srgb, var(--tech) 6%, #111c26); transform: translateY(-1px); }
.mapping-reference-link { display: grid; grid-template-columns: max-content minmax(0,1fr) 16px; align-items: center; gap: 11px; min-width: 0; min-height: 64px; padding: 11px 12px; color: inherit; text-decoration: none; }
.mapping-reference-link:focus-visible { outline: 2px solid var(--tech, var(--accent)); outline-offset: -3px; border-radius: 7px; }
.mapping-code { min-width: 54px; padding: 6px 7px; border: 1px solid color-mix(in srgb, var(--tech, var(--accent)) 38%, transparent); border-radius: 6px; background: color-mix(in srgb, var(--tech, var(--accent)) 10%, transparent); color: var(--tech, var(--accent)); font: 750 10px/1.1 ui-monospace, SFMono-Regular, Consolas, monospace; text-align: center; }
.mapping-copy { display: block; min-width: 0; }
.mapping-copy strong { display: block; margin: 0 0 4px; color: var(--text); font-size: 11px; line-height: 1.35; }
.mapping-copy small { display: block; overflow: hidden; color: var(--subtle); font-size: 8px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.mapping-external { align-self: start; color: var(--tech, var(--accent)); font-size: 13px; line-height: 1; opacity: .72; }
.mitre-chip button { margin-right: 7px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 6px; background: #17232e; color: var(--muted); cursor: pointer; font-size: 8px; font-weight: 750; }
.mitre-chip button:hover { border-color: var(--tech); color: var(--text); }
.mitre-chip .mitre-remove { padding: 3px 6px; font-size: 13px; line-height: 1; }
.mitre-version { margin-top: 11px !important; color: var(--subtle) !important; font-size: 9px !important; }
.nist-picker { display: grid; grid-template-columns: minmax(150px,.45fr) minmax(260px,1fr) max-content; gap: 9px; }
.nist-picker .secondary-button { height: 38px; }
.nist-mapping-list { display: grid; gap: 10px; }
.nist-mapping-list.editor { min-height: 56px; margin-top: 10px; padding: 11px; border: 1px solid var(--line-soft); border-radius: 8px; background: #0f1821; }
.nist-function-group { display: grid; grid-template-columns: 112px minmax(0,1fr); gap: 13px; align-items: start; }
.nist-function-label { display: grid; grid-template-columns: 34px minmax(0,1fr); align-items: center; gap: 7px; padding-top: 12px; color: var(--accent); text-transform: uppercase; }
.nist-function-label strong { display: grid; place-items: center; min-height: 26px; border: 1px solid rgba(77,198,198,.38); border-radius: 6px; background: rgba(77,198,198,.09); font: 800 9px/1 ui-monospace, SFMono-Regular, Consolas, monospace; }
.nist-function-label span { color: var(--muted); font-size: 9px; font-weight: 750; letter-spacing: .07em; }
.nist-function-items { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 9px; }
.nist-chip { --tech: var(--accent); display: grid; grid-template-columns: minmax(0,1fr) max-content; align-items: center; min-width: 0; min-height: 66px; padding: 0; overflow: hidden; border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: 9px; background: #111c26; color: var(--text); transition: border-color .16s ease, background .16s ease, transform .16s ease; }
.nist-chip:has(.mapping-reference-link:hover), .nist-chip:has(.mapping-reference-link:focus-visible) { border-color: rgba(77,198,198,.65); background: rgba(77,198,198,.055); transform: translateY(-1px); }
.nist-chip button { margin-right: 7px; padding: 3px 6px; border: 1px solid var(--line); border-radius: 6px; background: #17232e; color: var(--muted); cursor: pointer; font-size: 13px; line-height: 1; }
.nist-chip button:hover { border-color: var(--accent); color: var(--text); }
.nist-empty { align-self: center; margin: 0; color: var(--subtle); font-size: 10px; font-style: italic; }
.nist-version { margin-top: 11px !important; color: var(--subtle) !important; font-size: 9px !important; }
.tactic-0 { --tech: #57c7ff; }.tactic-1 { --tech: #8aa8ff; }.tactic-2 { --tech: #a78bfa; }.tactic-3 { --tech: #dd83d7; }.tactic-4 { --tech: #ff7f98; }.tactic-5 { --tech: #ff9470; }.tactic-6 { --tech: #efb64c; }.tactic-7 { --tech: #c6c85b; }.tactic-8 { --tech: #8dce65; }.tactic-9 { --tech: #50cf8f; }.tactic-10 { --tech: #45c7b8; }.tactic-11 { --tech: #4eb8d7; }.tactic-12 { --tech: #6ba4ef; }.tactic-13 { --tech: #9b94ed; }.tactic-14 { --tech: #bd86d9; }
.kb-page-layout { display: grid; grid-template-columns: minmax(230px, 290px) minmax(0, 1fr); gap: 18px; align-items: start; }
.kb-page-rail { position: sticky; top: 84px; padding: 20px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--panel); }
.kb-page-rail > h2 { margin: 0 0 5px; font-size: 14px; }
.kb-page-rail .detail-section { padding: 17px 0; }
.kb-page-rail .relation-chip { grid-template-columns: 1fr; gap: 4px; }
.kb-page-rail .record-integrity { align-items: flex-start; line-height: 1.55; overflow-wrap: anywhere; }
.kb-page-content { padding: 4px 28px 34px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--panel); }
.kb-content-section { padding: 28px 0; border-bottom: 1px solid var(--line-soft); }
.kb-content-section:last-child { border-bottom: 0; }
.kb-content-section h2 { margin: 0 0 14px; color: var(--accent); font-size: 11px; text-transform: uppercase; letter-spacing: .09em; }
.kb-content-section p { max-width: 1000px; margin: 0; color: #cad6df; font-size: 13px; line-height: 1.85; white-space: pre-wrap; }
.kb-content-section.empty p { color: var(--subtle); font-style: italic; }
.kb-rich-body { max-width: 1040px; color: #cad6df; font-size: 13px; line-height: 1.75; }
.kb-rich-body > :first-child { margin-top: 0; }
.kb-rich-body > :last-child { margin-bottom: 0; }
.kb-rich-body p { margin: 0 0 15px; white-space: normal; }
.kb-rich-body h3 { margin: 30px 0 12px; padding: 0 0 9px; border-bottom: 1px solid rgba(77,198,198,.22); color: var(--text); font-size: 18px; line-height: 1.35; }
.kb-rich-body h4 { margin: 24px 0 10px; color: #a9d5ef; font-size: 15px; line-height: 1.4; }
.kb-rich-body h5, .kb-rich-body h6 { margin: 20px 0 8px; color: var(--muted); font-size: 13px; line-height: 1.4; }
.kb-rich-body hr { height: 1px; margin: 26px 0; border: 0; background: linear-gradient(90deg, rgba(77,198,198,.5), var(--line-soft) 55%, transparent); }
.kb-rich-body ul, .kb-rich-body ol { display: grid; gap: 8px; margin: 10px 0 20px; padding-left: 24px; }
.kb-rich-body li { padding-left: 4px; }
.kb-rich-body li::marker { color: var(--accent); font-weight: 800; }
.kb-rich-body blockquote { margin: 16px 0 20px; padding: 13px 16px; border-left: 3px solid var(--accent); border-radius: 0 7px 7px 0; background: rgba(77,198,198,.055); }
.kb-rich-body blockquote p { margin: 0 0 7px; color: #bcd5df; }
.kb-rich-body blockquote p:last-child { margin-bottom: 0; }
.kb-rich-body code { padding: 2px 5px; border: 1px solid rgba(88,166,255,.2); border-radius: 4px; background: #0a1219; color: #b7d8ff; font: .9em/1.5 ui-monospace, "Cascadia Mono", Consolas, monospace; }
.kb-rich-body pre { max-width: 100%; margin: 16px 0 22px; padding: 15px 17px; overflow-x: auto; border: 1px solid var(--line); border-left: 3px solid var(--blue); border-radius: 8px; background: #091118; }
.kb-rich-body pre code { padding: 0; border: 0; background: transparent; color: #c9d8e3; white-space: pre; }
.kb-rich-body strong { color: var(--text); }
.kb-reference-list { display: grid; gap: 9px; }
.kb-reference-card { display: grid; grid-template-columns: minmax(220px,1fr) max-content; gap: 16px; align-items: center; padding: 12px 14px; border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: 8px; background: #101a23; }
.kb-reference-card > div:first-child { display: grid; grid-template-columns: 84px minmax(0,1fr); gap: 3px 10px; align-items: center; }
.kb-reference-card > div:first-child span { grid-row: 1 / 3; color: var(--accent); font: 800 10px/1.2 ui-monospace, "Cascadia Mono", Consolas, monospace; }
.kb-reference-card strong { color: var(--text); font-size: 11px; }
.kb-reference-card small { color: var(--subtle); font-size: 8px; }
.kb-reference-card > div:last-child { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.kb-reference-card a { padding: 7px 9px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font-size: 9px; font-weight: 700; text-decoration: none; }
.kb-reference-card a:hover, .kb-reference-card a:focus-visible { border-color: var(--accent); color: var(--text); outline: none; }
.kb-reference-source { margin-top: 12px; color: var(--muted); }
.kb-reference-source summary { cursor: pointer; color: var(--subtle); font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
.kb-reference-source .kb-rich-body, .kb-reference-source > p { margin-top: 11px; }
.kb-tag-list { display: flex; flex-wrap: wrap; gap: 8px; }
.kb-tag-list button { padding: 7px 10px; border: 1px solid rgba(77,198,198,.28); border-radius: 14px; background: rgba(77,198,198,.06); color: var(--accent); cursor: pointer; font-size: 9px; font-weight: 750; }
.kb-tag-list button:hover, .kb-tag-list button:focus-visible { border-color: var(--accent); background: rgba(77,198,198,.12); color: var(--text); outline: none; }
.incident-line-list { display: grid; gap: 8px; max-width: 1040px; margin: 0; padding: 0; list-style: none; }
.incident-line-list li { display: grid; grid-template-columns: 16px minmax(0,1fr); gap: 7px; align-items: start; padding: 8px 11px; border-left: 2px solid rgba(77,198,198,.34); border-radius: 0 6px 6px 0; background: rgba(77,198,198,.035); }
.incident-line-list li > span { padding-top: 2px; color: var(--accent); font-size: 15px; line-height: 1.4; }
.incident-line-list li > p { line-height: 1.65; white-space: normal; }

.analytics-view { display: grid; gap: 14px; }.analytics-card { background: var(--panel); border: 1px solid var(--line-soft); border-radius: var(--radius); padding: 20px; }.analytics-card h2 { font-size: 15px; margin: 0 0 16px; }.bar-row { display: grid; grid-template-columns: 140px 1fr 35px; gap: 12px; align-items: center; margin: 11px 0; font-size: 10px; color: var(--muted); }.bar-track { height: 8px; background: #0d151d; border-radius: 4px; overflow: hidden; }.bar-fill { height: 100%; background: linear-gradient(90deg, var(--accent), var(--blue)); border-radius: inherit; }.framework-empty { min-height: 280px; display: grid; place-items: center; text-align: center; color: var(--muted); }.framework-empty strong { display: block; color: var(--text); margin-bottom: 7px; }
.framework-workspace { display: grid; gap: 14px; }
.framework-query-page { display: grid; gap: 14px; }
.framework-query-page > .kb-back { width: max-content; margin: 0; padding: 4px 0; }
.framework-header { display: flex; justify-content: space-between; gap: 28px; padding: 24px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: linear-gradient(120deg, rgba(77,198,198,.07), rgba(88,166,255,.035) 52%, var(--panel)); }
.framework-header h1 { margin: 3px 0 8px; font-size: 25px; }
.framework-header p:last-child { max-width: 700px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.framework-summary { display: grid; grid-template-columns: repeat(3, minmax(90px,1fr)); gap: 8px; align-self: center; }
.framework-summary span { min-width: 100px; padding: 11px; border: 1px solid rgba(77,198,198,.18); border-radius: 8px; background: rgba(7,14,21,.45); color: var(--subtle); font-size: 8px; text-transform: uppercase; letter-spacing: .07em; }
.framework-summary strong { display: block; margin-bottom: 5px; color: var(--text); font-size: 18px; letter-spacing: normal; }
.framework-toolbar { display: grid; grid-template-columns: minmax(165px,220px) minmax(230px,1fr) max-content; gap: 10px; align-items: end; padding: 15px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--panel); }
.framework-toolbar label { display: grid; gap: 6px; }
.framework-toolbar label > span { color: var(--subtle); font-size: 8px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
.framework-toolbar select, .framework-toolbar input { width: 100%; height: 38px; padding: 0 11px; border: 1px solid var(--line); border-radius: 7px; background: #0e1821; color: var(--text); font: inherit; }
.framework-chart-switch { display: flex; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 8px; background: #0d161f; }
.framework-chart-switch button { height: 30px; padding: 0 12px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); cursor: pointer; font: 700 9px/1 inherit; }
.framework-chart-switch button:hover { color: var(--text); }
.framework-chart-switch button.active { background: rgba(77,198,198,.16); color: var(--accent); box-shadow: inset 0 0 0 1px rgba(77,198,198,.24); }
.framework-visual, .framework-selection, .framework-selection-empty { padding: 21px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--panel); }
.framework-visual-heading { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.framework-visual-heading h2, .framework-selection h2 { margin: 0 0 5px; font-size: 15px; }
.framework-visual-heading p, .framework-selection header p { margin: 0; color: var(--subtle); font-size: 9px; }
.framework-chart-empty { display: grid; min-height: 170px; place-items: center; color: var(--subtle); font-size: 10px; }
.framework-bar-chart { display: grid; gap: 5px; }
.framework-bar-row { display: grid; grid-template-columns: minmax(230px, .55fr) minmax(160px,1fr) 38px; gap: 13px; align-items: center; min-height: 49px; padding: 7px 9px; border: 1px solid transparent; border-radius: 7px; color: var(--text); text-decoration: none; transition: background .15s ease, border-color .15s ease; }
.framework-bar-row:hover, .framework-bar-row:focus-visible { border-color: var(--line); background: rgba(88,166,255,.045); outline: none; }
.framework-bar-label { display: grid; grid-template-columns: 66px minmax(0,1fr); gap: 8px; align-items: center; min-width: 0; }
.framework-bar-label strong { color: var(--accent); font: 750 9px/1 ui-monospace, SFMono-Regular, Consolas, monospace; }
.framework-bar-label span { overflow: hidden; color: #cbd7e0; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.framework-bar-track { height: 9px; overflow: hidden; border-radius: 5px; background: #0b141c; box-shadow: inset 0 0 0 1px rgba(255,255,255,.025); }
.framework-bar-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #58a6ff, #8aa8ff); }
.framework-bar-track i.nist { background: linear-gradient(90deg, #4dc6c6, #50cf8f); }
.framework-bar-count { color: var(--text); font-size: 11px; font-weight: 800; text-align: right; }
.framework-donut-layout { display: grid; grid-template-columns: minmax(190px, .42fr) minmax(280px,1fr); gap: 28px; align-items: center; }
.framework-donut { display: grid; width: min(260px,100%); aspect-ratio: 1; place-items: center; margin: 5px auto; border-radius: 50%; box-shadow: 0 18px 45px rgba(0,0,0,.22); }
.framework-donut::before { content: ""; grid-area: 1/1; width: 61%; aspect-ratio: 1; border: 1px solid var(--line-soft); border-radius: 50%; background: var(--panel); }
.framework-donut > span { z-index: 1; grid-area: 1/1; color: var(--subtle); font-size: 8px; text-align: center; text-transform: uppercase; letter-spacing: .08em; }
.framework-donut strong { display: block; margin-bottom: 3px; color: var(--text); font-size: 24px; letter-spacing: normal; }
.framework-donut-legend { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
.framework-donut-legend a { display: grid; grid-template-columns: 9px minmax(0,1fr) max-content; gap: 8px; align-items: center; min-width: 0; padding: 8px; border: 1px solid transparent; border-radius: 7px; color: var(--text); text-decoration: none; }
.framework-donut-legend a:hover, .framework-donut-legend a:focus-visible { border-color: var(--line); background: rgba(255,255,255,.025); outline: none; }
.framework-donut-legend i { width: 8px; height: 8px; border-radius: 2px; }
.framework-donut-legend span { min-width: 0; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.framework-donut-legend span strong { margin-right: 6px; color: var(--accent); font: 750 8px/1 ui-monospace, SFMono-Regular, Consolas, monospace; }
.framework-donut-legend b { font-size: 9px; }
.framework-timeline { overflow-x: auto; }
.framework-timeline svg { display: block; width: 100%; min-width: 560px; height: auto; }
.framework-timeline .axis { stroke: #2b3c4b; stroke-width: 1; }
.framework-timeline .line { fill: none; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.framework-timeline .line.mitre { stroke: #58a6ff; }.framework-timeline .line.nist { stroke: #4dc6c6; }
.framework-timeline text { fill: var(--subtle); font-size: 9px; }
.framework-line-legend { display: flex; justify-content: flex-end; gap: 18px; margin-bottom: 5px; color: var(--muted); font-size: 9px; }
.framework-line-legend span::before { content: ""; display: inline-block; width: 14px; height: 3px; margin: 0 6px 2px 0; border-radius: 2px; background: #58a6ff; }
.framework-line-legend span.nist::before { background: #4dc6c6; }
.framework-selection-empty { display: grid; min-height: 120px; place-items: center; align-content: center; color: var(--muted); text-align: center; }
.framework-selection-empty strong { color: var(--text); font-size: 13px; }
.framework-selection-empty p { max-width: 560px; margin: 7px 0 0; font-size: 10px; line-height: 1.6; }
.framework-selection > header { display: flex; justify-content: space-between; gap: 16px; padding-bottom: 17px; border-bottom: 1px solid var(--line-soft); }
.framework-selection > header h2 span { margin-right: 5px; color: var(--accent); font: 800 12px/1 ui-monospace, SFMono-Regular, Consolas, monospace; }
.framework-selection > header > div:last-child { display: flex; gap: 7px; align-items: flex-start; }
.framework-selection .secondary-button { display: inline-flex; align-items: center; text-decoration: none; white-space: nowrap; }
.framework-result-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; padding-top: 17px; }
.framework-result-columns h3 { margin: 0 0 9px; color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.framework-result-list { display: grid; gap: 7px; }
.framework-result-list > p { margin: 0; padding: 13px; border: 1px dashed var(--line); border-radius: 7px; color: var(--subtle); font-size: 9px; }
.framework-result-card { display: grid; grid-template-columns: 92px minmax(0,1fr) max-content; gap: 9px; align-items: center; padding: 10px; border: 1px solid var(--line-soft); border-radius: 7px; background: rgba(7,14,21,.38); color: var(--text); text-decoration: none; }
.framework-result-card:hover, .framework-result-card:focus-visible { border-color: rgba(77,198,198,.45); background: rgba(77,198,198,.04); outline: none; }
.framework-result-card > span { color: var(--accent); font: 750 8px/1 ui-monospace, SFMono-Regular, Consolas, monospace; }
.framework-result-card > strong { min-width: 0; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.framework-result-card > small { color: var(--subtle); font-size: 8px; white-space: nowrap; }
.toast-region { position: fixed; right: 20px; bottom: 20px; z-index: 80; display: grid; gap: 9px; }.toast { width: min(360px, calc(100vw - 40px)); padding: 13px 15px; border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: 8px; background: #15212c; color: #cbd7e0; box-shadow: var(--shadow); font-size: 11px; animation: toast-in .18s ease-out; }.toast.error { border-left-color: var(--red); }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }

@media (max-width: 1050px) { .metric-grid { grid-template-columns: repeat(2,1fr); }.analyst div, .connection { display: none; }.topbar { padding: 0 20px; }.form-grid.three { grid-template-columns: 1fr 1fr; } }
@media (max-width: 1050px) { .kb-page-summary { grid-template-columns: repeat(2, 1fr); }.incident-page-summary { grid-template-columns: 1fr; }.kb-page-layout { grid-template-columns: 1fr; }.kb-page-rail { position: static; } }
@media (max-width: 900px) { .query-row { grid-template-columns: 68px minmax(130px,1fr) minmax(130px,1fr) 34px; }.query-value { grid-column: 2 / 4; }.query-remove { grid-column: 4; grid-row: 1; }.query-builder-footer { align-items: stretch; flex-direction: column; } }
@media (max-width: 900px) { .framework-header { display: grid; }.framework-toolbar { grid-template-columns: 1fr 1fr; }.framework-chart-switch { grid-column: 1 / -1; width: max-content; }.framework-donut-layout, .framework-result-columns { grid-template-columns: 1fr; }.framework-donut-legend { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .app-shell { display: block; }.sidebar { position: fixed; z-index: 30; width: 250px; transform: translateX(-100%); transition: transform .2s ease; box-shadow: var(--shadow); }.sidebar.open { transform: translateX(0); }.mobile-menu { display: block; }.topbar { height: 58px; }.search-wrap kbd, .analyst { display: none; } main { padding: 24px 16px 40px; }.page-heading { align-items: flex-start; }.page-heading .primary-button { white-space: nowrap; }.queue-toolbar, .kb-toolbar { align-items: flex-start; flex-direction: column; }.filters { width: 100%; flex-wrap: wrap; }.filters label { flex: 1; min-width: 140px; }.filters select { width: 100%; }.query-builder { margin: 0 10px 14px; }.query-builder-heading { align-items: stretch; flex-direction: column; }.query-row { grid-template-columns: 62px minmax(0,1fr) 34px; }.query-row [data-query-field], .query-row [data-query-operator], .query-value { grid-column: 2; }.query-row [data-query-operator] { grid-row: 2; }.query-value { grid-row: 3; }.query-remove { grid-column: 3; grid-row: 1; }.query-builder-footer > div:last-child { flex-wrap: wrap; }.editor-modal, .kb-editor-modal { width: 100vw; height: 100vh; border-radius: 0; }.modal-backdrop { padding: 0; }.editor-layout { grid-template-columns: 1fr; }.form-nav { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); padding: 8px; }.form-nav button { white-space: nowrap; }.form-section, .kb-form-body { padding: 22px 17px 30px; }.form-grid, .form-grid.three { grid-template-columns: 1fr; gap: 0; }.nist-picker { grid-template-columns: 1fr; }.nist-function-group { grid-template-columns: 1fr; gap: 4px; }.nist-function-label { padding-top: 0; }.form-footer > span { display: none; }.form-footer { justify-content: flex-end; }.detail-summary { grid-template-columns: repeat(2,1fr); }.kb-grid { grid-template-columns: 1fr; }.kb-page-header { padding: 20px; }.kb-page-heading { display: grid; }.kb-page-heading h1 { font-size: 27px; }.kb-page-summary { grid-template-columns: 1fr 1fr; }.incident-page-summary, .summary-group-grid { grid-template-columns: 1fr; }.kb-page-content { padding: 2px 18px 26px; }.kb-reference-card { grid-template-columns: 1fr; }.kb-reference-card > div:last-child { justify-content: flex-start; }.evidence-upload-heading { display: grid; }.evidence-upload-controls { grid-template-columns: 1fr; }.evidence-file { grid-template-columns: 36px minmax(0,1fr); }.evidence-file-icon { width: 36px; height: 36px; }.evidence-file .secondary-button { grid-column: 1 / -1; } }
@media (max-width: 480px) { .metric-grid { grid-template-columns: 1fr 1fr; gap: 8px; }.metric-grid article { padding: 13px; }.metric-grid article > strong { font-size: 23px; }.metric-grid article > small { display: none; }.notice { align-items: flex-start; }.page-heading { display: grid; }.page-heading .primary-button { width: max-content; } }
@media (max-width: 600px) { .framework-summary, .framework-toolbar, .framework-donut-legend { grid-template-columns: 1fr; }.framework-chart-switch { grid-column: auto; width: 100%; }.framework-chart-switch button { flex: 1; }.framework-bar-row { grid-template-columns: minmax(0,1fr) 34px; }.framework-bar-track { grid-column: 1 / -1; grid-row: 2; }.framework-selection > header { display: grid; }.framework-selection > header > div:last-child { flex-wrap: wrap; }.framework-result-card { grid-template-columns: 1fr; }.framework-result-card > strong { white-space: normal; } }
@media print { .sidebar, .topbar, .page-heading, .notice, .metric-grid, .queue-card, .detail-actions, .close-button, .kb-back { display: none !important; }.app-shell { display: block; }.detail-section p, .detail-summary span, .detail-summary strong { color: black; }.detail-summary div { border-color: #ccc; background: white; }.knowledge-article-view, .incident-record-view, .kb-page-layout { display: block; }.kb-page-header, .kb-page-summary > div, .summary-group, .summary-item, .kb-page-rail, .kb-page-content { color: black; background: white; border-color: #ccc; box-shadow: none; }.kb-page-summary { grid-template-columns: repeat(4,1fr); }.incident-page-summary { grid-template-columns: repeat(2,1fr); }.kb-page-rail { margin: 14px 0; }.kb-content-section p, .kb-page-summary span, .kb-page-summary strong, .summary-group h2, .summary-item span, .summary-item strong { color: black; } }