:root{--bg:#07111f;--panel:#0d192a;--line:#203249;--text:#eff6ff;--muted:#8497ae;--green:#54e0c7;--red:#ff667c;--orange:#ffad5a;--purple:#9985ff;--shadow:0 20px 55px rgba(0,0,0,.26)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 75% -10%,#112d48 0,transparent 35%),var(--bg);color:var(--text);font-family:"IBM Plex Sans Thai",Inter,sans-serif;min-height:100vh}button,input,select{font:inherit}.sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:#091524;border-right:1px solid var(--line);padding:26px 18px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;gap:12px;align-items:center;padding:0 8px 28px}.brand-mark{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#58ebd0,#3578ff);font-family:Inter;font-weight:800;color:#06101e}.brand strong,.brand span{display:block}.brand span{color:var(--muted);font-size:11px}nav{display:grid;gap:7px}nav a{display:flex;align-items:center;gap:12px;color:#9aabc0;text-decoration:none;padding:11px 13px;border-radius:11px;font-weight:600;font-size:14px;transition:.2s}nav a:hover,nav a.active{background:#13233a;color:#fff;transform:translateX(2px)}nav a.active{box-shadow:inset 3px 0 var(--green)}nav a em{margin-left:auto;font-style:normal;background:#253750;border-radius:99px;padding:2px 7px;font-size:10px}.sidebar-footer{margin-top:auto}.health{display:flex;gap:10px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:13px;background:#0d1a2b}.health strong,.health small{display:block;font-size:11px}.health small{color:var(--muted)}.pulse{width:9px;height:9px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}.profile{display:flex;width:100%;align-items:center;gap:10px;background:transparent;border:0;color:white;padding:16px 8px 0;text-align:left}.profile>span{width:34px;height:34px;border-radius:50%;background:#263b58;display:grid;place-items:center;font-weight:700}.profile strong,.profile small{display:block;font-size:12px}.profile small{color:var(--muted)}main{margin-left:250px;padding:28px 34px 48px;max-width:1700px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.eyebrow{margin:0 0 4px;color:#6f839d;font:700 10px/1 Inter;letter-spacing:.16em}.topbar h1,.panel h2{margin:0;font-family:Inter;letter-spacing:-.03em}.topbar h1{font-size:28px}.top-actions{display:flex;gap:9px}.icon-btn,.primary-button,.filter-btn,.text-btn,.mobile-menu{border:1px solid var(--line);border-radius:10px;color:white;background:#101e31;cursor:pointer;transition:.2s}.icon-btn{width:41px;height:41px}.icon-btn:hover,.filter-btn:hover{transform:translateY(-1px)}.notification-button{position:relative}.notification-button i{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--red);right:8px;top:8px}.primary-button{background:linear-gradient(135deg,#1dbfa6,#277dec);border:0;padding:11px 17px;font-weight:700}.primary-button:hover{transform:translateY(-2px)}.alert-banner{display:flex;align-items:center;gap:15px;padding:15px 18px;border-radius:14px;border:1px solid rgba(255,102,124,.28);background:linear-gradient(90deg,rgba(255,102,124,.14),rgba(255,102,124,.04));margin-bottom:18px}.alert-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,102,124,.17);color:var(--red);font-weight:800}.alert-banner strong{font-size:14px}.alert-banner p{margin:2px 0 0;color:#a3b1c4;font-size:12px}.alert-banner button{margin-left:auto;background:transparent;border:0;color:#ff9baa;font-weight:700;cursor:pointer}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.metric-card,.panel{border:1px solid var(--line);background:linear-gradient(160deg,rgba(18,34,55,.96),rgba(10,23,39,.96));border-radius:16px;box-shadow:var(--shadow)}.metric-card{padding:18px}.metric-head{display:flex;justify-content:space-between;font-size:12px;color:#9aabc0}.metric-head b{font-size:10px;border-radius:99px;padding:4px 7px}.danger{color:#ff8a9b;background:rgba(255,102,124,.12)}.warning{color:#ffc27f;background:rgba(255,173,90,.12)}.good{color:#77e7d4;background:rgba(84,224,199,.12)}.metric-card>strong{display:block;font:800 30px/1 Inter;margin-top:15px}.metric-card>p{color:var(--muted);font-size:11px;margin:7px 0 12px}.spark{height:28px;display:flex;align-items:end;gap:5px}.spark i{flex:1;border-radius:3px 3px 0 0;background:var(--green);opacity:.55}.spark i:nth-child(1){height:28%}.spark i:nth-child(2){height:52%}.spark i:nth-child(3){height:41%}.spark i:nth-child(4){height:75%}.spark i:nth-child(5){height:62%}.spark i:nth-child(6){height:87%}.spark i:nth-child(7){height:100%}.spark.red i{background:var(--red)}.spark.orange i{background:var(--orange)}.spark.purple i{background:var(--purple)}.progress{height:6px;background:#1b2b42;border-radius:99px;margin-top:23px;overflow:hidden}.progress span{height:100%;display:block;background:linear-gradient(90deg,#42bda9,#69ead4)}.content-grid{display:grid;grid-template-columns:1.8fr 1fr;gap:14px;margin-top:14px}.panel{padding:20px}.panel-head{display:flex;align-items:center;justify-content:space-between}.panel h2{font-size:17px}.panel-head select{background:#101e31;border:1px solid var(--line);color:#9fb0c4;border-radius:9px;padding:8px}.chart-wrap{margin-top:15px}.chart-wrap svg{width:100%;height:245px}.grid-lines line{stroke:#263851}.chart-area{fill:url(#area)}.chart-line{fill:none;stroke:var(--green);stroke-width:3;filter:drop-shadow(0 0 7px rgba(84,224,199,.5));stroke-dasharray:1000;stroke-dashoffset:1000;animation:draw 1.8s ease forwards}.dots circle{fill:#07111f;stroke:var(--green);stroke-width:3}.chart-labels{display:flex;justify-content:space-between;color:#657b95;font-size:10px;padding:0 20px}.text-btn{background:transparent;border:0;color:#73d9ca}.donut-wrap{display:flex;align-items:center;justify-content:center;gap:28px;min-height:245px}.donut{width:148px;height:148px;border-radius:50%;background:conic-gradient(var(--red) 0 13%,var(--orange) 13% 41%,var(--purple) 41% 81%,#54708f 81%);display:grid;place-items:center;position:relative}.donut:before{content:"";position:absolute;width:100px;height:100px;background:#0e1b2d;border-radius:50%}.donut div{z-index:1;text-align:center}.donut strong,.donut span{display:block}.donut strong{font:800 27px Inter}.donut span{font-size:10px;color:var(--muted)}.legend{display:grid;gap:14px;min-width:130px}.legend div{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:8px;font-size:12px}.legend span{color:#93a4b9}.legend i,.activity{width:8px;height:8px;border-radius:50%}.critical-dot{background:var(--red)}.high-dot{background:var(--orange)}.medium-dot{background:var(--purple)}.low-dot{background:#54708f}.feed-panel{margin-top:14px}.feed-actions{display:flex;gap:9px}.search{display:flex;align-items:center;background:#0a1728;border:1px solid var(--line);border-radius:9px;padding:0 10px}.search input{width:245px;background:transparent;border:0;outline:0;color:white;padding:9px}.filter-btn{padding:8px 12px}.filter-btn b{background:#304765;padding:2px 6px;border-radius:99px;font-size:9px}.filter-drawer{max-height:0;overflow:hidden;opacity:0;display:flex;gap:12px;transition:.35s}.filter-drawer.open{max-height:100px;opacity:1;padding:15px 0;border-bottom:1px solid var(--line)}.filter-drawer label{display:grid;gap:4px;color:var(--muted);font-size:10px}.filter-drawer select{background:#0b1828;color:#dce8f5;border:1px solid var(--line);padding:7px;border-radius:7px}.filter-drawer button{align-self:end;background:transparent;color:#7edcca;border:0;cursor:pointer}.table-scroll{overflow:auto;margin-top:12px}table{width:100%;border-collapse:collapse;min-width:1000px}th,td{text-align:left;padding:13px 9px;border-bottom:1px solid #1c2d43;font-size:12px}th{color:#71859e;font:700 10px Inter;text-transform:uppercase}.vendor strong,.vendor small{display:block}.vendor small{color:var(--muted)}.score{display:inline-flex;min-width:34px;justify-content:center;padding:4px 7px;border-radius:7px;font:700 11px Inter}.score.critical{background:rgba(255,102,124,.14);color:#ff8ca0}.score.high{background:rgba(255,173,90,.14);color:#ffc07c}.score.medium{background:rgba(153,133,255,.14);color:#baaaff}.pill{display:inline-flex;padding:4px 8px;border-radius:99px;margin-right:4px;font-size:9px;font-weight:700}.pill.kev{background:rgba(255,102,124,.13);color:#ff8ba0}.pill.exploit{background:rgba(255,173,90,.12);color:#ffbd77}.asset-count{color:#75e1cf;font-weight:700}.patch-status strong,.patch-status small{display:block}.patch-status small{color:var(--muted)}.row-button{background:transparent;border:1px solid var(--line);color:#9eb0c4;border-radius:8px;padding:6px 9px;cursor:pointer}.table-footer{display:flex;justify-content:space-between;padding-top:14px;color:#73879f;font-size:11px}.table-footer button{background:transparent;color:#75dcca;border:0}.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.asset-list>div{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #1d2e44}.asset-list strong,.asset-list small{display:block}.asset-list small{color:var(--muted);font-size:10px}.asset-list b{font-size:11px;color:#ff9aac}.asset-icon{width:37px;height:37px;border-radius:10px;background:#172b43;display:grid;place-items:center;color:#7ce2d0}.activity-list>div{display:grid;grid-template-columns:10px 1fr;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #1d2e44}.activity-list p,.activity-list strong,.activity-list span{margin:0;display:block}.activity-list strong{font-size:12px}.activity-list span{font-size:10px;color:var(--muted)}footer{display:flex;justify-content:space-between;color:#536b86;font-size:10px;padding:25px 3px 0}.toast{position:fixed;right:25px;bottom:25px;display:flex;gap:12px;align-items:center;padding:14px 18px;background:#12273a;border:1px solid #2e5268;border-radius:13px;box-shadow:var(--shadow);transform:translateY(100px);opacity:0;transition:.35s;z-index:50}.toast.show{transform:none;opacity:1}.toast strong,.toast small{display:block}.toast small{color:var(--muted)}.modal-backdrop{position:fixed;inset:0;background:rgba(3,8,15,.75);backdrop-filter:blur(7px);display:grid;place-items:center;opacity:0;pointer-events:none;transition:.25s;z-index:60}.modal-backdrop.open{opacity:1;pointer-events:auto}.modal{width:min(560px,calc(100% - 32px));background:#0d1b2d;border:1px solid #294159;border-radius:20px;padding:25px;transform:scale(.96);transition:.25s}.modal-backdrop.open .modal{transform:none}.close-modal{float:right;background:transparent;border:0;color:#8498b0;font-size:24px}.modal-risk{display:flex;justify-content:space-between;background:#19263a;padding:12px;border-radius:11px;margin:15px 0}.modal-risk strong{color:#ff8297}.summary-box{background:#0a1625;border:1px solid var(--line);padding:15px;border-radius:12px;margin:18px 0}.summary-box ol{color:#9bacc0;line-height:1.9;font-size:13px}.reveal{opacity:0;transform:translateY(12px);transition:.6s}.reveal.visible{opacity:1;transform:none}.mobile-menu{display:none;width:40px;height:40px}@keyframes draw{to{stroke-dashoffset:0}}@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(84,224,199,0)}}@media(max-width:1100px){.metrics{grid-template-columns:repeat(2,1fr)}.content-grid{grid-template-columns:1fr}.sidebar{transform:translateX(-100%);transition:.3s}.sidebar.open{transform:none}main{margin-left:0}.mobile-menu{display:block}.topbar{gap:12px}.topbar>div:nth-child(2){margin-right:auto}}@media(max-width:700px){main{padding:20px 14px}.topbar h1{font-size:21px}.top-actions .icon-btn{display:none}.alert-banner button{display:none}.metrics,.bottom-grid{grid-template-columns:1fr}.panel{padding:15px}.feed-actions{width:100%;margin-top:12px}.panel-head{flex-wrap:wrap}.search{flex:1}.search input{width:100%}.donut-wrap{flex-direction:column}.filter-drawer.open{max-height:240px;flex-wrap:wrap}footer{flex-direction:column;gap:6px}}