.alerts-page { background: #0d1118; }
.alerts-shell { width: min(1500px, calc(100% - 28px)); margin: 14px auto 24px; }
.alerts-header { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; padding:18px 2px 14px; }
.alerts-header h1 { margin:8px 0 6px; font-family:"Manrope","Inter",sans-serif; font-size:clamp(1.5rem,3vw,2.35rem); }
.alerts-subtitle { margin:0; color:var(--muted); max-width:680px; }
.alerts-nav { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.alerts-nav a, .alerts-nav button { border:1px solid var(--line-soft); border-radius:10px; background:var(--surface); color:var(--text); text-decoration:none; padding:9px 12px; font:600 .82rem Inter,sans-serif; cursor:pointer; }
.alerts-nav button { border-color:#f18b55; background:rgba(241,139,85,.14); }
.alerts-toolbar { display:flex; gap:16px; align-items:center; flex-wrap:wrap; border:1px solid var(--line); border-radius:12px; background:var(--surface); padding:10px 12px; color:var(--muted); font-size:.86rem; }
.alerts-toolbar label { display:flex; align-items:center; gap:8px; }
.alerts-toolbar select { border:1px solid var(--line-soft); border-radius:8px; background:var(--surface-2); color:var(--text); padding:7px 9px; font:inherit; }
.toggle { cursor:pointer; }.toggle input { accent-color:#f18b55; }
.alerts-status { color:#9fe3b1; }.alerts-status.error { color:#ff9b9b; }.alerts-updated { margin-left:auto; }
.trajectory-note { color:#d3a96e; font-size:.78rem; }.marker-legend { display:flex; align-items:center; gap:6px; color:#aeb8c9; font-size:.76rem; }.legend-dot { display:inline-grid; place-items:center; width:20px; height:20px; border-radius:50%; color:#fff; font-style:normal; font-size:.7rem; }.legend-dot.red { background:#e84c4c; }.legend-dot.missile { background:#ae76ef; }.legend-dot.green { background:#39bd68; }
.alerts-grid { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:10px; margin-top:10px; min-height:650px; }
.alerts-map { min-height:650px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#141a23; }
.alerts-panel { border:1px solid var(--line); border-radius:14px; background:var(--surface); overflow:hidden; display:flex; flex-direction:column; min-height:0; }
.alerts-summary { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid var(--line); }
.alerts-summary div { padding:13px 15px; }.alerts-summary div+div { border-left:1px solid var(--line); }
.alerts-summary span { display:block; color:var(--muted); font-size:.76rem; }.alerts-summary strong { display:block; margin-top:3px; font-size:1.4rem; }
.alert-list { overflow:auto; padding:8px; }
.alert-item { border:1px solid var(--line-soft); border-left:4px solid #8b95a7; border-radius:10px; padding:10px; margin-bottom:8px; background:rgba(255,255,255,.025); cursor:pointer; }
.alert-item:hover { border-color:#f18b55; }.alert-item.red { border-left-color:#ef5350; }.alert-item.yellow { border-left-color:#f2ca52; }.alert-item.green { border-left-color:#4fd17d; }
.alert-item-top { display:flex; justify-content:space-between; gap:8px; font-size:.76rem; color:var(--muted); }.alert-item h2 { margin:6px 0 4px; font-size:.98rem; }.alert-item p { margin:0; color:#c7cfdd; white-space:pre-line; font-size:.82rem; line-height:1.35; }
.alert-chip { font-weight:700; text-transform:uppercase; letter-spacing:.05em; }.alert-chip.red { color:#ff8787; }.alert-chip.yellow { color:#f5d76a; }.alert-chip.green { color:#79e49b; }
.alert-locations { margin-top:8px; color:#f1b07c; font-size:.8rem; }.alert-thumb { display:block; max-width:100%; max-height:160px; object-fit:cover; margin-top:8px; border-radius:7px; }
.alert-marker-icon { background:transparent; border:0; }.alert-marker { position:relative; display:grid; place-items:center; width:34px; height:34px; border:2px solid rgba(255,255,255,.92); border-radius:50%; box-shadow:0 2px 12px rgba(0,0,0,.52), 0 0 0 3px rgba(255,255,255,.12); color:#10151d; font:800 1rem/1 Inter,sans-serif; transform:translateZ(0); }.alert-marker-core { position:relative; z-index:2; }.alert-marker-pulse { position:absolute; inset:-5px; border:2px solid currentColor; border-radius:50%; opacity:0; }.alert-marker.active .alert-marker-pulse { animation:alert-pulse 2.2s ease-out infinite; }.alert-marker.red{background:#ef5350;color:#fff}.alert-marker.yellow{background:#f2ca52;color:#161b22}.alert-marker.green{background:#4fd17d;color:#102018}.alert-marker.unknown{background:#8490a5;color:#fff}.alert-marker.cancelled { opacity:.78; box-shadow:0 1px 6px rgba(0,0,0,.35); }.leaflet-marker-icon:hover .alert-marker { transform:scale(1.12); }.leaflet-tooltip { background:#151c28; border:1px solid #445166; color:#edf2fa; box-shadow:0 4px 14px rgba(0,0,0,.3); }.leaflet-tooltip-top:before { border-top-color:#445166; }
@keyframes alert-pulse { 0% { transform:scale(.72); opacity:.65; } 70%,100% { transform:scale(1.4); opacity:0; } }
.leaflet-popup-content-wrapper, .leaflet-popup-tip { background:#1a202b; color:#e8ecf5; }.leaflet-popup-content { margin:12px; max-width:320px; }.leaflet-control-zoom a { background:#1a202b; color:#e8ecf5; border-color:#3b4558; }
.alert-popup-location { margin-top:4px; font-size:1.02rem; }.alert-popup small { color:#aab4c5; }.alert-popup-text { margin:9px 0 7px; white-space:pre-line; line-height:1.35; max-height:150px; overflow:auto; }.alert-popup-text.muted { color:#aab4c5; }.alert-popup-source { display:inline-block; margin-top:3px; color:#ffb078; font-size:.82rem; font-weight:600; }
@media (max-width: 900px) { .alerts-header { flex-direction:column; }.alerts-grid { grid-template-columns:1fr; min-height:0; }.alerts-map { min-height:58vh; }.alerts-panel { max-height:52vh; }.alerts-updated { margin-left:0; }.trajectory-note { width:100%; } }