@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");*,:after,:before{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;background:#f5f6fa;color:#101828;font-size:14px;line-height:1.5}.app-shell{display:flex;min-height:100vh}.main-content{margin-left:248px;padding:32px 42px;width:100%;max-width:1500px}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#101828;color:#fff;padding:24px 16px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:11px;padding:0 9px 25px;border-bottom:1px solid #344054;margin-bottom:18px}.brand-logo{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#7c3aed,#a78bfa);display:grid;place-items:center;font-weight:800;font-size:18px}.brand-name{font-weight:700}.brand-name small{display:block;color:#98a2b3;font-size:11px;font-weight:400}.sidebar nav{display:flex;flex-direction:column;gap:5px;flex:1 1}.sidebar nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:8px;color:#98a2b3;text-decoration:none;font-weight:500;transition:background .15s,color .15s}.sidebar nav a:hover{background:#1d2939;color:#fff}.sidebar nav a.selected{background:#7c3aed;color:#fff}.sidebar nav a span{width:20px;text-align:center;font-size:16px}.sidebar nav a b{margin-left:auto;background:#344054;border-radius:20px;padding:2px 7px;font-size:10px;font-weight:600}.side-footer{border-top:1px solid #344054;padding:13px 9px;color:#98a2b3;font-size:11px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.eyebrow{font-size:11px;color:#7c3aed;font-weight:700;letter-spacing:.11em}.page-header h1{font-size:24px;letter-spacing:-.03em}.header-tools{display:flex;align-items:center;gap:12px}.live{color:#039855;background:#ecfdf3;border-radius:20px;padding:6px 12px;font-size:11px;font-weight:600;display:inline-flex;align-items:center}.live i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#039855;margin-right:6px}.language{padding:6px 11px;border:1px solid #eaecf0;border-radius:8px;background:#fff;color:#101828;text-decoration:none;font-size:12px;font-weight:600}.user-avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#a78bfa);display:grid;place-items:center;color:#fff;font-weight:700}.hero-card{background:linear-gradient(120deg,#21104b,#4c1d95);color:#fff;border-radius:16px;padding:28px 32px;display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;overflow:hidden}.hero-card h2{font-size:21px;margin-bottom:4px}.hero-card p{color:#d6bcfa}.hero-icon{font-size:50px;color:#c4b5fd;opacity:.4}.stats{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:16px;gap:16px;margin-bottom:30px}.stat{background:#fff;border:1px solid #eaecf0;border-radius:13px;padding:19px;display:flex;align-items:flex-start;gap:13px;transition:box-shadow .2s,transform .2s}.stat:hover{box-shadow:0 5px 14px rgba(16,24,40,.05);transform:translateY(-2px)}.stat-icon{width:41px;height:41px;border-radius:10px;display:grid;place-items:center;font-size:17px}.stat-icon.purple{color:#7c3aed;background:#f4f3ff}.stat-icon.green{color:#039855;background:#ecfdf3}.stat-icon.orange{color:#dc6803;background:#fffaeb}.stat-icon.blue{color:#2563eb;background:#eff8ff}.stat div{flex:1 1}.stat small{display:block;color:#667085;font-size:11px;font-weight:500;margin-bottom:5px}.stat b{font-size:26px;line-height:1;font-weight:800}.trend{color:#039855;font-size:12px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.section-title h2{font-size:16px}.section-title p{font-size:12px;color:#667085}.view-button{border:1px solid #eaecf0;background:#fff;border-radius:8px;color:#101828;padding:8px 14px;text-decoration:none;font-size:12px;font-weight:600}.device-table{background:#fff;border:1px solid #eaecf0;border-radius:13px;overflow:hidden;margin-bottom:26px}table{width:100%;border-collapse:collapse}th{background:#f9fafb;color:#667085;font-size:10px;text-transform:uppercase;letter-spacing:.06em;text-align:left;padding:12px 20px;border-bottom:1px solid #eaecf0}td{padding:14px 20px;border-bottom:1px solid #f2f4f7;font-size:12px;white-space:nowrap}tbody tr:hover{background:#fafafa}tbody tr:last-child td{border-bottom:0}.asset{display:flex;align-items:center;gap:9px}.asset span{width:30px;height:30px;border-radius:8px;background:#f4f3ff;color:#7c3aed;display:grid;place-items:center}.asset strong,.device-table td strong{font-weight:600}td small{display:block;font-size:10px;margin-top:2px}.muted,td small{color:#667085}.risk-badge{padding:3px 8px;border-radius:20px;font-weight:700;font-size:11px}.risk-badge.low{color:#039855;background:#ecfdf3}.risk-badge.medium{color:#dc6803;background:#fffaeb}.risk-badge.critical,.risk-badge.high{color:#d92d20;background:#fef3f2}.status{display:inline-flex;align-items:center;color:#039855;font-size:11px;font-weight:600}.status i{width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:6px}.status.offline{color:#667085}.lower{display:grid;grid-template-columns:1fr 280px;grid-gap:16px;gap:16px;margin-bottom:30px}.panel{background:#fff;border:1px solid #eaecf0;border-radius:13px;padding:20px}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.panel h2{font-size:15px}.panel p{font-size:11px;color:#667085}.panel-title>b{background:#eaecf0;border-radius:20px;padding:2px 9px;font-size:11px}.safe{display:flex;align-items:center;gap:11px;padding:14px;background:#ecfdf3;border-radius:9px}.safe>span{width:32px;height:32px;border-radius:50%;background:#039855;color:#fff;display:grid;place-items:center;font-size:14px}.safe strong{font-size:12px;color:#039855}.safe p{font-size:11px;color:#667085}.health-panel{text-align:center}.health-panel>strong{display:block;font-size:40px;color:#039855;line-height:1;margin-top:16px}.health-panel>small{color:#667085;font-size:11px}.empty{text-align:center;background:#fff;border:1px dashed #eaecf0;border-radius:13px;padding:45px}.empty div:first-child{font-size:32px;color:#7c3aed}.empty h2{font-size:16px;margin:10px 0 4px}.empty p{font-size:12px;color:#667085}@media (max-width:1150px){.stats{grid-template-columns:repeat(2,1fr)}}@media (max-width:850px){.sidebar{width:64px;padding:18px 8px}.brand-name,.side-footer,.sidebar nav a b,.sidebar nav a span{display:none}.main-content{margin-left:64px;padding:22px}.lower{grid-template-columns:1fr}}@media (max-width:600px){.main-content{padding:15px}.stats{grid-template-columns:1fr}.live{display:none}.hero-card{padding:22px;text-align:center}.hero-icon{display:none}.page-header h1{font-size:20px}}