.top-bar{height:var(--topbar-height);background:var(--bg-panel);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 12px;gap:8px}.top-bar-left{flex:1;display:flex;align-items:center}.project-name{font-size:14px;font-weight:600;color:var(--text-primary);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-bar-center{display:flex;gap:4px}.top-bar-right{flex:1;display:flex;justify-content:flex-end;gap:4px}.top-bar-btn{width:var(--button-size);height:32px;border:none;background:transparent;color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.top-bar-btn:hover:not(:disabled){background:var(--bg-panel-hover);color:var(--text-primary)}.top-bar-btn:disabled{opacity:.3;cursor:default}.slider-wrapper{display:flex;align-items:center;gap:8px;height:var(--tool-options-height);padding:0 4px}.slider-label{font-size:11px;color:var(--text-secondary);white-space:nowrap;min-width:40px}.slider-track{position:relative;flex:1;height:20px;min-width:80px;background:var(--bg-input);border-radius:10px;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;display:flex;align-items:center}.slider-fill{position:absolute;left:0;top:0;bottom:0;background:var(--accent);border-radius:10px;pointer-events:none}.slider-thumb{position:absolute;width:16px;height:16px;background:var(--text-primary);border-radius:50%;transform:translate(-50%);pointer-events:none;box-shadow:0 1px 3px #0006}.slider-value{font-size:11px;color:var(--text-secondary);min-width:32px;text-align:right;font-variant-numeric:tabular-nums}.tool-options{height:var(--tool-options-height);background:var(--bg-panel);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 12px;gap:16px;overflow-x:auto}.tool-option-row{display:flex;align-items:center;gap:12px}.tool-option-buttons{display:flex;gap:2px}.option-btn{padding:3px 8px;border:1px solid var(--border);background:var(--bg-panel);color:var(--text-primary);border-radius:var(--radius-sm);font-size:11px;cursor:pointer;white-space:nowrap;min-height:28px}.option-btn:hover{background:var(--bg-panel-hover)}.option-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.tool-button{width:var(--button-size);height:var(--button-size);border:none;background:transparent;color:var(--text-secondary);border-radius:var(--radius-md);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:20px;transition:background .15s,color .15s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.tool-button:hover{background:var(--bg-panel-hover);color:var(--text-primary)}.tool-button.active{background:var(--accent-dim);color:var(--accent)}.main-toolbar{width:var(--toolbar-width);background:var(--bg-panel);border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:center;padding:6px 0;gap:2px;overflow-y:auto}.toolbar-group{width:100%;display:flex;flex-direction:column;align-items:center;padding-bottom:4px;border-bottom:1px solid var(--border);margin-bottom:4px}.toolbar-group:last-of-type{border-bottom:none}.toolbar-group-label{font-size:9px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px;-webkit-user-select:none;user-select:none}.toolbar-tools{display:flex;flex-direction:column;gap:2px;align-items:center}.toolbar-colors{margin-top:auto;padding:8px 0;display:flex;flex-direction:column;align-items:center;gap:4px}.color-swatches{position:relative;width:36px;height:36px;cursor:pointer}.color-swatch{position:absolute;border-radius:var(--radius-sm);border:2px solid var(--border-light)}.color-swatch.primary{width:24px;height:24px;top:0;left:0;z-index:1}.color-swatch.secondary{width:24px;height:24px;bottom:0;right:0}.swap-colors-btn{width:28px;height:20px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;font-size:14px;padding:0;border-radius:var(--radius-sm)}.swap-colors-btn:hover{color:var(--text-primary);background:var(--bg-panel-hover)}.fs-toolbar{position:fixed;top:50%;left:0;transform:translateY(-50%);z-index:9999;display:flex;align-items:flex-start}.fs-toolbar__toggle{width:28px;height:48px;border:none;border-radius:0 8px 8px 0;background:#0009;color:#fff;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent;flex-shrink:0}.fs-toolbar__toggle:active{background:#000c}.fs-toolbar__content{background:#1a1a2eeb;border-radius:0 12px 12px 0;padding:8px;display:flex;flex-direction:column;gap:8px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-left:none;max-height:80vh;overflow-y:auto}.fs-toolbar__group{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}.fs-toolbar__btn{width:44px;height:44px;border:none;border-radius:8px;background:#ffffff14;color:#ccc;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:background .15s}.fs-toolbar__btn:hover:not(:disabled){background:#ffffff26;color:#fff}.fs-toolbar__btn:active:not(:disabled){background:#fff3}.fs-toolbar__btn--active{background:var(--accent, #e94560)!important;color:#fff!important}.fs-toolbar__btn:disabled{opacity:.3;cursor:default}.fs-toolbar__sliders{display:flex;flex-direction:column;gap:4px;min-width:140px;padding:2px 4px}.fs-toolbar__sliders .slider-container{background:transparent;padding:2px 0}.fs-toolbar__sliders .slider-label{color:#aaa;font-size:10px}.fs-toolbar__sliders .slider-value{color:#ccc;font-size:10px}.fs-toolbar__colors{position:relative;width:44px;height:44px;cursor:pointer;touch-action:manipulation}.fs-toolbar__swatch{position:absolute;border-radius:4px;border:2px solid rgba(255,255,255,.3)}.fs-toolbar__swatch--primary{width:28px;height:28px;top:2px;left:2px;z-index:2}.fs-toolbar__swatch--secondary{width:22px;height:22px;bottom:2px;right:2px;z-index:1}.panel-container{width:var(--panel-width);background:var(--bg-panel);display:flex;flex-direction:column;overflow:hidden}.panel-left{border-right:1px solid var(--border)}.panel-right{border-left:1px solid var(--border)}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid var(--border);min-height:36px}.panel-title{font-size:12px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.panel-close-btn{width:24px;height:24px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm)}.panel-close-btn:hover{background:var(--bg-panel-hover);color:var(--text-primary)}.panel-content{flex:1;overflow-y:auto;overflow-x:hidden}.color-wheel{position:relative;touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair}.wheel-canvas{position:absolute;top:0;left:0;width:100%;height:100%}.square-canvas{position:absolute;border-radius:2px}.wheel-indicator,.sv-indicator{position:absolute;width:14px;height:14px;border:2px solid white;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 2px #00000080,inset 0 0 2px #0000004d}.color-panel{padding:12px;display:flex;flex-direction:column;gap:12px}.color-wheel-container{display:flex;justify-content:center;padding:4px 0}.color-hex-row{display:flex;align-items:center;gap:8px}.color-label{font-size:11px;color:var(--text-secondary);min-width:28px}.hex-input{flex:1;height:28px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-family:monospace;font-size:12px;padding:0 8px;outline:none}.hex-input:focus{border-color:var(--accent)}.color-sliders{display:flex;flex-direction:column;gap:2px}.color-section{display:flex;flex-direction:column;gap:6px}.color-section-title{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.color-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:2px}.color-swatch-btn{aspect-ratio:1;border:1px solid var(--border);border-radius:2px;cursor:pointer;padding:0;min-width:0;min-height:18px}.color-swatch-btn:hover{border-color:var(--text-primary);transform:scale(1.2);z-index:1}.color-palette-header{display:flex;align-items:center}.palette-select{flex:1;height:26px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:11px;padding:0 4px;outline:none;cursor:pointer}.palette-select:focus{border-color:var(--accent)}.layer-panel{display:flex;flex-direction:column;height:100%}.layer-blend-row{padding:6px 10px;border-bottom:1px solid var(--border)}.blend-mode-select{width:100%;padding:4px 6px;border:1px solid var(--border);background:var(--bg-input);color:var(--text-primary);border-radius:var(--radius-sm);font-size:11px}.layer-list{flex:1;overflow-y:auto}.layer-item{display:flex;align-items:center;gap:6px;padding:6px 10px;cursor:pointer;border-bottom:1px solid var(--border);flex-wrap:wrap;min-height:40px}.layer-item:hover{background:var(--bg-panel-hover)}.layer-item.active{background:var(--accent-dim)}.layer-visibility{width:28px;height:28px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);flex-shrink:0}.layer-visibility.visible{color:var(--text-primary)}.layer-visibility:hover{background:var(--bg-panel-hover)}.layer-name{flex:1;font-size:12px;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-actions{display:flex;flex-direction:column;gap:1px}.layer-move-btn{width:20px;height:14px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;font-size:8px;display:flex;align-items:center;justify-content:center;padding:0}.layer-move-btn:hover{color:var(--text-primary)}.layer-opacity-slider{width:100%;padding-left:34px}.layer-bottom-bar{display:flex;gap:4px;padding:8px;border-top:1px solid var(--border);justify-content:center}.layer-action-btn{width:36px;height:28px;border:1px solid var(--border);background:var(--bg-input);color:var(--text-primary);cursor:pointer;font-size:18px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center}.layer-action-btn:hover:not(:disabled){background:var(--bg-panel-hover);border-color:var(--border-light)}.layer-action-btn:disabled{opacity:.3;cursor:default}.layer-action-btn.danger:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.brush-panel{padding:12px;display:flex;flex-direction:column;gap:12px}.brush-active-info{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;background:var(--bg-panel-hover);border-radius:var(--radius-sm)}.brush-active-name{font-size:12px;font-weight:600;color:var(--text-primary)}.brush-active-category{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.brush-sliders{display:flex;flex-direction:column;gap:2px}.brush-category{display:flex;flex-direction:column;gap:6px}.brush-category-title{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.brush-preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}.brush-preset-btn{display:flex;align-items:center;gap:8px;padding:6px 8px;background:transparent;border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;color:var(--text-primary);text-align:left;min-height:36px}.brush-preset-btn:hover{background:var(--bg-panel-hover);border-color:var(--text-muted)}.brush-preset-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}.brush-preview{flex-shrink:0}.brush-preset-name{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filter-panel{display:flex;flex-direction:column;height:100%;gap:8px}.filter-categories{display:flex;flex-wrap:wrap;gap:4px;padding:8px 10px 0}.filter-cat-btn{padding:4px 8px;border:1px solid var(--border);background:var(--bg-input);color:var(--text-muted);cursor:pointer;font-size:11px;border-radius:var(--radius-sm)}.filter-cat-btn.active{background:var(--accent-dim);color:var(--text-primary);border-color:var(--accent)}.filter-cat-btn:hover:not(.active){background:var(--bg-panel-hover)}.filter-list{display:flex;flex-direction:column;gap:2px;padding:0 10px;max-height:120px;overflow-y:auto}.filter-item{padding:6px 8px;border:1px solid transparent;background:transparent;color:var(--text-primary);cursor:pointer;font-size:12px;text-align:left;border-radius:var(--radius-sm)}.filter-item:hover{background:var(--bg-panel-hover)}.filter-item.active{background:var(--accent-dim);border-color:var(--accent)}.filter-params{padding:8px 10px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:6px}.filter-name{margin:0;font-size:12px;color:var(--text-primary);font-weight:600}.filter-param{font-size:11px}.filter-checkbox{display:flex;align-items:center;gap:6px;cursor:pointer;color:var(--text-primary);font-size:11px}.filter-checkbox input{accent-color:var(--accent)}.filter-actions{display:flex;gap:6px;padding-top:4px}.filter-apply-btn,.filter-reset-btn{flex:1;padding:6px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;font-size:12px}.filter-apply-btn{background:var(--accent);color:#fff;border-color:var(--accent)}.filter-apply-btn:hover{opacity:.9}.filter-reset-btn{background:var(--bg-input);color:var(--text-primary)}.filter-reset-btn:hover{background:var(--bg-panel-hover)}.symmetry-panel{display:flex;flex-direction:column;gap:10px;padding:8px 10px}.symmetry-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.symmetry-mode-btn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border:1px solid var(--border);background:var(--bg-input);color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);min-height:44px}.symmetry-mode-btn.active{background:var(--accent-dim);color:var(--text-primary);border-color:var(--accent)}.symmetry-mode-btn:hover:not(.active){background:var(--bg-panel-hover)}.symmetry-icon{font-size:18px}.symmetry-label{font-size:10px}.symmetry-axes{padding:0 4px}.symmetry-checkbox{display:flex;align-items:center;gap:6px;cursor:pointer;color:var(--text-primary);font-size:12px;padding:4px 0}.symmetry-checkbox input{accent-color:var(--accent)}.animation-timeline{display:flex;flex-direction:column;gap:8px;padding:8px 10px}.timeline-controls{display:flex;justify-content:center;gap:4px}.timeline-btn{width:36px;height:36px;border:1px solid var(--border);background:var(--bg-input);color:var(--text-primary);cursor:pointer;font-size:16px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center}.timeline-btn:hover:not(:disabled){background:var(--bg-panel-hover)}.timeline-btn:disabled{opacity:.3;cursor:default}.timeline-btn.play-btn.active{background:var(--accent-dim);border-color:var(--accent)}.frame-info{text-align:center;font-size:11px;color:var(--text-muted)}.frame-strip{display:flex;gap:3px;overflow-x:auto;padding:4px 0;min-height:36px}.frame-thumb{min-width:32px;height:32px;border:1px solid var(--border);background:var(--bg-input);color:var(--text-muted);cursor:pointer;font-size:10px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}.frame-thumb.active{background:var(--accent-dim);color:var(--text-primary);border-color:var(--accent)}.frame-thumb:hover:not(.active){background:var(--bg-panel-hover)}.timeline-actions{display:flex;gap:4px;justify-content:center}.timeline-action-btn{padding:4px 10px;border:1px solid var(--border);background:var(--bg-input);color:var(--text-primary);cursor:pointer;font-size:11px;border-radius:var(--radius-sm)}.timeline-action-btn:hover:not(:disabled){background:var(--bg-panel-hover)}.timeline-action-btn:disabled{opacity:.3;cursor:default}.timeline-action-btn.danger:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.timeline-settings{border-top:1px solid var(--border);padding-top:8px;display:flex;flex-direction:column;gap:6px}.timeline-checkbox{display:flex;align-items:center;gap:6px;cursor:pointer;color:var(--text-primary);font-size:12px}.timeline-checkbox input{accent-color:var(--accent)}.perspective-panel{display:flex;flex-direction:column;gap:10px;padding:8px 10px}.perspective-modes{display:flex;flex-wrap:wrap;gap:4px}.persp-mode-btn{padding:6px 10px;border:1px solid var(--border);background:var(--bg-input);color:var(--text-muted);cursor:pointer;font-size:11px;border-radius:var(--radius-sm);min-height:32px}.persp-mode-btn.active{background:var(--accent-dim);color:var(--text-primary);border-color:var(--accent)}.persp-mode-btn:hover:not(.active){background:var(--bg-panel-hover)}.perspective-settings{display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--border);padding-top:8px}.photo-panel{display:flex;flex-direction:column;gap:.5rem;padding:.25rem}.photo-section{display:flex;flex-direction:column;gap:.35rem;padding-bottom:.5rem;border-bottom:1px solid var(--border-color, #333)}.photo-section:last-child{border-bottom:none}.photo-section-title{margin:0;font-size:.8rem;font-weight:600;color:var(--text-primary, #eee)}.photo-section-desc{margin:0;font-size:.75rem;color:var(--text-secondary, #888)}.photo-btn{padding:.4rem .6rem;border:1px solid var(--border-color, #444);border-radius:4px;background:var(--bg-secondary, #2a2a2a);color:var(--text-primary, #eee);font-size:.8rem;cursor:pointer;transition:background .15s}.photo-btn:hover:not(:disabled){background:var(--bg-hover, #3a3a3a)}.photo-btn:disabled{opacity:.5;cursor:not-allowed}.photo-import-btn{background:var(--accent-color, #4a9eff);border-color:var(--accent-color, #4a9eff);color:#fff}.photo-import-btn:hover:not(:disabled){background:var(--accent-hover, #3a8eef)}.photo-imported-info{margin:0;font-size:.7rem;color:var(--text-secondary, #888)}.photo-checkbox{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--text-primary, #eee);cursor:pointer}.photo-checkbox input{margin:0}.photo-grid-controls{display:flex;gap:.5rem}.photo-grid-input{display:flex;align-items:center;gap:.3rem;font-size:.75rem;color:var(--text-primary, #eee)}.photo-grid-input input{width:3rem;padding:.2rem .3rem;border:1px solid var(--border-color, #444);border-radius:3px;background:var(--bg-primary, #1a1a1a);color:var(--text-primary, #eee);font-size:.75rem}.photo-effects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.3rem}.photo-effect-btn{font-size:.75rem;padding:.35rem .3rem}.tablet-layout{width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:var(--bg-primary)}.main-area{flex:1;display:flex;overflow:hidden}.canvas-area{flex:1;overflow:hidden;position:relative}.panels-area{display:flex;flex-direction:column}.panels-area>*{flex:1}.tablet-layout.fullscreen-mode{background:var(--bg-canvas-area)}.exit-fullscreen-btn{position:fixed;top:12px;right:12px;z-index:9999;width:44px;height:44px;border:none;border-radius:50%;background:#0006;color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent;opacity:.5;transition:opacity .2s}.exit-fullscreen-btn:hover,.exit-fullscreen-btn:active{opacity:1;background:#000000b3}.canvas-viewport{flex:1;overflow:hidden;position:relative;background:var(--bg-canvas-area);display:flex;align-items:center;justify-content:center;touch-action:none}.canvas-container{box-shadow:var(--shadow-lg);line-height:0;touch-action:none}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.dialog{background:var(--bg-secondary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:420px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.dialog-large{max-width:600px}.dialog-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}.dialog-title{font-size:18px;font-weight:600;color:var(--text-primary);margin:0}.dialog-close{width:32px;height:32px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;font-size:24px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center}.dialog-close:hover{background:var(--bg-panel-hover);color:var(--text-primary)}.dialog-body{padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:16px}.dialog-field{display:flex;flex-direction:column;gap:6px}.dialog-field label{font-size:12px;color:var(--text-secondary);font-weight:500}.dialog-field-row{display:flex;gap:12px}.dialog-field-row .dialog-field{flex:1}.dialog-input{height:36px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:14px;padding:0 10px;outline:none;width:100%}.dialog-input:focus{border-color:var(--accent)}.dialog-range{width:100%;accent-color:var(--accent)}.dialog-footer{display:flex;gap:8px;padding:16px 20px;border-top:1px solid var(--border);justify-content:flex-end}.dialog-btn{height:36px;padding:0 20px;border:none;border-radius:var(--radius-sm);font-size:14px;font-weight:500;cursor:pointer;touch-action:manipulation}.dialog-btn.primary{background:var(--accent);color:#fff}.dialog-btn.primary:hover{background:var(--accent-hover)}.dialog-btn.secondary{background:var(--bg-panel-hover);color:var(--text-secondary)}.dialog-btn.secondary:hover{color:var(--text-primary)}.preset-grid,.format-options{display:flex;flex-wrap:wrap;gap:6px}.preset-btn{height:30px;padding:0 12px;border:1px solid var(--border);background:var(--bg-input);color:var(--text-secondary);border-radius:var(--radius-sm);font-size:12px;cursor:pointer}.preset-btn.active{border-color:var(--accent);color:var(--accent);background:var(--accent-dim)}.preset-btn:hover:not(.active){border-color:var(--border-light);color:var(--text-primary)}.empty-state{text-align:center;padding:40px 20px;color:var(--text-muted)}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.project-card{background:var(--bg-panel);border-radius:var(--radius-md);border:1px solid var(--border);cursor:pointer;overflow:hidden;position:relative;transition:border-color .15s}.project-card:hover{border-color:var(--accent)}.project-thumb{aspect-ratio:4 / 3;background:var(--bg-canvas-area);overflow:hidden}.project-thumb img{width:100%;height:100%;object-fit:cover}.project-thumb-placeholder{width:100%;height:100%;background:var(--bg-input)}.project-info{padding:8px 10px;display:flex;flex-direction:column;gap:2px}.project-card-name{font-size:13px;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.project-card-size{font-size:11px;color:var(--text-muted)}.project-delete-btn{position:absolute;top:4px;right:4px;width:24px;height:24px;border:none;background:#00000080;color:#fff;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s}.project-card:hover .project-delete-btn{opacity:1}.onboarding-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10000;pointer-events:all}.onboarding-spotlight{position:fixed;border-radius:8px;z-index:10001;pointer-events:none;transition:top .35s ease,left .35s ease,width .35s ease,height .35s ease,box-shadow .35s ease;box-shadow:0 0 0 9999px #0009}.onboarding-tooltip{position:fixed;z-index:10002;width:340px;max-width:calc(100vw - 32px);background:#1e1e2e;color:#e0e0e6;border-radius:12px;padding:20px 24px 16px;box-shadow:0 8px 32px #00000073,0 0 0 1px #ffffff14;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;opacity:0;transform:translateY(8px);transition:opacity .3s ease,transform .3s ease}.onboarding-tooltip.visible{opacity:1;transform:translateY(0)}.onboarding-step-counter{font-size:12px;color:#888;margin-bottom:6px;letter-spacing:.5px}.onboarding-title{font-size:18px;font-weight:700;margin:0 0 8px;color:#fff}.onboarding-description{font-size:14px;line-height:1.5;margin:0 0 18px;color:#b0b0ba}.onboarding-dots{display:flex;gap:6px;margin-bottom:16px}.onboarding-dot{width:8px;height:8px;border-radius:50%;background:#444;transition:background .25s ease}.onboarding-dot.active{background:#6c8cff}.onboarding-dot.completed{background:#5a7aee}.onboarding-buttons{display:flex;align-items:center;gap:8px;justify-content:flex-end}.onboarding-btn{border:none;border-radius:8px;padding:8px 18px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s ease,opacity .2s ease;line-height:1}.onboarding-btn:focus-visible{outline:2px solid #6c8cff;outline-offset:2px}.onboarding-btn-skip{background:transparent;color:#888;margin-right:auto}.onboarding-btn-skip:hover{color:#bbb}.onboarding-btn-back{background:#2a2a3a;color:#c0c0c8}.onboarding-btn-back:hover{background:#35354a}.onboarding-btn-next{background:#6c8cff;color:#fff}.onboarding-btn-next:hover{background:#5a7aee}@keyframes onboarding-fade-in{0%{opacity:0}to{opacity:1}}.onboarding-overlay{animation:onboarding-fade-in .3s ease forwards}.onboarding-overlay.exiting{animation:onboarding-fade-out .25s ease forwards}@keyframes onboarding-fade-out{0%{opacity:1}to{opacity:0}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100dvh;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}:root{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-tertiary: #0f3460;--bg-canvas-area: #2a2a3e;--bg-panel: #1e1e32;--bg-panel-hover: #2a2a42;--bg-input: #12122a;--text-primary: #e8e8f0;--text-secondary: #a0a0b8;--text-muted: #6a6a80;--accent: #e94560;--accent-hover: #ff6b81;--accent-dim: rgba(233, 69, 96, .3);--border: #2a2a42;--border-light: #3a3a52;--button-size: 44px;--toolbar-width: 56px;--topbar-height: 44px;--tool-options-height: 40px;--panel-width: 260px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--shadow: 0 2px 8px rgba(0, 0, 0, .3);--shadow-lg: 0 4px 16px rgba(0, 0, 0, .4)}#inkflow-app{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--text-primary);font-size:24px}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-sm)}.always-show-focus :focus{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-sm)}.skip-to-content{position:absolute;left:-9999px;top:0;z-index:99999;padding:.5rem 1rem;background:var(--accent);color:#fff;font-size:.9rem;font-weight:600;text-decoration:none;border-radius:0 0 var(--radius-md) 0}.skip-to-content:focus{left:0}button,[role=button],input[type=checkbox],input[type=radio],select{min-width:44px;min-height:44px}input[type=text],input[type=number],input[type=range],textarea{min-width:auto;min-height:auto}.high-contrast{--text-primary: #ffffff;--text-secondary: #d0d0e0;--text-muted: #a0a0c0;--border: #5050ff;--border-light: #6060ff;--bg-panel: #0a0a1e;--bg-panel-hover: #1a1a3e;--accent: #ff4070;--accent-hover: #ff7090;--accent-dim: rgba(255, 64, 112, .4)}.high-contrast button,.high-contrast [role=button]{border:1px solid var(--border-light)}[data-handedness=left] .main-area{flex-direction:row-reverse}[data-handedness=left] .main-toolbar{border-right:none;border-left:1px solid var(--border)}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}[data-colorblind=labels] .color-swatch:after{content:attr(data-color-name);position:absolute;bottom:-14px;left:50%;transform:translate(-50%);font-size:8px;white-space:nowrap;color:var(--text-muted);pointer-events:none}.settings-checkbox{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:var(--text-primary);cursor:pointer}.settings-checkbox input[type=checkbox]{min-width:20px;min-height:20px;width:20px;height:20px;accent-color:var(--accent);cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
