:root{color-scheme:dark;font-family:Segoe UI,ui-sans-serif,system-ui,-apple-system,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:#000;color:#e0e8ff;overflow:hidden}.starfield{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0}.star{position:absolute;border-radius:50%;background:#fff;animation:twinkle var(--dur) ease-in-out infinite alternate}@keyframes twinkle{0%{opacity:var(--min-o);transform:scale(1)}to{opacity:1;transform:scale(1.3)}}.shooting-star{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;opacity:0;animation:shoot 3s ease-in infinite;animation-delay:var(--delay)}.shooting-star:after{content:"";position:absolute;top:0;right:0;width:80px;height:1px;background:linear-gradient(to right,rgba(255,255,255,.6),transparent);transform-origin:right;transform:rotate(-45deg)}@keyframes shoot{0%{opacity:0;transform:translate(0) rotate(-45deg)}5%{opacity:1}15%{opacity:1;transform:translate(-400px,400px) rotate(-45deg)}16%{opacity:0}to{opacity:0}}.nebula{position:fixed;border-radius:50%;filter:blur(100px);opacity:.12;z-index:0;pointer-events:none}.nebula-1{width:600px;height:600px;background:radial-gradient(circle,#1a3a6a,transparent);top:-100px;right:-150px}.nebula-2{width:400px;height:400px;background:radial-gradient(circle,#3a1a5a,transparent);bottom:-50px;left:-100px}.earth-scene{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:1;animation:fadeInScene 1.5s ease-out}@keyframes fadeInScene{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.earth-container{position:relative;width:340px;height:340px;animation:floatEarth 20s ease-in-out infinite}@keyframes floatEarth{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}.atmosphere{position:absolute;top:-30px;right:-30px;bottom:-30px;left:-30px;border-radius:50%;background:radial-gradient(circle,rgba(70,160,255,.15),rgba(70,160,255,.05) 50%,transparent 70%);animation:pulseAtmo 4s ease-in-out infinite alternate}@keyframes pulseAtmo{0%{transform:scale(1);opacity:.8}to{transform:scale(1.06);opacity:1}}.earth{width:100%;height:100%;border-radius:50%;position:relative;overflow:hidden;box-shadow:inset -30px -10px 60px #000000b3,0 0 60px #328cff33,0 0 120px #328cff1a;animation:rotateEarth 60s linear infinite}@keyframes rotateEarth{0%{--rot: 0deg}to{--rot: 360deg}}.earth-surface{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(ellipse 120% 100% at 30% 50%,#1a6b3a 0%,transparent 30%),radial-gradient(ellipse 80% 60% at 60% 30%,#2a7a4a 0%,transparent 25%),radial-gradient(ellipse 60% 80% at 70% 60%,#1a5a3a 0%,transparent 20%),radial-gradient(ellipse 40% 50% at 25% 70%,#2a6a3a 0%,transparent 20%),radial-gradient(ellipse 100% 100% at 50% 50%,#1a4a8a 60%,#0a2a5a);animation:surfaceShift 60s linear infinite}@keyframes surfaceShift{0%{background-position:0% 0%,0% 0%,0% 0%,0% 0%,0% 0%}to{background-position:100% 0%,100% 0%,100% 0%,100% 0%,0% 0%}}.cloud-layer{position:absolute;top:-10%;right:-10%;bottom:-10%;left:-10%;border-radius:50%;background:radial-gradient(ellipse 30% 20% at 20% 30%,rgba(255,255,255,.4),transparent),radial-gradient(ellipse 25% 15% at 50% 50%,rgba(255,255,255,.3),transparent),radial-gradient(ellipse 35% 20% at 70% 40%,rgba(255,255,255,.35),transparent),radial-gradient(ellipse 20% 25% at 40% 70%,rgba(255,255,255,.25),transparent),radial-gradient(ellipse 30% 15% at 80% 60%,rgba(255,255,255,.3),transparent);animation:cloudsDrift 45s linear infinite;opacity:.7}@keyframes cloudsDrift{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.terminator{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:linear-gradient(90deg,transparent 40%,rgba(0,0,0,.6) 55%,rgba(0,0,0,.85) 70%)}.city-lights{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle 2px at 45% 35%,rgba(255,200,80,.9),transparent),radial-gradient(circle 1.5px at 50% 45%,rgba(255,200,80,.8),transparent),radial-gradient(circle 2px at 55% 30%,rgba(255,180,60,.85),transparent),radial-gradient(circle 1px at 60% 50%,rgba(255,200,80,.7),transparent),radial-gradient(circle 1.5px at 48% 55%,rgba(255,180,60,.8),transparent),radial-gradient(circle 2px at 65% 40%,rgba(255,200,80,.75),transparent),radial-gradient(circle 1px at 42% 48%,rgba(255,220,100,.7),transparent),radial-gradient(circle 1.5px at 58% 58%,rgba(255,180,60,.8),transparent);opacity:0;animation:cityLightsFade 60s linear infinite}@keyframes cityLightsFade{0%,40%{opacity:0}55%,70%{opacity:1}to{opacity:0}}.hud{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;pointer-events:none;padding:24px;display:flex;flex-direction:column}.hud>*{pointer-events:auto}.top-bar{display:flex;align-items:center;justify-content:space-between;animation:slideDown .8s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.back-button{display:flex;align-items:center;gap:8px;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);color:#c0d0ff;padding:10px 20px;border-radius:40px;font-size:.85rem;font-weight:500;cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:all .3s ease;letter-spacing:.04em}.back-button:hover{background:#ffffff1f;border-color:#64b4ff66;color:#fff;box-shadow:0 0 20px #64b4ff26;transform:translate(-2px)}.back-button svg{transition:transform .3s ease}.back-button:hover svg{transform:translate(-3px)}.mission-badge{display:flex;align-items:center;gap:10px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);padding:8px 16px;border-radius:40px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.mission-dot{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 8px #4ade8099;animation:blink 2s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.4}}.mission-label{font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:#ffffff80;font-family:SF Mono,Fira Code,ui-monospace,monospace}.hud-center{flex:1;display:flex;align-items:center;justify-content:center;position:relative}.scan-line{position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(100,180,255,.08),transparent);animation:scanMove 8s linear infinite}.scan-line:nth-child(1){animation-delay:0s}.scan-line:nth-child(2){animation-delay:4s}@keyframes scanMove{0%{top:0%;opacity:0}10%{opacity:1}90%{opacity:1}to{top:100%;opacity:0}}.corner-bracket{position:absolute;width:40px;height:40px;border-color:#64b4ff40;border-style:solid;border-width:0}.corner-bracket.tl{top:20%;left:25%;border-top-width:1px;border-left-width:1px}.corner-bracket.tr{top:20%;right:25%;border-top-width:1px;border-right-width:1px}.corner-bracket.bl{bottom:20%;left:25%;border-bottom-width:1px;border-left-width:1px}.corner-bracket.br{bottom:20%;right:25%;border-bottom-width:1px;border-right-width:1px}.bottom-panels{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;animation:slideUp .8s ease-out .3s both}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.data-panel{background:#ffffff08;border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:16px 20px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:all .3s ease}.data-panel:hover{background:#ffffff0f;border-color:#64b4ff33}.panel-label{font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:#64b4ff99;font-family:SF Mono,Fira Code,ui-monospace,monospace;margin-bottom:6px}.panel-value{font-size:1.4rem;font-weight:600;color:#e0eaff;letter-spacing:-.02em}.panel-unit{font-size:.75rem;color:#ffffff59;margin-left:4px;font-weight:400}.panel-sub{font-size:.72rem;color:#ffffff4d;margin-top:4px;font-family:SF Mono,Fira Code,ui-monospace,monospace}.side-panel{position:fixed;z-index:10;display:flex;flex-direction:column;gap:16px;animation:fadeInSide 1s ease-out .5s both}@keyframes fadeInSide{0%{opacity:0}to{opacity:1}}.side-panel.left{left:24px;top:50%;transform:translateY(-50%)}.side-panel.right{right:24px;top:50%;transform:translateY(-50%)}.side-stat{text-align:center;padding:8px 12px}.side-stat-label{font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:#64b4ff80;font-family:SF Mono,Fira Code,ui-monospace,monospace;margin-bottom:4px}.side-stat-value{font-size:.9rem;font-weight:600;color:#ffffffb3}.astronaut-info{position:fixed;bottom:24px;right:24px;z-index:10;display:flex;align-items:center;gap:12px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);padding:12px 18px;border-radius:50px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:slideUp .8s ease-out .6s both}.astronaut-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#2a4a7a,#1a2a4a);border:1.5px solid rgba(100,180,255,.3);display:flex;align-items:center;justify-content:center;font-size:1rem}.astronaut-details{display:flex;flex-direction:column}.astronaut-name{font-size:.8rem;font-weight:600;color:#e0eaff}.astronaut-role{font-size:.65rem;color:#64b4ff80;letter-spacing:.08em;text-transform:uppercase}.earth-title{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5;text-align:center;pointer-events:none;animation:titleFade 2s ease-out .5s both}@keyframes titleFade{0%{opacity:0;transform:translate(-50%,-48%)}to{opacity:1;transform:translate(-50%,-50%)}}.earth-title h1{font-size:3.5rem;font-weight:700;letter-spacing:-.03em;background:linear-gradient(180deg,#fff,#a0c4ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:none;line-height:1.1;margin-bottom:8px}.earth-title p{font-size:.9rem;color:#fff6;letter-spacing:.1em;font-family:SF Mono,Fira Code,ui-monospace,monospace}.vignette{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse 60% 60% at 50% 50%,transparent 40%,rgba(0,0,0,.5) 100%)}@media(max-width:768px){.earth-container{width:240px;height:240px}.earth-title h1{font-size:2.2rem}.bottom-panels{grid-template-columns:1fr;gap:8px}.side-panel{display:none}.astronaut-info{bottom:auto;top:80px;right:12px;padding:8px 12px}.hud{padding:16px}}