:root{--cyan:#47e8ff;--green:#18e28f;--line:rgba(71,232,255,.24);--panel:rgba(3,10,25,.74);--text:#eaf7ff;--muted:#8fa9ba;--head:"Orbitron",sans-serif;--body:"Inter",sans-serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#01030a;color:var(--text);font-family:var(--body)}
body{background:#01030a url("assets/earth/4k_stars.jpg") center/cover}.stars{position:fixed;inset:0;background:radial-gradient(circle at 70% 35%,rgba(25,78,130,.2),transparent 38%),linear-gradient(rgba(1,3,10,.15),rgba(1,3,10,.4));pointer-events:none}
#earthCanvas{position:fixed;inset:0;width:100%;height:100%;cursor:grab;touch-action:none}#earthCanvas.grabbing{cursor:grabbing}.scanlines{position:fixed;inset:0;z-index:8;pointer-events:none;opacity:.045;background:repeating-linear-gradient(0deg,transparent 0 3px,#fff 4px)}
header{position:fixed;z-index:10;top:0;left:0;width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:1rem 2rem;border-bottom:1px solid var(--line);background:rgba(1,4,12,.6);backdrop-filter:blur(15px)}header a,header button{color:var(--muted);font:700 .62rem var(--head);letter-spacing:.1em;text-decoration:none;background:none;border:1px solid var(--line);padding:.65rem .8rem}.header-actions{justify-self:end;display:flex;gap:.5rem}.brand{font:800 .78rem var(--head);letter-spacing:.15em}.brand span{color:var(--cyan);margin-right:.7rem}
.title-panel{position:fixed;z-index:5;left:clamp(1.2rem,5vw,5rem);top:17%;pointer-events:none}.title-panel p,.status{font:700 .58rem var(--head);letter-spacing:.18em;color:var(--cyan)}h1{margin:.5rem 0;font:800 clamp(2.8rem,7vw,7rem)/.82 var(--head);letter-spacing:-.06em}h1 span{display:block;color:transparent;-webkit-text-stroke:1px var(--cyan)}.status{margin-top:1.5rem;color:var(--green)}.status i{display:inline-block;width:7px;aspect-ratio:1;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);animation:pulse 1.5s infinite}
.controls{position:fixed;z-index:10;right:clamp(1rem,3vw,3rem);top:15%;width:min(300px,calc(100vw - 2rem));padding:1.3rem;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(18px)}.control-heading{display:flex;justify-content:space-between;padding-bottom:1rem;border-bottom:1px solid var(--line);font:700 .62rem var(--head);letter-spacing:.12em}.control-heading b{color:var(--green)}label{display:block;margin-top:1.15rem;color:var(--muted);font:600 .56rem var(--head);letter-spacing:.1em}output{float:right;color:var(--cyan)}input[type=range]{display:block;width:100%;margin-top:.6rem;accent-color:var(--cyan)}.controls button{width:100%;margin-top:1.2rem;padding:.75rem;color:#041018;background:var(--cyan);border:0;font:700 .6rem var(--head);letter-spacing:.1em}.instructions{margin:1rem 0 0;text-align:center;color:var(--muted);font:500 .48rem var(--head);letter-spacing:.1em}
.telemetry{position:fixed;z-index:5;left:clamp(1rem,4vw,4rem);right:clamp(1rem,4vw,4rem);bottom:3.5rem;display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}.telemetry div{padding:.85rem 1rem;background:rgba(3,10,25,.66);border:1px solid var(--line);backdrop-filter:blur(12px)}.telemetry small{display:block;color:var(--muted);font:600 .48rem var(--head);letter-spacing:.13em}.telemetry strong{display:block;margin-top:.4rem;color:var(--cyan);font:700 .65rem var(--head)}
.telemetry .ireland-signal{border-color:rgba(24,226,143,.55);box-shadow:inset 0 0 20px rgba(24,226,143,.08)}.telemetry .ireland-signal strong{color:var(--green);text-shadow:0 0 12px rgba(24,226,143,.7)}
footer{position:fixed;z-index:10;bottom:0;left:0;width:100%;padding:.65rem;text-align:center;color:#617789;background:rgba(1,4,12,.7);font:500 .46rem var(--head);letter-spacing:.08em}footer a{color:#7696aa}.loading,.fallback{position:fixed;z-index:30;inset:0;display:grid;place-items:center;align-content:center;background:#01040d;transition:.7s}.loading.off{opacity:0;visibility:hidden}.loading p,.fallback{font:700 .62rem var(--head);letter-spacing:.14em;color:var(--cyan)}.loader-orbit{width:80px;aspect-ratio:1;border:1px solid var(--line);border-radius:50%;animation:spin 1.8s linear infinite}.loader-orbit i{display:block;width:10px;aspect-ratio:1;border-radius:50%;background:var(--cyan);box-shadow:0 0 20px var(--cyan)}.hidden{display:none}.fallback{text-align:center;padding:2rem}.fallback a{color:var(--cyan)}
.page-transition{position:fixed;z-index:200;inset:0;display:grid;place-items:center;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 50%,#123e66,#041120 28%,#01040c 70%);transition:opacity .75s ease,filter .75s ease}.page-transition:before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(from 45deg,rgba(71,232,255,.1) 0 2deg,transparent 2deg 7deg);animation:spin 8s linear infinite}.page-transition span{position:relative;color:var(--cyan);font:700 .65rem var(--head);letter-spacing:.2em;text-shadow:0 0 22px var(--cyan)}.page-transition.active{opacity:1;filter:blur(0);pointer-events:all;visibility:visible!important}.page-transition.entering{animation:earthArrive 1.1s .2s ease forwards}
@keyframes earthArrive{0%{opacity:1;filter:blur(0)}70%{opacity:.9}100%{opacity:0;filter:blur(18px);visibility:hidden}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.35}}
@media(max-width:800px){header{grid-template-columns:1fr auto;padding:.8rem 1rem}.brand{display:none}.title-panel{top:12%;left:1rem}.title-panel p{display:none}.controls{top:auto;right:1rem;bottom:7rem;width:220px;padding:.8rem}.control-heading{font-size:.5rem}.controls label{margin-top:.65rem}.instructions{display:none}.telemetry{grid-template-columns:1fr 1fr;left:1rem;right:auto;bottom:3rem;width:calc(100% - 250px)}.telemetry div{padding:.6rem}.telemetry div:nth-child(3),.telemetry div:nth-child(4){display:none}}
@media(max-width:540px){.title-panel h1{font-size:2.3rem}.controls{left:1rem;right:1rem;bottom:3.6rem;width:auto;display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.control-heading,.controls button{grid-column:1/-1}.controls label{margin-top:.3rem}.telemetry{display:none}.controls label:nth-of-type(3),.controls label:nth-of-type(4){display:none}footer{display:none}.header-actions button:first-child{display:none}}
