@layer shared-ui{.app-container{display:flex;flex-direction:column;height:100vh;background-color:var(--bg-primary)}.app-header{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 var(--space-6);background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary);z-index:var(--z-sticky);-webkit-app-region:drag}.app-logo{display:flex;align-items:center;gap:var(--space-3);color:var(--text-primary);text-decoration:none;font-size:var(--font-size-xl);font-weight:700;-webkit-app-region:no-drag}.app-logo-icon{width:32px;height:32px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;object-fit:contain}.header-actions{display:flex;align-items:center;gap:var(--space-3);-webkit-app-region:no-drag}.app-main{display:flex;flex:1;overflow:hidden}.app-sidebar{width:280px;background-color:var(--bg-secondary);border-right:1px solid var(--border-primary);display:flex;flex-direction:column;overflow-y:auto}.app-content{flex:1;display:flex;flex-direction:column;overflow-y:auto;background-color:var(--bg-primary)}.dashboard-container{padding:var(--space-8);max-width:1200px;margin:0 auto;width:100%;min-height:100%;padding-bottom:var(--space-12)}.dashboard-header{margin-bottom:var(--space-8)}.dashboard-title{font-size:var(--font-size-3xl);font-weight:700;color:var(--text-primary);margin-bottom:var(--space-2)}.dashboard-subtitle{font-size:var(--font-size-lg);color:var(--text-secondary)}.dashboard-grid{display:grid;gap:var(--space-8)}.recent-projects{margin-bottom:var(--space-8)}.section-title{font-size:var(--font-size-xl);font-weight:600;color:var(--text-primary);margin-bottom:var(--space-4);display:flex;align-items:center;gap:var(--space-2)}.section-icon{width:24px;height:24px;color:var(--primary-blue)}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--space-4)}.project-card{background-color:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--space-6);transition:all var(--transition-normal);cursor:pointer}.project-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--primary-blue)}.project-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3)}.project-name{font-size:var(--font-size-lg);font-weight:600;color:var(--text-primary)}.project-date{font-size:var(--font-size-sm);color:var(--text-tertiary)}.project-preview{width:100%;height:120px;background-color:var(--bg-tertiary);border-radius:var(--radius-md);margin-bottom:var(--space-3);display:flex;align-items:center;justify-content:center;color:var(--text-tertiary);font-size:var(--font-size-sm)}.quick-actions{margin-bottom:var(--space-8)}.actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-4)}.action-card{background-color:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--space-6);text-align:center;transition:all var(--transition-normal);cursor:pointer}.action-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--primary-blue)}.action-icon{width:48px;height:48px;margin:0 auto var(--space-3);background:linear-gradient(135deg,var(--primary-blue),var(--primary-blue-light));border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--font-size-xl)}.action-title{font-size:var(--font-size-lg);font-weight:600;color:var(--text-primary);margin-bottom:var(--space-2)}.action-description{font-size:var(--font-size-sm);color:var(--text-secondary)}.tools-section{margin-bottom:var(--space-8)}.tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-6)}.tool-card{background-color:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--space-6);transition:all var(--transition-normal);cursor:pointer;position:relative;overflow:hidden}.tool-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-blue),var(--warning-orange))}.tool-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl);border-color:var(--primary-blue)}.tool-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4)}.tool-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--primary-blue),var(--primary-blue-light));border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--font-size-lg)}.tool-title{font-size:var(--font-size-xl);font-weight:600;color:var(--text-primary)}.tool-description{font-size:var(--font-size-sm);color:var(--text-secondary);line-height:1.6}.tool-status{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);background-color:var(--success-green);color:#fff;border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:500;margin-top:var(--space-3)}.tool-status.coming-soon{background-color:var(--gray-500)}@media(max-width:768px){.app-sidebar{width:240px}.dashboard-container{padding:var(--space-4)}.projects-grid,.tools-grid{grid-template-columns:1fr}}@media(max-width:640px){.app-main{flex-direction:column}.app-sidebar{width:100%;height:auto;border-right:none;border-bottom:1px solid var(--border-primary)}}.panel{background-color:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);display:flex;flex-direction:column;overflow:hidden}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-2) var(--space-3);background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary)}.panel-title{font-size:var(--font-size-md);font-weight:600;color:var(--text-primary);margin:0}.panel-content{flex:1;overflow-y:auto;padding:var(--space-2);min-height:120px}.layer-item{margin-bottom:var(--space-2);border:1px solid var(--border-primary);border-radius:var(--radius-md);overflow:hidden}.layer-header{display:flex;align-items:center;padding:var(--space-2) var(--space-3);background-color:var(--bg-secondary);cursor:pointer;transition:background-color var(--transition-fast)}.layer-header:hover{background-color:var(--bg-hover)}.layer-toggle{background:none;border:none;padding:var(--space-1);margin-right:var(--space-2);cursor:pointer;color:var(--text-secondary);transition:color var(--transition-fast)}.layer-toggle:hover{color:var(--text-primary)}.layer-checkbox{display:flex;align-items:center;gap:var(--space-2);cursor:pointer;flex:1}.layer-checkbox input[type=checkbox]{margin:0}.layer-name{font-weight:500;color:var(--text-primary)}.layer-objects{padding:var(--space-2) var(--space-4);background-color:var(--bg-primary);transition:all var(--transition-fast)}.layer-objects.collapsed{display:none}.layer-object{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);margin:var(--space-1) 0;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.layer-object:hover{background-color:var(--bg-hover)}.layer-object.selected{background-color:var(--primary-blue);color:var(--text-primary)}.layer-object.selected .object-icon,.layer-object.selected .object-name{color:#fff}.object-icon{font-size:var(--font-size-sm);color:var(--text-secondary);min-width:16px;text-align:center}.object-name{font-size:var(--font-size-sm);color:var(--text-primary);flex:1}.layer-empty{padding:var(--space-3);text-align:center;color:var(--text-secondary);font-size:var(--font-size-sm);font-style:italic}.layers-content{min-height:150px}.library-controls{display:flex;gap:var(--space-1)}.library-controls .btn{padding:var(--space-1) var(--space-2);font-size:var(--font-size-xs);min-width:auto}.library-path{padding:var(--space-2);background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary);font-size:var(--font-size-sm);color:var(--text-secondary);font-style:italic}.library-group-header{font-weight:700;margin-top:var(--space-2);margin-bottom:var(--space-1);color:var(--text-primary);font-size:var(--font-size-sm)}.library-group-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:6px;margin-bottom:var(--space-2)}.library-item{border:1px solid var(--border-primary);border-radius:var(--radius-sm);padding:6px;display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--bg-card);cursor:grab;transition:all var(--transition-fast)}.library-item:hover{border-color:var(--primary-blue);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.library-item:active{cursor:grabbing}.library-item[draggable=true]{cursor:grab}.library-item[draggable=true]:active{cursor:grabbing;opacity:.7}.library-item-image{width:56px;height:56px;object-fit:contain;pointer-events:none}.library-item-caption{font-size:var(--font-size-xs);text-align:center;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.editor-panels-left,.editor-panels-right{display:flex;flex-direction:column;position:relative}.panel-resize-handle{height:4px;background-color:var(--border-primary);cursor:row-resize;position:relative;transition:background-color var(--transition-fast);margin:var(--space-1) 0}.panel-resize-handle:hover{background-color:var(--primary-blue)}.panel-resize-handle:before{content:"";position:absolute;top:-2px;left:50%;transform:translate(-50%);width:20px;height:8px;background-color:var(--border-secondary);border-radius:var(--radius-sm);opacity:0;transition:opacity var(--transition-fast)}.panel-resize-handle:hover:before{opacity:1}.panel-resize-handle.dragging{background-color:var(--primary-blue)}.panel-resize-handle.dragging:before{opacity:1}.panel{flex-shrink:0}.panel:last-child{flex:1}.panel-spacer{background:transparent;border:none;flex:1;min-height:50px}#details-panel{height:600px;min-height:400px}#details-spacer{height:100px;min-height:50px}.object-details{display:flex;flex-direction:column;gap:8px}.rotation-controls{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);background-color:var(--bg-secondary);border-radius:var(--radius-md);border:1px solid var(--border-primary)}.rotation-controls label{font-size:var(--font-size-sm);font-weight:600;color:var(--text-primary);margin:0}.rotation-inputs{display:flex;align-items:center;gap:var(--space-2)}.rotation-range{flex:1}.rotation-number{width:60px;padding:4px 8px;border:1px solid var(--border-primary);border-radius:var(--radius-sm);background-color:var(--bg-primary);color:var(--text-primary);font-size:var(--font-size-sm);text-align:center}.rotation-unit{font-size:var(--font-size-sm);color:var(--text-secondary)}.object-preview{display:flex;flex-direction:column;gap:var(--space-3)}.object-preview strong{font-size:var(--font-size-md);font-weight:600;color:var(--text-primary);margin:0}.object-preview ul{list-style:none;padding:0;margin:0}.object-preview li{margin-bottom:var(--space-2)}.object-preview input[type=text]{width:100%;padding:6px 8px;border:1px solid var(--border-primary);border-radius:var(--radius-sm);background-color:var(--bg-primary);color:var(--text-primary);font-size:var(--font-size-sm);font-family:inherit}.object-preview input[type=text]:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px rgb(var(--primary-rgb) / .1)}.object-preview label{display:block;font-size:var(--font-size-sm);color:var(--text-secondary);margin-bottom:4px}.tools-panel{position:absolute;top:0;left:0;right:0;height:32px;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary);display:flex;align-items:center;justify-content:center;z-index:100;pointer-events:all;transition:transform var(--transition-normal),opacity var(--transition-normal)}.tools-panel.collapsed{transform:translateY(-100%);opacity:0;pointer-events:none}.tool-btn{width:28px;height:24px;background-color:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);color:var(--text-secondary);font-size:12px;display:flex;align-items:center;justify-content:center;margin:0 2px}.tool-btn:hover{background-color:var(--bg-hover);border-color:var(--primary-blue);color:var(--text-primary)}.tool-btn.active{background-color:var(--primary-blue);border-color:var(--primary-blue);color:#fff}.tools-collapse-btn{position:absolute;right:6px;top:50%;transform:translateY(-50%);background-color:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-sm);padding:2px 6px;cursor:pointer;font-size:9px;color:var(--text-secondary);transition:all var(--transition-fast);height:20px;display:flex;align-items:center}.tools-collapse-btn:hover{background-color:var(--bg-hover);color:var(--text-primary);border-color:var(--primary-blue)}.tools-expand-btn{position:absolute;top:2px;left:50%;transform:translate(-50%);background-color:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:0 0 var(--radius-sm) var(--radius-sm);padding:3px 10px;cursor:pointer;font-size:9px;color:var(--text-secondary);transition:all var(--transition-fast);z-index:99;box-shadow:var(--shadow-sm);height:18px;display:flex;align-items:center}.tools-expand-btn:hover{background-color:var(--bg-hover);color:var(--text-primary);border-color:var(--primary-blue)}.tools-panel.collapsed+.tools-expand-btn{display:flex}.editor-stage{position:relative;flex:1;display:flex;flex-direction:column}.stage-container{flex:1;margin-top:32px;position:relative;overflow:hidden;transition:margin-top var(--transition-normal);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.tools-panel.collapsed~.stage-container{margin-top:0}.tool-details-panel{background-color:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);overflow:hidden}.tool-details-panel .panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3);background-color:var(--bg-secondary);border-bottom:1px solid var(--border-primary)}.tool-details-panel .panel-title{font-size:var(--font-size-md);font-weight:600;color:var(--text-primary);margin:0}.tool-details-panel .panel-content{padding:var(--space-4)}.property-group{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:var(--space-3)}.property-group:last-child{margin-bottom:0}.property-group label{font-size:var(--font-size-sm);font-weight:500;color:var(--text-primary);margin:0 0 var(--space-1) 0;min-width:auto}.property-input{padding:var(--space-2);border:1px solid var(--border-primary);border-radius:var(--radius-sm);background-color:var(--bg-primary);color:var(--text-primary);font-size:var(--font-size-sm);min-width:100px;width:100%}.property-input[type=color]{width:50px;min-width:50px;height:32px;padding:2px;cursor:pointer}.property-input select{width:100%;cursor:pointer}.property-input:focus{outline:none;border-color:var(--primary-blue);box-shadow:0 0 0 2px #33a0ff1a}.property-value{font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:500}.shape-preview{pointer-events:none}.shape-point{pointer-events:none;opacity:.8}.shape-point-first{opacity:1;animation:pulse 1.5s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.6}to{opacity:1}}.shape-object{cursor:grab}.shape-object:active{cursor:grabbing}.path-preview{pointer-events:none}.path-object{cursor:grab;transition:stroke-width .2s ease}#overlay-svg:not(.geo-isolation-active) .path-object:hover{stroke-width:3px!important}#overlay-svg:not(.geo-isolation-active) .shape-object[data-geo-drawn-in-isolation],#overlay-svg:not(.geo-isolation-active) g.path-group[data-geo-drawn-in-isolation],#overlay-svg:not(.geo-isolation-active) g.path-group[data-geo-drawn-in-isolation] .path-object,#overlay-svg:not(.geo-isolation-active) g.path-group[data-geo-drawn-in-isolation] polyline{pointer-events:none!important}#overlay-svg:not(.geo-isolation-active) .shape-object[data-geo-drawn-in-isolation],#overlay-svg:not(.geo-isolation-active) .path-object[data-geo-drawn-in-isolation],#overlay-svg:not(.geo-isolation-active) g.path-group[data-geo-drawn-in-isolation] .path-object,#overlay-svg:not(.geo-isolation-active) g.path-group[data-geo-drawn-in-isolation] polyline{transition:none;cursor:inherit}#overlay-svg:not(.geo-isolation-active) .shape-object[data-geo-drawn-in-isolation]:hover,#overlay-svg:not(.geo-isolation-active) .path-object[data-geo-drawn-in-isolation]:hover,#overlay-svg:not(.geo-isolation-active) g.path-group[data-geo-drawn-in-isolation] .path-object:hover,#overlay-svg:not(.geo-isolation-active) g.path-group[data-geo-drawn-in-isolation] polyline:hover{stroke-width:revert!important}#overlay-svg:not(.geo-isolation-active) .shape-object[data-geo-drawn-in-isolation]:active,#overlay-svg:not(.geo-isolation-active) .path-object[data-geo-drawn-in-isolation]:active,#overlay-svg:not(.geo-isolation-active) g.path-group[data-geo-drawn-in-isolation]:active .path-object,#overlay-svg:not(.geo-isolation-active) g.path-group[data-geo-drawn-in-isolation]:active polyline{cursor:inherit}.path-object:active{cursor:grabbing}.comment-object{cursor:text;-webkit-user-select:none;user-select:none}.comment-object:hover{text-decoration:underline}.comment-object.selected-comment{fill:var(--primary-blue)!important;font-weight:700}.comment-group{cursor:text}}