:root{color-scheme:light;--atelier-background: #f5efe3;--atelier-surface: #ebe3d2;--atelier-surface-2: #ddd3bd;--atelier-surface-3: #d2c6ad;--atelier-border: #c8bba0;--atelier-border-faint: #d8cdb8;--atelier-accent: #34d399;--atelier-accent-dim: rgba(52, 211, 153, .22);--atelier-accent-glow: rgba(52, 211, 153, .1);--atelier-text: #2a2520;--atelier-text-sub: #4a4239;--atelier-text-muted: #6b6358;--atelier-text-dim: #9c9385;--atelier-success: #168a5b;--atelier-warning: #b96312;--atelier-error: #b43b36;--atelier-font-sans: "DM Sans", system-ui, sans-serif;--atelier-font-display: "Syne", system-ui, sans-serif;--atelier-font-mono: "IBM Plex Mono", ui-monospace, monospace;--atelier-space-1: 4px;--atelier-space-2: 8px;--atelier-space-3: 12px;--atelier-space-4: 16px;--atelier-space-5: 24px;--atelier-space-6: 32px;--atelier-radius-sm: 3px;--atelier-radius-md: 6px;--atelier-radius-lg: 8px;--atelier-text-xs: 10px;--atelier-text-sm: 12px;--atelier-text-md: 14px;--atelier-text-lg: 18px;--atelier-ease: .2s ease}:root.dark,:root[data-atelier-mode=dark]{color-scheme:dark;--atelier-background: #0c0b09;--atelier-surface: #141210;--atelier-surface-2: #1c1a17;--atelier-surface-3: #24211d;--atelier-border: #2a2720;--atelier-border-faint: #1f1d17;--atelier-accent-dim: rgba(52, 211, 153, .18);--atelier-accent-glow: rgba(52, 211, 153, .07);--atelier-text: #e2d9ce;--atelier-text-sub: #b5ab9d;--atelier-text-muted: #8a8070;--atelier-text-dim: #3e3a33;--atelier-success: #34d399;--atelier-warning: #d97706;--atelier-error: #ef6a62}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--ds-bg: var(--atelier-background);--ds-panel: var(--atelier-surface);--ds-raised: var(--atelier-surface-2);--ds-border: var(--atelier-border);--ds-accent: var(--atelier-accent);--ds-accent-dim:var(--atelier-success);--ds-accent-hover: var(--atelier-success);--ds-text: var(--atelier-text);--ds-muted: var(--atelier-text-muted);--ds-glow: var(--atelier-accent-glow);--ds-overlay: rgba(245, 239, 227, .88);--ds-overlay-strong: rgba(235, 227, 210, .94);--ds-radius: var(--atelier-radius-md);--ds-sidebar-w: 240px}:root.dark,:root[data-atelier-mode=dark]{--ds-overlay: rgba(12, 11, 9, .88);--ds-overlay-strong: rgba(12, 11, 9, .94)}html,body,#root{height:100%;background:var(--ds-bg);color:var(--ds-text);font-family:var(--atelier-font-sans);font-size:13px;-webkit-font-smoothing:antialiased;transition:background-color var(--atelier-ease),color var(--atelier-ease)}button,input,select{font:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--ds-accent);outline-offset:2px}.ds-shell{display:flex;height:100vh;overflow:hidden}.ds-sidebar{width:var(--ds-sidebar-w);flex-shrink:0;background:var(--ds-panel);border-right:1px solid var(--ds-border);display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--ds-border) transparent}.ds-brand{display:flex;align-items:center;gap:10px;padding:16px 14px 12px;border-bottom:1px solid var(--ds-border);flex-shrink:0}.ds-brand-glyph{font-size:22px;color:var(--ds-accent);line-height:1}.ds-brand-name{font-size:13px;font-weight:600;letter-spacing:.02em}.ds-brand-sub{font-size:10px;color:var(--ds-muted);letter-spacing:.04em;text-transform:uppercase;margin-top:1px}.ds-section{padding:12px 14px;border-bottom:1px solid var(--ds-border)}.ds-section--glow,.ds-section--reference{background:var(--ds-glow)}.ds-section-title{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--ds-muted);margin-bottom:10px}.ds-reference-row{display:flex;align-items:center;gap:10px}.ds-reference-thumb{width:44px;height:44px;object-fit:cover;border-radius:4px;border:1px solid var(--ds-border);flex-shrink:0}.ds-field{display:flex;flex-direction:column;gap:4px;margin-bottom:9px}.ds-field:last-child{margin-bottom:0}.ds-label{font-size:11px;color:var(--ds-muted)}.ds-slider-row{display:flex;align-items:center;gap:8px}.ds-range{flex:1;-webkit-appearance:none;height:3px;background:var(--ds-border);border-radius:2px;outline:none;cursor:pointer}.ds-range::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--ds-accent);cursor:pointer;transition:background .15s}.ds-range:hover::-webkit-slider-thumb{background:var(--ds-accent-hover)}.ds-val{font-size:11px;font-family:var(--atelier-font-mono);color:var(--ds-text);min-width:40px;text-align:right;font-variant-numeric:tabular-nums}.ds-val-input{width:40px;flex-shrink:0;padding:2px 4px;border:1px solid transparent;border-radius:4px;background:transparent;font-family:var(--atelier-font-mono);outline:none;transition:border-color .12s,background .12s}.ds-val-input:hover{border-color:var(--ds-border)}.ds-val-input:focus{border-color:var(--ds-accent-dim);background:var(--ds-panel)}.ds-val-input::-webkit-outer-spin-button,.ds-val-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.ds-mode-row{display:flex;gap:4px}.ds-mode-btn{flex:1;padding:4px 6px;border-radius:var(--ds-radius);border:1px solid var(--ds-border);background:transparent;color:var(--ds-muted);font-size:10px;font-family:inherit;cursor:pointer;transition:background .12s,color .12s;text-transform:uppercase;letter-spacing:.05em}.ds-mode-btn--active{background:var(--ds-accent);border-color:var(--ds-accent);color:#000;font-weight:600}.ds-mode-btn:not(.ds-mode-btn--active):hover{border-color:var(--ds-accent-dim);color:var(--ds-text)}.ds-select{width:100%;padding:6px 8px;font-size:11px;font-family:inherit;color:var(--ds-text);background:var(--ds-panel);border:1px solid var(--ds-border);border-radius:var(--ds-radius);cursor:pointer;outline:none;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ds-muted) 50%),linear-gradient(135deg,var(--ds-muted) 50%,transparent 50%);background-position:calc(100% - 14px) center,calc(100% - 9px) center;background-size:5px 5px,5px 5px;background-repeat:no-repeat;transition:border-color .12s}.ds-select:hover{border-color:var(--ds-accent-dim)}.ds-select:focus{border-color:var(--ds-accent)}.ds-select option{background:var(--ds-panel);color:var(--ds-text)}.ds-hint{font-size:10px;color:var(--ds-muted);line-height:1.4;margin:6px 0 2px}.ds-checkbox-row{display:flex;align-items:center;gap:6px;cursor:pointer;margin-top:6px}.ds-checkbox-row input{accent-color:var(--ds-accent)}.ds-btn{width:100%;padding:9px 12px;border-radius:var(--ds-radius);border:none;font-size:12px;font-weight:600;cursor:pointer;transition:background .15s,opacity .15s;letter-spacing:.02em;font-family:inherit}.ds-btn:disabled{opacity:.45;cursor:not-allowed}.ds-btn--primary{background:var(--ds-accent);color:#000}.ds-btn--primary:hover:not(:disabled){background:var(--ds-accent-hover)}.ds-btn--ghost{background:transparent;color:var(--ds-muted);border:1px solid var(--ds-border);font-weight:400}.ds-btn--ghost:hover:not(:disabled){border-color:var(--ds-accent-dim);color:var(--ds-text)}.ds-btn--sm{padding:5px 10px;font-size:11px;margin-top:6px;width:auto}.ds-progress{position:relative;height:28px;background:var(--ds-border);border-radius:var(--ds-radius);overflow:hidden}.ds-progress-bar{position:absolute;inset:0 auto 0 0;background:var(--ds-accent);transition:width .1s linear}.ds-progress-label{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:#000;mix-blend-mode:multiply}.ds-resolve-done{font-size:11px;color:var(--ds-accent);text-align:center;margin-top:8px}.ds-stop-editor{display:flex;flex-direction:column;gap:8px}.ds-stop-swatches{display:flex;flex-wrap:wrap;gap:6px}.ds-swatch-wrap{display:flex;flex-direction:column;align-items:center;gap:3px}.ds-swatch{width:28px;height:28px;border-radius:4px;border:1px solid var(--ds-border);cursor:pointer;transition:transform .12s}.ds-swatch:hover{transform:scale(1.12);border-color:var(--ds-accent)}.ds-swatch-count{font-size:9px;font-family:var(--atelier-font-mono);color:var(--ds-muted);font-variant-numeric:tabular-nums}.ds-swatch-picker{display:none}.ds-stop-actions{display:flex;flex-direction:column;gap:6px;margin-top:2px}.ds-main{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--ds-bg)}.ds-canvas-area{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;padding:16px}.ds-dot-wrap{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.ds-dot-inner{position:absolute;top:0;left:0;transform-origin:0 0;will-change:transform;line-height:0}.ds-dot-canvas{display:block;image-rendering:auto}.ds-navigator{position:absolute;bottom:12px;left:12px;background:var(--ds-overlay);border:1px solid var(--ds-border);border-radius:var(--ds-radius);overflow:hidden;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);-webkit-user-select:none;user-select:none;z-index:10}.ds-navigator-canvas{display:block;width:180px;cursor:crosshair}.ds-navigator-bar{display:flex;align-items:center;padding:3px 5px;border-top:1px solid var(--ds-border);gap:1px}.ds-nav-btn{background:none;border:none;color:var(--ds-muted);font-size:14px;cursor:pointer;padding:4px 8px;border-radius:4px;line-height:1;font-family:inherit;transition:color .12s,background .12s}.ds-nav-btn:hover{color:var(--ds-text);background:var(--ds-raised)}.ds-nav-sep{width:1px;height:14px;background:var(--ds-border);margin:0 3px;flex-shrink:0}.ds-nav-fit{font-size:12px;letter-spacing:0}.ds-canvas-replace{position:absolute;top:12px;right:12px;padding:6px 12px;font-size:11px;font-family:inherit;letter-spacing:.04em;background:var(--ds-overlay);color:var(--ds-text);border:1px solid var(--ds-border);border-radius:999px;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:background .15s,border-color .15s}.ds-canvas-replace:hover{background:var(--ds-overlay-strong);border-color:var(--ds-accent-dim)}.ds-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;max-width:480px;aspect-ratio:4/3;border:2px dashed var(--ds-accent-dim);border-radius:12px;cursor:pointer;transition:border-color .2s,background .2s;padding:40px;text-align:center}.ds-dropzone--drag,.ds-dropzone:hover{border-color:var(--ds-accent);background:var(--ds-glow)}.ds-dropzone-input{display:none}.ds-dropzone-icon{font-size:48px;color:var(--ds-accent-dim);line-height:1;transition:color .2s}.ds-dropzone:hover .ds-dropzone-icon,.ds-dropzone--drag .ds-dropzone-icon{color:var(--ds-accent)}.ds-dropzone-title{font-size:16px;font-weight:600;color:var(--ds-text)}.ds-dropzone-sub{font-size:12px;color:var(--ds-muted);line-height:1.6}.ds-export-panel{flex-shrink:0;border-top:1px solid var(--ds-border);background:var(--ds-panel);padding:10px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.ds-export-info{display:flex;align-items:center;gap:6px;font-size:11px;font-family:var(--atelier-font-mono);color:var(--ds-muted);font-variant-numeric:tabular-nums}.ds-export-sep{color:var(--ds-border)}.ds-export-variant{width:72px;padding:4px 8px;border:1px solid var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-panel);color:var(--ds-text);font-family:var(--atelier-font-mono);font-size:11px;outline:none}.ds-export-variant-tag{font-size:11px;font-family:var(--atelier-font-mono);font-weight:600;color:var(--ds-accent);font-variant-numeric:tabular-nums;padding:3px 8px;border:1px solid var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-panel)}.ds-export-mask-toggle{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--ds-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.ds-export-mask-toggle input{accent-color:var(--ds-accent)}.ds-export-actions{display:flex;gap:8px}.ds-export-btn{padding:7px 14px;border-radius:var(--ds-radius);border:1px solid var(--ds-accent-dim);background:transparent;color:var(--ds-accent);font-size:12px;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s,border-color .15s;white-space:nowrap}.ds-export-btn:hover:not(:disabled){background:var(--ds-accent);border-color:var(--ds-accent);color:#000}.ds-export-btn--hi{background:var(--ds-accent);border-color:var(--ds-accent);color:#000}.ds-export-btn--hi:hover:not(:disabled){background:var(--ds-accent-hover)}.ds-export-btn:disabled{opacity:.4;cursor:not-allowed}