*{box-sizing:border-box}body{margin:0;background:#061426;color:#fff;font-family:Arial,sans-serif}.app{min-height:100vh;overflow:hidden}header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#061326;border-bottom:1px solid #1c3852}.brand{display:flex;align-items:center;color:#fff;text-decoration:none;gap:8px}.brand span{font-size:35px}.brand b,.brand em{font-size:21px;font-style:normal}.brand em{color:#f47b28}header nav{display:flex;height:100%;gap:40px}header nav button{border:0;background:none;color:#9babb9;font-weight:bold}header nav .active{color:#43d4ed;border-bottom:3px solid #43d4ed}.map{height:calc(100vh - 82px);min-height:660px;position:relative;overflow:hidden;background:radial-gradient(circle at 70% 40%,#10445b,#07182c 45%,#041021);background-image:linear-gradient(25deg,transparent 48%,#33739732 49%,transparent 50%),linear-gradient(145deg,transparent 48%,#33739729 49%,transparent 50%),radial-gradient(circle at 70% 40%,#10445b,#07182c 45%,#041021)}.grid{position:absolute;inset:-20%;background:repeating-linear-gradient(12deg,transparent 0 80px,#8ac5eb17 82px 84px,transparent 85px 130px);transform:rotate(-8deg)}svg{position:absolute;inset:0;width:100%;height:100%}svg path{fill:none;stroke:#55e79b;stroke-width:5;stroke-dasharray:9 12;filter:drop-shadow(0 0 8px #55e79b)}
aside{position:absolute;z-index:10;left:24px;top:24px;bottom:24px;width:405px;display:flex;flex-direction:column;gap:13px}.search{height:62px;border:1px solid #4f6b83;border-radius:16px;background:#10243b;display:flex;align-items:center;gap:12px;padding:0 18px;color:#3bd4f1;font-size:31px}.search input{flex:1;border:0;outline:0;background:transparent;color:#fff;font-size:16px}.filters{display:flex;gap:7px}.filters button{border:1px solid #3b5670;border-radius:18px;background:#0d2138;color:#98abba;padding:7px 13px}.filters .on{background:#55e79b;color:#06271a;border-color:#55e79b}aside h2{font-size:18px;margin:3px 0;display:flex;justify-content:space-between}aside h2 small{font-weight:normal;color:#8194a5;font-size:11px}.cards{overflow:auto;display:grid;gap:8px}.card{min-height:96px;display:flex;gap:12px;align-items:center;text-align:left;color:#fff;background:#0d2239ed;border:1px solid #35536d;border-radius:14px;padding:8px}.card.on,.card:hover{border-color:#55e79b}.card>span:nth-child(2){flex:1;display:grid;gap:5px}.card b{font-size:14px}.card em{font-size:11px;font-style:normal;color:#55e79b}.card small{font-size:10px;color:#9baab8}.thumb{width:82px;height:75px;border-radius:10px;background:linear-gradient(145deg,#174c4d,#071c31);display:grid;place-items:center;font-size:28px}.thumb small{color:#55e79b}.card strong{font-size:27px;color:#43d4ed}.install,.drawer button,.green{border:0;border-radius:12px;padding:14px;background:#55e79b;color:#05291b;font-weight:bold}.pin{position:absolute;z-index:5;transform:translate(-50%,-50%);border:0;background:none}.pin span{display:grid;place-items:center;width:57px;height:62px;border:3px solid #fff;border-radius:50%;background:#0a1b2a;font-size:31px;box-shadow:0 0 0 2px #55e79b}.pin i{display:none;position:absolute;left:53px;top:18px;background:#55e79b;color:#05291b;border-radius:20px;padding:7px;white-space:nowrap;font-style:normal;font-weight:bold}.pin.active i{display:block}.pin.active span{box-shadow:0 0 0 7px #55e79b33,0 0 30px #55e79b}.drawer{position:absolute;z-index:8;left:460px;right:25px;bottom:25px;min-height:102px;border:1px solid #44617a;border-radius:17px;background:#071a2dec;display:flex;align-items:center;gap:26px;padding:17px}.drawer>div{display:grid;gap:5px}.drawer>div:nth-child(2){flex:1}.drawer small{color:#788ea1;font-size:9px;letter-spacing:.1em}.drawer b{font-size:13px}.drawer .fox{font-size:35px}.drawer button{min-width:170px}.mobile{display:none}
dialog{width:min(470px,calc(100% - 28px));background:#0a1e34;color:#fff;border:1px solid #3a5770;border-radius:22px;padding:31px;text-align:center}dialog::backdrop{background:#010912cc;backdrop-filter:blur(10px)}.close{position:absolute;right:12px;top:8px;border:0;background:none;color:#9bb0c1;font-size:29px}.ring{width:140px;height:140px;border:9px solid #55e79b;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;font-size:40px;font-weight:bold}.ring small{font-size:16px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #2b4860;border-radius:13px;margin:20px 0}.metrics span{padding:14px 5px;display:grid}.metrics small{color:#8297aa}.danger{border:1px solid #ed6e65;color:#ff8c83;background:#d9494415;border-radius:10px;padding:12px}.bigfox{font-size:60px}
@media(max-width:760px){header{height:66px;padding:0 14px}header nav{display:none}.map{height:calc(100dvh - 66px);min-height:620px}aside{left:10px;right:10px;top:10px;width:auto;bottom:auto}.search{height:54px}.cards,aside h2,.install{display:none}.pin:nth-of-type(n+5){display:none}.drawer{left:10px;right:10px;bottom:78px;min-height:174px;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px}.drawer>div:nth-child(2){grid-column:1/-1}.drawer>div:nth-child(5){display:none}.drawer .fox{display:none}.drawer button{min-width:0}.mobile{display:flex;position:fixed;z-index:20;bottom:0;left:0;right:0;height:67px;background:#061426;border-top:1px solid #29445c;justify-content:space-around}.mobile button{border:0;background:none;color:#55e79b;display:grid;place-items:center;font-size:20px}.mobile small{display:block;font-size:9px;color:#91a3b3}}