:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#ffffffde;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0f172a;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}.ground-highlight{animation:2s ease-in-out infinite ground-pulse;background:#38bdf866!important;border:1px solid #38bdf8cc!important;box-shadow:0 0 12px #38bdf899!important}@keyframes ground-pulse{0%{box-shadow:0 0 5px #38bdf866}50%{box-shadow:0 0 15px #38bdf8cc}to{box-shadow:0 0 5px #38bdf866}}body{-webkit-user-select:none;user-select:none;place-items:center;min-width:320px;min-height:100dvh;margin:0;display:flex;overflow:hidden}input,textarea,[contenteditable=true]{-webkit-user-select:text;user-select:text}#root{width:100vw;height:100dvh;margin:0;padding:0}.glass-panel{-webkit-backdrop-filter:blur(12px);background:#1e293bb3;border:1px solid #ffffff1a;border-radius:4px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#0003;border-radius:4px}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}input[type=range]{appearance:none;cursor:pointer;background:0 0;border:none;outline:none;width:100%;margin:0;padding:0}input[type=range]::-webkit-slider-thumb{appearance:none;cursor:pointer;background:linear-gradient(#334155 0%,#1e293b 45%,#0f172a 100%) padding-box padding-box;border-radius:7px;outline:none;width:32px;height:14px;margin-top:-5.5px;transition:all .2s;box-shadow:0 2px 4px #00000080,inset 0 1px #ffffff1a,inset 0 -1px 1px #0009;border:none!important}input[type=range]::-moz-range-thumb{cursor:pointer;background:linear-gradient(#f8fafc 0%,#cbd5e1 20%,#94a3b8 50%,#64748b 85%,#1e293b 100%);border-radius:7px;outline:none;width:32px;height:14px;box-shadow:0 3px 6px #0006,inset 0 1px #fff9,inset 0 -1.5px 1px #000c;border:none!important}input[type=range]::-webkit-slider-thumb:hover{background:linear-gradient(#fff 0%,#e2e8f0 20%,#cbd5e1 50%,#94a3b8 80%,#64748b 100%);box-shadow:0 4px 10px #0009,inset 0 1px #fffc,inset 0 -1px 1px #000000b3}input[type=range]::-webkit-slider-runnable-track{cursor:pointer;background:#0006;border:none;border-radius:2px;outline:none;width:100%;height:3px}.slider-wrapper{flex:0 0 90px;align-items:center;width:90px;height:18px;display:flex;position:relative}.slider-value{pointer-events:none;color:#fff;text-shadow:0 1px 2px #00000080;text-align:center;min-width:16px;font-size:.55rem;font-weight:500;position:absolute;top:50%;transform:translate(-50%,-50%)}input[type=range]:focus{outline:none}input[type=range]:hover+.slider-value,input[type=range]:active+.slider-value{color:#0f172a;text-shadow:none}button{color:#fff;cursor:pointer;background-color:#ffffff1a;border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:.6em 1.2em;font-family:inherit;font-size:1em;font-weight:500;transition:all .2s;display:flex}button:hover{background-color:#fff3;border-color:#ffffff4d}button:active{transform:scale(.98)}button.primary{color:#fff;background-color:#0ea5e9;border:none}button.primary:hover{background-color:#0284c7}button:disabled{opacity:.3;cursor:not-allowed}.timeline-btn{color:#fff9;white-space:nowrap;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1e293b66;border:1px solid #ffffff1a;border-radius:6px;gap:4px;min-width:24px;height:24px;padding:4px 8px;font-size:.75rem;transition:all .2s cubic-bezier(.4,0,.2,1)}.timeline-btn:hover:not(:disabled){color:#fff;background:#38bdf81a;border-color:#38bdf866;transform:translateY(-1px);box-shadow:0 4px 12px #0006}.timeline-btn.active{color:#fff;background:#b45309;border-color:#fcd34d}.timeline-btn.blue{color:#7dd3fc;background:#38bdf81a;border:1px solid #38bdf880}.timeline-btn.purple{color:#c4b5fd;background:#8b5cf626;border:1px solid #8b5cf680}.timeline-btn.red{color:#fca5a5;background:#ef44441a;border:1px solid #ef444480}.timeline-btn.yellow{color:#fbbf24;background:#fbbf241a;border:1px solid #fbbf2480}.timeline-btn.circle{color:#fff6;background:0 0;border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:20px;min-width:20px;height:20px;padding:0;transition:all .2s;display:flex}.timeline-btn.circle:hover:not(:disabled){color:#38bdf8;background:#38bdf81a;border-color:#38bdf84d}.timeline-btn.circle:active:not(:disabled){transform:scale(.95)}.zoom-percent-display{text-align:center;color:#fbbf24;cursor:pointer;border-radius:4px;min-width:32px;padding:0 4px;font-family:JetBrains Mono,Roboto Mono,monospace;font-size:.75rem;font-weight:800;transition:all .2s}.zoom-percent-display:hover{color:#fff;background:#38bdf81a}.timeline-btn.unsaved{z-index:10;animation:2s ease-in-out infinite glowing-save;color:#fde047!important;background:#fde04733!important;border:1px solid #fde047!important}@keyframes glowing-save{0%{border-color:#fde04766;box-shadow:0 0 5px #fde04766}50%{border-color:#fde047;box-shadow:0 0 15px #fde047,0 0 25px #fde04780}to{border-color:#fde04766;box-shadow:0 0 5px #fde04766}}.app-container{width:100vw;height:100dvh;display:flex;position:relative}.canvas-container{z-index:1;flex-grow:1;height:100%;position:relative}.sidebar{z-index:10;box-sizing:border-box;flex-direction:column;width:136px;height:auto;max-height:calc(100dvh - 164px);margin:4px;padding:4px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:0;overflow-y:auto;background:#1e293be0!important}.sidebar.minimized{white-space:nowrap;background:#1e293bf2;height:auto;max-height:40px;overflow:hidden;box-shadow:0 4px 12px #0000004d;min-height:0!important}.sidebar-joints,.sidebar-reset{width:236px}.sidebar-core{flex-shrink:0}.sidebar-attitude,.sidebar-reset{flex-shrink:0;height:auto;max-height:none;overflow-y:visible}.sidebar-stack{z-index:10;pointer-events:none;flex-direction:column;gap:5px;display:flex;position:absolute;top:40px;bottom:164px;left:52px}.sidebar-stack.right{top:40px;left:auto;right:10px}.sidebar-stack>*{pointer-events:auto}.sidebar-stack .sidebar{height:auto;max-height:none;margin:0;position:relative}.sidebar-stack .timeline-btn{margin:0!important}.timeline-container{z-index:60;pointer-events:none;justify-content:flex-start;padding:0;display:flex;position:absolute;bottom:20px;left:52px;right:10px}.timeline-panel{pointer-events:auto;-webkit-backdrop-filter:blur(16px);background:linear-gradient(135deg,#352d2699 0%,#241f1aa6 50%,#1a1612b3 100%);border:1px solid #4a3a2e99;border-radius:4px;flex-direction:column;gap:2px;width:100%;max-width:none;padding:4px 4px 3px;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 25px 50px -12px #000000b3,inset 0 1px #ffffff08}.controls-section{flex-direction:column;gap:0;margin-bottom:4px;display:flex}.controls-section h3{color:#38bdf8;text-transform:none;letter-spacing:.05em;border-bottom:1px solid #ffffff0d;margin:0 0 4px;padding-bottom:2px;font-size:.75rem;font-weight:500}.control-group{background-color:#ffffff05;border:1px solid #0000;border-radius:4px;flex-direction:column;gap:1px;padding:0 3px;transition:all .2s;display:flex}.control-group.glowing{background:#ea580c1a;border:1px solid #ea580c4d;transform:translate(4px);box-shadow:0 0 12px #ea580c26}.control-group.glowing .control-label span{color:#fb923c}.axis-glow{background:#ea580c33;border-radius:4px;box-shadow:0 0 8px #ea580c33}.axis-glow input[type=range]::-webkit-slider-thumb{outline:none;box-shadow:0 0 15px #ea580ccc,inset 0 1px #fff9,inset 0 -1.5px 1px #000000b3;background:linear-gradient(#fed7aa 0%,#fb923c 20%,#f97316 50%,#ea580c 80%,#451a03 100%)!important;border:none!important}.studio-panel{background:#1e293b99;border:1px solid #38bdf84d;border-radius:4px;margin-bottom:12px;padding:8px}.sidebar-accordion{border-radius:4px;transition:all .2s cubic-bezier(.4,0,.2,1);overflow:hidden}.accordion-header:hover{background:#38bdf80d!important}.accordion-header:hover span{text-shadow:0 0 8px #38bdf84d;color:#38bdf8!important}.accordion-header:hover svg{filter:drop-shadow(0 0 4px #38bdf880);color:#38bdf8!important}.accordion-header:active{transform:scale(.99)}.sidebar-accordion.collapsed{border-bottom:1px solid #ffffff08}.accordion-content{transform-origin:top;animation:.2s ease-out forwards slide-down}@keyframes slide-down{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.flex-col{flex-direction:column;align-items:center;gap:4px;display:flex}.vertical-sliders-container{justify-content:center;padding:4px 0;display:flex}.studio-grid-5x5{aspect-ratio:1;grid-template-rows:repeat(5,1fr);grid-template-columns:repeat(5,1fr);gap:4px;width:100%;display:grid}.studio-grid-5x5.debug-visible>div{outline:1px dashed #38bdf84d}.studio-grid-5x5>div{justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.studio-grid-5x5.debug-visible>div:after{content:"R" attr(data-row) " C" attr(data-col);color:#38bdf880;pointer-events:none;font-family:monospace;font-size:8px;position:absolute;top:1px;left:2px}.slider-wrapper.vertical-rotated{transform-origin:50%;width:78px;height:18px;transform:rotate(-90deg)}.slider-wrapper.vertical-rotated input{width:78px!important}.slider-wrapper.vertical-rotated input[type=range]::-webkit-slider-thumb{transform:rotate(90deg)}.slider-wrapper.vertical-rotated input[type=range]::-moz-range-thumb{transform:rotate(90deg)}.control-label{color:#94a3b8;justify-content:space-between;font-size:.7rem;font-weight:400;display:flex}.flex-row{align-items:center;gap:8px;display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.toggle-switch{background:#0006;border-radius:20px;padding:4px;display:flex}.toggle-option{cursor:pointer;border-radius:16px;padding:6px 16px;font-size:.9rem;transition:all .3s}.toggle-option.active{color:#0f172a;background:#38bdf8;font-weight:600}.checkbox-container{cursor:pointer;-webkit-user-select:none;user-select:none;background:#ffffff0d;border-radius:4px;align-items:center;padding:4px 8px;transition:background .2s;display:flex}.checkbox-container:hover{background:#ffffff1a}.checkbox-container input[type=checkbox]{cursor:pointer;accent-color:#38bdf8;width:16px;height:16px}.menu-item{color:#e2e8f0;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:0;justify-content:flex-start;align-items:center;gap:8px;width:100%;padding:10px 16px;font-size:.95rem;transition:background .2s;display:flex}.menu-item:hover{color:#38bdf8;background:#ffffff1a}.timeline-track{height:calc(100px * var(--timeline-zoom,1));cursor:default;border:1px solid #352d26;border-radius:8px;margin-bottom:6px;transition:height .2s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:inset 0 10px 30px #000c,0 1px #ffffff05;background:#1a1612!important}.timeline-track:before,.timeline-track:after{content:"";height:calc(8px * var(--timeline-zoom,1));z-index:5;pointer-events:none;background:0 0;position:absolute;left:0;right:0}.timeline-track:before{top:calc(2px * var(--timeline-zoom,1))}.timeline-track:after{bottom:calc(2px * var(--timeline-zoom,1))}.timeline-marker{top:calc(10px * var(--timeline-zoom,1));bottom:calc(10px * var(--timeline-zoom,1));width:calc(72px * var(--timeline-zoom,1));border-radius:calc(6px * var(--timeline-zoom,1));cursor:grab;transform-origin:bottom;background:#2a201a;border:1px solid #4a3a2e;flex-direction:column;justify-content:center;align-items:center;transition:all .2s cubic-bezier(.175,.885,.32,1.275);display:flex;position:absolute;transform:translate(-50%);box-shadow:0 12px 24px #00000080}.marker-dots{justify-content:center;gap:calc(12px * var(--timeline-zoom,1));pointer-events:none;padding:0;display:flex;position:absolute;left:0;right:0}.marker-dots.top{top:calc(-10px * var(--timeline-zoom,1))}.marker-dots.bottom{bottom:calc(-10px * var(--timeline-zoom,1))}.marker-dots .dot{width:calc(6px * var(--timeline-zoom,1));height:calc(6px * var(--timeline-zoom,1));background-color:#1a1612;border:1px solid #352d26;border-radius:50%}.marker-dots .dot.measure-dot{background-color:#a78bfa;border-color:#a78bfa66;box-shadow:0 0 10px #a78bfa80}.marker-dots .dot.clickable{pointer-events:auto;cursor:pointer;transition:all .2s}.marker-dots .dot.clickable:hover{z-index:50;background-color:#fff6;transform:scale(1.3);box-shadow:0 0 8px #fff6}.marker-dots .dot.selected.dot-0{background-color:#fde047;border-color:#fde04766;box-shadow:0 0 10px #fde047b3}.marker-dots .dot.selected.dot-1{background-color:#38bdf8;border-color:#38bdf866;box-shadow:0 0 10px #38bdf8b3}.marker-dots .dot.selected.dot-2{background-color:#4ade80;border-color:#4ade8066;box-shadow:0 0 10px #4ade80b3}.marker-dots .dot.selected.dot-3{background-color:#f472b6;border-color:#f472b666;box-shadow:0 0 10px #f472b6b3}.marker-dots .dot.has-data{background-color:#fff;border-color:#fff6;box-shadow:0 0 10px #ffffffb3}.timeline-marker:hover,.timeline-marker.active{z-index:10;background:#352d26;border-color:#fbbf24;box-shadow:0 15px 30px #0009}.timeline-marker.active{z-index:25;border-width:2px;border-color:#fbbf24;transform:translate(-50%)scale(1.1);box-shadow:0 0 35px #fbbf244d,inset 0 0 12px #fbbf241a}.timeline-marker.selected{border-color:#fbbf24;box-shadow:0 0 15px #fbbf2433;background:#fbbf2426!important}.timeline-marker.drag-move-source{opacity:.4!important;box-shadow:none!important;background:#0f172a99!important;border:1px dashed #38bdf899!important}.timeline-marker.drag-copy-source{opacity:.75!important;background:#22c55e0d!important;border:1px dashed #22c55e99!important;box-shadow:0 0 10px #22c55e26!important}.timeline-marker.drag-move-target{opacity:.95;z-index:40!important;background:#38bdf826!important;border-color:#38bdf8!important;transform:translate(-50%)scale(1.05)!important;box-shadow:0 0 25px #38bdf8cc,inset 0 0 10px #38bdf84d!important}.timeline-marker.drag-copy-target{opacity:.95;z-index:40!important;background:#22c55e26!important;border-color:#22c55e!important;transform:translate(-50%)scale(1.05)!important;box-shadow:0 0 25px #22c55ecc,inset 0 0 10px #22c55e4d!important}.timeline-marker.drag-move-target.overwrite,.timeline-marker.drag-copy-target.overwrite{border:1.5px solid #ef4444!important;box-shadow:0 0 35px #ef4444f2,inset 0 0 12px #ef444466!important}.timeline-marker.overwrite:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;z-index:99!important;background:#ef444447!important;border:1px solid #ef444466!important}.timeline-insert-marker{animation:1.2s ease-in-out infinite insert-marker-pulse}@keyframes insert-marker-pulse{0%{opacity:.85;box-shadow:0 0 10px #fbbf24,0 0 3px #fbbf24}50%{opacity:1;box-shadow:0 0 22px #fbbf24,0 0 8px #fbbf24}to{opacity:.85;box-shadow:0 0 10px #fbbf24,0 0 3px #fbbf24}}.timeline-drag-preview-card{will-change:transform, left, top;animation:.18s cubic-bezier(.16,1,.3,1) forwards drag-preview-fade-in}@keyframes drag-preview-fade-in{0%{opacity:0;transform:scale(.92)translate(-4px,-4px)}to{opacity:1;transform:scale(1)translate(0)}}.context-menu{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#1e293bf2;border:1px solid #ffffff1a;border-radius:6px;min-width:180px;padding:4px 0;animation:.15s ease-out context-menu-fade-in;box-shadow:0 10px 25px #00000080,0 0 0 1px #ffffff0d}@keyframes context-menu-fade-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu-item{color:#e2e8f0;cursor:pointer;justify-content:space-between;align-items:center;gap:12px;padding:6px 12px;font-size:.85rem;transition:all .1s;display:flex;position:relative}.context-menu-item:hover{color:#38bdf8;background:#38bdf833}.context-menu-item:hover svg{color:#38bdf8;opacity:1!important}.context-menu-item.disabled{opacity:.4;cursor:not-allowed}.context-menu-item.disabled:hover{color:#e2e8f0;background:0 0}.context-menu-submenu{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:2100;background:#1e293bfa;border:1px solid #ffffff1a;border-radius:6px;min-width:180px;padding:4px 0;display:none;position:absolute;top:-4px;left:100%;box-shadow:0 10px 25px #00000080}.context-menu-item:not(.disabled):hover>.context-menu-submenu{animation:.15s ease-out context-menu-fade-in;display:block}.context-menu-submenu.flip-left,.flip-left .context-menu-submenu{left:auto;right:100%}.context-menu-submenu.flip-up,.flip-up .context-menu-submenu{top:auto;bottom:-4px}.context-menu-divider{background:#ffffff0d;height:1px;margin:4px 0}.selected-count-badge{color:#0f172a;background:#fbbf24;border-radius:10px;margin-left:6px;padding:1px 5px;font-size:.65rem;font-weight:800}.timeline-marker .frame-label{font-size:calc(.7rem * var(--timeline-zoom,1));color:#ffffffe6;text-align:center;padding:calc(2px * var(--timeline-zoom,1)) 0;border-radius:0 0 calc(6px * var(--timeline-zoom,1)) calc(6px * var(--timeline-zoom,1));pointer-events:none;text-shadow:0 1px 2px #00000080;background:#0009;font-family:JetBrains Mono,Roboto Mono,monospace;font-weight:700;position:absolute;bottom:0;left:0;right:0}@keyframes glowPulse{0%{box-shadow:0 0 5px #38bdf866}50%{box-shadow:0 0 20px #38bdf8cc,0 0 30px #38bdf866}to{box-shadow:0 0 5px #38bdf866}}.loader{border:5px solid #ffffff1a;border-top-color:#38bdf8;border-radius:50%;width:60px;height:60px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.music-panel{align-items:center;gap:6px;display:flex}.music-panel.loaded{background:#8b5cf614;border:1px solid #8b5cf640;border-radius:8px;gap:6px;padding:1px 8px}.music-panel.analyzing{background:#38bdf814;border:1px solid #38bdf840;border-radius:8px;gap:6px;padding:1px 10px;animation:2s ease-in-out infinite glowPulse}.music-info{align-items:center;gap:8px;font-size:.7rem;display:flex}.music-filename{color:#e2e8f0;text-overflow:ellipsis;white-space:nowrap;max-width:120px;font-weight:500;overflow:hidden}.music-bpm{color:#a78bfa;font-family:monospace;font-size:.75rem;font-weight:700}.music-beats{color:#94a3b8;font-size:.65rem}.music-volume{align-items:center;gap:4px;display:flex}.music-volume input[type=range]{height:2px}.music-volume input[type=range]::-webkit-slider-thumb{background:#a78bfa;width:10px;height:10px;margin-top:-4px;box-shadow:0 0 4px #8b5cf64d}.spin-icon{animation:1.5s linear infinite spin}.waveform-canvas{opacity:1;border-radius:6px}.timeline-track.has-music{border-color:#8b5cf64d;box-shadow:inset 0 2px 10px #00000080,inset 0 0 30px #8b5cf60d}.timeline-marker.measure-start:after{content:none}.explorer-card{background:#0f172a99;border:1px solid #38bdf84d;border-radius:8px;transition:all .3s cubic-bezier(.4,0,.2,1);overflow:hidden;box-shadow:0 4px 12px #0003}.explorer-card:hover{background:#38bdf81a;border-color:#38bdf8;transform:translateY(-2px);box-shadow:0 8px 20px #38bdf833}.explorer-card.selected{background:#38bdf826;border-color:#38bdf8;box-shadow:0 0 15px #38bdf84d,inset 0 0 10px #38bdf81a}.explorer-preview{background:#081418fa;border:2px solid #38bdf8;border-radius:16px;animation:.25s cubic-bezier(.175,.885,.32,1.275) forwards popIn;transform:translate(-50%);box-shadow:0 25px 50px -12px #0009,0 0 30px #38bdf840}@keyframes popIn{0%{opacity:0;transform:translate(-50%)scale(.9)}to{opacity:1;transform:translate(-50%)scale(1)}}@keyframes scaleIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.dialog-cancel-btn:hover{color:#f8fafc!important;background:#ffffff1a!important;border-color:#fff3!important}.library-drop-target{z-index:50!important;background:#38bdf84d!important;border:2px solid #38bdf8!important;transform:translate(-50%)scale(1.1)!important;box-shadow:0 0 20px #38bdf899!important}@media (width<=1024px){.sidebar{width:120px!important}.sidebar-joints,.sidebar-reset{width:200px!important}.sidebar-stack{bottom:146px!important}.sidebar-stack.right{right:8px!important}.timeline-container{bottom:12px!important;left:52px!important;right:12px!important}}@media (width<=768px){.nav-rail{display:none!important}.timeline-container{left:12px!important;right:12px!important;bottom:calc(16px + env(safe-area-inset-bottom))!important}.sidebar-stack{display:none!important}}