@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');
:root{--bg:#061326;--panel:#0b1d33;--panel2:#102640;--line:#1b3855;--text:#e8f0fa;--muted:#8fa5bd;--blue:#2d79c7;--cyan:#54c5c2;--amber:#e8ad54;--red:#df7777}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 70% -20%,#153a5d 0,transparent 42%),var(--bg);color:var(--text);font-family:'IBM Plex Sans Arabic',Tahoma,sans-serif;font-size:14px}
.topbar{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 26px;background:#07182bdc;position:sticky;top:0;z-index:1000;backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:12px}.brand strong{display:block;font-size:15px;letter-spacing:.2px}.brand small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.brand-mark{width:42px;height:42px;border-radius:12px;background:linear-gradient(145deg,#2879bb,#16416a);display:grid;place-items:center;font-size:13px;font-weight:700;letter-spacing:1px;border:1px solid #4a8fc3}
.top-actions{display:flex;align-items:center;gap:14px}.status{color:#a8c5d8;font-size:11px}.status i{display:inline-block;width:7px;height:7px;background:#55c5a2;border-radius:50%;margin-left:6px}.icon-btn{background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:10px;width:36px;height:36px;font-size:18px;cursor:pointer}.menu-btn{display:none}
.app-shell{display:grid;grid-template-columns:238px minmax(0,1fr);min-height:calc(100vh - 76px)}.sidebar{border-left:1px solid var(--line);padding:24px 16px;display:flex;flex-direction:column;background:#081a2d}.side-heading{font-size:10px;color:#718ba6;letter-spacing:1px;margin:0 10px 12px}.nav-item{width:100%;border:0;background:transparent;color:#a9bbcf;text-align:right;padding:12px 13px;border-radius:9px;margin-bottom:4px;font:inherit;cursor:pointer}.nav-item span{display:inline-block;width:26px;color:#7ea7c9}.nav-item.active,.nav-item:hover{background:#12314e;color:#fff}.side-divider{height:1px;background:var(--line);margin:20px 4px}.filter-check{display:flex;align-items:center;gap:9px;color:#b4c4d5;padding:7px 10px;font-size:12px}.filter-check input{accent-color:#3b9ca5}.sidebar-note{margin-top:25px;background:#102a42;border:1px solid #21415d;border-radius:10px;padding:13px;color:#b5c8d9;font-size:11px;line-height:1.8}.sidebar-note b{color:#e7f2fc}.sidebar-note p{margin:5px 0 0}.side-footer{margin-top:auto;padding:22px 8px 0;color:#617c98;font-size:10px}
.main-content{padding:28px 30px 18px;max-width:1600px;width:100%;margin:auto}.page-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:22px}.eyebrow{font-size:9px;letter-spacing:1.5px;color:#5ca9d2;direction:ltr;text-align:right}.page-head h1{font-size:25px;margin:5px 0 2px}.page-head p,.panel-head p,.source-strip p{color:var(--muted);font-size:11px;margin:0}.date-chip{border:1px solid var(--line);background:#0b2037;color:#9fb5ca;padding:9px 13px;border-radius:8px;font-size:11px}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.metric-card,.panel{background:linear-gradient(145deg,#0c2037,#091a2d);border:1px solid var(--line);border-radius:13px}.metric-card{padding:16px 18px;min-height:106px}.metric-card span{display:block;color:#9bb0c6;font-size:11px}.metric-card strong{display:block;font-size:26px;margin:4px 0 1px;letter-spacing:.5px}.metric-card small{color:#66839e;font-size:10px}.metric-time{font-size:20px!important}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr);gap:14px}.panel{padding:17px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.panel h2{font-size:14px;margin:0 0 4px}.pill{border-radius:30px;padding:5px 10px;font-size:10px;white-space:nowrap}.pill.blue{background:#12395a;color:#8fc7ee;border:1px solid #24557a}#map{height:365px;border-radius:9px;overflow:hidden;background:#10263b;border:1px solid #29455e}.leaflet-container{background:#0d2439;font-family:inherit}.leaflet-control-attribution{font-size:9px!important}.map-legend{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:12px;color:#9bb0c6;font-size:10px}.dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-left:5px}.teal{background:var(--cyan)}.amber{background:var(--amber)}.muted{color:#66819b}
.text-btn{background:transparent;border:0;color:#68b7d9;font:inherit;font-size:10px;cursor:pointer}.event-feed{display:flex;flex-direction:column}.event-item{display:grid;grid-template-columns:8px 1fr auto;gap:10px;padding:12px 0;border-bottom:1px solid #19334c}.event-item:last-child{border-bottom:0}.event-pin{width:7px;height:7px;border-radius:50%;background:var(--amber);margin-top:7px;box-shadow:0 0 0 4px #e8ad541c}.event-item b{font-size:12px;display:block}.event-item p{font-size:10px;color:#8fa6bd;margin:4px 0;line-height:1.6}.event-item small{color:#67829d;font-size:9px}.grade{font-size:10px;font-weight:700;width:23px;height:23px;border-radius:7px;display:grid;place-items:center}.grade-a{background:#153f3c;color:#74d4bb}.grade-b{background:#193b59;color:#8cc7ee}.grade-c{background:#4a3820;color:#edc17a}.grade-d{background:#492d35;color:#e8a0a0}
.lower-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.region-list>div{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #19334c}.region-list>div:last-child{border:0}.region-icon{width:32px;height:32px;border-radius:9px;background:#153451;color:#8fc4e7;display:grid;place-items:center;font-size:9px;font-weight:700;direction:ltr}.region-list b{display:block;font-size:11px}.region-list small,.confidence-row small{display:block;color:#7f99b2;font-size:9px;margin-top:2px}.region-tag{margin-right:auto;background:#143d42;color:#7ed0c3;padding:4px 8px;border-radius:20px;font-size:9px}.region-tag.neutral{background:#26384a;color:#a9bbcb}.confidence-row{display:flex;align-items:center;gap:10px;padding:8px 0}.confidence-row b{font-size:11px}.source-strip{display:flex;align-items:center;gap:22px;margin-top:14px}.source-strip>div{margin-left:auto}.source-strip a{color:#82c6e5;text-decoration:none;font-size:11px;white-space:nowrap}.source-strip a span{font-size:10px}footer{display:flex;justify-content:space-between;color:#627e99;font-size:9px;padding:18px 4px 4px}.toast{position:fixed;bottom:20px;left:20px;background:#163b53;border:1px solid #3d718f;color:#eaf7ff;padding:10px 15px;border-radius:9px;opacity:0;transform:translateY(8px);transition:.2s;z-index:2000;pointer-events:none}.toast.show{opacity:1;transform:translateY(0)}
@media(max-width:1050px){.app-shell{grid-template-columns:205px 1fr}.main-content{padding:24px 18px}.dashboard-grid{grid-template-columns:1fr}.feed-panel{min-height:unset}}
@media(max-width:700px){.topbar{height:64px;padding:0 13px}.menu-btn{display:block;order:0}.brand{margin-right:auto;margin-left:auto;gap:8px}.brand-mark{width:36px;height:36px}.brand strong{font-size:11px}.brand small{font-size:9px}.top-actions{gap:7px}.status{display:none}.app-shell{display:block;min-height:calc(100vh - 64px)}.sidebar{position:fixed;z-index:1100;top:64px;bottom:0;right:0;width:min(82vw,290px);transform:translateX(105%);transition:transform .22s;box-shadow:-15px 0 35px #0008}.sidebar.open{transform:translateX(0)}.main-content{padding:19px 12px 12px}.page-head{align-items:flex-start;gap:8px}.page-head h1{font-size:21px}.page-head p{font-size:10px;max-width:235px;line-height:1.7}.date-chip{font-size:9px;padding:7px 8px;white-space:nowrap}.metric-grid{grid-template-columns:repeat(2,1fr);gap:8px}.metric-card{padding:12px;min-height:91px}.metric-card strong{font-size:22px}.dashboard-grid,.lower-grid{grid-template-columns:1fr;gap:10px}.panel{padding:13px;border-radius:11px}.panel-head{margin-bottom:11px}#map{height:290px}.map-legend{gap:10px;font-size:9px}.source-strip{align-items:flex-start;flex-wrap:wrap;gap:12px}.source-strip>div{width:100%;margin:0}.source-strip a{font-size:10px}footer{display:block;line-height:1.8}footer span{display:block}.event-item{padding:10px 0}.event-item b{font-size:11px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}