:root{
  --bg:#020608;--sidebar:#040b10;--panel:#07131a;--panel2:#091923;--line:#163747;
  --text:#f6f8fa;--muted:#8fa2ad;--red:#ff2038;--red2:#d90025;--cyan:#27d8ff;
  --green:#40e49c;--amber:#ffb64a;--blue:#48a8ff
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:
radial-gradient(circle at 78% 8%,rgba(255,32,56,.08),transparent 24%),
radial-gradient(circle at 55% 38%,rgba(39,216,255,.04),transparent 28%)}
button,input{font:inherit}
.app-shell{min-height:100vh;display:grid;grid-template-columns:245px 1fr}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:245px;border-right:1px solid #122d3b;background:linear-gradient(180deg,#03090d,#050d12);padding:20px 14px;z-index:20}
.brand{text-decoration:none;color:white;display:block;padding:0 8px}.wordmark{font-weight:950;font-size:34px;letter-spacing:-2px;line-height:1}.wordmark span{color:var(--red)}.brand small{display:block;color:#9fb1bb;font-size:9px;margin:4px 0 0 70px;font-weight:700}.tagline{font-size:11px;color:#708792;margin:14px 8px 24px}
.sidebar nav{display:flex;flex-direction:column;gap:5px}
.nav-item{border:0;background:transparent;color:#b8c5cb;padding:11px 12px;border-radius:9px;text-align:left;cursor:pointer;display:flex;align-items:center;gap:11px}
.nav-item span{width:20px;text-align:center;color:#8ea4ae}.nav-item:hover{background:#08151d}.nav-item.active{color:white;background:linear-gradient(90deg,rgba(255,32,56,.22),rgba(255,32,56,.07));border:1px solid rgba(255,32,56,.22)}.nav-item.active span{color:var(--red)}
.side-card{position:absolute;left:14px;right:14px;bottom:20px;border:1px solid #184054;background:#06131a;border-radius:12px;padding:14px}.side-card strong{font-size:10px;color:var(--cyan);letter-spacing:2px}.side-card p{font-size:11px;color:#8399a4;line-height:1.5;margin:7px 0 0}
.workspace{grid-column:2;min-width:0}
.topbar{height:68px;border-bottom:1px solid #112d3a;background:rgba(3,9,13,.8);backdrop-filter:blur(16px);position:sticky;top:0;z-index:15;display:flex;align-items:center;justify-content:space-between;padding:0 24px}
.search{width:min(610px,55vw);height:40px;border:1px solid #1a4052;border-radius:9px;background:#041016;display:flex;align-items:center;padding:0 12px;color:#708793;gap:10px}.search input{flex:1;border:0;outline:0;background:transparent;color:white}.search input::placeholder{color:#607783}.search kbd{border:1px solid #244959;color:#78919c;border-radius:5px;padding:3px 6px;font-size:10px}
.top-actions{display:flex;align-items:center;gap:17px}.health{font-size:11px;color:#8da1ab}.health i{display:inline-block;width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 10px var(--green);margin-right:7px}.icon-btn{width:34px;height:34px;border-radius:50%;border:1px solid #244351;background:#061018;color:white}.profile{display:flex;align-items:center;gap:9px}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#15394a,#e01932);font-size:11px;font-weight:800}.profile b{display:block;font-size:12px}.profile small{display:block;font-size:9px;color:#7f949f}
#viewRoot{padding:28px 26px 60px;min-height:calc(100vh - 110px)}
.page-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:24px}.page-head h1{font-size:34px;letter-spacing:-1.5px;margin:0}.page-head p{color:#8095a0;font-size:13px;margin:8px 0 0}.page-tools{display:flex;gap:9px}.btn{border:1px solid #23495a;background:#07151d;color:white;padding:10px 14px;border-radius:8px;cursor:pointer}.btn.primary{background:linear-gradient(135deg,var(--red),var(--red2));border-color:transparent}.btn:hover{filter:brightness(1.08)}
.kpis{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}.kpi{border:1px solid #163748;background:linear-gradient(180deg,#07131a,#061017);border-radius:11px;padding:14px;min-height:125px}.kpi .label{font-size:11px;color:#8fa2ad}.kpi .value{font-size:30px;font-weight:850;margin-top:12px}.kpi .delta{font-size:10px;margin-top:8px;color:#8197a2}.kpi .delta.up{color:var(--red)}.kpi .delta.good{color:var(--green)}.kpi.risk{border-color:#6a2630;box-shadow:inset 0 0 35px rgba(255,32,56,.06)}.kpi.risk .value{color:var(--red)}
.grid-2{display:grid;grid-template-columns:1.55fr .75fr;gap:12px;margin-top:12px}.panel{border:1px solid #163748;background:#061017;border-radius:12px;overflow:hidden}.panel-head{display:flex;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #14313f}.panel-head b{font-size:13px}.panel-head span{font-size:10px;color:#7f95a0}
.map{height:390px;position:relative;overflow:hidden;background:
radial-gradient(circle at 52% 45%,rgba(39,216,255,.12),transparent 23%),
linear-gradient(rgba(39,216,255,.045) 1px,transparent 1px),
linear-gradient(90deg,rgba(39,216,255,.045) 1px,transparent 1px);background-size:auto,34px 34px,34px 34px}
.map:before{content:"";position:absolute;inset:18% 7%;border:1px solid rgba(39,216,255,.14);border-radius:48% 55% 43% 58%;transform:rotate(-4deg)}
.map svg{position:absolute;inset:0;width:100%;height:100%}.map path{fill:none;stroke:var(--red);stroke-width:1.3;stroke-dasharray:8 10;opacity:.7;animation:dash 8s linear infinite}.map path:nth-child(2){stroke:var(--cyan);opacity:.35}
.pulse{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 18px var(--red);animation:pulse 1.7s infinite}.p1{left:13%;top:55%}.p2{left:36%;top:34%;animation-delay:.3s}.p3{right:34%;top:48%;animation-delay:.7s}.p4{right:15%;bottom:24%;animation-delay:1.1s}.p5{left:53%;bottom:19%;animation-delay:1.4s}
.map-badge{position:absolute;padding:7px 9px;border:1px solid #6f2631;border-radius:6px;background:#0a1217;color:#f8cbd0;font-size:9px}.mb1{left:18%;top:24%}.mb2{right:17%;bottom:17%;border-color:#1d5f78;color:#c9f4ff}
.side-list{padding:4px 14px 12px}.side-list .row,.table .row{display:grid;align-items:center;border-bottom:1px solid #102a37}.side-list .row{grid-template-columns:1fr auto;padding:11px 0}.side-list b{font-size:11px}.side-list small{font-size:9px;color:#7d929d}.badge{display:inline-flex;align-items:center;padding:4px 7px;border-radius:999px;font-size:9px;background:#2a1318;color:#ff9eaa;border:1px solid #5a202a}.badge.high{background:#2b2011;color:#ffd38e;border-color:#664516}.badge.good{background:#10271e;color:#83f0bd;border-color:#1d5940}.badge.info{background:#102630;color:#a4eaff;border-color:#23556a}
.bottom-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:12px}.mini-panel{border:1px solid #163748;background:#061017;border-radius:12px;padding:15px}.mini-panel h3{font-size:13px;margin:0 0 14px}.finding-row{display:grid;grid-template-columns:1fr auto;gap:10px;padding:9px 0;border-top:1px solid #102a37}.finding-row b{font-size:11px}.finding-row span{font-size:9px;color:#7d929d}
.attack-path{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.node{padding:9px;border:1px solid #235063;border-radius:8px;font-size:10px}.node.danger{border-color:#6e2832;color:#ffb8c1}.arrow{color:#5c7480}.scorebar{height:8px;background:#102934;border-radius:99px;overflow:hidden;margin-top:17px}.scorebar i{display:block;height:100%;width:92%;background:linear-gradient(90deg,var(--red),#ff5a39)}
.framework{margin:10px 0}.framework div{display:flex;justify-content:space-between;font-size:10px}.bar{height:7px;margin-top:6px;background:#102934;border-radius:99px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),#80efff)}
.table{border:1px solid #163748;background:#061017;border-radius:12px;overflow:hidden}.table .head{background:#081821;color:#708994;font-size:9px;text-transform:uppercase;letter-spacing:.8px}.table .row{grid-template-columns:1.25fr .8fr .55fr .55fr .55fr .6fr;padding:12px 14px;font-size:11px}.table .row:hover:not(.head){background:#08151c}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#a9eaff}.sev-critical{color:var(--red)}.sev-high{color:var(--amber)}.sev-medium{color:#f0d562}.sev-low{color:var(--cyan)}
.cards-4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.card{border:1px solid #163748;background:#061017;border-radius:12px;padding:17px}.card h3{font-size:13px;margin:0 0 8px}.card p{font-size:11px;line-height:1.55;color:#849aa5}.card strong{font-size:27px}.card .icon{font-size:23px;color:var(--red);margin-bottom:20px}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}.chip{border:1px solid #23495a;background:#06141b;color:#9eb0b9;border-radius:999px;padding:7px 11px;font-size:10px}.chip.active{border-color:#71303a;color:#ffc0c8;background:#1e0e13}
.path-canvas{height:520px;border:1px solid #163748;background:
radial-gradient(circle at 50% 45%,rgba(39,216,255,.08),transparent 30%),
linear-gradient(rgba(39,216,255,.04) 1px,transparent 1px),
linear-gradient(90deg,rgba(39,216,255,.04) 1px,transparent 1px);background-size:auto,35px 35px,35px 35px;border-radius:12px;position:relative;overflow:hidden}
.path-canvas svg{position:absolute;inset:0;width:100%;height:100%}.path-canvas path{fill:none;stroke:#2d718f;stroke-width:2}.path-canvas path.danger{stroke:var(--red);stroke-dasharray:8 7;animation:dash 7s linear infinite}
.graph-node{position:absolute;min-width:120px;padding:12px;border-radius:10px;background:#07151d;border:1px solid #255065;text-align:center;font-size:10px;box-shadow:0 15px 30px rgba(0,0,0,.2)}.graph-node b{display:block;font-size:12px;margin-bottom:4px}.gn1{left:5%;top:42%}.gn2{left:28%;top:23%}.gn3{left:49%;top:46%}.gn4{right:20%;top:27%}.gn5{right:4%;top:49%;border-color:#752631}.gn5 b{color:#ff9eaa}
.validation-grid{display:grid;grid-template-columns:1fr .85fr;gap:12px}.policy-box{border:1px solid #163748;background:#061017;border-radius:12px;padding:18px}.policy-line{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #102a37;font-size:11px}.policy-line span{color:#8297a2}.permit{color:var(--green);font-weight:800}.deny{color:var(--red);font-weight:800}
.ai-layout{display:grid;grid-template-columns:1fr 340px;gap:12px}.chat{border:1px solid #163748;background:#061017;border-radius:12px;min-height:590px;display:flex;flex-direction:column}.chat-head{padding:15px 16px;border-bottom:1px solid #14313f;display:flex;justify-content:space-between}.chat-head b{font-size:13px}.chat-head span{font-size:10px;color:#6f8792}.messages{padding:18px;flex:1}.msg{max-width:78%;padding:12px 14px;border-radius:12px;margin:10px 0;font-size:12px;line-height:1.55}.msg.user{margin-left:auto;background:#122633;border:1px solid #25506a}.msg.ai{background:#110a0e;border:1px solid #59212b}.msg.ai b{color:var(--red)}.composer{display:flex;gap:8px;padding:13px;border-top:1px solid #14313f}.composer input{flex:1;background:#041016;border:1px solid #204252;color:white;border-radius:8px;padding:11px}.composer button{border:0;border-radius:8px;background:var(--red);color:white;padding:0 16px}.prompt-list{display:flex;flex-direction:column;gap:8px}.prompt-list button{text-align:left;border:1px solid #173b4d;background:#06131a;color:#b7c4ca;padding:11px;border-radius:8px;font-size:10px}
.report-card{display:grid;grid-template-columns:55px 1fr auto;align-items:center;gap:12px;padding:13px;border:1px solid #163748;border-radius:10px;background:#061017;margin-bottom:9px}.report-card .doc{width:44px;height:50px;border:1px solid #275267;border-radius:7px;display:grid;place-items:center;color:var(--cyan)}.report-card b{display:block;font-size:12px}.report-card span{font-size:10px;color:#7d929d}.app-footer{border-top:1px solid #102936;padding:18px 26px;display:flex;justify-content:space-between;color:#6f8792;font-size:10px}
.toast{position:fixed;right:22px;bottom:22px;background:#081820;border:1px solid #255066;color:#dce6ea;border-radius:9px;padding:12px 15px;transform:translateY(30px);opacity:0;pointer-events:none;transition:.25s;z-index:100}.toast.show{transform:none;opacity:1}
@keyframes dash{to{stroke-dashoffset:-100}}@keyframes pulse{0%,100%{transform:scale(.9);opacity:.6}50%{transform:scale(1.5);opacity:1}}
@media(max-width:1200px){.kpis{grid-template-columns:repeat(4,1fr)}.grid-2,.validation-grid,.ai-layout{grid-template-columns:1fr}.bottom-grid{grid-template-columns:1fr}.cards-4{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.workspace{grid-column:1}.top-actions .health,.profile div:not(.avatar){display:none}.search{width:65vw}.kpis,.cards-4{grid-template-columns:1fr 1fr}.table{overflow:auto}.table .row{min-width:720px}}