:root{--bg-base: #0f1219;--bg-surface: #1a1f2e;--bg-elevated: #242b3d;--bg-hover: #2e3650;--text-primary: #e8e0f0;--text-secondary: #8b8aa0;--text-muted: #5a596e;--accent: #e234ab;--accent-secondary: #7c3aed;--accent-glow: rgba(226, 52, 171, .3);--accent-glow-strong: rgba(226, 52, 171, .5);--border: rgba(255, 255, 255, .08);--border-focus: var(--accent);--font-brand: "Comfortaa", cursive;--font-body: "Space Grotesk", sans-serif;--font-mono: "JetBrains Mono", monospace;--drawer-collapsed-height: 56px;--drawer-handle-height: 28px;--drawer-max-height: 75vh;--drawer-radius: 20px 20px 0 0;--panel-collapsed-width: 48px;--panel-expanded-width: 288px;--panel-radius: 16px;--transition-panel: .35s var(--ease-out-expo);--ease-out-expo: cubic-bezier(.16, 1, .3, 1);--transition-fast: .15s ease;--transition-drawer: .4s var(--ease-out-expo)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-base);color:var(--text-primary);font-family:var(--font-body);font-size:14px;line-height:1.5;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--accent);text-decoration:none}a:hover{color:var(--text-primary)}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;background:var(--bg-elevated);outline:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 0 10px var(--accent-glow);transition:transform var(--transition-fast),box-shadow var(--transition-fast)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.25);box-shadow:0 0 16px var(--accent-glow-strong)}input[type=range]::-moz-range-thumb{width:18px;height:18px;border:none;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 0 10px var(--accent-glow)}input[type=number]{background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);font-family:var(--font-mono);font-size:13px;padding:7px 10px;width:100%;outline:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}input[type=number]:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-glow)}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}select{background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);font-family:var(--font-body);font-size:13px;padding:7px 10px;width:100%;outline:none;cursor:pointer;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}select:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-glow)}select option{background:var(--bg-surface);color:var(--text-primary)}input[type=file]{font-family:var(--font-body);font-size:13px;color:var(--text-secondary);cursor:pointer}input[type=file]::file-selector-button{background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);font-family:var(--font-body);font-size:13px;padding:6px 14px;margin-right:10px;cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast)}input[type=file]::file-selector-button:hover{background:var(--bg-hover);border-color:var(--accent)}.toggle{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.toggle input{position:absolute;opacity:0;width:0;height:0}.toggle__track{width:40px;height:22px;border-radius:11px;background:var(--bg-elevated);border:1px solid var(--border);position:relative;transition:background var(--transition-fast),border-color var(--transition-fast);flex-shrink:0}.toggle__track:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--text-muted);transition:transform .2s var(--ease-out-expo),background var(--transition-fast)}.toggle input:checked+.toggle__track{background:var(--accent);border-color:var(--accent)}.toggle input:checked+.toggle__track:after{transform:translate(18px);background:#fff}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;border-radius:10px;border:1px solid var(--border);background:var(--bg-elevated);color:var(--text-primary);font-family:var(--font-body);font-size:13px;font-weight:500;cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast)}.btn:hover{background:var(--bg-hover);border-color:var(--accent)}.btn--accent{background:var(--accent);border-color:var(--accent);color:#fff}.btn--accent:hover{background:#c92d96;box-shadow:0 0 16px var(--accent-glow)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.canvas-wrapper[data-v-7ba07930]{position:absolute;top:0;left:0;width:100vw;height:100vh}.canvas-loading[data-v-7ba07930]{display:flex;align-items:center;justify-content:center;position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;pointer-events:none}.canvas-spinner[data-v-7ba07930]{width:40px;height:40px;border:3px solid var(--bg-elevated);border-top-color:var(--accent);border-radius:50%;animation:spin-7ba07930 .8s linear infinite}@keyframes spin-7ba07930{to{transform:rotate(360deg)}}.canvas-sketch[data-v-7ba07930]{width:100%;height:100%}.drawer[data-v-ab0b0b13]{position:fixed;bottom:0;left:0;right:0;z-index:1000;background:var(--bg-surface);border-radius:var(--drawer-radius);box-shadow:0 -4px 40px #0009;overflow:hidden;transition:height .4s cubic-bezier(.16,1,.3,1)}.drawer--dragging[data-v-ab0b0b13]{transition:none}.drawer--expanded[data-v-ab0b0b13]{overflow-y:auto}.drawer__header[data-v-ab0b0b13]{cursor:grab;-webkit-user-select:none;user-select:none}.drawer__header[data-v-ab0b0b13]:active{cursor:grabbing}.drawer__handle[data-v-ab0b0b13]{display:flex;justify-content:center;padding:14px 0 8px}.drawer__handle-bar[data-v-ab0b0b13]{width:44px;height:5px;border-radius:3px;background:var(--text-muted);transition:background var(--transition-fast)}.drawer__summary[data-v-ab0b0b13]{display:flex;align-items:center;justify-content:space-between;padding:2px 20px 14px;cursor:pointer}.drawer__mode-badge[data-v-ab0b0b13]{background:#e234ab1f;color:var(--accent);padding:6px 18px;border-radius:20px;font-family:var(--font-brand);font-size:14px;font-weight:700;border:1px solid rgba(226,52,171,.2)}.drawer__quick-actions[data-v-ab0b0b13]{display:flex;gap:8px}.drawer__icon-btn[data-v-ab0b0b13]{padding:6px 10px;color:var(--text-secondary)}.drawer__icon-btn[data-v-ab0b0b13]:hover{color:var(--accent)}.drawer__content[data-v-ab0b0b13]{padding:4px 20px 32px}.drawer__section[data-v-ab0b0b13]{margin-bottom:20px}.drawer__section-title[data-v-ab0b0b13]{font-family:var(--font-brand);font-size:10px;text-transform:uppercase;letter-spacing:2px;color:var(--text-muted);margin-bottom:10px}.drawer__section--action[data-v-ab0b0b13]{margin-bottom:0}.mode-grid[data-v-ab0b0b13]{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}@media(max-width:420px){.mode-grid[data-v-ab0b0b13]{grid-template-columns:repeat(2,1fr)}}.mode-chip[data-v-ab0b0b13]{display:flex;flex-direction:column;align-items:center;padding:10px 6px 8px;border-radius:12px;border:1px solid var(--border);background:var(--bg-elevated);color:var(--text-secondary);cursor:pointer;transition:all .2s ease;font-family:var(--font-body)}.mode-chip[data-v-ab0b0b13]:hover{border-color:#e234ab4d;background:#e234ab0f}.mode-chip--active[data-v-ab0b0b13]{border-color:var(--accent);background:#e234ab1a;color:var(--text-primary);box-shadow:0 0 20px #e234ab26}.mode-chip__icon[data-v-ab0b0b13]{font-family:var(--font-mono);font-size:14px;margin-bottom:2px;color:var(--accent)}.mode-chip__name[data-v-ab0b0b13]{font-size:12px;font-weight:600}.mode-chip__desc[data-v-ab0b0b13]{font-size:10px;color:var(--text-muted);margin-top:1px}.control-row[data-v-ab0b0b13]{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}.control-group[data-v-ab0b0b13]{flex:1}.control-group label[data-v-ab0b0b13]{display:block;font-size:11px;color:var(--text-muted);margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}.control-group--slider[data-v-ab0b0b13]{flex:1}.slider-with-value[data-v-ab0b0b13]{display:flex;align-items:center;gap:12px}.slider-with-value input[type=range][data-v-ab0b0b13]{flex:1}.control-value[data-v-ab0b0b13]{font-family:var(--font-mono);font-size:13px;color:var(--accent);min-width:36px;text-align:right}.toggle__label[data-v-ab0b0b13]{font-size:13px;color:var(--text-secondary)}.blend-modes[data-v-ab0b0b13]{display:flex;flex-wrap:wrap;gap:6px}.blend-pill[data-v-ab0b0b13]{padding:5px 12px;border-radius:20px;border:1px solid var(--border);background:var(--bg-elevated);color:var(--text-secondary);font-family:var(--font-body);font-size:11px;font-weight:500;cursor:pointer;transition:all .15s ease;text-transform:uppercase;letter-spacing:.5px}.blend-pill[data-v-ab0b0b13]:hover{border-color:#e234ab4d;color:var(--text-primary)}.blend-pill--active[data-v-ab0b0b13]{border-color:var(--accent);background:#e234ab1a;color:var(--accent)}.btn--full[data-v-ab0b0b13]{width:100%;padding:12px;font-size:14px;font-weight:600}.is-desktop[data-v-ab0b0b13]{bottom:auto;right:auto;top:0;left:0;width:var(--panel-expanded-width);height:100vh;border-radius:0 var(--panel-radius) var(--panel-radius) 0;box-shadow:4px 0 40px #0009;display:flex;flex-direction:row;transition:width var(--transition-panel)}.is-desktop.panel--collapsed[data-v-ab0b0b13]{width:var(--panel-collapsed-width)}.panel__strip[data-v-ab0b0b13]{width:var(--panel-collapsed-width);flex-shrink:0;display:flex;flex-direction:column;align-items:center;padding:16px 0;gap:12px;border-right:1px solid var(--border)}.panel__toggle[data-v-ab0b0b13]{background:transparent;border:none;padding:8px;border-radius:8px;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color var(--transition-fast),background var(--transition-fast)}.panel__toggle[data-v-ab0b0b13]:hover{color:var(--accent);background:#e234ab14}.panel__toggle-icon[data-v-ab0b0b13]{transition:transform var(--transition-panel);display:block}.is-desktop:not(.panel--collapsed) .panel__toggle-icon[data-v-ab0b0b13]{transform:rotate(180deg)}.panel__strip-btn[data-v-ab0b0b13]{padding:8px;border:none;background:transparent;color:var(--text-secondary)}.panel__strip-btn[data-v-ab0b0b13]:hover{color:var(--accent);background:#e234ab14}.is-desktop .drawer__content[data-v-ab0b0b13]{flex:1;min-width:0;overflow-y:auto;overflow-x:hidden;padding:16px 16px 32px;transition:opacity .2s ease,visibility .2s ease}.is-desktop.panel--collapsed .drawer__content[data-v-ab0b0b13]{opacity:0;visibility:hidden;pointer-events:none}.app-layout[data-v-ee5fccd5]{position:relative;width:100vw;height:100vh;overflow:hidden}.app-header[data-v-ee5fccd5]{position:fixed;top:0;right:0;z-index:100;display:flex;justify-content:flex-end;align-items:center;padding:14px 20px;pointer-events:none}.app-header[data-v-ee5fccd5]>*{pointer-events:auto}.app-about-link[data-v-ee5fccd5]{width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;color:var(--text-secondary);font-size:14px;font-weight:500;transition:border-color .2s,color .2s;background:#0f121980}.app-about-link[data-v-ee5fccd5]:hover{border-color:var(--accent);color:var(--accent)}