:root{--bg:#070b12;--bg2:#0c121c;--card:#111927;--line:#1f2a3b;--text:#e8edf5;--muted:#9aa7ba;--gold:#F5C451;--hh:'Space Grotesk',system-ui,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 Inter,system-ui,sans-serif}
a{color:var(--gold)}
h1,h2,h3{font-family:var(--hh);margin:0;letter-spacing:-.01em}
button{font:inherit;color:inherit;cursor:pointer}
.banner{background:var(--gold);color:#1a1405;text-align:center;font-weight:600;font-size:13px;padding:6px 12px}
header{position:sticky;top:0;z-index:30;background:rgba(7,11,18,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hwrap{max-width:1440px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:20px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);font-family:var(--hh);font-weight:700;font-size:20px;white-space:nowrap}
.logo svg{flex:none}
nav{display:flex;gap:4px}
nav a{color:var(--muted);text-decoration:none;padding:8px 12px;border-radius:8px;font-weight:500;white-space:nowrap}
nav a[aria-current]{color:var(--text);background:var(--card)}
nav a:hover{color:var(--text)}
.search{flex:1;max-width:340px;margin-left:auto;position:relative}
.search input{width:100%;background:var(--card);border:1px solid var(--line);border-radius:10px;color:var(--text);padding:10px 12px 10px 36px;font:inherit;min-height:44px}
.search svg{position:absolute;left:11px;top:13px}
.btn{background:var(--gold);color:#1a1405;border:0;border-radius:10px;padding:10px 16px;font-weight:600;min-height:44px;white-space:nowrap}
.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--line)}
.btn.ghost:hover{border-color:var(--gold)}

.mapwrap{position:relative;height:calc(100vh - 150px);min-height:520px;max-height:820px;background:#02060d;overflow:hidden;border-bottom:1px solid var(--line)}
#map{display:block;width:100%;height:100%;cursor:grab;touch-action:none}
#map:active{cursor:grabbing}
.country{stroke:none;transition:fill-opacity .35s}
.country:hover{fill-opacity:.72}
.borders{fill:none;stroke:#ffe7b3;stroke-opacity:.55;stroke-width:.6px;vector-effect:non-scaling-stroke;pointer-events:none}
.bglow{fill:none;stroke:#ffd27a;stroke-opacity:.14;stroke-width:3px;vector-effect:non-scaling-stroke;pointer-events:none}
.lift{stroke:var(--gold);stroke-width:1.8px;vector-effect:non-scaling-stroke;fill-opacity:.42;pointer-events:none;animation:liftin .45s ease-out}
@keyframes liftin{from{opacity:0}to{opacity:1}}
.dim .country{fill-opacity:.1}
.dim .country.inv{fill-opacity:.7}
.maptools{position:absolute;left:16px;top:16px;display:flex;flex-direction:column;gap:10px;z-index:5}
.layerbar{display:flex;align-items:center;gap:2px;background:rgba(10,15,24,.88);border:1px solid var(--line);border-radius:12px;padding:4px;backdrop-filter:blur(6px);max-width:calc(100vw - 32px);overflow-x:auto;scrollbar-width:none}
.layerbar::-webkit-scrollbar{display:none}
.lsel{display:none;align-items:center;gap:8px;background:rgba(10,15,24,.9);border:1px solid var(--line);border-radius:12px;padding:4px 4px 4px 12px;backdrop-filter:blur(6px)}
.lsel span{font:600 10px Inter;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.lsel select{appearance:none;-webkit-appearance:none;background:var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%231a1405' stroke-width='3'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;color:#1a1405;border:0;border-radius:9px;font:600 15px Inter;padding:9px 34px 9px 12px;min-height:44px}
.layerbar .grp{font:600 10px Inter;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;padding:0 6px 0 8px;white-space:nowrap}
.layerbar .sep{width:1px;align-self:stretch;background:var(--line);margin:6px 4px;flex:none}
.layerbar button{flex:none;background:none;border:0;padding:8px 14px;border-radius:9px;color:var(--muted);font-weight:500;min-height:40px;white-space:nowrap}
.layerbar button[aria-pressed=true]{background:var(--gold);color:#1a1405;font-weight:600}
.zoombtns{display:flex;flex-direction:column;background:rgba(10,15,24,.85);border:1px solid var(--line);border-radius:12px;overflow:hidden;width:44px}
.zoombtns button{background:none;border:0;height:44px;font-size:20px;color:var(--text)}
.zoombtns button+button{border-top:1px solid var(--line)}
.marker{position:absolute;left:0;top:0;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:1.5px solid var(--gold);background:rgba(20,14,2,.78);display:grid;place-items:center;z-index:4;box-shadow:0 0 14px rgba(245,196,81,.55),0 0 34px rgba(245,196,81,.25);padding:0}
.marker::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--gold);animation:pulse 2.2s ease-out infinite}
@keyframes pulse{from{transform:scale(.8);opacity:.9}to{transform:scale(1.6);opacity:0}}
.mlabel{position:absolute;top:48px;left:50%;transform:translateX(-50%);white-space:nowrap;font:600 11px Inter;color:var(--gold);background:rgba(8,10,14,.8);padding:2px 7px;border-radius:6px;pointer-events:none}
.sbadge{background:rgba(245,196,81,.14);border:1px dashed var(--gold);color:var(--gold);font:600 12px Inter;border-radius:8px;padding:5px 9px;align-self:flex-start}
.tip{position:absolute;pointer-events:none;background:rgba(8,12,20,.92);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:13px;z-index:6;display:none;white-space:nowrap}

.panel{position:absolute;top:16px;right:16px;max-height:calc(100% - 32px);width:380px;background:rgba(10,15,24,.94);backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:16px;z-index:8;overflow-y:auto;transform:translateX(420px);transition:transform .4s cubic-bezier(.2,.8,.2,1);padding:20px}
.panel.open{transform:none}
.pclose{position:absolute;right:12px;top:12px;width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--card);display:grid;place-items:center}
.phead{display:flex;gap:14px;align-items:center;padding-right:44px}
.photo{width:64px;height:64px;border-radius:50%;flex:none;border:1.5px dashed #4a5a72;display:grid;place-items:center;background:var(--bg2)}
.pname{font-size:22px;line-height:1.15}
.code{font:600 11px Inter;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:1px 6px;margin-left:6px;vertical-align:3px}
.lname{color:var(--muted);font-size:13px;margin-top:2px}
.ideo{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-size:13px;font-weight:500;background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:5px 10px}
.sw{width:14px;height:14px;border-radius:4px;flex:none}
.sec{border-top:1px solid var(--line);margin-top:16px;padding-top:14px}
.sec h3{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600;margin-bottom:10px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:14px}
.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:500;text-align:right}
.bar{display:grid;grid-template-columns:76px 1fr 46px;align-items:center;gap:10px;font-size:13px;margin-bottom:7px}
.bar .t{height:10px;background:var(--bg2);border-radius:5px;overflow:hidden}
.bar .f{height:100%;border-radius:5px;opacity:.75}
.bar .v{text-align:right;color:var(--muted)}
.note{font-size:12px;color:var(--muted);margin-top:8px}
.odds{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.odd{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.odd b{display:block;font-family:var(--hh);font-size:20px}
.odd span{font-size:12px;color:var(--muted)}
.comm{border:1.5px dashed #4a5a72;border-radius:12px;padding:14px;margin-top:16px}
.comm .lbl{font-size:12px;font-weight:600;color:var(--gold);letter-spacing:.04em}
.comm .row{display:flex;justify-content:space-between;align-items:baseline;margin:8px 0 12px}
.comm .row b{font-family:var(--hh);font-size:22px}
.regions{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}
.regions span{aspect-ratio:1;border-radius:4px;opacity:.75}
.pbtns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.news li{list-style:none;padding:10px 0;border-bottom:1px solid var(--line)}
.news ul{padding:0;margin:0}
.news .meta{font-size:12px;color:var(--muted);margin-top:2px}
.involved{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--line);background:var(--bg2);border-radius:999px;padding:4px 10px;font-size:13px}
.callout{margin-top:16px;font-size:13px;color:var(--muted);background:var(--bg2);border-left:0;border:1px solid var(--line);border-radius:10px;padding:10px 12px}

.legend{max-width:1440px;margin:0 auto;padding:14px 20px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;font-size:13px;color:var(--muted);border-bottom:1px solid var(--line)}
.legend .scale{display:flex;flex-wrap:wrap;gap:6px 14px}
.legend .it{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.legend .src{flex-basis:100%;font-size:12px}
.stripe{background:repeating-linear-gradient(45deg,#6b7280 0 3px,#cbd5e1 3px 5px)}

main{max-width:1440px;margin:0 auto;padding:28px 20px 40px;display:grid;grid-template-columns:1.6fr 1fr;gap:28px}
.block h2{font-size:22px;margin-bottom:14px;display:flex;justify-content:space-between;align-items:baseline}
.block h2 a{font:500 13px Inter;text-decoration:none}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.ecard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;position:relative;overflow:hidden}
.ecard::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--c,#9ca3af)}
.ecard .cty{font-family:var(--hh);font-weight:600;font-size:17px}
.ecard .d{color:var(--muted);font-size:13px}
.ecard .cd{font-family:var(--hh);font-size:26px;font-weight:700;color:var(--gold);margin:8px 0 2px}
.ecard .lead{font-size:13px;display:flex;align-items:center;gap:6px}
.list{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:4px 16px}
.list button{display:flex;width:100%;text-align:left;background:none;border:0;padding:12px 0;gap:12px;align-items:center;min-height:44px}
.list button+button{border-top:1px solid var(--line)}
.list .ic{width:36px;height:36px;border-radius:50%;border:1px solid var(--gold);display:grid;place-items:center;flex:none}
.list .meta,.nlist .meta{font-size:12px;color:var(--muted)}
.nlist{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:4px 16px;margin:0}
.nlist li{list-style:none;padding:12px 0}
.nlist li+li{border-top:1px solid var(--line)}
.side{display:flex;flex-direction:column;gap:28px}
footer{border-top:1px solid var(--line);color:var(--muted);font-size:13px}
.fwrap{max-width:1440px;margin:0 auto;padding:22px 20px 30px;display:grid;gap:6px}
.fwrap .small{font-size:12px;opacity:.85}
.mapwrap.popen .layerbar{display:none}
.mapwrap.popen .lsel{display:flex;align-self:flex-start}
@media (max-width:900px){
 .hwrap{flex-wrap:wrap;gap:10px;padding:10px 14px}
 .search{order:3;max-width:none;flex-basis:100%;margin:0}
 nav{order:4;flex-basis:100%;overflow-x:auto;margin:0 -4px}
 .signin{margin-left:auto;padding:8px 14px;font-size:14px}
 nav{scrollbar-width:none}nav::-webkit-scrollbar{display:none}
 .mapwrap.popen .maptools,.mapwrap.popen .mlabel{display:none}
 .mapwrap{height:62vh;min-height:420px}
 .maptools{left:10px;top:10px}
 .zoombtns{display:none}
 .layerbar{display:none}
 .lsel{display:flex}
 .layerbar .sep{flex-basis:100%;height:0;margin:0;background:none}
 .layerbar .grp{min-width:64px;padding:0 2px 0 6px;font-size:9.5px}
 .layerbar button{padding:8px 8px;font-size:13.5px}
 .panel{top:auto;left:0;right:0;bottom:0;width:auto;max-height:58%;border-radius:18px 18px 0 0;transform:translateY(105%)}
 .panel.open{transform:none}
 main{grid-template-columns:1fr;padding:22px 14px 32px}
 .legend{padding:12px 14px}
}
@media (max-width:420px){.cards .ecard:nth-child(n+9){display:none}.logo span{font-size:18px}.layerbar button{padding:8px 8px;font-size:13.5px}.cards{grid-template-columns:1fr 1fr}.ecard .cd{font-size:22px}}

.breaking{display:none;align-items:center;gap:10px;background:#7f1d1d;color:#fff;font-size:14px;padding:8px 20px;border:0;width:100%;text-align:left;min-height:40px}
.breaking.on{display:flex}
.breaking b{font:700 12px Inter;letter-spacing:.08em;background:#fff;color:#7f1d1d;border-radius:4px;padding:2px 6px}
.legend .it.nd .sw{background:#2b313b;border:1px solid #4a5568}
.legend .lt{font-weight:600;color:var(--text);margin-right:4px}
.srcline{font-size:12px;color:var(--muted)}
.srcline a{color:var(--gold)}
.bigv{font:700 34px/1.1 var(--hh);margin-top:16px}
.bigv small{font:500 13px Inter;color:var(--muted);margin-left:6px}
.rank{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin:10px 0 6px}
.rank b{color:var(--text)}
.pbar{height:8px;border-radius:4px;background:var(--bg2);position:relative;overflow:hidden}
.pbar span{position:absolute;left:0;top:0;bottom:0;border-radius:4px}
.snap{width:100%;border-collapse:collapse;font-size:14px}
.snap td{padding:7px 0;border-bottom:1px solid var(--line)}
.snap td:last-child{text-align:right;font-weight:500}
.snap tr.cur td{color:var(--gold)}
.snap .yr{color:var(--muted);font-size:12px;font-weight:400;margin-left:4px}
.ndbox{margin-top:16px;color:var(--muted);font-size:14px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:12px}
.marker.m-earthquake{border-color:#fb923c;box-shadow:0 0 14px rgba(251,146,60,.55),0 0 30px rgba(251,146,60,.2);width:38px;height:38px;margin:-19px 0 0 -19px}
.marker.m-earthquake::after{border-color:#fb923c}
.marker.m-earthquake .mlabel{color:#fdba74}
.marker.m-tsunami{border-color:#38bdf8;box-shadow:0 0 14px rgba(56,189,248,.55),0 0 30px rgba(56,189,248,.2)}
.marker.m-tsunami::after{border-color:#38bdf8}
.marker.m-tsunami .mlabel{color:#7dd3fc}
.marker .mlabel{max-width:180px;overflow:hidden;text-overflow:ellipsis}
