.top-menu-bar{display:flex;justify-content:space-between;align-items:center;background:#2c2c2c;color:#e0e0e0;height:32px;border-bottom:1px solid #1a1a1a;font-size:13px;-webkit-user-select:none;user-select:none;position:relative;z-index:1000}.menu-left{display:flex;align-items:center;height:100%}.app-logo{display:flex;align-items:center;justify-content:center;width:32px;height:32px;margin-left:8px;margin-right:8px;cursor:pointer;transition:background .1s}.app-logo:hover{background:#3a3a3a}.logo-svg{height:20px;width:auto;filter:brightness(0) invert(1);transition:filter .2s}.app-logo:hover .logo-svg{filter:brightness(0) invert(1) sepia(1) saturate(1) hue-rotate(200deg)}.menu-items{display:flex;height:100%}.menu-container{position:relative}.menu-button{background:transparent;border:none;color:#e0e0e0;padding:0 12px;height:32px;cursor:pointer;font-size:13px;transition:background .1s}.menu-button:hover{background:#3a3a3a}.menu-button.active{background:#404040}.menu-dropdown{position:absolute;top:32px;left:0;background:#2c2c2c;border:1px solid #1a1a1a;box-shadow:0 4px 12px #00000080;min-width:200px;padding:4px 0;z-index:1001}.menu-item{display:flex;justify-content:space-between;align-items:center;padding:6px 20px;cursor:pointer;position:relative}.menu-item:hover:not(.disabled){background:#3a3a3a}.menu-item.disabled{opacity:.4;cursor:default}.menu-item-label{display:flex;align-items:center;gap:8px}.menu-item-check{width:16px;text-align:center}.menu-item-shortcut{color:#888;font-size:11px;margin-left:32px}.menu-item-arrow{color:#888;font-size:10px}.menu-separator{height:1px;background:#3a3a3a;margin:4px 0}.submenu{display:none;position:absolute;left:100%;top:-4px;background:#2c2c2c;border:1px solid #1a1a1a;box-shadow:0 4px 12px #00000080;min-width:180px;padding:4px 0}.menu-item.has-submenu:hover .submenu{display:block}.menu-right{display:flex;align-items:center;gap:12px;padding-right:12px}.quick-actions{display:flex;align-items:center;gap:8px}.quick-action-btn{display:flex;align-items:center;gap:4px;background:transparent;border:1px solid #3a3a3a;border-radius:4px;color:#e0e0e0;padding:4px 10px;font-size:12px;cursor:pointer;transition:all .2s;position:relative}.quick-action-btn:hover:not(:disabled){background:#3a3a3a;border-color:#4a4a4a}.quick-action-btn:disabled{opacity:.5;cursor:not-allowed}.quick-action-btn.locked{border-color:#444}.quick-action-btn.has-changes{border-color:#f39c12;animation:pulse-border 2s infinite}.quick-action-btn.upgrade-btn{background:linear-gradient(135deg,#667eea,#764ba2);border:none;color:#fff;font-weight:500}.quick-action-btn.upgrade-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea66}.quick-action-btn.upgrade-needed{background:linear-gradient(135deg,#667eea,#764ba2);border:none;color:#fff;font-weight:500;animation:gentle-glow 3s infinite}.quick-action-btn.upgrade-needed:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea80}.btn-icon{font-size:14px}.btn-label{font-size:12px}.menu-status{display:flex;align-items:center;gap:16px}.unsaved-indicator{color:#f39c12;font-size:11px}.user-info{display:flex;align-items:center;gap:6px;cursor:pointer;padding:4px;border-radius:4px;transition:background .2s}.user-info:hover{background:#3a3a3a}.user-avatar{width:24px;height:24px;border-radius:50%;object-fit:cover}.user-avatar-placeholder{width:24px;height:24px;border-radius:50%;background:#4a90e2;color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}.pro-badge{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:2px 6px;border-radius:10px;font-size:10px;font-weight:600;letter-spacing:.5px}.sign-in-btn{background:#4a90e2;border:none;color:#fff;padding:6px 16px;border-radius:4px;font-size:12px;cursor:pointer;transition:background .2s}.sign-in-btn:hover{background:#5ba0f2}.menu-item.highlight{color:gold;font-weight:500}.menu-item.highlight:hover{background:linear-gradient(90deg,#667eea1a,#764ba21a)}@keyframes pulse-border{0%,to{border-color:#f39c12}50%{border-color:#e67e22}}@keyframes gentle-glow{0%,to{box-shadow:0 2px 8px #667eea4d}50%{box-shadow:0 2px 12px #667eea80}}.left-toolbar{width:48px;background:#2c2c2c;border-right:1px solid #1a1a1a;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none}.toolbar-header{padding:8px;text-align:center;font-size:9px;color:#888;border-bottom:1px solid #1a1a1a;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.toolbar-tools{flex:1;padding:4px;display:flex;flex-direction:column;gap:2px}.toolbar-button{width:40px;height:40px;background:#363636;border:1px solid #2a2a2a;border-radius:4px;color:#e0e0e0;cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;transition:all .1s}.toolbar-button:hover{background:#404040;border-color:#4a4a4a}.toolbar-button.active{background:#4a90e2;border-color:#5a9ff2;color:#fff}.toolbar-button.toggled{background:#3a7a3a;border-color:#4a8a4a}.tool-icon{font-size:18px;line-height:1}.tool-shortcut{position:absolute;bottom:2px;right:2px;font-size:8px;background:#00000080;padding:1px 3px;border-radius:2px;color:#aaa}.toolbar-separator{height:1px;background:#3a3a3a;margin:4px 0}.toolbar-footer{padding:4px;border-top:1px solid #1a1a1a}.help-button{font-weight:700;font-size:14px}.layers-panel{background:#2c2c2c;border:1px solid #1a1a1a;display:flex;flex-direction:column;height:100%;color:#e0e0e0;font-size:12px}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px;background:#363636;border-bottom:1px solid #1a1a1a}.panel-title{font-weight:600;text-transform:uppercase;font-size:11px;letter-spacing:.5px}.panel-actions{display:flex;gap:4px}.panel-action{background:transparent;border:none;color:#888;cursor:pointer;padding:2px 6px;font-size:14px;border-radius:2px;transition:all .1s}.panel-action:hover{background:#404040;color:#e0e0e0}.panel-action:disabled{opacity:.4;cursor:not-allowed}.layer-group{background:#242424;margin-bottom:2px}.group-header{background:#2a2a2a;border-left:3px solid #4a90e2}.group-expand{background:transparent;border:none;color:#888;cursor:pointer;padding:2px;font-size:10px;transition:color .1s}.group-expand:hover{color:#e0e0e0}.group-icon{font-size:16px;display:flex;align-items:center;justify-content:center;height:100%}.group-children{padding-left:20px;background:#1f1f1f}.layer-count{font-size:10px;color:#666}.layers-list.drag-over-root{background:#4a90e21a;border:2px dashed #4a90e2}.delete-group-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.delete-group-dialog{background:#2c2c2c;border:1px solid #1a1a1a;border-radius:8px;padding:24px;max-width:400px;box-shadow:0 8px 32px #00000080}.delete-group-dialog h3{margin:0 0 12px;color:#e0e0e0;font-size:16px}.delete-group-dialog p{color:#999;margin:0 0 24px;font-size:14px}.dialog-buttons{display:flex;flex-direction:column;gap:8px}.dialog-button{padding:10px 16px;background:#363636;border:1px solid #4a4a4a;border-radius:4px;color:#e0e0e0;cursor:pointer;font-size:13px;transition:all .1s}.dialog-button:hover{background:#404040;border-color:#5a5a5a}.dialog-button.danger{background:#5a2a2a;border-color:#6a3a3a;color:#f99}.dialog-button.danger:hover{background:#6a3a3a;border-color:#7a4a4a}.dialog-button.secondary{background:transparent;border-color:#3a3a3a;color:#888}.dialog-button.secondary:hover{background:#2a2a2a;color:#aaa}.layers-controls{padding:8px;border-bottom:1px solid #1a1a1a}.blend-mode{width:100%;background:#363636;border:1px solid #4a4a4a;color:#e0e0e0;padding:4px 8px;border-radius:4px;margin-bottom:8px;font-size:12px}.blend-mode:disabled{opacity:.5;cursor:not-allowed}.opacity-control label{font-size:11px;color:#888;min-width:45px}.opacity-slider{flex:1;height:4px;background:#4a4a4a;border-radius:2px;outline:none;cursor:pointer}.opacity-slider:disabled{opacity:.5;cursor:not-allowed}.opacity-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;background:#4a90e2;border-radius:50%;cursor:pointer}.opacity-slider::-moz-range-thumb{width:12px;height:12px;background:#4a90e2;border-radius:50%;border:none;cursor:pointer}.opacity-control{display:flex;align-items:center;gap:8px}.opacity-control label{font-size:11px;color:#888}.opacity-slider{flex:1;height:4px;background:#363636;outline:none;-webkit-appearance:none}.opacity-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:#4a90e2;border-radius:50%;cursor:pointer}.opacity-value{font-size:11px;color:#888;min-width:35px;text-align:right}.layers-list{flex:1;overflow-y:auto;padding:4px}.empty-layers{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#666}.empty-layers .hint{font-size:11px;color:#555}.layer-item{display:flex;align-items:center;gap:8px;padding:6px;background:#363636;border:1px solid #2a2a2a;border-radius:4px;margin-bottom:2px;cursor:pointer;transition:all .1s;-webkit-user-select:none;user-select:none}.layer-item:hover{background:#404040}.layer-item.selected{background:#4a90e2;border-color:#5a9ff2}.layer-item.drag-over{border-top:2px solid #4a90e2}.layer-controls{display:flex;gap:2px}.layer-visibility,.layer-lock{width:20px;height:20px;background:transparent;border:none;color:#555;cursor:pointer;font-size:12px;border-radius:2px;display:flex;align-items:center;justify-content:center;transition:all .1s}.layer-visibility.visible,.layer-lock.locked{color:#e0e0e0}.layer-visibility:hover,.layer-lock:hover{background:#4a4a4a}.layer-item.locked{opacity:.6;cursor:not-allowed}.layer-item.locked .layer-name{color:#888}.layer-thumbnail{width:32px;height:32px;background:#2a2a2a;border:1px solid #1a1a1a;border-radius:2px;overflow:hidden;display:flex;align-items:center;justify-content:center}.layer-thumbnail img{width:100%;height:100%;object-fit:cover}.empty-thumbnail{color:#555;font-weight:700}.layer-info{flex:1;display:flex;flex-direction:column;gap:2px}.layer-name{font-size:12px;font-weight:500}.layer-name-input{background:#2a2a2a;border:1px solid #4a90e2;color:#e0e0e0;padding:2px 4px;font-size:12px;border-radius:2px;outline:none}.layer-details{display:flex;gap:8px;font-size:10px;color:#888}.layer-context-menu{position:fixed;background:#2c2c2c;border:1px solid #1a1a1a;box-shadow:0 4px 12px #00000080;padding:4px 0;z-index:10000;min-width:150px}.context-menu-item{padding:6px 16px;cursor:pointer;transition:background .1s}.context-menu-item:hover{background:#3a3a3a}.context-menu-item.danger{color:#e74c3c}.context-menu-separator{height:1px;background:#3a3a3a;margin:4px 0}.properties-panel{background:#2c2c2c;color:#e0e0e0;height:100%;display:flex;flex-direction:column;font-size:12px}.no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#666}.no-selection .hint{font-size:11px;color:#555}.properties-content{flex:1;overflow-y:auto;padding:12px}.property-section{margin-bottom:20px}.property-section h4{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#888;margin:0 0 12px;font-weight:600}.property-group{margin-bottom:16px}.property-group label{display:block;margin-bottom:6px;color:#aaa;font-size:11px}.position-inputs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.input-group{display:flex;align-items:center;gap:4px}.input-label{color:#888;font-size:10px;font-weight:600;min-width:12px}.property-group input[type=number]{background:#363636;border:1px solid #1a1a1a;color:#e0e0e0;padding:4px 6px;border-radius:2px;font-size:11px;width:100%;outline:none}.property-group input[type=number]:focus{border-color:#4a90e2}.slider-group{display:flex;align-items:center;gap:8px}.property-slider{flex:1;height:4px;background:#363636;outline:none;-webkit-appearance:none;border-radius:2px}.property-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:#4a90e2;border-radius:50%;cursor:pointer}.property-slider::-webkit-slider-thumb:hover{background:#5aa0f2;transform:scale(1.2)}.slider-value{width:50px}.unit{color:#888;font-size:10px}.flip-buttons{display:flex;gap:8px}.flip-button{flex:1;padding:8px;background:#363636;border:1px solid #1a1a1a;color:#888;border-radius:4px;cursor:pointer;font-size:16px;transition:all .1s}.flip-button:hover{background:#404040;color:#e0e0e0}.flip-button.active{background:#4a90e2;border-color:#5a9ff2;color:#fff}.action-buttons{display:flex;flex-direction:column;gap:8px}.action-button{padding:8px 12px;background:#363636;border:1px solid #1a1a1a;color:#e0e0e0;border-radius:4px;cursor:pointer;font-size:12px;transition:all .1s}.action-button:hover{background:#404040;border-color:#4a4a4a}.action-button.danger{color:#e74c3c;border-color:#8b2418}.action-button.danger:hover{background:#8b2418;color:#fff}.appearance-panel{background:#2c2c2c;color:#e0e0e0;height:100%;display:flex;flex-direction:column;font-size:12px}.appearance-content{flex:1;overflow-y:auto;padding:12px}.appearance-section{margin-bottom:24px}.appearance-section h4{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#888;margin:0 0 12px;font-weight:600}.body-type-selector{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}.body-type-option{display:flex;flex-direction:column;align-items:center;padding:12px 8px;background:#1e1e1e;border:2px solid #2a2a2a;border-radius:4px;cursor:pointer;transition:all .1s}.body-type-option:hover{background:#252525;border-color:#4a4a4a}.body-type-option.active{background:#2a2a2a;border-color:#4a90e2}.body-type-icon{font-size:24px;margin-bottom:4px}.body-type-label{font-size:11px;color:#999;text-transform:uppercase;letter-spacing:.5px}.body-type-option.active .body-type-label{color:#4a90e2}.preset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.preset-button{aspect-ratio:1;border:2px solid #2a2a2a;border-radius:4px;cursor:pointer;position:relative;overflow:hidden;transition:all .1s}.preset-button:hover{border-color:#4a4a4a;transform:scale(1.05)}.preset-button.active{border-color:#4a90e2;box-shadow:0 0 0 2px #4a90e240}.preset-button.skin-tone{min-height:40px}.preset-label{position:absolute;bottom:2px;left:2px;right:2px;background:#000000b3;color:#fff;font-size:9px;padding:2px;text-align:center;border-radius:2px}.preset-list{display:flex;flex-direction:column;gap:2px}.preset-item{display:flex;align-items:center;gap:8px;padding:8px;background:#363636;border:1px solid #2a2a2a;border-radius:4px;cursor:pointer;transition:all .1s;color:#e0e0e0}.preset-item:hover{background:#404040}.preset-item.active{background:#4a90e2;border-color:#5a9ff2;color:#fff}.preset-icon{font-size:14px}.preset-name{flex:1;text-align:left}.preset-check{font-size:12px}.background-grid{grid-template-columns:repeat(2,1fr)}.preset-button.background{min-height:60px}.toggle-options{display:flex;flex-direction:column;gap:8px}.toggle-option{display:flex;align-items:center;gap:8px;padding:8px;background:#363636;border:1px solid #2a2a2a;border-radius:4px;cursor:pointer;transition:all .1s}.toggle-option:hover{background:#404040}.toggle-option input[type=checkbox]{width:16px;height:16px;accent-color:#4a90e2}.toggle-option span{flex:1;font-size:12px}.toggle-option input:disabled+span{opacity:.5}.dock-base{display:flex;gap:4px;padding:8px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;box-shadow:0 2px 8px #0000001a;z-index:100}.dock-vertical{flex-direction:column}.dock-horizontal{flex-direction:row}.dock-right{position:fixed;right:16px}.dock-left{position:fixed;left:16px}.dock-top{position:fixed;top:16px}.dock-bottom{position:fixed;bottom:16px}.dock-button{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background:transparent;border:1px solid transparent;border-radius:6px;color:var(--text-secondary);cursor:pointer;transition:all .2s ease;position:relative}.dock-button:hover{background:var(--bg-tertiary);color:var(--text-primary);border-color:var(--border-color)}.dock-button.active{background:var(--accent-color);color:#fff;border-color:var(--accent-color)}.dock-button:disabled{opacity:.5;cursor:not-allowed}.dock-button:disabled:hover{background:transparent;border-color:transparent;transform:none}.dock-icon{flex-shrink:0}@media (max-width: 768px){.dock-base{padding:6px}.dock-button{width:44px;height:44px;min-width:44px;min-height:44px}}@media (prefers-color-scheme: dark){.dock-base{background:var(--bg-secondary);border-color:var(--border-color);box-shadow:0 2px 8px #0000004d}}.right-panel-dock{position:fixed;right:300px;top:30px;bottom:0;width:40px;background:var(--bg-secondary, #2a2a2a);border-left:1px solid var(--border-color, #333);border-radius:8px 0 0 8px;display:flex;flex-direction:column;align-items:center;padding:8px 0;gap:4px;z-index:1000;transition:right .3s ease}.right-panel-dock.panel-collapsed{right:0}.dock-button{width:32px;height:32px;background:transparent;border:none;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;color:var(--text-secondary, #888)}.dock-button:hover{background:var(--bg-hover, #3a3a3a);color:var(--text-primary, #ffffff);transform:scale(1.05)}.dock-button:active{transform:scale(.95)}.dock-icon{font-size:14px;line-height:1}.dock-button.history-active{background:var(--accent-color, #007AFF);color:#fff}.dock-button.history-active:hover{background:var(--accent-color-hover, #0056CC)}.right-panel{width:300px;background:#2c2c2c;border-left:1px solid #1a1a1a;display:flex;flex-direction:column;position:relative;transition:width .3s}.right-panel.collapsed{width:32px}.panel-toggle{position:absolute;top:50%;left:4px;transform:translateY(-50%);background:#363636;border:1px solid #1a1a1a;color:#888;padding:8px 4px;cursor:pointer;border-radius:2px;font-size:12px}.panel-tabs{display:flex;background:#363636;border-bottom:1px solid #1a1a1a;position:relative}.panel-tab{flex:1;background:transparent;border:none;color:#888;padding:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;transition:all .1s;border-bottom:2px solid transparent}.panel-tab:hover{background:#404040;color:#e0e0e0}.panel-tab.active{color:#e0e0e0;background:#2c2c2c;border-bottom-color:#4a90e2}.tab-icon{font-size:14px}.tab-label{font-weight:500}.panel-collapse{position:absolute;right:4px;top:50%;transform:translateY(-50%);background:transparent;border:none;color:#888;cursor:pointer;padding:4px;font-size:12px}.panel-collapse:hover{color:#e0e0e0}.panel-content{flex:1;overflow:hidden;display:flex;flex-direction:column}.status-bar{height:24px;background:#2c2c2c;border-top:1px solid #1a1a1a;display:flex;align-items:center;padding:0 8px;font-size:11px;color:#888;-webkit-user-select:none;user-select:none;position:relative;z-index:9999}.status-section{display:flex;align-items:center;gap:4px;padding:0 8px}.status-label{color:#666;font-weight:500}.status-value{color:#aaa}.status-workspace{text-transform:capitalize;color:#4a90e2;font-weight:600}.status-separator{width:1px;height:14px;background:#3a3a3a}.status-spacer{flex:1}.status-tips{margin-left:auto}.status-hint{color:#666;font-style:italic}.status-bar:hover .status-hint{color:#888}.storage-pill{display:flex;align-items:center;gap:4px;padding:2px 8px;border-radius:12px;font-size:10px;font-weight:600;cursor:pointer;transition:all .2s ease}.storage-cloud{background:linear-gradient(135deg,#4caf50,#2e7d32);color:#fff;box-shadow:0 2px 4px #4caf504d}.storage-local{background:linear-gradient(135deg,#2196f3,#1565c0);color:#fff;box-shadow:0 2px 4px #2196f34d}.storage-pill:hover{transform:translateY(-1px);box-shadow:0 4px 8px #0003}.storage-cloud:hover{box-shadow:0 4px 8px #4caf5066}.storage-local:hover{box-shadow:0 4px 8px #2196f366}.storage-icon{font-size:10px;line-height:1}.storage-text{font-size:9px;text-transform:uppercase;letter-spacing:.5px}.mobile-bottom-nav{position:fixed;bottom:0;left:0;right:0;background:var(--bg-primary);border-top:1px solid var(--border-color);z-index:1000;padding:8px 0;box-shadow:0 -2px 8px #0000001a}.mobile-nav-container{display:flex;justify-content:space-around;align-items:center;padding:0 8px;position:relative}.mobile-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:4px 8px;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;border-radius:8px;transition:all .2s ease;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;flex:1}.mobile-nav-item:hover,.mobile-nav-item:active{background:var(--bg-secondary);color:var(--text-primary)}.mobile-nav-item.active{background:var(--accent-color);color:#fff}.mobile-nav-item.center-action{background:var(--accent-color, #007AFF);color:#fff;border-radius:50%;width:56px;height:56px;min-width:56px;min-height:56px;margin:0 16px;box-shadow:0 4px 12px #007bff4d;flex:0 0 auto;position:relative;top:-8px}.mobile-nav-item.center-action:hover,.mobile-nav-item.center-action:active{background:var(--accent-color-hover, #0056CC);transform:scale(1.05)}.center-icon{margin-bottom:0!important}.mobile-nav-icon{font-size:12px;font-weight:600;margin-bottom:2px;line-height:1}.mobile-nav-label{font-size:10px;font-weight:500;line-height:1;text-align:center}@media (max-width: 768px){.mobile-bottom-nav{padding-bottom:max(8px,env(safe-area-inset-bottom))}}@media (min-width: 769px){.mobile-bottom-nav{display:none}}.mobile-bottom-sheet-overlay{position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;background:#00000080;z-index:10000;display:flex;align-items:flex-end;justify-content:center;animation:fadeIn .2s ease-out}.mobile-bottom-sheet{background:var(--bg-primary, #2c2c2c);border-radius:20px 20px 0 0;width:100vw;max-width:100vw;max-height:70vh;position:relative;left:0!important;right:0!important;top:auto!important;bottom:auto!important;margin:0;animation:slideUp .3s ease-out;touch-action:none;transform-origin:center bottom}.bottom-sheet-handle{display:flex;justify-content:center;padding:12px 0 8px;cursor:grab}.handle-bar{width:36px;height:4px;background:var(--text-quaternary);border-radius:2px}.bottom-sheet-content{padding:0 0 16px;max-height:calc(70vh - 40px);overflow-y:auto;-webkit-overflow-scrolling:touch}.mobile-bottom-sheet .right-panel{width:100%!important;height:auto!important;position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;border:none;box-shadow:none;background:transparent;margin:0!important}.mobile-bottom-sheet .panel-tabs{justify-content:space-around;padding:0 8px}.mobile-bottom-sheet .panel-tab{flex:1;margin:0 4px;min-height:44px;font-size:14px}.mobile-bottom-sheet .panel-content{padding:0}.mobile-bottom-sheet .property-slider,.mobile-bottom-sheet input[type=range]{min-height:44px;-webkit-appearance:none;background:transparent}.mobile-bottom-sheet .property-slider::-webkit-slider-thumb{width:24px;height:24px;border-radius:50%;background:var(--accent-color);cursor:pointer;-webkit-appearance:none;border:2px solid white;box-shadow:0 2px 4px #0003}.mobile-bottom-sheet .property-slider::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--accent-color);cursor:pointer;border:2px solid white;box-shadow:0 2px 4px #0003}.mobile-bottom-sheet button{min-height:44px;min-width:44px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.mobile-bottom-sheet .flip-button,.mobile-bottom-sheet .action-button{padding:12px 16px;font-size:14px}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media (min-width: 769px){.mobile-bottom-sheet-overlay{display:none}}.proui-layout{display:flex;flex-direction:column;height:100vh;background:#1a1a1a;overflow:hidden;position:relative}.proui-layout.fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;z-index:10000}.proui-main{flex:1;display:flex;overflow:hidden;position:relative}.proui-viewport{flex:1;background:#242424;position:relative;overflow:hidden}.cursor-select{cursor:default}.cursor-add{cursor:crosshair}.cursor-zoom{cursor:zoom-in}.cursor-eraser{cursor:not-allowed}.cursor-panning{cursor:grab}.cursor-panning:active{cursor:grabbing}.design-workspace .left-toolbar,.design-workspace .right-panel{display:none}.design-workspace .proui-viewport{max-width:100%}.review-workspace .left-toolbar,.review-workspace .right-panel,.review-workspace .top-menu-bar{display:none}.review-workspace .proui-viewport{max-width:100%}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.left-toolbar{animation:slideInLeft .3s ease-out}.right-panel{animation:slideInRight .3s ease-out}.proui-layout.mobile{height:100vh;height:100dvh}.proui-layout.mobile .proui-main{padding-bottom:72px}.proui-layout.mobile .proui-viewport{width:100%;height:100%;touch-action:pan-x pan-y}@media (max-width: 1024px){.right-panel{width:250px}}@media (max-width: 768px){.proui-layout{height:100vh;height:100dvh}.proui-main{padding-bottom:72px}.proui-viewport{width:100%;height:100%;background:#242424}.proui-viewport::-webkit-scrollbar{display:none}.proui-viewport{-ms-overflow-style:none;scrollbar-width:none}}.onboarding-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999;pointer-events:none}.onboarding-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000bf;pointer-events:all;cursor:pointer}.onboarding-backdrop-with-hole{position:fixed;top:0;left:0;right:0;bottom:0;pointer-events:all;cursor:pointer}.onboarding-highlight-border{position:fixed;border:2px solid rgba(0,122,255,.6);border-radius:8px;pointer-events:none;animation:pulse-border 2s infinite}@keyframes pulse-border{0%,to{border-color:#007aff99;box-shadow:0 0 20px #007aff4d}50%{border-color:#007affe6;box-shadow:0 0 40px #007aff80}}.onboarding-tooltip{position:fixed;background:var(--bg-primary, #1a1a1a);border:1px solid var(--border-color, #333);border-radius:12px;padding:20px;width:320px;box-shadow:0 10px 40px #00000080;pointer-events:all;animation:slideIn .3s ease;z-index:10000}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.onboarding-tooltip-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.onboarding-step-indicator{font-size:12px;color:var(--text-secondary, #999);text-transform:uppercase;letter-spacing:.5px;font-weight:600}.onboarding-tooltip-title{font-size:18px;font-weight:600;color:var(--text-primary, #ffffff);margin:0 0 8px}.onboarding-tooltip-description{font-size:14px;color:var(--text-secondary, #999);line-height:1.5;margin:0 0 20px}.onboarding-tooltip-actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.onboarding-btn{padding:8px 16px;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.onboarding-btn-primary{background:var(--accent-color, #007AFF);color:#fff}.onboarding-btn-primary:hover{background:var(--accent-hover, #0066CC)}.onboarding-btn-secondary{background:var(--bg-tertiary, #333);color:var(--text-primary, #ffffff);border:1px solid var(--border-color, #333)}.onboarding-btn-secondary:hover{background:var(--bg-hover, #3a3a3a)}.onboarding-btn-text{background:transparent;color:var(--text-secondary, #999);padding:8px}.onboarding-btn-text:hover{color:var(--text-primary, #ffffff)}.onboarding-progress{display:flex;justify-content:center;gap:8px}.onboarding-progress-dot{width:8px;height:8px;border-radius:50%;background:var(--bg-tertiary, #333);transition:all .3s ease}.onboarding-progress-dot.active{background:var(--accent-color, #007AFF);transform:scale(1.2)}.onboarding-progress-dot.completed{background:var(--success-color, #34C759)}.onboarding-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9999}.onboarding-modal{background:var(--bg-primary, #1a1a1a);border:1px solid var(--border-color, #333);border-radius:16px;padding:32px;max-width:400px;width:90%;box-shadow:0 20px 60px #00000080;animation:modalSlideIn .3s ease}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.onboarding-modal-content{text-align:center}.onboarding-modal-content h2{font-size:24px;font-weight:600;color:var(--text-primary, #ffffff);margin:0 0 12px}.onboarding-modal-content p{font-size:15px;color:var(--text-secondary, #999);line-height:1.5;margin:0 0 24px}.onboarding-modal-actions{display:flex;gap:12px;justify-content:center}@media (max-width: 768px){.onboarding-tooltip{width:calc(100vw - 40px);max-width:320px}.onboarding-modal{padding:24px}.onboarding-btn{padding:10px 16px;font-size:15px}}*{box-sizing:border-box}html,body{margin:0;padding:0;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#1a1a1a;color:#e0e0e0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#2c2c2c}::-webkit-scrollbar-thumb{background:#555;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#666}::selection{background:#4a90e2;color:#fff}*:focus{outline:2px solid #4a90e2;outline-offset:1px}button:focus,input:focus,select:focus{outline-offset:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.cursor-crosshair{cursor:crosshair!important}.cursor-grab{cursor:grab!important}.cursor-grabbing{cursor:grabbing!important}.cursor-zoom-in{cursor:zoom-in!important}.cursor-zoom-out{cursor:zoom-out!important}.cursor-not-allowed{cursor:not-allowed!important}.spinner{width:20px;height:20px;border:2px solid #363636;border-top:2px solid #4a90e2;border-radius:50%;animation:spin 1s linear infinite}.pro-button{background:#363636;border:1px solid #2a2a2a;color:#e0e0e0;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:12px;transition:all .1s}.pro-button:hover{background:#404040;border-color:#4a4a4a}.pro-button:active{background:#2a2a2a}.pro-button.primary{background:#4a90e2;border-color:#5a9ff2}.pro-button.primary:hover{background:#5aa0f2}.pro-button.danger{background:#e74c3c;border-color:#c0392b}.pro-button.danger:hover{background:#c0392b}.pro-input{background:#363636;border:1px solid #2a2a2a;color:#e0e0e0;padding:6px 8px;border-radius:3px;font-size:12px;outline:none}.pro-input:focus{border-color:#4a90e2;box-shadow:0 0 0 1px #4a90e240}.pro-tooltip{position:absolute;background:#1a1a1a;color:#e0e0e0;padding:6px 8px;border-radius:4px;font-size:11px;box-shadow:0 4px 12px #00000080;z-index:10000;white-space:nowrap;pointer-events:none}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{width:100vw;height:100vh;overflow:hidden}
