@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&display=swap";html,body{margin:0;padding:0;background:#000;width:100%;font-family:Inter,sans-serif;color:#f0f0f0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-container{width:100%;position:relative}.canvas-container{width:100%;height:100vh;position:sticky;top:0;left:0}.scroll-spacer{height:300vh;width:100%}.welcome-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:200;display:flex;align-items:center;justify-content:center;animation:fadeIn 1s ease-in-out}.welcome-popup{background:#141419cc;border-radius:1.5rem;padding:3rem;max-width:500px;text-align:center;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 50px #00000080}.welcome-popup h2{font-size:2.5rem;font-weight:900;margin:0 0 1rem;color:#fff;letter-spacing:.05em}.welcome-popup p{font-size:1.1rem;line-height:1.7;color:#ccc;margin-bottom:2.5rem}.welcome-button{background:#fff;color:#000;border:none;padding:1rem 2.5rem;border-radius:.75rem;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s;text-transform:uppercase;letter-spacing:.1em}.welcome-button:hover{transform:translateY(-3px);box-shadow:0 5px 20px #ffffff4d}.popup-action-button{display:inline-block;background:#d1a3ff;color:#000;border:none;padding:.8rem 2rem;border-radius:.5rem;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1.5rem;margin-right:.5rem;text-decoration:none}.popup-action-button:hover{transform:translateY(-2px);box-shadow:0 0 15px #d1a3ff}.main-header,.main-footer{position:fixed;left:0;width:100%;z-index:20;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;pointer-events:none;box-sizing:border-box}.main-header{top:0;background:linear-gradient(to bottom,#00000080,#0000)}.main-footer{top:auto;bottom:0;background:linear-gradient(to top,#00000080,#0000);justify-content:center;font-size:.8rem;color:#888;pointer-events:all}.header-logo{font-weight:900;font-size:1.2rem;letter-spacing:.1em;text-transform:uppercase;pointer-events:all}.header-nav{display:flex}.header-nav a{color:#f0f0f0;text-decoration:none;margin-left:1.5rem;font-size:.9rem;pointer-events:all;transition:color .3s;white-space:nowrap}.header-nav a:hover{color:#e28888}.planet-ui-overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:flex-start;z-index:10;pointer-events:none;animation:fadeIn .5s ease-in-out}.planet-card-wrapper{margin-left:5vw;pointer-events:all;max-width:400px}.planet-content{background:linear-gradient(to top,rgba(0,0,0,.7) 0%,rgba(0,0,0,.3) 50%,transparent 100%),radial-gradient(circle at 10% 10%,var(--planet-color),transparent 90%),#121216cc;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:1px solid var(--planet-color, rgba(255, 255, 255, .1));border-radius:1.5rem;overflow:hidden;position:relative;display:flex;flex-direction:column;height:520px}.corner-close-button{position:absolute;top:1rem;right:1rem;z-index:10;width:32px;height:32px;background:#0000004d;border:1px solid rgba(255,255,255,.1);border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s;pointer-events:all}.corner-close-button:hover{background:#fff3;transform:scale(1.1)}.planet-card-carousel{display:flex;flex-grow:1;min-height:0;transition:transform .6s cubic-bezier(.4,0,.2,1)}.planet-card-slide{flex:0 0 100%;position:relative;display:flex;flex-direction:column}.climate-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2}.planet-card-slide-content{position:relative;z-index:3;padding:2rem;display:flex;flex-direction:column;flex-grow:1;background:none}.planet-card-header{display:flex;align-items:flex-start;margin-bottom:1.5rem}.decorative-line{width:4px;height:50px;background-color:var(--planet-color, #fff);margin-right:1.5rem;border-radius:2px}.planet-title{font-size:2.5rem;font-weight:900;margin:0;text-transform:uppercase;letter-spacing:.1em;color:var(--planet-color, white);line-height:1}.planet-subtitle{font-size:.9rem;font-weight:400;margin:.25rem 0 0;letter-spacing:.1em;text-transform:uppercase;opacity:.7}.planet-details{flex-grow:1;display:flex;flex-direction:column;font-size:.95rem;line-height:1.6;opacity:.9}.flora-fauna-layout,.text-content-layout{flex-grow:1}.flora-fauna-model{height:150px;width:100%;margin-bottom:1rem;background:#0003;border-radius:.5rem}.card-model-viewer{width:100%;height:100%;cursor:grab}.planet-card-footer{padding:1.5rem 2rem;margin-top:auto;position:relative;z-index:1;background:transparent;border-top:none}.planet-card-navigation{display:flex;justify-content:center;align-items:center;gap:1rem}.planet-card-navigation button{background:#0006;border:1px solid rgba(255,255,255,.1);color:#fff;width:44px;height:44px;border-radius:50%;cursor:pointer;transition:all .3s ease;display:flex;justify-content:center;align-items:center}.planet-card-navigation button:hover:not(:disabled){background:var(--planet-color);box-shadow:0 0 15px -2px var(--planet-color, #fff);transform:scale(1.1)}.planet-card-navigation button:disabled{opacity:.5;cursor:not-allowed}.slide-indicators{display:flex;align-items:center}.slide-indicators span{width:8px;height:8px;border-radius:50%;background:#ffffff4d;margin:0 8px;transition:all .3s}.slide-indicators span.active{background:var(--planet-color, #fff);transform:scale(1.3);box-shadow:0 0 10px 1px var(--planet-color, #fff)}.planet-card-weather-dynamic{font-weight:700;font-size:.9rem;margin-bottom:1rem;text-transform:uppercase;letter-spacing:.05em;color:#ccc}.planet-card-weather-dynamic span{background-color:var(--planet-color, white);color:#000;padding:.2rem .5rem;border-radius:4px;margin-left:.5rem}.planet-content-landed{width:400px;max-width:90vw;background:#0a0a0fb3;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:1px solid var(--planet-color, #fff);border-radius:1rem;pointer-events:all;box-shadow:0 10px 30px #0003,0 0 20px var(--planet-color, #fff);padding:2rem;box-sizing:border-box;display:flex;flex-direction:column}.nav-popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:15;background:#000000b3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);pointer-events:all;animation:fadeIn .3s ease-in-out;padding:1rem;box-sizing:border-box}.nav-popup-content{background:#0a0a0acc;border:1px solid #444;border-radius:1rem;padding:2rem 3rem;max-width:600px;text-align:center}.nav-popup-title{font-size:2.5rem;font-weight:900;margin:0 0 1rem;text-transform:uppercase;letter-spacing:.1em;color:#fff}.nav-popup-content p{font-size:1.1rem;line-height:1.7;margin-bottom:2.5rem;color:#ccc}.nav-popup-content .close-button,.planet-content-landed .close-button{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#f0f0f0;padding:.75rem 1.5rem;border-radius:.5rem;font-size:1rem;cursor:pointer;transition:all .3s}.nav-popup-content .close-button:hover,.planet-content-landed .close-button:hover{background:#fff3;transform:translateY(-2px);box-shadow:0 0 15px var(--planet-color, #fff)}.preloader-overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#000;z-index:100;opacity:1}.preloader-particle{width:20px;height:20px;background-color:#fff;border-radius:50%;box-shadow:0 0 20px #fff,0 0 40px #ffcda3,0 0 60px #e28888}.preloader-text{color:#aaa;margin-top:2rem;font-size:1rem;letter-spacing:.2em;text-transform:uppercase}.transition-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;z-index:50;pointer-events:none;opacity:0;transition:opacity .5s ease-in-out}.transition-overlay.visible{opacity:1}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (max-width: 768px){.planet-ui-overlay{justify-content:center}.planet-card-wrapper{margin:0 auto;width:90vw}.main-header{padding:.75rem 1rem;flex-direction:column;align-items:center;background:linear-gradient(to bottom,#000000b3,#0000)}.header-logo{font-size:1rem;margin-bottom:.5rem}.header-nav{justify-content:center;width:100%}.header-nav a{margin:0 .5rem;font-size:.8rem}.main-footer{padding:.5rem 1rem;font-size:.7rem}.nav-popup-content{padding:1.5rem}.nav-popup-title{font-size:1.8rem}.nav-popup-content p{font-size:1rem}}