*{margin:0;padding:0;box-sizing:border-box}html,body{overflow:hidden;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#000010;color:#fff;height:100vh}.webgl{position:fixed;top:0;left:0;outline:none;z-index:1}.loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#000010,#012,#000010);display:flex;justify-content:center;align-items:center;z-index:1000;transition:opacity .5s ease-out}.loading-screen.hidden{opacity:0;pointer-events:none}.loading-content{text-align:center;max-width:400px;padding:2rem}.galaxy-loader{position:relative;width:120px;height:120px;margin:0 auto 2rem}.galaxy-spinner{width:100%;height:100%;border:3px solid rgba(255,255,255,.1);border-top:3px solid #ff9500;border-radius:50%;animation:spin 2s linear infinite}.stars{position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(2px 2px at 20px 30px,#fff,transparent),radial-gradient(2px 2px at 40px 70px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 90px 40px,rgba(255,255,255,.6),transparent);background-repeat:repeat;background-size:100px 100px;animation:twinkle 3s ease-in-out infinite alternate}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes twinkle{0%{opacity:.3}to{opacity:1}}.loading-title{font-size:2rem;font-weight:300;margin-bottom:.5rem;background:linear-gradient(45deg,#ff9500,#06f);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.loading-subtitle{font-size:1rem;opacity:.8;margin-bottom:2rem}.loading-progress{width:100%;height:4px;background:#ffffff1a;border-radius:2px;overflow:hidden;margin-bottom:2rem}.progress-bar{height:100%;background:linear-gradient(90deg,#ff9500,#06f);width:0%;transition:width .3s ease;border-radius:2px}.loading-tips{text-align:left;font-size:.9rem;opacity:.7;line-height:1.6}.loading-tips p{margin-bottom:.5rem}.ui-overlay{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100;font-size:14px}.ui-overlay *{pointer-events:auto}.galaxy-header{position:absolute;top:20px;left:20px;z-index:101}.galaxy-title{font-size:1.8rem;font-weight:300;margin-bottom:.25rem;text-shadow:2px 2px 4px rgba(0,0,0,.8)}.galaxy-subtitle{font-size:.9rem;opacity:.8;text-shadow:1px 1px 2px rgba(0,0,0,.8)}.info-panel{position:absolute;top:20px;right:380px;max-width:300px}.info-toggle{background:#000010cc;border:1px solid rgba(255,255,255,.2);color:#fff;padding:8px 12px;border-radius:20px;cursor:pointer;font-size:1rem;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.info-toggle:hover{background:#ff950033;border-color:#ff9500}.info-content{background:#000010e6;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:1rem;margin-top:10px;display:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 32px #00000080}.info-content.visible{display:block;animation:fadeInUp .3s ease}.info-content h3{margin-bottom:.75rem;color:#ff9500}.info-content ul{list-style:none;line-height:1.6}.info-content li{margin-bottom:.5rem;padding-left:.5rem}.stats-panel{position:absolute;top:120px;left:20px;background:#000010cc;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:150px}.stat-item{display:flex;justify-content:space-between;margin-bottom:.5rem}.stat-item:last-child{margin-bottom:0}.stat-label{opacity:.8}.stat-value{color:#ff9500;font-weight:500}.quick-actions{position:absolute;bottom:20px;left:20px;display:flex;gap:10px}.action-btn{background:#000010cc;border:1px solid rgba(255,255,255,.2);color:#fff;padding:12px;border-radius:50%;cursor:pointer;font-size:1.2rem;width:50px;height:50px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.action-btn:hover{background:#ff950033;border-color:#ff9500;transform:translateY(-2px)}.share-panel{position:absolute;bottom:20px;right:20px;background:#000010cc;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:200px}.share-panel h4{margin-bottom:.75rem;color:#ff9500;text-align:center}.share-buttons{display:flex;gap:8px;justify-content:center}.share-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:8px 12px;border-radius:6px;cursor:pointer;font-size:.8rem;transition:all .3s ease;text-decoration:none;display:inline-block}.share-btn:hover{background:#fff3;transform:translateY(-1px)}.share-btn.twitter:hover{background:#1da1f24d;border-color:#1da1f2}.share-btn.facebook:hover{background:#1877f24d;border-color:#1877f2}.credits{position:absolute;bottom:20px;left:50%;transform:translate(-50%);text-align:center;font-size:.8rem;opacity:.6}.credits a{color:#ff9500;text-decoration:none}.credits a:hover{text-decoration:underline}.tutorial-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;justify-content:center;align-items:center;z-index:2000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.tutorial-modal.hidden{display:none}.tutorial-content{background:#000010f2;border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:2rem;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;position:relative;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 20px 60px #000000b3}.tutorial-close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;opacity:.6;transition:opacity .3s ease}.tutorial-close:hover{opacity:1}.tutorial-content h2{text-align:center;margin-bottom:1.5rem;color:#ff9500}.tutorial-step{display:none;text-align:center}.tutorial-step.active{display:block;animation:fadeIn .3s ease}.tutorial-step h3{margin-bottom:1rem;color:#06f}.tutorial-step p{line-height:1.6;margin-bottom:1rem;opacity:.9}.tutorial-visual{background:#ff95001a;border:1px solid rgba(255,149,0,.3);border-radius:8px;padding:1rem;margin:1rem 0;font-weight:500;color:#ff9500}.tutorial-navigation{display:flex;justify-content:space-between;align-items:center;margin-top:2rem}.tutorial-btn{background:#ff950033;border:1px solid #ff9500;color:#fff;padding:8px 16px;border-radius:6px;cursor:pointer;transition:all .3s ease}.tutorial-btn:hover{background:#ff95004d}.tutorial-btn:disabled{opacity:.5;cursor:not-allowed}.tutorial-dots{display:flex;gap:8px}.dot{width:10px;height:10px;border-radius:50%;background:#ffffff4d;cursor:pointer;transition:all .3s ease}.dot.active{background:#ff9500}.tutorial-skip{background:none;border:none;color:#fff9;text-align:center;width:100%;margin-top:1rem;cursor:pointer;font-size:.9rem;text-decoration:underline}.tutorial-skip:hover{color:#fff}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.galaxy-header{top:10px;left:10px;right:10px}.galaxy-title{font-size:1.4rem;line-height:1.2}.galaxy-subtitle{font-size:.85rem}.info-panel{top:10px;right:10px;max-width:280px;left:auto}.info-content{max-height:60vh;overflow-y:auto}.stats-panel{top:90px;left:10px;padding:.75rem;min-width:140px;max-width:calc(100vw - 20px)}.quick-actions{bottom:80px;left:50%;transform:translate(-50%);gap:8px;flex-wrap:wrap;justify-content:center;max-width:calc(100vw - 20px)}.action-btn{width:44px;height:44px;font-size:1.1rem;min-width:44px}.share-panel{bottom:15px;right:10px;left:10px;padding:.75rem;min-width:auto;max-width:none;width:calc(100vw - 20px);margin:0 auto;text-align:center}.share-panel h4{font-size:.9rem;margin-bottom:.5rem;line-height:1.2}.share-buttons{flex-direction:row;gap:6px;justify-content:center;flex-wrap:wrap}.share-btn{padding:8px 12px;font-size:.8rem;flex:1;min-width:70px;max-width:90px;white-space:nowrap}.credits{bottom:125px;font-size:.7rem;left:50%;transform:translate(-50%);max-width:calc(100vw - 20px);text-align:center}.tutorial-content{padding:1.5rem;margin:.5rem;max-height:90vh;overflow-y:auto}.loading-content{padding:1rem;max-width:calc(100vw - 20px)}.loading-title{font-size:1.6rem;line-height:1.2}.lil-gui{display:none!important}.lil-gui.mobile-visible{display:block!important;position:fixed!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;z-index:2000!important;max-height:80vh!important;overflow-y:auto!important;box-shadow:0 10px 30px #00000080!important;border-radius:8px!important}}@media (max-width: 480px){.ui-overlay{font-size:11px}.galaxy-header{top:5px;left:5px;right:5px}.galaxy-title{font-size:1.1rem;line-height:1.1}.galaxy-subtitle{font-size:.75rem}.info-panel{top:5px;right:5px;max-width:calc(100vw - 80px)}.info-content{padding:.6rem;max-height:50vh;font-size:.8rem}.stats-panel{top:70px;left:5px;padding:.5rem;min-width:120px;font-size:.8rem}.action-btn{width:40px;height:40px;font-size:1rem;min-width:40px}.quick-actions{bottom:75px;left:50%;transform:translate(-50%);gap:6px;max-width:calc(100vw - 10px);justify-content:center}.share-panel{bottom:10px;right:5px;left:5px;padding:.5rem;min-width:auto;max-width:none;width:calc(100vw - 10px);font-size:.8rem;text-align:center}.share-panel h4{font-size:.8rem;margin-bottom:.4rem}.share-btn{padding:8px;font-size:.7rem;flex:1;min-width:60px;max-width:80px}.credits{bottom:110px;font-size:.65rem}.tutorial-content{padding:1rem;margin:.25rem;font-size:.9rem}.loading-content{padding:.75rem}.loading-title{font-size:1.3rem}.loading-tips{font-size:.8rem}.lil-gui.mobile-visible{width:280px!important;max-width:calc(100vw - 20px)!important;max-height:70vh!important;font-size:.85rem!important}}@media (max-width: 768px) and (orientation: landscape){.galaxy-header{top:5px;left:5px}.stats-panel{top:50px}.quick-actions{bottom:45px}.share-panel{bottom:5px;padding:.4rem}.share-panel h4{font-size:.8rem;margin-bottom:.3rem}.share-btn{padding:6px 8px;font-size:.7rem}.credits{bottom:80px;font-size:.6rem}.lil-gui.mobile-visible{max-height:90vh!important}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#0000004d}::-webkit-scrollbar-thumb{background:#ff950080;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ff9500b3}.mobile-gui{backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important}@media (max-width: 768px){button,.action-btn,.share-btn,.tutorial-btn{min-width:44px!important;min-height:44px!important;touch-action:manipulation}*{touch-action:manipulation}.notification{font-size:.9rem!important;padding:.75rem 1rem!important;max-width:calc(100vw - 20px)!important;left:10px!important;right:10px!important;margin:0 auto!important}.ui-overlay>*{margin:.25rem}.modal-content{margin:10px!important;max-height:calc(100vh - 20px)!important;overflow-y:auto!important}}@media (max-width: 320px){.galaxy-title{font-size:1rem!important}.galaxy-subtitle{font-size:.7rem!important}.action-btn{width:36px!important;height:36px!important;font-size:.9rem!important}.quick-actions{gap:4px!important}.mobile-gui{width:260px!important;font-size:.8rem!important}}@media (max-height: 500px) and (orientation: landscape){.lil-gui.mobile-gui{max-height:95vh!important}.tutorial-content,.modal-content{max-height:95vh!important;padding:.75rem!important}.galaxy-header{top:2px!important}.stats-panel{top:35px!important}}
