*{box-sizing:border-box}
:root{
 --sidebar:#0b2237;
 --sidebar-2:#102d47;
 --sidebar-text:#e8f0f6;
 --sidebar-muted:#9eb4c7;
 --page:#eef3f7;
 --card:#fff;
 --text:#182b3b;
 --muted:#6d7f8f;
 --line:#dbe5ec;
 --primary:#1b6fae;
 --primary-2:#145984;
 --danger:#c53030;
 --warning:#d68a18;
 --success:#248765;
 --purple:#7357b7;
 --shadow:0 8px 28px rgba(27,55,76,.07);
}
html,body{min-height:100%}
body{
 margin:0;
 background:var(--page);
 color:var(--text);
 font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
a{color:inherit}

/* HEADER */
.top{
 position:fixed;
 top:0;left:0;right:0;height:64px;
 z-index:100;
 background:linear-gradient(135deg,#0b2033,#123653);
 color:#fff;
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding:0 18px 0 22px;
 box-shadow:0 4px 18px rgba(0,0,0,.14);
}
.brand{display:flex;align-items:center;gap:12px}
.brand b{font-size:18px;letter-spacing:.05em}
.brand .muted{color:#aac0d1;margin-left:5px}
.brand small{display:block;color:#9bb2c5;font-size:10px;margin-top:2px;letter-spacing:.04em}
.mobile-menu-btn{
 display:none;background:transparent;color:#fff;border:1px solid #ffffff38;
 border-radius:9px;padding:6px 9px;font-size:18px;cursor:pointer
}
.top .inline{margin:0}
.top .inline button{
 background:#ffffff18;color:#fff;border:1px solid #ffffff32;
 border-radius:8px;padding:7px 11px;font-weight:700;cursor:pointer
}

/* SIDEBAR */
.nav{
 position:fixed;
 z-index:90;
 top:64px;left:0;bottom:0;
 width:255px;
 padding:14px 12px 24px;
 overflow-y:auto;
 background:linear-gradient(180deg,var(--sidebar),#081b2c);
 color:var(--sidebar-text);
 border-right:1px solid #163850;
 display:block;
 box-shadow:5px 0 22px rgba(7,25,39,.10);
}
.nav-group{
 padding:0 0 12px;
 margin-bottom:10px;
 border-bottom:1px solid rgba(255,255,255,.08);
}
.nav-group:last-child{border-bottom:0}
.nav-title{
 padding:5px 9px 7px;
 color:var(--sidebar-muted);
 font-size:10px;
 font-weight:900;
 letter-spacing:.13em;
}
.nav-links{display:block}
.nav-links a{
 display:flex;
 align-items:center;
 gap:10px;
 width:100%;
 padding:10px 10px;
 margin:2px 0;
 border-radius:9px;
 color:var(--sidebar-text);
 text-decoration:none;
 font-size:14px;
 font-weight:720;
 transition:background .12s ease,transform .12s ease,color .12s ease
}
.nav-links a:hover{background:#ffffff10;transform:translateX(2px)}
.nav-links a.active{
 background:linear-gradient(90deg,#1c71b0,#15547e);
 color:#fff;
 box-shadow:0 4px 12px rgba(0,0,0,.14)
}
.nav-links a span{overflow:hidden;text-overflow:ellipsis}

/* MAIN */
.wrap{
 max-width:none;
 margin:0 0 0 255px;
 padding:82px 24px 34px;
}
.page-context{
 display:flex;align-items:center;gap:7px;
 margin:0 0 12px;
 color:#8393a1;font-size:12px
}
.page-context b{color:#b6c0c8}
h1{font-size:29px;line-height:1.15;margin:0 0 16px}
h2{font-size:18px;margin:0}
h3{margin:0}
.muted,small{color:var(--muted)}

/* DASHBOARD */
.hero{
 display:flex;
 justify-content:space-between;
 align-items:center;
 gap:18px;
 padding:18px 20px;
 margin:0 0 16px;
 border-radius:14px;
 background:linear-gradient(135deg,#123653,#174867);
 color:#fff;
 box-shadow:var(--shadow)
}
.hero h1{margin:4px 0 5px;font-size:27px}
.hero p{margin:0;color:#d2e2ee;font-size:13px}
.hero .eyebrow{color:#aec7d8}
.hero-meta{display:flex;align-items:center;gap:8px;color:#d7e7f1;font-weight:800;white-space:nowrap}
.live-dot{
 width:9px;height:9px;border-radius:50%;background:#52d78d;
 box-shadow:0 0 0 5px rgba(82,215,141,.14)
}

.stats{
 display:grid;
 grid-template-columns:repeat(5,minmax(0,1fr));
 gap:12px;
 margin:0 0 16px
}
.statlink{display:block;text-decoration:none;color:inherit}
.statlink>div{
 height:100%;
 min-height:108px;
 background:#fff;
 border:1px solid var(--line);
 border-radius:12px;
 padding:14px 15px;
 box-shadow:0 5px 18px rgba(23,42,58,.045);
 transition:.12s ease;
 position:relative;
 overflow:hidden
}
.statlink>div:before{
 content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--primary)
}
.statlink:hover>div{transform:translateY(-2px);box-shadow:0 11px 25px rgba(23,42,58,.11)}
.stat-critical>div:before{background:var(--danger)}
.stat-team>div:before{background:var(--success)}
.stat-task>div:before{background:var(--purple)}
.stat-alert>div:before{background:var(--warning)}
.statlabel{font-size:11px;font-weight:900;text-transform:uppercase;color:#768999;letter-spacing:.05em}
.statlink b{display:block;font-size:31px;line-height:1.05;margin:6px 0 3px}
.statlink small{font-size:11px;font-weight:800;color:var(--primary)}

.dashboard-grid{
 display:grid;
 grid-template-columns:minmax(0,2fr) minmax(330px,.95fr);
 gap:16px;
 align-items:stretch
}
.dashboard-map,.dashboard-grid>.card{min-height:560px}
.card{
 background:var(--card);
 border:1px solid var(--line);
 border-radius:13px;
 padding:16px;
 margin-bottom:16px;
 box-shadow:var(--shadow)
}
.card-title{
 display:flex;justify-content:space-between;align-items:center;
 gap:10px;flex-wrap:wrap;margin-bottom:12px
}
.card-title h2{margin-top:3px}
.eyebrow{font-size:10px;letter-spacing:.13em;font-weight:900;color:#7890a1}
.ghost-btn{
 display:inline-flex;align-items:center;
 padding:7px 10px;
 border:1px solid #cedbe4;
 border-radius:8px;
 background:#fff;
 color:#2b536f;
 text-decoration:none;
 font-weight:800;
 font-size:12px
}
#map,.maplarge{
 width:100%;
 height:500px;
 border-radius:10px;
 overflow:hidden;
}
.dashboard-map #map{height:500px}
.leaflet-container{font:inherit}
#liveLog{
 height:500px;
 overflow-y:auto;
 padding-right:3px
}
#liveLog .mission{
 margin:0;
 border:0;
 border-bottom:1px solid #e7edf1;
 border-radius:0;
 padding:11px 2px
}
#liveLog .mission:last-child{border-bottom:0}

.quick-access{margin-top:0}
.quick-grid{
 display:grid;
 grid-template-columns:repeat(4,minmax(0,1fr));
 gap:10px
}
.quick-grid a{
 padding:13px;
 border:1px solid var(--line);
 background:#fbfdfe;
 border-radius:11px;
 text-decoration:none
}
.quick-grid a:hover{background:#f2f8fb;border-color:#c7dce9}
.quick-grid b{display:block;margin-bottom:4px}
.quick-grid span{font-size:12px;color:var(--muted)}

/* CONTROLS */
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
input,select,textarea{
 width:100%;padding:10px 11px;
 border:1px solid #bdccd7;border-radius:8px;
 margin:5px 0 10px;
 font:inherit;background:#fff;color:var(--text)
}
textarea{min-height:95px;resize:vertical}
.btn{
 display:inline-block;background:var(--primary);color:#fff;
 border:0;border-radius:8px;padding:9px 13px;
 font-weight:800;cursor:pointer;text-decoration:none
}
.btn:hover{background:var(--primary-2)}
.secondary{background:#fff!important;color:#29465d!important;border:1px solid #ccd8e1!important}
.dangerbtn{background:var(--danger)!important;color:#fff!important;border:0!important;border-radius:8px;padding:8px 10px;font-weight:800;cursor:pointer}
.reportbtn{background:#285f8f!important}
.smallbtn{padding:7px 9px!important;font-size:12px!important}
.inline{display:inline}
.notice{padding:13px;border-radius:9px;margin-bottom:15px}
.good{background:#def4e5;color:#185c2c}
.bad{background:#f8d8dc;color:#791721}

/* TABLES */
table{width:100%;border-collapse:collapse;display:block;overflow:auto}
th,td{padding:10px;border-bottom:1px solid #e5ebef;text-align:left;vertical-align:top}
th{font-size:12px;color:#617486;background:#f7f9fb}
tr:hover td{background:#fcfdfe}

/* STATUS */
.badge{
 display:inline-block;padding:4px 8px;border-radius:999px;
 font-size:11px;font-weight:900
}
.badge.critique{background:#ffe0e3;color:#8a1520}
.badge.grave{background:#ffe8cb;color:#8b5606}
.badge.moderee{background:#fff1b7;color:#7a6200}
.badge.faible{background:#ddf0f9;color:#1e6386}
.alert{padding:13px;border-radius:9px;margin-bottom:10px}
.alert.critique{background:#ffe0e3;color:#811923}
.alert.urgent{background:#ffe8cb}
.alert.important{background:#fff1b7}
.alert.info{background:#ddf0f9}

/* OTHER MODULES */
.mission,.quick{padding:13px;border-bottom:1px solid #e3e9ed}
.channels{display:flex;gap:8px;overflow:auto;margin:12px 0}
.channels a{background:#edf3f7;padding:8px 11px;border-radius:999px;text-decoration:none;font-weight:750;white-space:nowrap}
.message{padding:10px 0;border-bottom:1px solid #e4eaee}
.checkrow{display:flex;align-items:center;gap:10px;padding:7px 0}
.checkbtn{border:0;background:#e7eef3;border-radius:50%;width:31px;height:31px}
.done{text-decoration:line-through;color:#7b8994}

/* LOGIN */
.login{
 min-height:100vh;display:grid;place-items:center;
 background:linear-gradient(135deg,#0a2034,#143c5b)
}
.loginbox{
 width:min(470px,92vw);background:#fff;padding:30px;
 border-radius:16px;box-shadow:0 20px 55px rgba(0,0,0,.24)
}

/* RESPONSIVE */
@media(max-width:1200px){
 .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
 .dashboard-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.8fr)}
 .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
 .mobile-menu-btn{display:inline-block}
 .nav{
   display:none;
   width:280px;
   top:64px;
   height:calc(100vh - 64px);
 }
 .nav-open .nav{display:block}
 .wrap{margin-left:0;padding:80px 14px 25px}
 .dashboard-grid{grid-template-columns:1fr}
 .dashboard-map,.dashboard-grid>.card{min-height:0}
 #map,.dashboard-map #map{height:430px}
 #liveLog{height:auto;max-height:430px}
}
@media(max-width:650px){
 .hero{display:block}
 .hero-meta{margin-top:12px}
 .stats,.grid2,.grid3,.quick-grid{grid-template-columns:1fr}
 .stats{gap:10px}
 .wrap{padding-left:10px;padding-right:10px}
 h1{font-size:24px}
 #map,.dashboard-map #map{height:380px}
 .top{padding-left:12px;padding-right:12px}
 .brand b{font-size:16px}
}