*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{overscroll-behavior:none;font-size:130%;overflow:auto}html,body{-webkit-user-select:none;user-select:none;touch-action:none;background:#000;width:100%;height:100%;font-family:monospace;position:relative}:root{--bottom-ui-offset:0px}#canvas-parent{width:100%;height:100%;display:block}#canvas-parent canvas{touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%}#loading-overlay{z-index:10;opacity:1;pointer-events:none;touch-action:none;filter:blur(64px);background:#000 50%/cover no-repeat;width:100%;height:100%;transition:opacity .6s ease-out;position:absolute;top:0;left:0}#loading-overlay.hidden{opacity:0}:root{--sidebar-width:340px}#app-row{flex-direction:row;width:100%;height:100%;display:flex;position:fixed;inset:0}#viewport-column{flex-direction:column;flex:auto;min-width:0;height:100%;display:flex;position:relative}#canvas-container{flex:auto;width:100%;min-height:0;position:relative}#dev-panel{flex:0 0 var(--sidebar-width,340px);width:var(--sidebar-width,340px);z-index:10;background:#181818;height:100%;display:none;position:relative;overflow:hidden}#dev-panel.visible{flex-direction:column;display:flex}#dev-panel .gui_root.gui_panel{box-sizing:border-box;flex-direction:column;width:100%;height:100%;display:flex;overflow:hidden}#dev-panel .gui_root .row.has_timeline,#timeline-panel .tl-track.has_timeline{--tl-tint:#4ab8ff;box-shadow:inset 3px 0 0 0 var(--tl-tint);background:color-mix(in srgb, var(--tl-tint) 12%, transparent)}#dev-panel .gui_root .row.has_timeline.timeline_relative,#timeline-panel .tl-track.has_timeline.timeline_relative{--tl-tint:#b98cff}#timeline-panel .tl-tracks-rest .tl-track:nth-child(2n){background:color-mix(in srgb, var(--tl-tint,#4ab8ff) 18%, transparent)}#timeline-panel .tl-tracks-rest .tl-track:nth-child(2n) .tl-lane{background:#161616}#timeline-panel .tl-tracks-rest .tl-track.tl-hover{background:color-mix(in srgb, var(--tl-tint,#4ab8ff) 24%, transparent)}#timeline-panel .tl-tracks-rest .tl-track.tl-hover .tl-lane{background:color-mix(in srgb, var(--tl-tint,#4ab8ff) 16%, #101010)}#timeline-panel .tl-tracks-rest .tl-track.tl-sel{background:color-mix(in srgb, var(--tl-tint,#4ab8ff) 34%, transparent)}#timeline-panel .tl-tracks-rest .tl-track.tl-sel .tl-lane{background:color-mix(in srgb, var(--tl-tint,#4ab8ff) 26%, #101010)}#dev-panel .gui_root .row.tl-xhover{background:color-mix(in srgb, var(--tl-tint,#4ab8ff) 22%, transparent)}#dev-panel .gui_root .tl-keyframe-btn .icon.gui_icon_dot{transform:rotate(45deg)}#dev-panel .gui_root .row.has_timeline .tl-keyframe-btn{color:var(--tl-tint)}#dev-panel .gui_root .row.has_timeline .tl-keyframe-btn:active{color:#fff}#dev-panel .panel_header{flex:none}#dev-panel .panel_content{flex-direction:column;flex:auto;min-height:0;display:flex;overflow:hidden}#dev-panel .panel_content>*{flex:none}#dev-panel .panel_scroll{overscroll-behavior:contain;flex:auto;min-height:0;overflow-y:auto}#dev-panel .watched_footer{flex:none;max-height:40%;overflow-y:auto}#dev-panel .watch_btn.is_active,#dev-panel .watched_footer .watch_btn{color:var(--gui-color-6)}#dev-panel-resize-handle{right:var(--sidebar-width,340px);cursor:col-resize;z-index:15;background:0 0;width:6px;height:100%;transition:background .15s;display:none;position:fixed;top:0}#dev-panel-resize-handle.visible{display:block}#dev-panel-resize-handle:hover,#dev-panel-resize-handle.dragging{background:#ffffff1f}#dev-panel-resize-handle:after{content:"";background:#fff3;border-radius:1px;width:2px;height:32px;transition:background .15s;position:absolute;top:50%;left:2px;transform:translateY(-50%)}#dev-panel-resize-handle:hover:after,#dev-panel-resize-handle.dragging:after{background:#ffffff73}#debug-error{color:red;background:#ffff0080;padding:2%;font-family:monospace;font-size:26px;font-weight:500;line-height:38px;text-decoration:none;display:none;position:absolute;inset:0}#instructions{z-index:15;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#ffffffbf;letter-spacing:.08em;pointer-events:none;white-space:normal;text-align:center;overflow-wrap:anywhere;opacity:0;background:#00000073;border-radius:0;width:100%;padding:.4rem 1rem;font-family:monospace;font-size:.6875rem;transition:opacity .3s;position:absolute;top:1rem;left:0;right:0}#instructions.visible{opacity:1}#loader{color:#fff;z-index:10;background:radial-gradient(circle,#be51c4 0%,#c757be 51%,#8953a8 100%);flex-direction:column;transition:opacity .3s;display:flex;position:fixed;inset:0;overflow:hidden}.sort-dropdown{justify-content:flex-end;margin:.75rem 0;display:flex;position:relative}.sort-trigger{color:#ffffffb3;letter-spacing:.1em;cursor:pointer;text-align:center;background:#0000004d;border:1px solid #ffffff26;outline:none;min-width:6rem;padding:.3rem .5rem;font-family:monospace;font-size:.625rem}.sort-trigger:hover,.sort-trigger.open{color:#fff;border-color:#fff6}.sort-menu{z-index:50;background:#1e031a;border:1px solid #ffffff26;min-width:6rem;display:none;position:absolute;top:100%;right:0}.sort-menu.open{display:block}.sort-option{color:#fff9;letter-spacing:.1em;cursor:pointer;text-align:left;white-space:nowrap;background:0 0;border:none;width:100%;padding:.4rem .5rem;font-family:monospace;font-size:.625rem;display:block}.sort-option:hover{color:#fff;background:#ffffff14}.sort-option.active{color:#fff}.loader-content{-webkit-overflow-scrolling:touch;flex:1;width:100%;padding:0 1rem 1rem;overflow-y:auto}.loader-footer{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#50074440;border-top:1px solid #ffffff1a;justify-content:center;width:100%;padding:.1rem;display:flex}#loader.hidden{opacity:0;pointer-events:none}#loader h1{letter-spacing:.2em;text-transform:uppercase;color:#000;margin-bottom:.5rem;font-size:1.125rem}#exp-list{grid-template-columns:repeat(3,1fr);gap:.75rem;width:100%;max-width:450px;margin:0 auto;padding:.5rem;display:grid}.exp-btn{color:#fff;cursor:pointer;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#50074466;border:1px solid #ffffff26;flex-direction:column;align-items:center;gap:.5rem;width:100%;min-width:0;padding:.5rem;font-family:monospace;transition:all .2s;display:flex}.exp-btn:hover{background:#50074499}.thumbnail-container{width:100%;aspect-ratio:var(--thumbnail-aspect-ratio,1 / 3);background:linear-gradient(135deg,#30032a,#500744);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.thumbnail{object-fit:cover;width:100%;height:100%;transition:opacity .3s}.exp-btn .title{letter-spacing:.02em;color:#fff;text-overflow:ellipsis;white-space:nowrap;width:100%;padding:0 .125rem;font-size:.625rem;font-weight:700;overflow:hidden}.drafts-separator{letter-spacing:.1em;text-transform:uppercase;color:#000;text-align:left;border-bottom:1px dashed #0000004d;grid-column:1/-1;width:100%;margin-top:1.5rem;margin-bottom:.5rem;padding-bottom:.25rem;font-family:monospace;font-size:.6875rem}#pause-btn{z-index:20;color:#aaa;cursor:pointer;background:#00000080;border:1px solid #444;border-radius:50%;justify-content:center;align-items:center;width:2rem;height:2rem;font-family:monospace;font-size:1rem;line-height:1;transition:opacity .2s;display:flex;position:absolute;bottom:3.75rem;left:50%;transform:translate(-50%)}#pause-btn:hover{color:#fff;border-color:#fff}#pause-btn.hidden{display:none}#back-btn{bottom:calc(1.5rem + var(--bottom-ui-offset));color:#aaa;letter-spacing:.1em;cursor:pointer;z-index:20;background:#00000080;border:1px solid #444;padding:.375rem .875rem;font-family:monospace;font-size:.6875rem;display:none;position:absolute;left:1.5rem}#drafts-btn{color:#fff;letter-spacing:.1em;cursor:pointer;background:#ffffff1a;border:1px solid #fff3;padding:.5rem 1.25rem;font-family:monospace;font-size:.6875rem;transition:all .2s;display:none}#back-btn.visible,#drafts-btn.visible,#info-btn.visible{display:block}#drafts-btn:hover{background:#fff3;border-color:#fff}#info-btn{bottom:calc(1.5rem + var(--bottom-ui-offset));color:#aaa;letter-spacing:.1em;cursor:pointer;z-index:20;background:#00000080;border:1px solid #444;padding:.375rem .875rem;font-family:monospace;font-size:.6875rem;display:none;position:absolute;right:1.5rem}#info-btn:hover{color:#fff;border-color:#fff}#preset-container{z-index:20;flex-direction:row;align-items:stretch;display:none;position:absolute;bottom:3.5rem;left:50%;transform:translate(-50%)}#preset-container.visible{display:flex}#preset-prev,#preset-next{color:#aaa;cursor:pointer;background:#00000080;border:1px solid #444;justify-content:center;align-items:center;width:2rem;font-family:monospace;font-size:.6875rem;transition:border-color .2s,color .2s;display:flex}#preset-prev{border-radius:3px 0 0 3px}#preset-next{border-radius:0 3px 3px 0}#preset-name{color:#aaa;letter-spacing:.1em;cursor:default;white-space:nowrap;text-align:center;background:#00000080;border:1px solid #444;border-left:none;border-right:none;width:11rem;padding:.375rem .875rem;font-family:monospace;font-size:.6875rem;transition:border-color .2s,color .2s}#preset-prev:hover,#preset-next:hover{color:#fff;border-color:#fff}#replay-btn{bottom:calc(1.5rem + var(--bottom-ui-offset));color:#aaa;letter-spacing:.1em;cursor:pointer;z-index:20;background:#00000080;border:1px solid #444;padding:.375rem .875rem;font-family:monospace;font-size:.6875rem;display:none;position:absolute;right:50%;transform:translate(50%)}#touch-btn{cursor:pointer;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:100;pointer-events:none;background-color:#ffffff4d;background-image:url(/assets/touch-CLgRnS1Y.png);background-position:50%;background-repeat:no-repeat;background-size:50%;border:none;border-radius:50%;justify-content:center;align-items:center;width:16vh;height:16vh;transition:opacity 1.5s;display:flex;position:absolute;top:75%;left:50%;transform:translate(-50%,-50%)}#touch-btn:before{content:"";opacity:1;z-index:-1;background:conic-gradient(red 0%,#ff9a00 10%,#d0de21 20%,#4fdc4a 30%,#3fdad8 40%,#2fc9e2 50%,#1c7fee 60%,#5f15f2 70%,#ba0cf8 80%,#fb07d9 90%,red 100%);border-radius:50%;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle,#0000 0% 7vh,#000 7.4vh 8.1vh,#0000 8.1vh);mask-image:radial-gradient(circle,#0000 0% 7vh,#000 7.4vh 8.1vh,#0000 8.1vh)}#touch-btn.hidden{opacity:0}#touch-btn:hover{background-color:#fff9}.modal-overlay{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:100;opacity:0;pointer-events:none;background:#000000b3;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .2s;display:flex;position:absolute;top:0;left:0}.modal-overlay.visible{opacity:1;pointer-events:auto}.modal-content{color:#fff;background:#1e031a;border:1px solid #ffffff26;width:90%;max-width:400px;padding:2rem;font-family:monospace}.modal-title{color:#fff;border-bottom:1px dashed #fff3;margin-top:0;margin-bottom:1rem;padding-bottom:.5rem;font-size:1rem}.modal-body{color:#ccc;white-space:pre-wrap;margin-bottom:1.5rem;font-size:.8125rem;line-height:1.5}.modal-close-btn{color:#fff;letter-spacing:.1em;cursor:pointer;float:right;background:#ffffff1a;border:1px solid #fff3;padding:.375rem .875rem;font-family:monospace;font-size:.6875rem;transition:all .2s}.modal-close-btn:hover{background:#fff3;border-color:#fff}#timeline-panel{flex:0 0 var(--timeline-height,120px);width:100%;height:var(--timeline-height,120px);z-index:10;background:#181818;border-top:1px solid #ffffff14;display:none;position:relative;overflow:hidden}body.has-timeline #timeline-panel{flex-direction:column;display:flex}#timeline-panel.tl-system-disabled:after{content:"Snapshot System Disabled";color:#d0d0d0;letter-spacing:.1em;text-transform:uppercase;pointer-events:none;z-index:50;background:#1e1e1e8c;justify-content:center;align-items:center;font-size:13px;display:flex;position:absolute;inset:0}#timeline-panel .gui_root.gui_panel{box-sizing:border-box;flex-direction:column;gap:3px;width:100%;height:100%;padding:4px 8px;display:flex;overflow:hidden}#timeline-panel .gui_root.gui_panel>*{flex:none}#timeline-panel-resize-handle{left:0;right:var(--sidebar-width,340px);bottom:var(--timeline-height,120px);cursor:row-resize;z-index:15;background:0 0;height:4px;transition:background .15s;display:none;position:fixed}body.has-timeline #timeline-panel-resize-handle{display:block}#timeline-panel-resize-handle:hover,#timeline-panel-resize-handle.dragging{background:#ffffff1f}#timeline-panel .gui_root.gui_panel>.tl-transport{flex:none;align-items:center}.tl-time{color:#ddd;text-align:center;white-space:nowrap;min-width:92px;font-family:monospace;font-size:11px}.tl-time span{color:#777}#timeline-panel .gui_root.gui_panel>.tl-body{--tl-label-w:120px;flex-direction:column;flex:auto;gap:2px;min-height:0;display:flex;position:relative}.tl-track-label{flex:0 0 var(--tl-label-w);width:var(--tl-label-w);box-sizing:border-box;color:#aaa;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;justify-content:flex-end;align-items:center;padding-right:8px;font-size:11px;display:flex;overflow:hidden}.tl-track-label:hover{color:#fff}.tl-ruler-label{color:#666;font-size:10px}.gui_root .tl-track-label.tl-section-btns{flex:0 0 var(--tl-label-w);width:var(--tl-label-w);box-sizing:border-box;justify-content:flex-end;align-items:center;gap:2px;padding-right:8px;display:flex}.tl-lane,.gui_root .tl-track-header>.tl-lane{cursor:crosshair;background:#101010;border-radius:2px;flex:auto;min-width:0;position:relative;overflow:hidden}.tl-row.tl-ruler{flex:none;height:26px;margin-bottom:2px;display:flex}.tl-ruler .tl-lane{background:#161616}.tl-section-band{pointer-events:none;box-sizing:border-box;height:26px;position:absolute;top:0;overflow:hidden}.tl-track-header .tl-section-band{height:22px}.tl-section-band span{color:#ded;opacity:.85;white-space:nowrap;padding-left:4px;font-size:10px}.tl-section-playback{opacity:.85;pointer-events:none;width:12px;height:12px;position:absolute;top:50%;right:3px;transform:translateY(-50%)}.tl-section-playback svg{fill:#ded;width:100%;height:100%}.tl-section-handle{cursor:ew-resize;z-index:3;width:5px;position:absolute;top:0;bottom:0}.tl-section-handle[data-edge=start]{margin-left:0}.tl-section-handle[data-edge=end]{margin-left:-5px}.tl-section-handle:hover{background:#ffffff40}.tl-tick{pointer-events:none;background:#ffffff38;width:1px;height:26px;position:absolute;top:0}.tl-tick span{color:#999;white-space:nowrap;font-size:10px;position:absolute;top:11px;left:3px}.tl-kfd{background:var(--gui-color-6,#e9b23a);box-sizing:border-box;cursor:pointer;z-index:2;border:1px solid #0000008c;width:9px;height:9px;position:absolute;top:50%;transform:translate(-50%,-50%)rotate(45deg)}.tl-kfd:hover,.tl-kfd.tl-active{background:#fff}#timeline-panel .gui_root .tl-body .tl-tracks-rest{overflow-anchor:none;border-top:1px solid #ffffff14;flex-direction:column;flex:auto;gap:2px;min-height:0;padding-top:2px;display:flex;overflow-y:auto}.tl-track,.gui_root .tl-body .tl-track.tl-track-header{flex:none;height:22px;display:flex}.tl-secline{pointer-events:none;background:#ffffff12;width:1px;height:22px;position:absolute;top:0}.tl-curve{pointer-events:none;width:calc(100% - 4px);height:calc(100% - 4px);position:absolute;inset:2px}.tl-curve polyline{fill:none;stroke:var(--gui-color-6,#4af);stroke-opacity:.65;stroke-width:1.5px;vector-effect:non-scaling-stroke}.tl-marker{cursor:pointer;box-sizing:border-box;background:#e9b23a;border:1px solid #0000008c;width:9px;height:9px;position:absolute;top:50%;transform:translate(-50%,-50%)rotate(45deg)}.tl-marker:hover{background:#ffd76e}.tl-marker.tl-sel{background:#fff;border-color:#e9b23a}.tl-marker.tl-eased{border-color:#7fd8c8}.tl-empty{color:#666;padding:10px;font-size:11px}.tl-playhead{pointer-events:none;z-index:5;background:#ff3b3b;width:2px;height:22px;margin-left:-1px;position:absolute;top:0;box-shadow:0 0 4px #ff2828cc}.tl-playhead-ruler{height:26px}.tl-playhead-snapped{box-shadow:none;z-index:4;background:#888}.tl-playhead i{border-top:7px solid #ff3b3b;border-left:5px solid #0000;border-right:5px solid #0000;position:absolute;top:0;left:50%;transform:translate(-50%)}#timeline-panel .gui_root.gui_panel>.tl-selrow,#timeline-panel .gui_root.gui_panel>.tl-sections,#timeline-panel .gui_root.gui_panel .tl-selrow-actions{flex:none;align-items:center}.tl-selname{color:#ddd;white-space:nowrap;min-width:110px;font-size:11px}.tl-selname span{color:#888}.tl-easelabel{color:#888;font-size:10px}
