/* SIA Force SOC Dashboard Design System */
:root{--gold:#E8541E;--gold-light:#FF6B3A;--bg:#080818;--bg2:#0C0C22;--bg-card:rgba(26,26,78,.25);--bg-card-h:rgba(26,26,78,.45);--text:#E8E6F0;--text-m:#B0AFBF;--border:rgba(232,84,30,.08);--border-g:rgba(232,84,30,.25);--danger:#ef4444;--warn:#f59e0b;--ok:#22c55e;--info:#00d4ff;--purple:#7c3aed;--r:16px;--tr:.35s cubic-bezier(.4,0,.2,1)}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased}
a{color:var(--gold);text-decoration:none}a:hover{text-decoration:underline}
.soc-nav{background:rgba(8,8,24,.95);border-bottom:1px solid var(--border);padding:0 24px;display:flex;align-items:center;height:56px;position:sticky;top:0;z-index:100;backdrop-filter:blur(12px)}
.soc-nav .logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.1rem;color:var(--text);margin-right:32px}
.soc-nav .logo img{height:28px}
.soc-nav .tabs{display:flex;gap:4px}
.soc-nav .tab{padding:8px 16px;border-radius:8px;font-size:.8rem;font-weight:600;color:var(--text-m);transition:var(--tr);cursor:pointer}
.soc-nav .tab:hover,.soc-nav .tab.active{background:rgba(232,84,30,.12);color:var(--gold)}
.soc-nav .tab.active{border-bottom:2px solid var(--gold)}
.soc-nav .live-dot{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:.75rem;color:var(--ok)}
.soc-nav .live-dot::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--ok);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.container{max-width:1440px;margin:0 auto;padding:0 24px}
.stats-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;padding:20px 0}
.stat{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:16px;text-align:center;transition:var(--tr)}
.stat:hover{border-color:var(--border-g);transform:translateY(-1px)}
.stat .v{font-size:1.6rem;font-weight:800;background:linear-gradient(135deg,var(--gold),var(--gold-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.stat .l{font-size:.65rem;color:var(--text-m);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:20px;padding:20px 0}
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:24px;backdrop-filter:blur(8px);transition:var(--tr);position:relative;overflow:hidden}
.card:hover{border-color:var(--border-g);box-shadow:0 0 20px rgba(232,84,30,.08)}
.card h2{font-size:1rem;font-weight:700;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.card h2 .ico{font-size:1.2rem}
.card.full{grid-column:1/-1}
.chart-box{position:relative;height:260px}
.tbl{width:100%;border-collapse:separate;border-spacing:0}
.tbl th{text-align:left;padding:8px 12px;font-size:.65rem;text-transform:uppercase;letter-spacing:.8px;color:var(--text-m);border-bottom:1px solid var(--border)}
.tbl td{padding:8px 12px;border-bottom:1px solid var(--border);font-size:.82rem}
.tbl tr:hover td{background:rgba(232,84,30,.03)}
.tbl a{color:var(--gold);font-weight:600}
.badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:.65rem;font-weight:700;text-transform:uppercase}
.badge.crit{background:rgba(239,68,68,.15);color:var(--danger);border:1px solid rgba(239,68,68,.3)}
.badge.high{background:rgba(245,158,11,.15);color:var(--warn);border:1px solid rgba(245,158,11,.3)}
.badge.med{background:rgba(0,212,255,.15);color:var(--info);border:1px solid rgba(0,212,255,.3)}
.badge.ok{background:rgba(34,197,94,.12);color:var(--ok);border:1px solid rgba(34,197,94,.3)}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag{background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(232,84,30,.08));border:1px solid rgba(124,58,237,.2);padding:5px 12px;border-radius:6px;font-size:.78rem;font-weight:600;transition:var(--tr)}
.tag:hover{border-color:var(--gold);transform:scale(1.04)}
.bar-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.bar-h .code{width:28px;font-size:.8rem;font-weight:700}
.bar-h .track{flex:1;height:6px;background:rgba(255,255,255,.04);border-radius:3px;overflow:hidden}
.bar-h .fill{height:100%;border-radius:3px;background:linear-gradient(90deg,var(--gold),var(--purple));transition:width 1s}
.bar-h .pct{font-size:.7rem;color:var(--text-m);width:32px;text-align:right}
.item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}
.item:last-child{border-bottom:none}
.item .name{font-weight:600;font-size:.85rem}
.item .meta{color:var(--gold);font-size:.75rem;font-weight:600}
.item .date{color:var(--text-m);font-size:.7rem}
.footer{text-align:center;padding:32px 0;color:var(--text-m);font-size:.7rem;border-top:1px solid var(--border)}
@media(max-width:768px){.stats-bar{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}.soc-nav .tabs{overflow-x:auto}}