:root{--lb-color-primary: #3b82f6;--lb-color-primary-foreground: #ffffff;--lb-color-background: #ffffff;--lb-color-foreground: #1f2937;--lb-color-border: #e5e7eb;--lb-color-muted: #f3f4f6;--lb-color-muted-foreground: #6b7280;--lb-panel-background: rgba(255, 255, 255, .9);--lb-panel-border: rgba(255, 255, 255, .4);--lb-panel-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--lb-selection-ring: #3b82f6;--lb-radius-sm: .375rem;--lb-radius-md: .5rem;--lb-radius-lg: .75rem;--lb-radius-xl: 1rem;--lb-spacing-xs: .25rem;--lb-spacing-sm: .5rem;--lb-spacing-md: 1rem;--lb-font-family: inherit;--lb-font-size-xs: .75rem;--lb-font-size-sm: .875rem;--lb-z-toolbar: 50;--lb-z-panel: 50}[class^=lb-]{box-sizing:border-box;font-family:var(--lb-font-family)}.lb-toolbar{position:absolute;top:1.5rem;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:var(--lb-spacing-sm);background-color:var(--lb-panel-background);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:.375rem;border-radius:var(--lb-radius-xl);box-shadow:var(--lb-panel-shadow);border:1px solid var(--lb-panel-border);z-index:var(--lb-z-toolbar)}.lb-toolbar__separator{width:1px;height:1.5rem;background-color:var(--lb-color-border);margin:0 .25rem}.lb-tool-button{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border-radius:var(--lb-radius-lg);transition:all .2s ease;border:none;background:transparent;color:var(--lb-color-muted-foreground);cursor:pointer;padding:0}.lb-tool-button:hover{background-color:var(--lb-color-muted)}.lb-tool-button--active{background-color:var(--lb-color-primary);color:var(--lb-color-primary-foreground);box-shadow:0 4px 6px -1px #3b82f64d}.lb-properties-panel{position:absolute;top:1.5rem;right:1.5rem;width:16rem;background-color:var(--lb-panel-background);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--lb-radius-xl);box-shadow:var(--lb-panel-shadow);border:1px solid var(--lb-color-border);padding:var(--lb-spacing-md);z-index:var(--lb-z-panel)}.lb-properties-panel__title{font-size:var(--lb-font-size-xs);font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--lb-color-muted-foreground);margin:0 0 var(--lb-spacing-md) 0}.lb-property-group{margin-bottom:var(--lb-spacing-md)}.lb-property-label{display:block;font-size:var(--lb-font-size-xs);font-weight:500;color:var(--lb-color-foreground);margin-bottom:var(--lb-spacing-sm)}.lb-color-grid{display:flex;flex-wrap:wrap;gap:var(--lb-spacing-sm)}.lb-color-swatch{width:1.5rem;height:1.5rem;border-radius:var(--lb-radius-sm);border:1px solid var(--lb-color-border);cursor:pointer;padding:0}.lb-input{width:100%;font-size:var(--lb-font-size-sm);padding:var(--lb-spacing-sm);background-color:#f9fafb;border:1px solid var(--lb-color-border);border-radius:var(--lb-radius-md);outline:none}.lb-input:focus{box-shadow:0 0 0 2px var(--lb-color-primary)}.lb-slider{width:100%;height:.25rem;background-color:var(--lb-color-border);border-radius:var(--lb-radius-md);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.lb-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1rem;height:1rem;background-color:var(--lb-color-primary);border-radius:50%}.lb-panel-footer{padding-top:var(--lb-spacing-sm);border-top:1px solid var(--lb-color-muted);display:flex;justify-content:space-between}.lb-text-button{font-size:var(--lb-font-size-xs);font-weight:500;color:var(--lb-color-muted-foreground);background:none;border:none;cursor:pointer;display:flex;align-items:center;padding:0}.lb-text-button:hover{color:var(--lb-color-primary)}.lb-icon-mr{margin-right:.375rem}.lb-zoom-controls{position:absolute;bottom:1.5rem;left:1.5rem;display:flex;align-items:center;gap:var(--lb-spacing-sm);background-color:var(--lb-panel-background);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:.375rem;border-radius:var(--lb-radius-xl);box-shadow:var(--lb-panel-shadow);border:1px solid var(--lb-color-border);z-index:var(--lb-z-panel)}.lb-zoom-button{width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--lb-radius-md);border:none;background:transparent;color:var(--lb-color-muted-foreground);cursor:pointer;padding:0}.lb-zoom-button:hover{background-color:var(--lb-color-muted)}.lb-zoom-value{font-size:var(--lb-font-size-xs);font-weight:700;color:var(--lb-color-foreground);width:3rem;text-align:center}.lb-zoom-separator{width:1px;height:1rem;background-color:var(--lb-color-border);margin:0 .25rem}.lb-fit-button{height:2rem;padding:0 .5rem;display:flex;align-items:center;justify-content:center;font-size:.625rem;font-weight:700;text-transform:uppercase;color:var(--lb-color-muted-foreground);background:transparent;border:none;border-radius:var(--lb-radius-md);cursor:pointer}.lb-fit-button:hover{background-color:var(--lb-color-muted)}.lb-element-text{-webkit-user-select:none;user-select:none;font-weight:500;pointer-events:none}.lb-selection-rect{pointer-events:none;fill:none;stroke:var(--lb-selection-ring);stroke-width:1;stroke-dasharray:4 2}.lb-element-container{width:100%;height:100%;overflow:hidden}.lb-element-container--selected{box-shadow:0 0 0 2px var(--lb-selection-ring)}.lb-canvas-container{position:relative;width:100%;height:100%;overflow:hidden;background-color:#fafafa;-webkit-user-select:none;user-select:none}.lb-canvas-container--hand{cursor:grab}.lb-canvas-container--hand:active{cursor:grabbing}.lb-canvas-container--default{cursor:default}.lb-svg-canvas{width:100%;height:100%;touch-action:none;outline:none}.lb-grid-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.2}.lb-connection{transition:all .3s ease}.lb-connection-preview{transition:none}.lb-resize-handle{fill:var(--lb-color-background);stroke:var(--lb-selection-ring);stroke-width:1px}body{margin:0;font-family:Rethink Sans,sans-serif;background-color:#f9fafb}.app-container{width:100vw;height:100vh;display:flex;flex-direction:column;overflow:hidden}.app-header{height:4rem;background-color:#fff;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between;padding:0 1.5rem;z-index:10}.logo-section{display:flex;align-items:center;gap:.75rem}.logo-icon{width:2rem;height:2rem;background-color:#2563eb;border-radius:.5rem;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700}.app-title{font-size:1.125rem;font-weight:700;color:#111827;margin:0}.app-title span{color:#3b82f6;font-weight:500}.header-controls{display:flex;align-items:center;gap:1rem}.last-action{font-size:.75rem;color:#6b7280;background-color:#f9fafb;padding:.375rem .75rem;border-radius:9999px}.export-btn{padding:.625rem 1.25rem;background-color:#111827;color:#fff;border-radius:.75rem;font-size:.875rem;font-weight:600;border:none;cursor:pointer;box-shadow:0 4px 6px -1px #0000001a}.export-btn:hover{background-color:#1f2937}.main-content{flex:1;display:flex}.sidebar{width:30%;background-color:#fff;border-right:1px solid #e5e7eb;overflow-y:auto}.sidebar-content{padding:1.5rem;display:flex;flex-direction:column;gap:2rem}.section-title{font-size:.875rem;font-weight:700;color:#111827;margin-bottom:1rem;display:flex;align-items:center}.section-icon{margin-right:.5rem;color:#3b82f6}.button-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.col-span-2{grid-column:span 2}.action-btn{padding:.5rem .75rem;color:#fff;border-radius:.25rem;font-size:.75rem;border:none;cursor:pointer;transition:background-color .2s}.btn-blue{background-color:#3b82f6}.btn-blue:hover{background-color:#2563eb}.btn-green{background-color:#22c55e}.btn-green:hover{background-color:#16a34a}.btn-purple{background-color:#a855f7}.btn-purple:hover{background-color:#9333ea}.btn-orange{background-color:#f97316}.btn-orange:hover{background-color:#ea580c}.btn-indigo{background-color:#6366f1}.btn-indigo:hover{background-color:#4f46e5}.btn-yellow{background-color:#eab308}.btn-yellow:hover{background-color:#ca8a04}.btn-red{background-color:#ef4444}.btn-red:hover{background-color:#dc2626}.btn-teal{background-color:#14b8a6}.btn-teal:hover{background-color:#0d9488}.btn-gray{background-color:#374151}.btn-gray:hover{background-color:#1f2937}.btn-light-gray{background-color:#4b5563}.btn-light-gray:hover{background-color:#374151}.btn-blue-dark{background-color:#2563eb}.btn-blue-dark:hover{background-color:#1d4ed8}.btn-secondary{background-color:#6b7280}.btn-secondary:hover{background-color:#4b5563}.canvas-area{flex:1;position:relative}.user-card{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 2px #0000000d;border:1px solid #e5e7eb;padding:1rem;height:100%;display:flex;flex-direction:column;justify-content:space-between;box-sizing:border-box}.user-header{display:flex;align-items:center;gap:.75rem}.user-avatar{width:2.5rem;height:2.5rem;border-radius:9999px;background-color:#dbeafe;display:flex;align-items:center;justify-content:center;color:#3b82f6}.user-name{font-size:.875rem;font-weight:700;color:#1f2937;margin:0}.user-role{font-size:.625rem;color:#9ca3af;margin:0}.user-footer{margin-top:1rem;padding-top:1rem;border-top:1px solid #f9fafb;display:flex;justify-content:space-between;align-items:center}.user-badge{padding:.125rem .5rem;border-radius:9999px;background-color:#dcfce7;color:#16a34a;font-size:.625rem;font-weight:700}.user-action{font-size:.75rem;color:#3b82f6;font-weight:500;background:none;border:none;cursor:pointer}