:root{--color-void:#05050a;--color-surface:#0d0d1a;--color-surface-2:#12122a;--color-border:#1e1e3a;--color-lava:#ff4500;--color-magma:#ff6a00;--color-bg-dark:#050202;--color-cyan:#f30;--color-cyan-glow:#f306;--color-violet:#8b00ff;--color-text:#e0e0f0;--color-muted:#ffffff80;--color-muted-2:#335;--font-display:"Space Grotesk", sans-serif;--font-primary:"Inter", system-ui, sans-serif;--font-mono:"Fira Code", monospace;--radius:4px;--transition:.15s ease;--glass-bg:#14050566;--glass-border:#f303}*{box-sizing:border-box}body{background-color:var(--color-void);color:var(--color-text);font-family:var(--font-display);margin:0;padding:0;overflow:hidden}.app-container{width:100vw;height:100vh;display:flex}.canvas-container{background-color:var(--color-void);flex:1;justify-content:center;align-items:center;display:flex;position:relative}@media (width<=768px){.canvas-container{align-items:flex-start}}.fractal-image{object-fit:contain;max-width:100%;max-height:100%}.panel-container{background-color:var(--color-surface);border-left:1px solid var(--color-border);flex-direction:column;gap:20px;width:320px;padding:16px;display:flex;overflow-y:auto}.panel-section{border-bottom:1px solid var(--color-border);flex-direction:column;gap:12px;padding-bottom:16px;display:flex}.panel-title{text-transform:uppercase;letter-spacing:1px;color:var(--color-lava);margin:0;font-size:14px;font-weight:700}.input-group{flex-direction:column;gap:4px;display:flex}.input-row{gap:8px;display:flex}.input-row .input-group{flex:1}.input-group label{text-transform:uppercase;color:var(--color-muted);font-size:11px}.input-group input,.input-group select{background-color:var(--color-surface-2);border:1px solid var(--color-border);color:var(--color-text);border-radius:var(--radius);font-family:var(--font-mono);padding:8px;font-size:12px}.input-group input:focus,.input-group select:focus{border-color:var(--color-lava);outline:none}.btn-primary{background-color:var(--color-lava);color:#fff;border-radius:var(--radius);cursor:pointer;font-family:var(--font-display);text-transform:uppercase;transition:background-color var(--transition);border:none;padding:12px;font-weight:700}.btn-primary:hover{background-color:var(--color-magma)}.btn-primary:disabled{background-color:var(--color-muted-2);color:var(--color-muted);cursor:not-allowed}.render-status{border:1px solid var(--color-border);border-radius:var(--radius);font-family:var(--font-mono);color:var(--color-cyan);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0d0d1acc;padding:8px 12px;font-size:12px;position:absolute;bottom:20px;left:20px}.canvas-container.tiktok-mode{background-color:#000;padding:20px}.canvas-container.tiktok-mode>div{border:2px solid var(--color-pink);border-radius:8px;margin:0 auto;overflow:hidden;box-shadow:0 0 20px #ff008066;aspect-ratio:9/16!important;width:100%!important;max-width:45vh!important;height:auto!important;max-height:90vh!important}.canvas-container.tiktok-mode .render-status{display:none}.bottom-nav-container{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#05050a66;border:1px solid #ff50004d;border-radius:40px;justify-content:center;align-items:center;gap:15px;padding:10px 20px;display:flex;box-shadow:0 10px 40px #0ff3,inset 0 0 0 1px #ffffff0d}.bubble-menu-wrapper{justify-content:center;align-items:center;display:flex}.bubble-menu-btn{cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ff50001a;border:2px solid #ff500066;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:flex;box-shadow:0 0 20px #ff50004d,inset 0 0 15px #ff500033}.bubble-menu-btn:hover{background:#ff500033;transform:scale(1.1);box-shadow:0 0 30px #ff500080,inset 0 0 25px #ff500066}.bubble-icon{filter:drop-shadow(0 0 5px #ff5000cc);font-size:24px}.close-bubble-btn{color:#ffffff80;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:10px;font-size:20px;transition:all .2s;display:flex}.close-bubble-btn:hover{color:var(--color-cyan);transform:rotate(90deg)}.nav-links{gap:5px;display:flex}.nav-btn{color:#fff9;cursor:pointer;background:0 0;border:none;border-radius:20px;flex-direction:row;justify-content:center;align-items:center;gap:8px;padding:10px 16px;font-size:14px;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.nav-btn:hover{color:#fff;background:#ffffff0d}.nav-btn.active{color:var(--color-cyan);background:#ff50001a;box-shadow:0 0 20px #ff500033}.nav-icon{font-size:16px}.music-selector{border-left:1px solid #ffffff1a;align-items:center;gap:10px;padding-left:20px;display:flex}.track-dropdown{color:var(--color-pink);cursor:pointer;background:#00000080;border:1px solid #fff3;border-radius:8px;outline:none;padding:8px 12px;font-family:inherit;font-size:13px;font-weight:600;transition:all .2s}.track-dropdown:hover{border-color:var(--color-pink)}.track-dropdown option{color:#fff;background:#111}.ui-overlay{pointer-events:none;z-index:100;width:100vw;height:100dvh;position:absolute;top:0;left:0}.start-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:9999;cursor:pointer;background:#000c;justify-content:center;align-items:center;width:100vw;height:100dvh;display:flex;position:absolute;top:0;left:0}.start-btn{letter-spacing:10px;color:#fff;border:2px solid var(--color-cyan);text-shadow:0 0 20px var(--color-cyan);border-radius:50px;padding:20px 40px;font-size:24px;font-weight:800;animation:2s infinite alternate pulseGlow;box-shadow:0 0 40px #ff500066,inset 0 0 20px #ff500033}@keyframes pulseGlow{0%{box-shadow:0 0 40px #ff500066,inset 0 0 20px #ff500033}to{transform:scale(1.05);box-shadow:0 0 80px #ff5000cc,inset 0 0 40px #ff500080}}.store-overlay{pointer-events:auto;box-sizing:border-box;justify-content:center;align-items:center;width:100vw;height:100dvh;padding:2vw;display:flex;position:absolute;top:0;left:0}.portfolio-scroll-area{pointer-events:auto;border-radius:24px;width:100%;max-width:1600px;height:90dvh;overflow-y:auto}.portfolio-scroll-area::-webkit-scrollbar{display:none}.portfolio-scroll-area{-ms-overflow-style:none;scrollbar-width:none}.bubble-overlay{bottom:calc(20px + env(safe-area-inset-bottom));pointer-events:auto;z-index:200;position:absolute;left:50%;transform:translate(-50%)}.portfolio-container{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:radial-gradient(circle,#0006 0%,#000c 100%);border:1px solid #00ffff1a;border-radius:24px;flex-direction:column;width:100%;height:fit-content;min-height:100%;padding:40px;animation:.8s ease-out fadeIn;display:flex}.portfolio-grid-wrapper{column-count:3;column-gap:30px;width:100%;padding-bottom:80px}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.portfolio-header{text-align:center;margin-bottom:50px;transform:translateZ(50px)}.portfolio-header h2{letter-spacing:8px;background:linear-gradient(90deg, #fff, var(--color-cyan));-webkit-text-fill-color:transparent;text-shadow:0 0 40px #ff500066;-webkit-background-clip:text;margin:0;font-size:48px;font-weight:900}.portfolio-header p{color:#fffc;text-shadow:0 2px 4px #000c;margin-top:10px;font-size:18px}.portfolio-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);break-inside:avoid;background:#0a0f1966;border:1px solid #ff500066;border-radius:16px;flex-direction:column;margin-bottom:30px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex;overflow:hidden;box-shadow:0 0 30px #00ffff1a,inset 0 0 20px #00ffff1a}.portfolio-card:hover{border-color:#ff5000;transform:translateY(-10px)scale(1.05);box-shadow:0 20px 40px #000c,0 0 60px #ff500099}.hud-toggle-btn{color:var(--color-cyan);cursor:pointer;z-index:1001;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-transform:uppercase;letter-spacing:2px;background:#ff50001a;border:1px solid #ff50004d;border-radius:20px;padding:10px 16px;font-size:12px;font-weight:800;transition:all .2s}.hud-toggle-btn:hover{background:#ff500033;box-shadow:0 0 15px #ff500066}.card-image-placeholder{background:linear-gradient(45deg,#00ffff1a,#ff00ff1a);border-bottom:1px solid #ffffff0d;justify-content:center;align-items:center;height:180px;display:flex}.hologram-text{letter-spacing:4px;color:#fff3;font-weight:800}.card-content{flex-direction:column;flex-grow:1;padding:20px;display:flex}.card-content h3{color:#fff;margin:0 0 10px;font-size:20px}.card-desc{color:#ffffff80;flex-grow:1;margin:0 0 20px;font-size:14px;line-height:1.5}.card-footer{justify-content:space-between;align-items:center;display:flex}.price{color:var(--color-cyan);font-size:24px;font-weight:700}.btn-buy{background:var(--color-cyan);color:#000;cursor:pointer;text-transform:uppercase;letter-spacing:1px;border:none;border-radius:20px;padding:8px 24px;font-size:13px;font-weight:800;transition:all .2s}.btn-buy:hover{box-shadow:0 0 20px var(--color-cyan);background:#fff}@media (width<=1024px){.portfolio-grid-wrapper{column-count:2}}@media (width<=768px){.portfolio-grid-wrapper{column-count:1}.bottom-nav-container{border-radius:20px;flex-wrap:wrap;justify-content:center;gap:6px;width:95vw;padding:8px}.nav-links{flex-wrap:wrap;justify-content:center;gap:4px;width:100%}.nav-btn{text-align:center;flex-direction:column;flex:auto;gap:4px;min-width:60px;padding:6px;font-size:10px}.nav-btn svg{width:14px;height:14px}.close-bubble-btn{padding:6px}}