*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;min-height:100%;overflow-x:hidden;overflow-y:auto;background:#050505;font-family:Outfit,sans-serif;color:#fff}#cosmos-canvas{display:block;width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:0}#scroll-container{position:relative;z-index:1;pointer-events:none}.planet-section{width:100%;height:100vh;display:flex;align-items:center;justify-content:center;position:relative}.hidden{opacity:0;pointer-events:none;visibility:hidden;transition:opacity .5s ease,visibility .5s}.section-marker{display:none}.planet-section[data-planet=footer] .section-marker{display:flex;align-items:center;justify-content:center;height:100%;width:100%;padding-bottom:0;pointer-events:none;-webkit-user-select:none;user-select:none}#global-header{position:fixed;top:0;left:0;width:100%;height:80px;display:flex;justify-content:space-between;align-items:center;padding:0 40px;z-index:100;background:#0a0a0f4d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.05)}.brand-logo{display:flex;align-items:center;gap:12px;cursor:pointer;-webkit-user-select:none;user-select:none}.logo-symbol{font-size:1.4rem;color:#0ff;box-shadow:0 0 15px #00ffff4d;animation:voxelPulse 2s infinite ease-in-out;line-height:1}.logo-text{display:flex;flex-direction:column;justify-content:center;width:max-content}.text-main{font-family:Archivo Black,sans-serif;font-size:1.4rem;color:#fff;letter-spacing:.05em;line-height:1;text-transform:uppercase}.text-sub{font-family:Inter,sans-serif;font-size:.55rem;color:#fff9;font-weight:500;letter-spacing:.76em;margin-right:-.76em;margin-top:2px;text-transform:uppercase;text-align:center}.brand-logo:hover .logo-symbol{transform:rotate(45deg);transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}@keyframes voxelPulse{0%{transform:scale(1);opacity:1}50%{transform:scale(.85);opacity:.7}to{transform:scale(1);opacity:1}}#global-header .social-nav{display:flex;gap:8px}.social-btn{position:relative;background:none;border:1px solid rgba(255,255,255,.1);color:#fff9;width:36px;height:36px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;pointer-events:auto}.social-btn:hover{color:#fff;border-color:#ffffff4d;background:#ffffff0d}.social-btn .tooltip{position:absolute;top:calc(100% + 10px);right:0;background:#0f0f14f2;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:8px 14px;font-family:Outfit,sans-serif;font-size:12px;color:#ffffffd9;white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(-4px);transition:opacity .25s ease,transform .25s ease;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.social-btn .tooltip:before{content:"";position:absolute;top:-5px;right:14px;width:8px;height:8px;background:#0f0f14f2;border-left:1px solid rgba(255,255,255,.12);border-top:1px solid rgba(255,255,255,.12);transform:rotate(45deg)}.social-btn .tooltip.active{opacity:1;transform:translateY(0)}#global-footer{width:100%;padding:0 24px;pointer-events:none}.footer-track{--footer-rise: 16vh;width:max-content;max-width:calc(100vw - 48px);margin:0 auto;display:flex;align-items:center;justify-content:center;gap:10px;transform:translate3d(0,var(--footer-rise),0);will-change:transform,opacity;transition:transform .12s linear,opacity .2s ease-out;opacity:.9;white-space:nowrap;color:#e4eef8eb;font-family:Outfit,sans-serif;font-weight:400;font-size:14px;line-height:1.25;letter-spacing:.08em;text-transform:uppercase}.footer-segment{font-weight:400}.footer-separator{opacity:.45;transform:translateY(-1px)}@media(max-width:900px){#global-header{height:68px;padding:0 14px}.brand-logo{gap:8px}.logo-symbol{font-size:1.15rem}.text-main{font-size:1.08rem}.text-sub{font-size:.48rem;letter-spacing:.58em;margin-right:-.58em}#global-header .social-nav{gap:5px}.social-btn{width:28px;height:28px}.social-btn .iconify{width:15px!important;height:15px!important}#global-footer{padding:0 14px}.footer-track{--footer-rise: 18vh;max-width:calc(100vw - 28px);display:grid;gap:6px;justify-items:center;text-align:center;font-size:11px;line-height:1.35;letter-spacing:.06em;white-space:normal}.footer-separator{display:none}.footer-project,.footer-experiment,.footer-copyright{display:block}}#playlist-container{position:fixed;left:0;top:50%;transform:translateY(-50%);z-index:1000;color:#fff;pointer-events:auto;display:flex;flex-direction:column;align-items:flex-start;gap:0;overflow:visible}#playlist-container.hidden{display:none}#playlist-container.collapsed .glass-panel{transform:translate(-100%);opacity:.9;pointer-events:none}#playlist-container.collapsed .playlist-fold-btn{transform:translate(0)}#playlist-container.collapsed .focused-planet-display{opacity:0;transform:translate(-24px);transition:opacity .25s ease,transform .25s ease}.playlist-fold-btn{position:absolute;top:22px;left:0;width:22px;height:88px;border:1px solid rgba(255,255,255,.18);border-left:none;border-radius:0 10px 10px 0;background:#0a1423bf;color:#dcf5ffe6;font-size:16px;line-height:1;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:opacity .2s ease,background .2s ease,transform .35s ease;z-index:2;transform:translate(280px)}.playlist-fold-btn:hover{opacity:1;background:#0f2337e6}.glass-panel{background:#ffffff0d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);padding:24px;border-radius:0 16px 16px 0;width:280px;pointer-events:auto;box-shadow:0 4px 30px #0000004d;transition:transform .35s ease,opacity .35s ease;transform:translate(0)}.focused-planet-display{width:280px;margin-top:10px;margin-left:0;padding:8px 10px 4px;text-align:center;font-family:Archivo Black,sans-serif;font-size:32px;letter-spacing:.08em;line-height:1.05;color:#dcf7fff2;text-shadow:0 0 22px rgba(80,210,255,.28);text-transform:uppercase;pointer-events:none;transition:opacity .25s ease,transform .25s ease}.playlist-header{font-size:10px;letter-spacing:2px;color:#ffffff80;margin-bottom:16px;font-weight:700}.playlist-header .playing-planet{margin-left:6px;color:#a4ecfff2;font-weight:600;letter-spacing:1.4px}.track-card{display:flex;align-items:center;margin-bottom:24px}.track-icon{width:48px;height:48px;background:#ffffff1a;border-radius:8px;display:flex;justify-content:center;align-items:center;font-size:20px;margin-right:16px}.track-title{font-size:16px;font-weight:600;margin-bottom:4px}.track-artist{font-size:12px;color:#fff9}.controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.control-btn{background:none;border:none;color:#fff;font-size:20px;cursor:pointer;opacity:.7;transition:opacity .2s}.control-btn:hover{opacity:1}.control-btn.play{font-size:24px;width:48px;height:48px;background:#ffffff1a;border-radius:50%;display:flex;justify-content:center;align-items:center;padding:0}.control-btn.play.paused{padding-left:4px}.control-btn.play.playing{padding-left:0}.track-list{margin-top:20px;margin-bottom:16px;border-top:1px solid rgba(255,255,255,.1);padding-top:16px}.track-list ul{list-style:none;padding:0;max-height:120px;overflow-y:auto}.track-list li{font-size:11px;color:#ffffff80;padding:6px 8px;border-radius:4px;cursor:pointer;transition:all .2s;display:flex;justify-content:space-between}.track-list li:hover{background:#ffffff0d;color:#fff}.track-list li.active{color:#0ff;font-weight:600;background:#00ffff0d}.track-list ul::-webkit-scrollbar{width:4px}.track-list ul::-webkit-scrollbar-thumb{background:#fff3;border-radius:2px}.esc-hint{margin-top:16px;font-size:10px;color:#fff6;text-align:center;border-top:1px solid rgba(255,255,255,.1);padding-top:12px}.esc-hint .key{border:1px solid rgba(255,255,255,.3);padding:2px 6px;border-radius:4px;font-weight:700}@media(max-width:900px){#playlist-container{left:50%;right:auto;top:auto;bottom:7vh;transform:translate(-50%);width:min(90vw,340px);flex-direction:row;justify-content:center}#playlist-container .glass-panel{width:min(90vw,340px);padding:14px 14px 12px;border-radius:14px;transform:none!important;opacity:.96!important;pointer-events:auto!important}#playlist-container .focused-planet-display{display:none}#playlist-container .playlist-header{margin-bottom:10px;font-size:10px;letter-spacing:1.5px;color:#ebf5ff8c;font-weight:500}#playlist-container .playlist-header .playing-planet{display:inline-block;margin-left:8px;color:#a4ecfff5;font-weight:700;letter-spacing:1.8px}#playlist-container .track-list,#playlist-container .esc-hint{display:none}#playlist-container .track-card{margin-bottom:10px}#playlist-container .track-icon{width:40px;height:40px;margin-right:12px;font-size:16px}#playlist-container .track-title{font-size:14px;margin-bottom:2px}#playlist-container .track-artist{font-size:11px}#playlist-container .controls{margin-bottom:0}#playlist-container .playlist-fold-btn{display:none}#playlist-container.collapsed .glass-panel{transform:none!important;opacity:.96!important;pointer-events:auto!important}}#planet-info{position:fixed;bottom:10%;left:50%;transform:translate(-50%);text-align:center;z-index:10;pointer-events:none;transition:opacity .6s ease,visibility .6s}#planet-info h2{font-family:Archivo Black,sans-serif;font-size:48px;letter-spacing:6px;text-transform:uppercase;color:#fff;text-shadow:0 0 30px rgba(255,255,255,.3);margin-bottom:8px}#planet-info p{font-size:14px;color:#ffffff80;letter-spacing:2px}#scroll-hint{position:fixed;top:120px;left:50%;transform:translate(-50%);z-index:12;pointer-events:none;transition:opacity .5s ease}#scroll-hint.hidden{opacity:0}.scroll-card{display:flex;flex-direction:column;align-items:center;gap:9px;min-height:132px;padding:22px 24px;background:#0f192857;border:1px solid rgba(190,235,255,.26);border-radius:16px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 0 26px #58c6ff29}.scroll-card-text{font-family:Outfit,sans-serif;font-size:12px;font-weight:700;letter-spacing:4.5px;color:#e1f5ffe6;text-transform:uppercase}.scroll-card-arrow{color:#aae6ffe6;animation:scrollCardBounce 2s ease-in-out infinite}.scroll-card-sub{font-family:Outfit,sans-serif;font-size:10px;letter-spacing:2.5px;color:#bce2fab8}@keyframes scrollCardBounce{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}@keyframes scrollCardBounceUp{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}body.mobile-scroll-up .scroll-card-arrow{animation-name:scrollCardBounceUp}.voxel-label{color:#fff;font-family:Outfit,sans-serif;font-size:14px;font-weight:500;letter-spacing:2px;text-transform:uppercase;pointer-events:none;-webkit-user-select:none;user-select:none;text-shadow:0 0 10px rgba(255,255,255,.5),0 0 20px rgba(255,255,255,.2);opacity:.85;transition:opacity .3s ease}#loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;z-index:9999;display:flex;justify-content:center;align-items:center;transition:opacity 1.5s ease-in-out}#loading-screen.fade-out{opacity:0;pointer-events:none}.loading-logo-box{display:flex;flex-direction:column;align-items:center;gap:12px}.loading-symbol{color:#0ff;font-size:2rem;animation:pulse 2s infinite}.loading-text-group{display:flex;flex-direction:column;align-items:center;gap:0px}.loading-main{font-family:Archivo Black,sans-serif;font-size:2.5rem;color:#fff;letter-spacing:.1em}.loading-sub{font-family:Inter,sans-serif;font-size:.9rem;color:#fff9;letter-spacing:.4em}@media(max-width:900px){#scroll-hint{top:92px}.scroll-card{min-height:122px;padding:18px}.scroll-card-text{font-size:10px;letter-spacing:3px}}
