*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--ds-bg: #0a0a08;--ds-panel: #131310;--ds-border: #222218;--ds-accent: #e8a435;--ds-accent-dim:#8c5e15;--ds-text: #f0ead8;--ds-muted: #8a8470;--ds-glow: rgba(232, 164, 53, .07);--ds-radius: 6px;--ds-sidebar-w: 240px}html,body,#root{height:100%;background:var(--ds-bg);color:var(--ds-text);font-family:SF Pro Text,Segoe UI,system-ui,sans-serif;font-size:13px;-webkit-font-smoothing:antialiased}.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:#f0bb5c}.ds-val{font-size:11px;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:inherit;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:#f0bb5c}.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;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:#0a0a08e0;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:#ffffff12}.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:#0a0a08b3;color:var(--ds-text);border:1px solid rgba(255,255,255,.14);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:#0a0a08e6;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;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:inherit;font-size:11px;outline:none}.ds-export-variant-tag{font-size:11px;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:#f0bb5c}.ds-export-btn:disabled{opacity:.4;cursor:not-allowed}