:root{color-scheme:dark;--bg:#030816;--text:#eef5fd;--muted:#97a9bf;--cyan:#08d8f6;--violet:#9753fa;--line:rgba(107,165,220,.16)}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden;display:flex;flex-direction:column;min-height:100vh}
a{color:inherit;text-decoration:none}
.sky{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(1100px 620px at 78% 8%,rgba(49,119,255,.16),transparent 60%),radial-gradient(900px 600px at 0% 100%,rgba(151,83,250,.14),transparent 60%),var(--bg)}
.sky:after{content:"";position:absolute;inset:0;opacity:.6;background-image:radial-gradient(1px 1px at 12% 18%,#7ed0ff,transparent),radial-gradient(1px 1px at 61% 11%,#a2bbff,transparent),radial-gradient(1px 1px at 79% 83%,#a2bbff,transparent),radial-gradient(1px 1px at 39% 67%,#fff8,transparent),radial-gradient(1px 1px at 90% 40%,#fff6,transparent),radial-gradient(1.5px 1.5px at 25% 85%,#c9f7ff,transparent);background-size:520px 480px;animation:tw 6s ease-in-out infinite alternate}
@keyframes tw{to{opacity:.3}}
.top{display:flex;align-items:center;justify-content:space-between;padding:20px clamp(16px,4vw,48px)}
.brand{display:flex;align-items:center;gap:10px;font-size:17px;letter-spacing:.3px}.brand img{border-radius:50%}
.xbtn{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);font-size:18px}
.xbtn:hover{border-color:var(--cyan)}
.wrap{flex:1;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:24px;max-width:1180px;width:100%;margin:0 auto;padding:12px clamp(16px,4vw,48px) 24px}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;border:1px solid rgba(8,216,246,.35);background:rgba(8,216,246,.08);color:#c9f7ff;font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase}
.pill i{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:pulse 1.8s ease-in-out infinite}
@keyframes pulse{50%{opacity:.3}}
h1{font-size:clamp(40px,6.4vw,76px);line-height:1.02;letter-spacing:-1.5px;margin:22px 0 16px;font-weight:800}
h1 span{background:linear-gradient(90deg,#08d8f6,#3177ff 55%,#9753fa);-webkit-background-clip:text;background-clip:text;color:transparent}
.copy p{font-size:clamp(17px,1.6vw,20px);color:var(--muted);margin:0 0 30px;max-width:30ch}
.follow{display:inline-flex;align-items:center;gap:10px;padding:13px 20px;border-radius:14px;font-weight:700;font-size:15px;background:rgba(8,216,246,.1);border:1px solid rgba(8,216,246,.45);color:#c9f7ff}
.follow span{font-size:17px}.follow:hover{background:rgba(8,216,246,.18)}
.stage{position:relative;width:100%;max-width:540px;aspect-ratio:1/1;justify-self:center}
.ring{position:absolute;border-radius:50%;border:1px dashed rgba(8,216,246,.22);pointer-events:none}
.r1{inset:9.5%}.r2{inset:5%;border-color:rgba(49,119,255,.28);animation:spin 120s linear infinite}.r3{inset:1%;border-color:rgba(151,83,250,.22);animation:spin 200s linear infinite reverse}
.glow{position:absolute;inset:18%;border-radius:50%;background:radial-gradient(circle,rgba(8,216,246,.25),transparent 70%);filter:blur(20px)}
.earth{position:absolute;inset:14%;border-radius:50%;overflow:hidden;box-shadow:0 0 46px rgba(8,140,246,.35);isolation:isolate}
.earth:before{content:"";position:absolute;top:-9%;bottom:-9%;left:0;width:400%;background:url(/assets/earth-map-20261105.webp) 0 50%/50% 100% repeat-x;animation:turn 90s linear infinite;will-change:transform}
.earth:after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset -28px -18px 60px rgba(0,0,0,.78),inset 14px 10px 36px rgba(120,190,255,.22);background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.18),transparent 38%),radial-gradient(circle at 50% 50%,transparent 55%,rgba(2,6,18,.55) 78%,rgba(2,6,18,.9) 100%)}
@keyframes turn{from{transform:translate3d(-50%,0,0)}to{transform:translate3d(0,0,0)}}
.sweep{position:absolute;inset:14%;border-radius:50%;background:conic-gradient(from 0deg,rgba(8,216,246,0) 0deg,rgba(8,216,246,0) 300deg,rgba(8,216,246,.28) 358deg,rgba(8,216,246,0) 360deg);animation:spin 5s linear infinite;pointer-events:none;mix-blend-mode:screen}
@keyframes spin{to{transform:rotate(360deg)}}
.blips{position:absolute;inset:0}
.blip{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:5px;z-index:2;color:var(--cyan);pointer-events:none}
.blip i{position:relative;display:block;width:9px;height:9px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);flex:none}
.blip.fresh i:after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid currentColor;animation:ring 1.6s ease-out 2}
.blip.v i{background:var(--violet);box-shadow:0 0 10px var(--violet)}
@keyframes ring{from{transform:scale(1);opacity:.9}to{transform:scale(4);opacity:0}}
.blip b{font-size:11px;font-weight:700;color:#fff;background:rgba(3,8,22,.78);border:1px solid var(--line);padding:1px 6px;border-radius:6px;white-space:nowrap;max-width:96px;overflow:hidden;text-overflow:ellipsis;transition:opacity .6s}
.blip.old b{opacity:0}.blip.gone{opacity:0;transition:opacity 1s}
.foot{text-align:center;color:#5e7189;font-size:12.5px;padding:18px 16px 26px}
@media (max-width:860px){.wrap{grid-template-columns:1fr;text-align:center;gap:8px}.copy p{margin-left:auto;margin-right:auto}.stage{max-width:420px;order:-1}h1{margin-top:18px}}
@media (max-width:420px){.blip b{font-size:10px;max-width:70px}.top{padding:14px 16px}}
@media (prefers-reduced-motion:reduce){.earth:before,.sweep,.r2,.r3,.sky:after{animation:none}}
@media (max-width:860px){.stage{width:min(100%,calc(100vw - 72px))}}