body,html{margin:0;padding:0;width:100%;height:100%;overflow:hidden;font-family:-apple-system,sans-serif;color:#000;touch-action:none}#app{width:100%;height:100%;position:relative}canvas{display:block;cursor:crosshair}canvas.orbit-mode{cursor:grab!important}canvas.orbit-mode:active{cursor:grabbing!important}.ui-overlay{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10}.ui-overlay>*{pointer-events:all}.logo{position:fixed;top:0;left:0;font-size:10px;color:#ffffff46;display:flex;padding:4px}.toolbar-left{position:fixed;top:32px;left:0;max-width:320px}.toolbar-right{position:fixed;top:0;right:0;max-width:320px}.toolbar-shader{position:fixed;right:180px;top:0;max-width:320px;max-height:calc(100vh - 40px);overflow-y:auto;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1000}.toolbar-audio{position:fixed;right:380px;top:0;max-width:320px;max-height:calc(100vh - 40px);overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000}.tool-section{background:#1414141a;border:0px solid rgba(50,89,107,.05);border-radius:0;padding:0;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);max-height:90vh;overflow-y:auto}.tool-section.collapsed .section-content{display:none}.section-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;margin-bottom:4px;padding:2px;border-radius:2px;transition:background .2s}.section-header:hover{background:#ffffff0d}.section-title{font-size:9px;font-weight:500;letter-spacing:3px;text-transform:uppercase;padding:2px;color:#aaa}.section-toggle{font-size:8px;color:#4e4e4e63}.section-content{display:flex;flex-direction:column;gap:4px}.control-group{display:flex;flex-direction:column;gap:2px}.control-label{font-size:8px;color:#888;text-transform:uppercase;letter-spacing:.3px}.control-input{display:flex;gap:4px;align-items:center}.slider{flex:1;height:3px;background:#ffffff1f;border-radius:0;outline:none}.slider::-webkit-slider-thumb{-webkit-appearance:none;width:4px;height:10px;background:#50ebff;border-radius:0;cursor:pointer}.slider::-moz-range-thumb{width:8px;height:10px;background:linear-gradient(0deg,#0000,#0009,#eafdff,#0000,#0000);border-radius:0;cursor:pointer;border:none}.slider-value{min-width:30px;font-size:8px;color:#aaa;font-family:monospace}.btn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}.tool-btn{background:#28282833;color:#515151;border:1px solid rgba(255,255,255,.061);border-radius:1px;padding:3px 5px;font-size:8px;cursor:pointer;transition:all .2s;text-transform:uppercase;letter-spacing:.3px;font-weight:500}.tool-btn:hover{background:#3c3c3ccc;border-color:#ffffff4d;color:#fff}.tool-btn.active{background:#cbf0ff2f;border-color:#83e2ff85;color:#fff}.color-swatch{width:24px;height:24px;border:2px solid rgba(255,255,255,.3);border-radius:3px;cursor:pointer;transition:all .2s}.color-swatch:hover{border-color:#fff9;transform:scale(1.05)}.color-picker{position:fixed;width:250px;height:250px;z-index:30;visibility:hidden;opacity:0;transition:opacity .2s}.color-picker.visible{visibility:visible;opacity:1}.color-picker canvas{position:absolute;cursor:pointer}#hue-selector,#luminosity-selector{position:absolute;border:2px solid rgba(0,0,0,.5);border-radius:50%;pointer-events:none;box-shadow:0 0 0 2px #fffc;width:15px;height:15px}.footer{position:fixed;bottom:8px;right:8px;font-size:9px;color:#424242;background:#0000001a;padding:4px 8px;border-radius:3px;opacity:.8}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#0003}::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}select{background:#28282899;color:#aaa;border:1px solid rgba(255,255,255,.15);border-radius:3px;padding:4px 6px;font-size:10px;cursor:pointer;outline:none}select:hover{border-color:#ffffff4d}input[type=file]{display:none}.preset-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:4px}.preset-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3px}.footer{position:fixed;bottom:4px;right:4px;font-size:8px;color:#424242;background:#0000001a;padding:3px 6px;border-radius:3px;opacity:.8;z-index:900;font-family:monospace}.footer a{color:#666;text-decoration:none}.footer a:hover{color:#999}.backgrounds-list::-webkit-scrollbar{width:4px}.backgrounds-list::-webkit-scrollbar-track{background:#0003}.backgrounds-list::-webkit-scrollbar-thumb{background:#fff3;border-radius:2px}