*{box-sizing:border-box}html,body,.app,#map{height:100%;margin:0}body{font-family:Inter,Segoe UI,Arial,sans-serif;background:#050c14;color:#eef8ff;overflow:hidden}.leaflet-container{background:#07131f}.leaflet-control-attribution{background:rgba(3,10,17,.75)!important;color:#557086!important;font-size:8px}.leaflet-control-attribution a{color:#6f9ab5!important}.hero{position:absolute;z-index:700;left:5vw;top:7vh;width:360px;pointer-events:none}.eyebrow{margin-top:20px;color:#5ddcff;letter-spacing:3px;font-size:10px;font-weight:800}.hero h1{font-size:54px;line-height:.94;margin:9px 0 15px;letter-spacing:-2px;text-shadow:0 5px 25px #000}.hero h1 b{color:#62ddff}.hero p{color:#a6bbca;font-size:14px;line-height:1.55;max-width:330px}.hero button{pointer-events:auto;border:1px solid #57d9ff;background:rgba(20,162,201,.18);color:#dff9ff;border-radius:7px;padding:12px 18px;font-weight:900;font-size:11px;letter-spacing:1px;cursor:pointer;box-shadow:0 0 25px rgba(55,205,255,.15)}.hero button:hover{background:rgba(42,197,238,.32)}.top-stats{position:absolute;z-index:700;right:4vw;top:4vh;display:flex;gap:10px}.top-stats div{min-width:105px;background:rgba(5,17,28,.78);border:1px solid #1e3c51;border-radius:8px;padding:10px 12px;backdrop-filter:blur(8px)}.top-stats strong{display:block;font-size:20px}.top-stats span{font-size:8px;color:#7691a5;letter-spacing:1px}.side-panel{position:absolute;z-index:800;right:4vw;top:15vh;width:285px;display:none;background:rgba(6,18,30,.94);border:1px solid #285069;border-radius:12px;padding:16px;box-shadow:0 20px 60px rgba(0,0,0,.45);backdrop-filter:blur(12px)}.side-panel.open{display:block}.panel-head{display:flex;justify-content:space-between;color:#5ddcff;font-size:9px;letter-spacing:2px;font-weight:900}.panel-head button{background:none;border:0;color:#71899b;font-size:22px;cursor:pointer}.side-panel h2{font-size:23px;margin:14px 0 6px}.side-panel p{font-size:11px;color:#90a8ba;line-height:1.5}.route-list{margin-top:15px}.route-item{border-top:1px solid #1b3446;padding:10px 0;font-size:10px;color:#b7cad8}.route-item b{display:block;color:#f1f8fc;margin-bottom:3px}.route-item span{color:#61ddff}.bottom-card{position:absolute;z-index:700;left:5vw;bottom:4vh;background:rgba(5,16,27,.82);border:1px solid #1c3b4f;border-radius:8px;padding:10px 13px;backdrop-filter:blur(8px)}.legend{font-size:9px;color:#b2c5d3}.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin:0 5px 0 11px}.legend i:first-child{margin-left:0}.road{background:#57d9ff}.ship{background:#4de2a0}.air{background:#ffd264}.hint{font-size:8px;color:#597487;margin-top:5px}.state-label{background:none!important;border:0!important;box-shadow:none!important;color:#b8d1df!important;font-size:8px;font-weight:800;letter-spacing:.5px;text-shadow:0 1px 5px #000}.state-label:before{display:none}.hub-dot{width:11px;height:11px;background:#5cdeff;border:2px solid #eaffff;border-radius:50%;box-shadow:0 0 0 5px rgba(92,222,255,.12),0 0 18px #5cdeff}.port-dot{width:11px;height:11px;background:#4de2a0;border:2px solid #eaffff;border-radius:50%;box-shadow:0 0 0 5px rgba(77,226,160,.12),0 0 18px #4de2a0}.moving{font-size:21px;filter:drop-shadow(0 0 7px rgba(93,221,255,.8))}.pulse{animation:pulse 1.7s infinite}@keyframes pulse{0%,100%{transform:scale(1);opacity:.8}50%{transform:scale(1.35);opacity:1}}#toast{position:absolute;z-index:900;left:50%;bottom:7vh;transform:translateX(-50%) translateY(20px);opacity:0;background:#0a2231;border:1px solid #3e6b82;color:#bff2ff;border-radius:20px;padding:8px 14px;font-size:10px;transition:.35s}#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}@media(max-width:800px){.hero{left:20px;top:25px;width:280px}.hero h1{font-size:38px}.hero p{font-size:12px}.top-stats{top:auto;bottom:90px;right:15px}.top-stats div{min-width:75px}.top-stats span{font-size:7px}.side-panel{right:15px;top:auto;bottom:145px}.bottom-card{left:15px;bottom:15px}}