:root{--bg-primary:#0d0d1a;--bg-secondary:#141428;--bg-tertiary:#1a1a35;--bg-surface:#1e1e3a;--bg-elevated:#252550;--panel-bg:#141432d9;--panel-bg-hover:#1e1e3cf2;--panel-border:#6464ff14;--panel-border-hover:#6464ff26;--panel-blur:12px;--panel-radius:8px;--panel-radius-sm:4px;--accent-blue:#00d4ff;--accent-purple:#a855f7;--accent-green:#22c55e;--accent-red:#ff6b6b;--accent-orange:#ff9f43;--accent-yellow:#fbbf24;--accent-blue-10:#00d4ff1a;--accent-blue-20:#00d4ff33;--accent-blue-30:#00d4ff4d;--accent-purple-10:#a855f71a;--accent-purple-20:#a855f733;--text-primary:#e8e8f0;--text-secondary:#9898b0;--text-muted:#606080;--text-accent:var(--accent-blue);--text-inverse:#0d0d1a;--hover-bg:#ffffff0f;--active-bg:var(--accent-blue-20);--focus-ring:var(--accent-blue);--selected-bg:var(--accent-blue-10);--shadow-sm:0 1px 3px #0006;--shadow-md:0 4px 12px #00000080;--shadow-lg:0 8px 32px #0009;--shadow-glow-blue:0 0 20px #00d4ff26;--font-ui:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", "Fira Code", "Cascadia Code", monospace;--font-size-xs:10px;--font-size-sm:11px;--font-size-md:12px;--font-size-lg:13px;--font-size-xl:14px;--space-1:2px;--space-2:4px;--space-3:6px;--space-4:8px;--space-5:12px;--space-6:16px;--space-7:20px;--space-8:24px;--top-menu-h:32px;--tab-bar-h:30px;--toolbar-w:44px;--right-panel-w:220px;--timeline-h:220px;--timeline-h-min:140px;--timeline-h-max:50vh;--timeline-label-w:168px;--timeline-cell:26px;--status-bar-h:24px;--transition-fast:.12s ease;--transition-base:.2s ease;--transition-slow:.35s ease;--z-canvas:1;--z-overlay:10;--z-toolbar:100;--z-panel:100;--z-menu:200;--z-modal:500;--z-tooltip:600}body{grid-template-rows:var(--top-menu-h) var(--tab-bar-h) 36px 1fr var(--timeline-h) var(--status-bar-h);grid-template-columns:1fr;grid-template-areas:"topmenu""tabbar""toolbar-ctx""editor""timeline""statusbar";height:100vh;display:grid;overflow:hidden}.tool-bar{align-items:center;gap:var(--space-3);padding:0 var(--space-4);background:var(--bg-secondary);border-bottom:1px solid var(--panel-border);z-index:var(--z-menu);-webkit-user-select:none;user-select:none;white-space:nowrap;grid-area:toolbar-ctx;display:flex;overflow:auto hidden}.tool-bar__separator{background:var(--panel-border);flex-shrink:0;width:1px;height:20px}.tool-bar__spacer{flex:1}.tool-bar__field{align-items:center;gap:var(--space-2);flex-shrink:0;display:flex}.tool-bar__field--right{margin-left:auto}.tool-bar__label{font-family:var(--font-ui);font-size:var(--font-size-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.4px;font-weight:500}#tool-bar-active-name{color:var(--accent-blue);min-width:60px;font-weight:600}.tool-bar__slider{width:100px;accent-color:var(--accent-blue);cursor:pointer}.tool-bar__number{background:var(--bg-primary);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);width:52px;color:var(--text-primary);font-family:var(--font-mono);font-size:var(--font-size-xs);text-align:center;transition:border-color var(--transition-fast);outline:none;padding:3px 6px}.tool-bar__number:hover,.tool-bar__number:focus{border-color:var(--accent-blue)}.tool-bar__number::-webkit-inner-spin-button{opacity:.5}.tool-bar__number::-webkit-outer-spin-button{opacity:.5}.tool-bar__unit{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--text-muted);margin-left:-4px}.tool-bar__select{background:var(--bg-primary);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);color:var(--text-primary);font-size:var(--font-size-xs);cursor:pointer;outline:none;padding:3px 8px}.tool-bar__select:focus{border-color:var(--accent-blue)}.tool-bar__check{align-items:center;gap:var(--space-2);cursor:pointer;font-family:var(--font-ui);font-size:var(--font-size-xs);color:var(--text-secondary);text-transform:none;letter-spacing:0;display:flex}.tool-bar__check input{accent-color:var(--accent-blue);cursor:pointer}.tool-bar__badge{color:var(--accent-blue);font-family:var(--font-mono);font-size:var(--font-size-xs);background:#00d4ff26;border:1px solid #00d4ff4d;border-radius:10px;padding:2px 8px}.symmetry-toggle{background:var(--bg-primary);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);align-items:center;gap:1px;padding:2px;display:flex}.symmetry-toggle__btn{border-radius:calc(var(--panel-radius-sm) - 2px);width:26px;height:24px;color:var(--text-muted);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex}.symmetry-toggle__btn:hover{color:var(--text-secondary);background:#ffffff0f}.symmetry-toggle__btn--active{color:var(--accent-blue);background:#00d4ff26}.symmetry-toggle__btn--active:hover{color:var(--accent-blue);background:#00d4ff38}.tab-bar{min-height:var(--tab-bar-h);background:var(--bg-secondary);border-bottom:1px solid var(--panel-border);z-index:var(--z-menu);grid-area:tabbar;align-items:stretch;display:flex;overflow:hidden}.tab-bar__tabs{scrollbar-width:thin;flex:1;min-width:0;display:flex;overflow:auto hidden}.tab-bar__tabs::-webkit-scrollbar{height:4px}.tab-bar__tab{border-right:1px solid var(--panel-border);min-width:80px;max-width:180px;height:100%;color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;flex:none;align-items:center;gap:6px;padding:0 8px 0 12px;display:flex;position:relative}.tab-bar__tab:hover{background:var(--hover-bg);color:var(--text-secondary)}.tab-bar__tab--active{background:var(--bg-primary);color:var(--text-primary)}.tab-bar__tab--active:after{content:"";background:var(--accent-blue);height:2px;position:absolute;bottom:0;left:0;right:0}.tab-bar__name{text-overflow:ellipsis;white-space:nowrap;font-size:var(--font-size-sm);font-family:var(--font-ui);overflow:hidden}.tab-bar__dirty-dot{color:var(--accent-blue);flex-shrink:0;font-size:8px;display:none}.tab-bar__tab--dirty .tab-bar__dirty-dot{display:inline}.tab-bar__close{width:16px;height:16px;color:inherit;opacity:0;cursor:pointer;background:0 0;border:none;border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;margin-left:auto;font-size:10px;display:flex}.tab-bar__tab:hover .tab-bar__close,.tab-bar__tab--active .tab-bar__close{opacity:.7}.tab-bar__close:hover{opacity:1;background:var(--hover-bg)}.tab-bar__add{width:28px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex-shrink:0;font-size:16px}.tab-bar__add:hover{color:var(--text-primary);background:var(--hover-bg)}.tab-bar__tab--dragging{opacity:.45}.tab-bar__tab--drop-before{box-shadow:inset 2px 0 0 var(--accent-blue)}.tab-bar__tab--drop-after{box-shadow:inset -2px 0 0 var(--accent-blue)}.tab-bar__rename-input{background:var(--bg-primary);border:1px solid var(--accent-blue);width:100%;min-width:60px;color:var(--text-primary);font:inherit;font-size:var(--font-size-sm);outline:none;padding:1px 4px}.top-menu{align-items:center;gap:var(--space-2);padding:0 var(--space-5);background:var(--bg-secondary);border-bottom:1px solid var(--panel-border);z-index:var(--z-menu);-webkit-user-select:none;user-select:none;grid-area:topmenu;display:flex}.top-menu__brand{align-items:center;gap:var(--space-3);margin-right:var(--space-5);display:flex}.top-menu__logo{filter:drop-shadow(0 0 6px #00d4ff4d)}.top-menu__title{font-family:var(--font-ui);font-weight:700;font-size:var(--font-size-lg);color:var(--text-primary);letter-spacing:.5px;background:linear-gradient(135deg, var(--accent-blue), var(--accent-purple));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.top-menu__nav{align-items:center;gap:var(--space-1);display:flex}.top-menu__item{color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--font-size-md);padding:var(--space-2) var(--space-4);border-radius:var(--panel-radius-sm);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;font-weight:500}.top-menu__item:hover{background:var(--hover-bg);color:var(--text-primary)}.top-menu__item:active{background:var(--active-bg);color:var(--accent-blue)}.top-menu__spacer{flex:1}.top-menu__history{align-items:center;gap:var(--space-1);margin-right:var(--space-3);display:flex}.top-menu__history-btn{border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);width:28px;height:28px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0a;justify-content:center;align-items:center;padding:0;display:flex}.top-menu__history-btn:hover:not(:disabled){background:var(--hover-bg);color:var(--text-primary);border-color:var(--panel-border-hover)}.top-menu__history-btn:disabled{opacity:.35;cursor:not-allowed}.top-menu__account{margin-left:var(--space-2);align-items:center;display:flex}.top-menu__auth-btn{background:var(--accent-blue);color:#0a0a14;font-family:var(--font-ui);border-radius:var(--panel-radius-sm);border:none;height:22px;padding:2px 10px;font-size:11px;font-weight:600;line-height:18px}.top-menu__auth-btn:hover{filter:brightness(1.08)}.top-menu__account-btn{border:1px solid var(--accent-purple);background:linear-gradient(135deg, var(--accent-blue), var(--accent-purple));color:#fff;border-radius:50%;width:22px;height:22px;padding:0;font-size:11px;font-weight:700;line-height:20px}.top-menu__account-btn:hover{filter:brightness(1.1)}.editor{grid-area:editor;grid-template-columns:var(--toolbar-w) 1fr var(--right-panel-w);grid-template-rows:1fr;display:grid;overflow:hidden}.toolbar{background:var(--bg-secondary);border-right:1px solid var(--panel-border);padding:var(--space-3) var(--space-2);z-index:var(--z-toolbar);flex-direction:column;display:flex;overflow:hidden auto}.toolbar__tools{align-items:center;gap:var(--space-1);flex-direction:column;display:flex}.toolbar__btn{border-radius:var(--panel-radius-sm);width:32px;height:32px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;display:flex;position:relative}.toolbar__btn:hover{background:var(--hover-bg);color:var(--text-primary);border-color:var(--panel-border-hover)}.toolbar__btn--active{background:var(--active-bg);color:var(--accent-blue);border-color:#00d4ff40;box-shadow:inset 0 0 8px #00d4ff14,0 0 6px #00d4ff1a}.toolbar__btn--active:hover{background:var(--accent-blue-30)}.toolbar__separator{background:var(--panel-border);width:24px;height:1px;margin:var(--space-2) 0}.toolbar__options{gap:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--panel-border);flex-direction:column;margin-top:auto;display:flex}.tool-option{align-items:center;gap:var(--space-1);flex-direction:column;display:flex}.tool-option__label{font-family:var(--font-mono);color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:8px}.tool-option__slider{appearance:none;background:var(--bg-elevated);cursor:pointer;writing-mode:vertical-lr;direction:rtl;border-radius:2px;outline:none;width:32px;height:3px}.tool-option__slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent-blue);cursor:pointer;border-radius:50%;width:10px;height:10px;box-shadow:0 0 6px #00d4ff66}.tool-option__value{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--text-secondary)}.canvas-area{touch-action:none;background:var(--bg-primary);background-image:linear-gradient(45deg,#0a0a18 25%,#0000 25%),linear-gradient(-45deg,#0a0a18 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#0a0a18 75%),linear-gradient(-45deg,#0000 75%,#0a0a18 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;position:relative;overflow:hidden}.canvas-viewport{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.canvas-container{image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;box-shadow:var(--shadow-lg), 0 0 40px #0006;border:1px solid #ffffff0d;position:relative}.main-canvas,.grid-overlay,.preview-overlay,.selection-overlay{image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;position:absolute;top:0;left:0}.main-canvas{z-index:var(--z-canvas);background:#fff}.grid-overlay{z-index:calc(var(--z-canvas) + 1);pointer-events:none}.preview-overlay{z-index:calc(var(--z-canvas) + 2);pointer-events:none}.selection-overlay{z-index:calc(var(--z-canvas) + 3);pointer-events:none}.right-panels{background:var(--bg-secondary);border-left:1px solid var(--panel-border);z-index:var(--z-panel);flex-direction:column;display:flex;overflow:hidden auto}.panel{border-bottom:1px solid var(--panel-border);flex-direction:column;display:flex}.panel__header{padding:var(--space-3) var(--space-4);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background var(--transition-fast);background:#ffffff05;justify-content:space-between;align-items:center;display:flex}.panel__header:hover{background:#ffffff0a}.panel__title{font-family:var(--font-ui);font-size:var(--font-size-sm);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.8px;font-weight:600}.panel__toggle{color:var(--text-muted);cursor:pointer;transition:transform var(--transition-base);background:0 0;border:none;padding:2px;display:flex}.panel--collapsed .panel__toggle{transform:rotate(-90deg)}.panel--collapsed .panel__body,.panel--collapsed .panel__footer{display:none}.panel__body{padding:var(--space-3) var(--space-4);flex:1}.panel__footer{align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-top:1px solid var(--panel-border);display:flex}.panel__action{border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);width:26px;height:26px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0a;justify-content:center;align-items:center;display:flex}.panel__action:hover{background:var(--hover-bg);color:var(--text-primary);border-color:var(--panel-border-hover)}.panel__action--danger:hover{color:var(--accent-red);background:#ff6b6b26;border-color:#ff6b6b4d}.color-picker{gap:var(--space-2);flex-direction:column;display:flex}.color-picker__top{align-items:center;gap:var(--space-2);display:flex}.color-picker__swatches{flex-shrink:0;width:34px;height:34px;position:relative}.color-picker__swatch{cursor:pointer;transition:width var(--transition-fast), height var(--transition-fast), top var(--transition-fast), left var(--transition-fast), bottom var(--transition-fast), right var(--transition-fast), z-index 0s;border:1px solid #00000073;border-radius:2px;position:absolute;box-shadow:0 0 0 1px #ffffff1f}.color-picker__swatch--active{z-index:2;width:26px;height:26px;top:0;left:0}.color-picker__swatch--inactive{z-index:1;width:15px;height:15px;bottom:0;right:0}.color-picker__hex-input{background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);min-width:0;color:var(--text-primary);font-family:var(--font-mono);font-size:var(--font-size-xs);text-transform:uppercase;outline:none;flex:1;padding:4px 8px}.color-picker__hex-input:focus{border-color:var(--accent-blue)}.color-picker__satval{border-radius:var(--panel-radius-sm);border:1px solid var(--panel-border);cursor:crosshair;position:relative;overflow:hidden}.color-picker__satval canvas{width:100%;height:72px;display:block}.color-picker__cursor{pointer-events:none;border:2px solid #fff;border-radius:50%;width:8px;height:8px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 2px #0009}.color-picker__hue-wrap{border-radius:var(--panel-radius-sm);border:1px solid var(--panel-border);cursor:crosshair;position:relative;overflow:hidden}.color-picker__hue-wrap canvas{width:100%;height:8px;display:block}.color-picker__hue-thumb{pointer-events:none;background:#fff;border-radius:1px;width:3px;height:12px;position:absolute;top:-2px;transform:translate(-50%);box-shadow:0 0 2px #00000080}.color-picker__rgb{grid-template-columns:1fr 1fr 1fr;gap:4px;display:grid}.color-picker__num{background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);color:var(--text-secondary);font-family:var(--font-mono);text-align:center;-moz-appearance:textfield;outline:none;width:100%;padding:2px 4px;font-size:10px}.color-picker__num:focus{border-color:var(--accent-blue);color:var(--text-primary)}.color-picker__num::-webkit-inner-spin-button{display:none}.color-picker__num::-webkit-outer-spin-button{display:none}.palette{gap:var(--space-2);margin-top:var(--space-2);flex-direction:column;display:flex}.palette__header{align-items:center;gap:var(--space-2);display:flex}.palette__actions{flex-shrink:0;gap:2px;display:flex}.palette__action{background:var(--bg-elevated);border:1px solid var(--panel-border);color:var(--text-muted);border-radius:var(--panel-radius-sm);cursor:pointer;width:24px;height:24px;transition:all var(--transition-fast);justify-content:center;align-items:center;font-size:12px;display:flex}.palette__action:hover:not(:disabled){background:var(--hover-bg);color:var(--text-primary);border-color:var(--panel-border-hover)}.palette__action:disabled{opacity:.35;cursor:not-allowed}.palette__action--danger:hover:not(:disabled){color:var(--accent-red);background:#ff6b6b26;border-color:#ff6b6b4d}.palette__hint{color:var(--text-muted);opacity:.7;margin:0;font-size:10px}.palette__select{background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);color:var(--text-primary);font-family:var(--font-ui);font-size:var(--font-size-xs);padding:var(--space-2) var(--space-3);cursor:pointer;transition:border-color var(--transition-fast);outline:none;flex:1}.palette__select:focus{border-color:var(--accent-blue)}.palette__grid{grid-template-columns:repeat(8,1fr);gap:2px;display:grid}.palette__swatch{aspect-ratio:1;cursor:pointer;border:1px solid #ffffff0f;border-radius:2px;transition:transform 80ms,border-color 80ms}.palette__swatch:hover{z-index:2;border-color:#ffffff40;transform:scale(1.15)}.recent-colors{margin-top:var(--space-1)}.recent-colors__grid{grid-template-columns:repeat(8,1fr);gap:2px;display:grid}.recent-colors__grid:empty:before{content:"—";color:var(--text-muted);text-align:center;grid-column:1/-1;padding:2px 0;font-size:10px}.timeline{background:var(--bg-secondary);border-top:1px solid var(--panel-border);min-height:0;padding:0 var(--space-4) var(--space-3);z-index:var(--z-toolbar);-webkit-user-select:none;user-select:none;flex-direction:column;grid-area:timeline;display:flex;position:relative}.timeline__resize-handle{height:6px;margin:0 calc(var(--space-4) * -1) var(--space-1);cursor:ns-resize;touch-action:none;background:0 0;flex-shrink:0;position:relative}.timeline__resize-handle:after{content:"";background:var(--text-muted);opacity:.45;width:40px;height:3px;transition:opacity var(--transition-fast), background var(--transition-fast);border-radius:999px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.timeline__resize-handle:hover:after,body.timeline--resizing .timeline__resize-handle:after{opacity:.9;background:var(--accent-blue)}.timeline__controls{align-items:center;gap:var(--space-3);margin-bottom:var(--space-2);padding-top:var(--space-1);flex-shrink:0;display:flex}.timeline__transport{align-items:center;gap:var(--space-1);display:flex}.timeline__btn{border:1px solid var(--panel-border);color:var(--text-secondary);font-size:var(--font-size-xs);border-radius:var(--panel-radius-sm);cursor:pointer;width:24px;height:24px;transition:background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);background:#ffffff0a;justify-content:center;align-items:center;display:flex}.timeline__btn:hover{background:var(--hover-bg);color:var(--text-primary)}.timeline__btn--play{background:var(--accent-blue-20);color:var(--accent-blue);border-color:#00d4ff33}.timeline__btn--play:hover{background:var(--accent-blue-30)}.timeline__btn--playing{color:var(--accent-purple);background:#a855f733;border-color:#a855f759}.timeline__info{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--text-secondary);white-space:nowrap}.timeline__info--clickable{cursor:pointer;border-radius:var(--panel-radius-sm);padding:var(--space-1) var(--space-2);transition:background var(--transition-fast), color var(--transition-fast)}.timeline__info--clickable:hover{background:var(--hover-bg);color:var(--text-primary)}.timeline__fps-popover{min-width:200px}.timeline__fps-apply{align-items:center;gap:var(--space-2);font-family:var(--font-ui);font-size:var(--font-size-xs);color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;display:flex}.timeline__fps-apply-check{accent-color:var(--accent-blue)}.timeline__separator{color:var(--text-muted);font-size:var(--font-size-xs)}.timeline__frame-actions{align-items:center;gap:var(--space-1);flex-shrink:0;display:flex}.timeline__action{border:1px solid var(--panel-border);color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--font-size-xs);height:24px;padding:0 var(--space-2);border-radius:var(--panel-radius-sm);cursor:pointer;white-space:nowrap;transition:background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);background:#ffffff0a}.timeline__action:hover:not(:disabled){background:var(--hover-bg);color:var(--text-primary);border-color:var(--panel-border-hover)}.timeline__action:disabled{opacity:.35;cursor:not-allowed}.timeline__action--danger:hover:not(:disabled){color:var(--accent-red);background:#ff6b6b26;border-color:#ff6b6b4d}.timeline__options{align-items:center;gap:var(--space-2);margin-left:auto;display:flex}.timeline__toggle{border:1px solid var(--panel-border);color:var(--text-muted);font-family:var(--font-ui);font-size:var(--font-size-xs);height:24px;padding:0 var(--space-3);border-radius:var(--panel-radius-sm);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0a}.timeline__toggle:hover{background:var(--hover-bg);color:var(--text-secondary)}.timeline__toggle--active{background:var(--accent-blue-10);color:var(--accent-blue);border-color:#00d4ff40}.timeline__onion-group{align-items:center;gap:2px;display:inline-flex}.timeline__onion-settings{border-radius:var(--panel-radius-sm);width:22px;height:22px;color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:1px solid #0000;padding:0;font-size:11px;line-height:1}.timeline__onion-settings:hover{background:var(--hover-bg);color:var(--text-secondary);border-color:var(--panel-border)}.timeline__onion-popover{min-width:200px}.timeline__onion-scope{gap:var(--space-1);border:none;flex-direction:column;margin:0;padding:0;display:flex}.timeline__onion-scope legend{margin-bottom:var(--space-1);padding:0}.timeline__onion-scope-option{align-items:center;gap:var(--space-2);font-family:var(--font-ui);font-size:var(--font-size-xs);color:var(--text-secondary);cursor:pointer;display:flex}.timeline__tag-select{background:var(--bg-primary);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);color:var(--text-secondary);font-size:var(--font-size-xs);height:24px;padding:0 var(--space-2);cursor:pointer;max-width:120px}.timeline__tag-select:disabled{opacity:.5;cursor:not-allowed}.timeline__tag-strips{z-index:5;min-height:20px;padding-bottom:var(--space-1);border-bottom:1px solid var(--panel-border);background:var(--bg-secondary);grid-area:1/2;position:sticky;top:0}.timeline__tag-track{height:16px;min-width:var(--timeline-cell);position:relative}.timeline__tag-bar{height:14px;padding:0 var(--space-1);font-family:var(--font-ui);color:#0d0d1a;cursor:pointer;text-overflow:ellipsis;white-space:nowrap;opacity:.85;transition:opacity var(--transition-fast), box-shadow var(--transition-fast);border:none;border-radius:2px;font-size:9px;font-weight:600;position:absolute;top:0;overflow:hidden;box-shadow:inset 0 0 0 1px #00000026}.timeline__tag-bar:hover{opacity:1}.timeline__tag-bar--active{opacity:1;box-shadow:inset 0 0 0 1px #ffffff59, 0 0 0 1px var(--accent-blue)}.timeline__scroll{border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);background:var(--bg-primary);scrollbar-width:thin;scrollbar-color:#ffffff26 transparent;flex:1;min-height:0;overflow:auto}.timeline__scroll::-webkit-scrollbar{width:8px;height:8px}.timeline__scroll::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:999px}.timeline__scroll::-webkit-scrollbar-thumb:hover{background:#ffffff40}.timeline__grid{grid-template-columns:var(--timeline-label-w) max-content;grid-template-rows:auto auto auto;align-items:start;min-width:min-content;display:grid}.timeline__corner{z-index:6;width:var(--timeline-label-w);background:var(--bg-secondary);padding-left:var(--space-2);align-items:center;display:flex;position:sticky;left:0}.timeline__corner-label{font-family:var(--font-ui);letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);font-size:9px;font-weight:600}.timeline__corner--tags{border-bottom:1px solid var(--panel-border);grid-area:1/1;height:20px;top:0}.timeline__corner--headers{height:calc(var(--timeline-cell) + var(--space-2));border-bottom:1px solid var(--panel-border);padding-right:var(--space-2);grid-area:2/1;justify-content:space-between;top:21px}.timeline__layer-add{border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);width:20px;height:20px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0a;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;line-height:1;display:flex}.timeline__layer-add:hover{background:var(--hover-bg);color:var(--accent-blue);border-color:#00d4ff59}.timeline__layer-props{align-items:center;gap:var(--space-2);padding:0 var(--space-2);border-left:1px solid var(--panel-border);border-right:1px solid var(--panel-border);margin:0 var(--space-1);flex-shrink:0;display:flex}.timeline__layer-props[hidden]{display:none}.timeline__layer-props-name{font-size:var(--font-size-xs);color:var(--accent-blue);text-overflow:ellipsis;white-space:nowrap;max-width:72px;font-weight:600;overflow:hidden}.timeline__layer-props-label{letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);font-size:9px;font-weight:600}.timeline__layer-props-slider{width:72px;accent-color:var(--accent-blue)}.timeline__layer-props-val{font-family:var(--font-mono);color:var(--text-secondary);min-width:32px;font-size:10px}.timeline__layer-props-select{font-family:var(--font-ui);font-size:var(--font-size-xs);color:var(--text-primary);background:var(--bg-surface);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);max-width:96px;padding:2px 4px}.timeline__layer-props-select:focus{border-color:var(--accent-blue);outline:none}.timeline__headers{gap:var(--space-1);padding:var(--space-1) 0;border-bottom:1px solid var(--panel-border);z-index:5;background:var(--bg-secondary);grid-area:2/2;display:flex;position:sticky;top:21px}.timeline__header{width:var(--timeline-cell);height:var(--timeline-cell);border-radius:var(--panel-radius-sm);font-family:var(--font-mono);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff08;border:1px solid #ffffff0f;flex-shrink:0;justify-content:center;align-items:center;font-size:10px;font-weight:500;display:flex}.timeline__header--tick{color:var(--text-primary);background:#ffffff0f;border-color:#ffffff1a}.timeline__header:hover{background:var(--hover-bg);color:var(--text-primary);border-color:var(--panel-border-hover)}.timeline__header--active{background:var(--accent-blue-20);color:var(--accent-blue);border-color:#00d4ff73;font-weight:700;box-shadow:0 0 8px #00d4ff26}.timeline__header--dragging{opacity:.45}.timeline__header--drag-over{border-color:var(--accent-purple);color:var(--accent-purple);background:#a855f71f}.timeline__duration-popover{z-index:var(--z-tooltip);gap:var(--space-1);padding:var(--space-2) var(--space-3);background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);box-shadow:var(--shadow-md);flex-direction:column;min-width:120px;display:flex;position:fixed}.timeline__duration-label{font-family:var(--font-ui);font-size:var(--font-size-xs);color:var(--text-muted)}.timeline__duration-input{width:100%;padding:var(--space-1) var(--space-2);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-mono);font-size:var(--font-size-sm)}.timeline__duration-input:focus{border-color:var(--accent-blue);outline:none}.context-menu{z-index:var(--z-menu);min-width:168px;padding:var(--space-1);background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);box-shadow:var(--shadow-md);position:fixed}.context-menu__item{width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--panel-radius-sm);color:var(--text-primary);font-family:var(--font-ui);font-size:var(--font-size-sm);text-align:left;cursor:pointer;background:0 0;border:none;display:block}.context-menu__item:hover:not(:disabled){background:var(--hover-bg)}.context-menu__item:disabled{opacity:.4;cursor:not-allowed}.context-menu__item--danger{color:var(--accent-red)}.context-menu__item--danger:hover:not(:disabled){background:#ff6b6b1f}.timeline__rows{flex-direction:column;grid-area:3/1/auto/-1;gap:0;display:flex}.timeline__row{grid-template-columns:var(--timeline-label-w) max-content;border-bottom:1px solid #ffffff0a;align-items:stretch;gap:0;display:grid}.timeline__row--alt{background:#ffffff04}.timeline__row--active{background:#00d4ff0f}.timeline__row--hidden{opacity:.45}.timeline__row--locked{opacity:.92}.timeline__layer-label{z-index:4;width:var(--timeline-label-w);padding:var(--space-1) var(--space-1) var(--space-1) var(--space-2);font-family:var(--font-ui);font-size:var(--font-size-xs);color:var(--text-secondary);white-space:nowrap;background:inherit;cursor:pointer;min-height:calc(var(--timeline-cell) + var(--space-1));-webkit-user-select:none;user-select:none;border-left:2px solid #0000;align-items:center;gap:3px;display:flex;position:sticky;left:0;overflow:hidden}.timeline__row--active .timeline__layer-label,.timeline__layer-label--active{color:var(--accent-blue);border-left-color:var(--accent-blue);background:#00d4ff14}.timeline__layer-btn{width:18px;height:18px;color:var(--text-muted);cursor:pointer;opacity:.55;transition:color var(--transition-fast), opacity var(--transition-fast), background var(--transition-fast);background:0 0;border:none;border-radius:2px;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}.timeline__layer-btn:hover{opacity:1;color:var(--text-primary);background:#ffffff14}.timeline__layer-btn--on{opacity:1;color:var(--text-secondary)}.timeline__layer-btn--lock.timeline__layer-btn--on{color:var(--accent-orange)}.timeline__layer-actions{opacity:0;transition:opacity var(--transition-fast);flex-shrink:0;align-items:center;gap:0;margin-left:auto;display:flex}.timeline__layer-label:hover .timeline__layer-actions,.timeline__layer-label--active .timeline__layer-actions{opacity:1}.timeline__layer-action{width:18px;height:18px;color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast), background var(--transition-fast);background:0 0;border:none;border-radius:2px;justify-content:center;align-items:center;padding:0;display:flex}.timeline__layer-action:hover:not(:disabled){color:var(--text-primary);background:#ffffff14}.timeline__layer-action:disabled{opacity:.25;cursor:not-allowed}.timeline__layer-action--danger:hover:not(:disabled){color:var(--accent-red);background:#ff6b6b1f}.timeline__layer-label--dragging{opacity:.45}.timeline__layer-label--drag-over{outline:1px dashed var(--accent-purple);outline-offset:-1px}.timeline__layer-rename{background:var(--bg-elevated);border:1px solid var(--accent-blue);border-radius:var(--panel-radius-sm);min-width:0;color:var(--text-primary);font-family:var(--font-ui);font-size:var(--font-size-xs);outline:none;flex:1;padding:1px 4px}.timeline__layer-index{width:16px;height:16px;font-family:var(--font-mono);color:var(--text-muted);background:#ffffff0f;border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;font-size:9px;font-weight:600;display:flex}.timeline__row--active .timeline__layer-index{background:var(--accent-blue-20);color:var(--accent-blue)}.timeline__layer-name{text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.timeline__cells{gap:var(--space-1);padding:var(--space-1) 0;display:flex}.timeline__cel{width:var(--timeline-cell);height:var(--timeline-cell);border-radius:var(--panel-radius-sm);cursor:pointer;transition:border-color var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast);background:#ffffff0a;border:1px solid #ffffff14;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex;position:relative;overflow:hidden}.timeline__cel:active{transform:scale(.92)}.timeline__cel:hover{border-color:var(--panel-border-hover);background:#ffffff12}.timeline__cel--active{border-color:var(--accent-blue);background:#00d4ff14;box-shadow:0 0 0 1px #00d4ff59,inset 0 0 0 1px #00d4ff33}.timeline__cel--empty{background:#00000038;border-style:dashed;border-color:#ffffff0d}.timeline__cel--empty:hover{background:#ffffff0d}.timeline__cel--linked{color:var(--accent-purple);background:#a855f724;border-color:#a855f766}.timeline__cel--linked:hover{background:#a855f733}.timeline__cel--dragging{opacity:.45}.timeline__cel--drag-over{border-color:var(--accent-purple);background:#a855f724;box-shadow:0 0 0 1px #a855f733}.timeline__cel-link-badge{width:11px;height:11px;color:var(--accent-purple);pointer-events:none;background:#1a1a2ed9;border-radius:2px;justify-content:center;align-items:center;display:flex;position:absolute;bottom:1px;right:1px}.timeline__cel-link-badge .timeline__cel-link-icon{width:9px;height:9px}.timeline__cel-thumb{width:100%;height:100%;image-rendering:pixelated;display:block}.timeline__cel-link-icon{opacity:.9;width:12px;height:12px}.timeline__cel-link-icon path{fill:none;stroke:currentColor;stroke-width:1.4px;stroke-linecap:round}.status-bar{align-items:center;gap:var(--space-6);padding:0 var(--space-5);background:var(--bg-tertiary);border-top:1px solid var(--panel-border);z-index:var(--z-toolbar);-webkit-user-select:none;user-select:none;grid-area:statusbar;display:flex}.status-bar__section{align-items:center;display:flex}.status-bar__section--spacer{flex:1}.status-bar__item--autosave{font-family:var(--font-ui);color:var(--text-muted)}.status-bar__item--saving{color:var(--accent-orange)}.status-bar__item--saved{color:var(--accent-green)}.status-bar__item--error{color:var(--accent-red)}.status-bar__item{align-items:center;gap:var(--space-2);font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--text-secondary);display:flex}.status-bar__color-swatch{border:1px solid #ffffff26;border-radius:2px;width:10px;height:10px}.toast-container{bottom:calc(var(--status-bar-h) + 12px);z-index:calc(var(--z-menu) + 10);align-items:center;gap:var(--space-2);pointer-events:none;flex-direction:column;display:flex;position:fixed;left:50%;transform:translate(-50%)}.input-display{left:calc(var(--toolbar-w) + var(--space-3));bottom:calc(var(--timeline-h) + var(--status-bar-h) + 8px);z-index:var(--z-overlay);align-items:center;gap:var(--space-3);pointer-events:none;max-width:min(70vw,640px);display:flex;position:fixed}.input-display[hidden]{display:none!important}.input-display__keys,.input-display__mouse{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.input-display__key,.input-display__mouse-btn{min-width:22px;height:22px;font-family:var(--font-mono);color:var(--text-primary);background:var(--bg-elevated);border:1px solid var(--panel-border);box-shadow:0 0 0 1px #00d4ff26, var(--shadow-sm,0 2px 8px #00000059);border-radius:4px;justify-content:center;align-items:center;padding:0 6px;font-size:11px;font-weight:500;line-height:1;animation:.12s input-display-pop;display:inline-flex}.input-display__plus{font-family:var(--font-mono);color:var(--text-muted);-webkit-user-select:none;user-select:none;padding:0 1px;font-size:11px;font-weight:600}@keyframes input-display-pop{0%{opacity:.65;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.toast{background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);color:var(--text-primary);font-family:var(--font-ui);font-size:var(--font-size-sm);padding:var(--space-2) var(--space-4);box-shadow:var(--shadow-md);opacity:0;white-space:nowrap;transition:opacity .2s,transform .2s;transform:translateY(8px)}.toast--visible{opacity:1;transform:translateY(0)}.toast--warning{color:var(--accent-orange);border-color:#ff9f4373}.preview-panel{z-index:var(--z-tooltip);background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius);width:min(360px,100vw - 32px);box-shadow:var(--shadow-lg);-webkit-user-select:none;user-select:none;position:fixed}.preview-panel__header{justify-content:space-between;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--panel-border);cursor:grab;background:#ffffff05;display:flex}.preview-panel__header:active{cursor:grabbing}.preview-panel__title{font-family:var(--font-ui);font-size:var(--font-size-sm);color:var(--text-primary);font-weight:600}.preview-panel__header-actions{gap:var(--space-1);display:flex}.preview-panel__icon-btn{border:1px solid var(--panel-border);color:var(--text-secondary);font-size:var(--font-size-xs);min-width:22px;height:22px;padding:0 var(--space-2);border-radius:var(--panel-radius-sm);cursor:pointer;background:#ffffff0a}.preview-panel__icon-btn:hover{background:var(--hover-bg);color:var(--text-primary)}.preview-panel__body{padding:var(--space-3);background:#112;justify-content:center;align-items:center;display:flex}.preview-panel__viewport{image-rendering:pixelated;image-rendering:crisp-edges;box-shadow:var(--shadow-md);border:1px solid #ffffff0f}.preview-panel__canvas{image-rendering:pixelated;image-rendering:crisp-edges;display:block}.preview-panel__footer{justify-content:space-between;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-top:1px solid var(--panel-border);display:flex}.preview-panel__transport{align-items:center;gap:var(--space-2);display:flex}.preview-panel__btn{border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);background:var(--accent-blue-20);width:24px;height:24px;color:var(--accent-blue);cursor:pointer;font-size:var(--font-size-xs)}.preview-panel__btn--playing{color:var(--accent-purple);background:#a855f733}.preview-panel__info{font-family:var(--font-mono);color:var(--text-muted);font-size:10px}.preview-panel__scales{gap:var(--space-1);display:flex}.preview-panel__scale{border:1px solid var(--panel-border);color:var(--text-secondary);height:22px;padding:0 var(--space-2);border-radius:var(--panel-radius-sm);cursor:pointer;background:#ffffff0a;font-size:10px}.preview-panel__scale--active{background:var(--accent-blue-20);color:var(--accent-blue);border-color:#00d4ff40}.preview-panel__gif-note{font-size:var(--font-size-xs);color:var(--text-secondary);margin-bottom:var(--space-3)}.preview-panel__gif-wrap{padding:var(--space-3);border-radius:var(--panel-radius-sm);background:#112;justify-content:center;display:flex}.preview-panel__gif-img{image-rendering:pixelated;image-rendering:crisp-edges;max-width:100%;max-height:320px}.tag-editor__list{gap:var(--space-1);margin-bottom:var(--space-4);flex-direction:column;max-height:180px;display:flex;overflow-y:auto}.tag-editor__item{align-items:center;gap:var(--space-2);padding:var(--space-2);border-radius:var(--panel-radius-sm);font-size:var(--font-size-xs);background:#ffffff08;grid-template-columns:12px 1fr auto auto 24px;display:grid}.tag-editor__swatch{border-radius:2px;width:12px;height:12px}.tag-editor__name{color:var(--text-primary);font-weight:600}.tag-editor__range,.tag-editor__mode{color:var(--text-muted);font-family:var(--font-mono)}.tag-editor__delete{color:var(--text-muted);cursor:pointer;background:0 0;border:none}.tag-editor__delete:hover{color:var(--accent-red)}.tag-editor__empty{font-size:var(--font-size-xs);color:var(--text-muted)}.tag-editor__heading{font-size:var(--font-size-sm);color:var(--text-primary);margin-bottom:var(--space-3)}.tag-editor__field{gap:var(--space-1);margin-bottom:var(--space-3);font-size:var(--font-size-xs);color:var(--text-secondary);flex-direction:column;display:flex}.tag-editor__field input,.tag-editor__field select{background:var(--bg-primary);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);color:var(--text-primary);padding:var(--space-2);font-size:var(--font-size-sm)}.tag-editor__row{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.toolbar__btn:active{transform:scale(.9)}.panel__toggle{transition:transform var(--transition-base)}.palette__swatch{transition:transform .1s,border-color .1s,box-shadow .1s}@keyframes glowPulse{0%,to{box-shadow:inset 0 0 8px #00d4ff14,0 0 6px #00d4ff1a}50%{box-shadow:inset 0 0 12px #00d4ff1f,0 0 10px #00d4ff26}}.toolbar__btn--active{animation:3s ease-in-out infinite glowPulse}@keyframes layerSlideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.layer-block--enter{animation:.2s ease-out layerSlideIn}@keyframes valuePing{0%{color:var(--accent-blue)}to{color:var(--text-secondary)}}.status-bar__item--updated span{animation:.6s ease-out valuePing}.panel__body,.panel__footer{transition:opacity var(--transition-base)}.color-picker__fg:hover{box-shadow:0 0 12px #00d4ff59}.color-picker__bg:hover{border-color:var(--accent-purple);box-shadow:0 0 8px #a855f740}.top-menu__item{position:relative;overflow:hidden}.top-menu__item:after{content:"";background:var(--accent-blue);width:0;height:1px;transition:all var(--transition-base);position:absolute;bottom:0;left:50%;transform:translate(-50%)}.top-menu__item:hover:after{width:60%}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#ffffff26}:focus-visible{outline:1px solid var(--accent-blue);outline-offset:1px}button:focus:not(:focus-visible){outline:none}.modal-overlay{z-index:var(--z-modal);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;visibility:hidden;transition:opacity var(--transition-base), visibility var(--transition-base);background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-overlay--visible{opacity:1;visibility:visible}.modal{background:var(--bg-surface);border:1px solid var(--panel-border-hover);border-radius:var(--panel-radius);box-shadow:var(--shadow-lg), 0 0 60px #0006;width:90%;min-width:340px;max-width:480px;transition:transform var(--transition-base);overflow:hidden;transform:scale(.95)translateY(10px)}.modal-overlay--visible .modal{transform:scale(1)translateY(0)}.modal--wide{width:min(96vw,720px);max-width:720px}.modal__recovery{align-items:center;gap:var(--space-5);display:flex}.modal__recovery-thumb{border-radius:var(--panel-radius-sm);border:1px solid var(--panel-border);width:96px;height:96px;image-rendering:pixelated;background:#1e1e3a;flex-shrink:0}.modal__recovery-text{font-size:var(--font-size-sm);color:var(--text-secondary);line-height:1.5}.modal__recovery-text strong{color:var(--text-primary)}.projects-modal__toolbar{gap:var(--space-3);margin-bottom:var(--space-4);display:flex}.projects-modal__search{background:var(--bg-secondary);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);min-width:0;color:var(--text-primary);font-family:var(--font-ui);font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3);outline:none;flex:1}.projects-modal__search:focus{border-color:var(--accent-blue)}.projects-modal__sort{background:var(--bg-secondary);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);color:var(--text-primary);font-size:var(--font-size-sm);padding:var(--space-2)}.projects-modal__grid{gap:var(--space-3);max-height:420px;padding-right:var(--space-1);grid-template-columns:repeat(auto-fill,minmax(140px,1fr));display:grid;overflow-y:auto}.projects-modal__empty{text-align:center;color:var(--text-muted);font-size:var(--font-size-sm);padding:var(--space-8) var(--space-4);grid-column:1/-1}.projects-modal__card{gap:var(--space-2);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);padding:var(--space-2);transition:border-color var(--transition-fast);background:#ffffff05;flex-direction:column;display:flex}.projects-modal__card:hover{border-color:var(--panel-border-hover)}.projects-modal__card--active{border-color:#00d4ff73;box-shadow:0 0 12px #00d4ff1f}.projects-modal__open{align-items:center;gap:var(--space-2);cursor:pointer;text-align:center;background:0 0;border:none;flex-direction:column;width:100%;padding:0;display:flex}.projects-modal__thumb{aspect-ratio:1;object-fit:contain;width:100%;image-rendering:pixelated;border-radius:var(--panel-radius-sm);background:#1e1e3a;border:1px solid #ffffff0f}.projects-modal__name{font-family:var(--font-ui);font-size:var(--font-size-sm);color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-weight:600;overflow:hidden}.projects-modal__badge{color:var(--accent-blue);letter-spacing:.02em;font-size:10px;font-weight:600}.projects-modal__date{font-family:var(--font-mono);color:var(--text-muted);font-size:10px}.projects-modal__actions{justify-content:center;gap:var(--space-1);display:flex}.projects-modal__action{border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);width:28px;height:24px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0a;justify-content:center;align-items:center;font-size:12px;display:flex}.projects-modal__action:hover{background:var(--hover-bg);color:var(--text-primary)}.projects-modal__action--danger:hover{color:var(--accent-red);border-color:#ff6b6b59}.modal__header{padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--panel-border);background:#ffffff05;justify-content:space-between;align-items:center;display:flex}.modal__title{font-family:var(--font-ui);font-size:var(--font-size-xl);color:var(--text-primary);margin:0;font-weight:600}.modal__close{color:var(--text-muted);cursor:pointer;border-radius:var(--panel-radius-sm);transition:all var(--transition-fast);background:0 0;border:none;padding:4px;display:flex}.modal__close:hover{background:var(--hover-bg);color:var(--text-primary)}.modal__hint{margin-top:var(--space-3);font-size:var(--font-size-sm);color:var(--text-muted)}.modal__footer{justify-content:flex-end;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-6);border-top:1px solid var(--panel-border);background:#0000001a;display:flex}.modal__btn{padding:var(--space-3) var(--space-6);border-radius:var(--panel-radius-sm);font-family:var(--font-ui);font-size:var(--font-size-md);cursor:pointer;transition:all var(--transition-fast);border:1px solid #0000;font-weight:500}.modal__btn--secondary{border-color:var(--panel-border);color:var(--text-secondary);background:0 0}.modal__btn--secondary:hover{background:var(--hover-bg);color:var(--text-primary)}.modal__btn--primary{color:var(--accent-blue);background:linear-gradient(135deg,#00d4ff33,#a855f733);border-color:#00d4ff4d}.modal__btn--discard{color:var(--text-muted);background:0 0;border-color:#0000;margin-right:auto}.modal__btn--discard:hover{background:var(--hover-bg);color:var(--text-primary)}.modal__btn--discard[hidden]{display:none}.modal__form{gap:var(--space-5);flex-direction:column;display:flex}.modal__field{align-items:center;gap:var(--space-4);display:flex}.modal__label{font-family:var(--font-ui);font-size:var(--font-size-md);color:var(--text-secondary);min-width:50px;font-weight:500}.modal__input{background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);color:var(--text-primary);font-family:var(--font-mono);font-size:var(--font-size-md);padding:var(--space-3) var(--space-4);transition:border-color var(--transition-fast);outline:none;flex:1;max-width:120px}.modal__input:focus{border-color:var(--accent-blue);box-shadow:0 0 0 2px var(--accent-blue-10)}.modal__input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.modal__input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.modal__input[type=number]{-moz-appearance:textfield}.modal__unit{font-family:var(--font-mono);font-size:var(--font-size-sm);color:var(--text-muted)}.modal__presets{gap:var(--space-3);flex-direction:column;display:flex}.modal__presets-label{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.modal__presets-grid{gap:var(--space-2);flex-wrap:wrap;display:flex}.modal__preset{padding:var(--space-2) var(--space-4);background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);color:var(--text-secondary);font-family:var(--font-mono);font-size:var(--font-size-xs);cursor:pointer;transition:all var(--transition-fast)}.modal__preset:hover{border-color:var(--panel-border-hover);background:var(--hover-bg);color:var(--text-primary)}.modal__preset--active{background:var(--accent-blue-10);color:var(--accent-blue);border-color:#00d4ff4d;box-shadow:0 0 8px #00d4ff1a}.modal__templates{gap:var(--space-3);flex-direction:column;display:flex}.modal__templates-grid{gap:var(--space-2);grid-template-columns:repeat(2,1fr);display:grid}.modal__template{text-align:left;padding:var(--space-3) var(--space-4);flex-direction:column;align-items:flex-start;gap:2px;min-height:52px;display:flex}.modal__template-label{font-weight:600;font-size:var(--font-size-sm)}.modal__template-desc{color:var(--text-muted);font-size:10px}.modal__select{flex:1;max-width:100%}.export-dialog__layout{gap:var(--space-5);grid-template-columns:160px 1fr 140px;align-items:start;display:grid}.export-dialog__section-title{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin:0 0 var(--space-3)}.export-dialog__formats{gap:var(--space-2);flex-direction:column;display:flex}.export-dialog__format{padding:var(--space-2) var(--space-3);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);cursor:pointer;transition:border-color var(--transition-fast);flex-direction:column;gap:2px;display:flex}.export-dialog__format:has(input:checked){background:#00d4ff0f;border-color:#00d4ff59}.export-dialog__format input{opacity:0;pointer-events:none;position:absolute}.export-dialog__format-label{font-size:var(--font-size-sm);color:var(--text-primary);font-weight:600}.export-dialog__format-desc{color:var(--text-muted);font-size:10px;line-height:1.3}.export-dialog__options{gap:var(--space-3);flex-direction:column;display:flex}.export-dialog__field{align-items:center;gap:var(--space-3);display:flex}.export-dialog__field--hidden{display:none}.export-dialog__label{min-width:72px;font-size:var(--font-size-sm);color:var(--text-secondary)}.export-dialog__select,.export-dialog__input{background:var(--bg-secondary);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);max-width:200px;color:var(--text-primary);font-family:var(--font-mono);font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3);outline:none;flex:1}.export-dialog__select:focus,.export-dialog__input:focus{border-color:var(--accent-blue)}.export-dialog__range{align-items:center;gap:var(--space-2);display:flex}.export-dialog__range .export-dialog__input{max-width:64px}.export-dialog__checkbox{align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);color:var(--text-secondary);cursor:pointer;display:flex}.export-dialog__warnings{color:var(--accent-orange,#ff9f43);margin:0;font-size:10px;line-height:1.4}.export-dialog__preview-box{border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);padding:var(--space-2);background:#1e1e3a;justify-content:center;align-items:center;display:flex}.export-dialog__preview-canvas{image-rendering:pixelated;max-width:100%}.export-dialog__size{margin-top:var(--space-2);font-family:var(--font-mono);color:var(--text-muted);text-align:center;font-size:10px}@media (width<=640px){.export-dialog__layout{grid-template-columns:1fr}}.import-dialog__file-row{gap:var(--space-2);margin-bottom:var(--space-3);flex-direction:column;display:flex}.import-dialog__filename{font-family:var(--font-mono);color:var(--text-muted);word-break:break-all;font-size:10px}.import-dialog__preview-box{min-height:160px}.import-dialog__preview-canvas{width:160px;height:160px}.auth-dialog{gap:var(--space-3);flex-direction:column;display:flex}.auth-dialog .modal__input{width:100%;max-width:none}.auth-dialog .modal__label{min-width:0}.auth-dialog__banner{font-size:var(--font-size-sm);color:var(--text-secondary);background:var(--bg-elevated);border:1px solid var(--panel-border);border-radius:var(--panel-radius-sm);padding:var(--space-3) var(--space-4);line-height:1.4}.auth-dialog__tabs{gap:var(--space-1);margin-bottom:var(--space-2);display:flex}.auth-dialog__tab{border:1px solid var(--panel-border);color:var(--text-secondary);border-radius:var(--panel-radius-sm);padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);background:0 0;flex:1;font-weight:500}.auth-dialog__tab--active{border-color:var(--accent-blue);color:var(--text-primary);background:var(--accent-blue-10,#00d4ff1f)}.auth-dialog__username{display:none}.auth-dialog__username--visible{gap:var(--space-2);flex-direction:column;display:flex}.auth-dialog__hint{color:var(--text-muted);font-size:11px}.auth-dialog__error{font-size:var(--font-size-sm);color:#f87171}.auth-dialog__resend{color:var(--accent-blue);font-size:var(--font-size-sm);background:0 0;border:none;align-self:flex-start;padding:0;text-decoration:underline}.auth-dialog__divider{align-items:center;gap:var(--space-3);color:var(--text-muted);font-size:11px;display:flex}.auth-dialog__divider:before,.auth-dialog__divider:after{content:"";background:var(--panel-border);flex:1;height:1px}.auth-dialog__oauth{gap:var(--space-2);flex-direction:column;display:flex}.auth-dialog__oauth-btn{background:var(--bg-elevated);border:1px solid var(--panel-border);color:var(--text-primary);border-radius:var(--panel-radius-sm);padding:var(--space-3);font-size:var(--font-size-sm)}.auth-dialog__oauth-btn:hover:not(:disabled){border-color:var(--panel-border-hover);background:var(--hover-bg)}.auth-dialog__oauth-btn:disabled{opacity:.45;cursor:not-allowed}.palette-import__file-row{gap:var(--space-2);margin-bottom:var(--space-3);flex-direction:column;display:flex}.palette-import__filename{font-family:var(--font-mono);color:var(--text-muted);word-break:break-all;font-size:10px}.palette-import__name{width:100%;margin-bottom:var(--space-2)}.palette-import__meta{color:var(--text-muted);margin:0 0 var(--space-2);font-size:11px}.palette-import__swatches{max-height:120px;margin-bottom:var(--space-3);flex-wrap:wrap;gap:3px;display:flex;overflow:auto}.palette-import__swatch{border:1px solid #ffffff1f;border-radius:2px;width:14px;height:14px;display:inline-block}.palette-import__more{color:var(--text-muted);align-self:center;padding-left:4px;font-size:10px}.palette-import__warn{color:var(--accent-yellow,#e8c547);margin:0 0 var(--space-3);font-size:11px}.palette-import__check{align-items:center;gap:var(--space-2);margin-bottom:var(--space-2);font-size:12px;display:flex}.palette-import__check--disabled{opacity:.45}.palette-import__hint{color:var(--text-muted);margin:var(--space-3) 0 0;font-size:11px;line-height:1.4}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-ui);font-size:var(--font-size-md);color:var(--text-primary);background:var(--bg-primary);cursor:default;line-height:1.4;overflow:hidden}body.cursor-crosshair .canvas-area{cursor:crosshair}body.cursor-grab .canvas-area{cursor:grab}body.cursor-grabbing .canvas-area{cursor:grabbing}body.cursor-move .canvas-area{cursor:move}body.cursor-eyedropper .canvas-area{cursor:crosshair}body.cursor-brush-preview .canvas-area{cursor:none!important}.brush-cursor{pointer-events:none;z-index:1000;box-sizing:border-box;border:1px solid #fffffff2;display:none;position:fixed;box-shadow:0 0 0 1px #000000d9}body.is-drawing{-webkit-user-select:none;user-select:none}h1,h2,h3,h4,h5,h6{color:var(--text-primary);font-weight:600}a{color:var(--accent-blue);text-decoration:none}a:hover{text-decoration:underline}input,select,textarea,button{font-family:inherit;font-size:inherit}button{cursor:pointer}canvas{display:block}