*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}*{border-color:var(--color-border, #e8e8ed)}body{background-color:var(--color-bg-primary, #ffffff);color:var(--color-text-primary, #1c1c1e);font-weight:400;font-feature-settings:"rlig" 1,"calt" 1}.\!container{width:100%!important}.container{width:100%}@media(min-width:640px){.\!container{max-width:640px!important}.container{max-width:640px}}@media(min-width:768px){.\!container{max-width:768px!important}.container{max-width:768px}}@media(min-width:1024px){.\!container{max-width:1024px!important}.container{max-width:1024px}}@media(min-width:1280px){.\!container{max-width:1280px!important}.container{max-width:1280px}}@media(min-width:1536px){.\!container{max-width:1536px!important}.container{max-width:1536px}}.btn{gap:8px;border-radius:8px;padding-left:16px;padding-right:16px;padding-top:.625rem;padding-bottom:.625rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);display:inline-flex;padding-left:var(--spacing-4);padding-right:var(--spacing-4);position:relative;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:all var(--transition-fast);transition-duration:.15s;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;align-items:center;justify-content:center}.btn:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#3b82f6}.btn:active{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:scale(.95)}.btn:disabled{--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:.6;transform:scale(1);cursor:not-allowed}.btn-primary{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1));--tw-shadow: 0 1px 2px rgba(0, 0, 0, .05);--tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);box-shadow:var(--shadow-sm)}.btn-primary:hover:not(:disabled){--tw-translate-y: -.125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1));--tw-shadow: 0 4px 6px rgba(0, 0, 0, .07);--tw-shadow-colored: 0 4px 6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.btn-secondary{border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1));border:1px solid var(--color-border)}.btn-secondary:hover:not(:disabled){--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.btn-danger{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.btn-danger:hover:not(:disabled){--tw-translate-y: -.125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-bg-opacity: 1;background-color:rgb(220 38 38 / var(--tw-bg-opacity, 1))}.btn-sm{padding-left:12px;padding-right:12px;padding-top:.375rem;padding-bottom:.375rem;font-size:.75rem;line-height:1rem;padding-left:var(--spacing-3);padding-right:var(--spacing-3);font-size:var(--font-size-xs)}.\!input,.input{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:8px;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding-left:12px;padding-right:12px;padding-top:.625rem;padding-bottom:.625rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);padding-left:var(--spacing-3);padding-right:var(--spacing-3);width:100%;font-size:var(--font-size-sm);border:1px solid var(--color-border);transition:all var(--transition-fast);transition-duration:.15s}.\!input:focus{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-shadow: 0 0 0 3px rgba(0,122,255,.15);--tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);outline:2px solid transparent;outline-offset:2px}.input:focus{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-shadow: 0 0 0 3px rgba(0,122,255,.15);--tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);outline:2px solid transparent;outline-offset:2px}.\!input:invalid{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity, 1))}.input:invalid{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity, 1))}.\!input::-moz-placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.\!input::placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.input::-moz-placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.input::placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.\!input:disabled{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1));opacity:.6;cursor:not-allowed}.input:disabled{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1));opacity:.6;cursor:not-allowed}.\!slider,.slider{height:.375rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:8px;--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1));outline:2px solid transparent;outline-offset:2px;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;transition:color var(--transition-fast),background-color var(--transition-fast),border-color var(--transition-fast);transition-duration:.15s;cursor:pointer}.\!slider:hover,.slider:hover{--tw-bg-opacity: 1;background-color:rgb(209 213 219 / var(--tw-bg-opacity, 1))}.\!slider:focus{--tw-shadow: 0 0 0 3px rgba(0,122,255,.15);--tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.slider:focus{--tw-shadow: 0 0 0 3px rgba(0,122,255,.15);--tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.\!slider::-webkit-slider-thumb{height:20px;width:20px;border-radius:9999px;border-width:2px;--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1));--tw-shadow: 0 1px 2px rgba(0, 0, 0, .05);--tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);cursor:pointer}.slider::-webkit-slider-thumb{height:20px;width:20px;border-radius:9999px;border-width:2px;--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1));--tw-shadow: 0 1px 2px rgba(0, 0, 0, .05);--tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);cursor:pointer}.\!slider::-webkit-slider-thumb{-webkit-appearance:none!important;appearance:none!important}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none}.\!slider::-webkit-slider-thumb:hover{--tw-scale-x: 1.1;--tw-scale-y: 1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow: 0 4px 6px rgba(0, 0, 0, .07);--tw-shadow-colored: 0 4px 6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transform:scale(1.1)}.slider::-webkit-slider-thumb:hover{--tw-scale-x: 1.1;--tw-scale-y: 1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow: 0 4px 6px rgba(0, 0, 0, .07);--tw-shadow-colored: 0 4px 6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transform:scale(1.1)}.\!slider::-webkit-slider-thumb:active{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:scale(.95)}.slider::-webkit-slider-thumb:active{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:scale(.95)}.\!slider::-moz-range-thumb{height:20px;width:20px;border-radius:9999px;border-width:2px;--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1));--tw-shadow: 0 1px 2px rgba(0, 0, 0, .05);--tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);cursor:pointer}.slider::-moz-range-thumb{height:20px;width:20px;border-radius:9999px;border-width:2px;--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1));--tw-shadow: 0 1px 2px rgba(0, 0, 0, .05);--tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);cursor:pointer}.tooltip{display:inline-block;position:relative}.tooltip:before{content:attr(data-tooltip);visibility:hidden;bottom:100%;left:50%;--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));white-space:nowrap;border-radius:8px;--tw-bg-opacity: 1;background-color:rgb(17 24 39 / var(--tw-bg-opacity, 1));padding-left:8px;padding-right:8px;padding-top:.375rem;padding-bottom:.375rem;font-size:.75rem;line-height:1rem;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);padding-left:var(--spacing-2);padding-right:var(--spacing-2);position:absolute;z-index:50;font-size:var(--font-size-xs);opacity:0;transition:all var(--transition-fast);transition-duration:.15s;pointer-events:none}.tooltip:after{content:"";visibility:hidden;bottom:100%;left:50%;--tw-translate-x: -50%;--tw-translate-y: 100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));border-width:4px;border-color:transparent;--tw-border-opacity: 1;border-top-color:rgb(17 24 39 / var(--tw-border-opacity, 1));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);position:absolute;z-index:50;opacity:0;transition:all var(--transition-fast);transition-duration:.15s;pointer-events:none}.tooltip:hover:before,.tooltip:hover:after{visibility:visible;opacity:1}@media(max-width:768px){.sidebar-left.tooltip:hover:before,.sidebar-left .tooltip:hover:after{transform:translate(0)}.sidebar-right.tooltip:hover:before,.sidebar-right .tooltip:hover:after{transform:translate(0)}}.\!sidebar,.sidebar{width:18rem;border-right-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);border-right:1px solid var(--color-border);transition:all var(--transition-fast);transition-duration:.2s}.\!sidebar.collapsed,.sidebar.collapsed{width:64px}.canvas-container{border-radius:10px;--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-shadow: 0 10px 15px rgba(0, 0, 0, .1);--tw-shadow-colored: 0 10px 15px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);position:relative;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden;min-width:var(--canvas-min-width);min-height:var(--canvas-min-height)}.tool-grid{gap:8px;display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.\!sidebar.collapsed .tool-grid,.sidebar.collapsed .tool-grid{grid-template-columns:repeat(1,minmax(0,1fr))}.tool-btn{min-height:80px;gap:4px;border-radius:8px;border-width:1px;--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1));padding:16px;font-size:.75rem;line-height:1rem;font-weight:500;--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);padding:var(--spacing-4);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);border:1px solid var(--color-border);transition:all var(--transition-fast);transition-duration:.15s;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center}.tool-btn:hover{--tw-translate-y: -.125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(239 246 255 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity, 1));--tw-shadow: 0 4px 6px rgba(0, 0, 0, .07);--tw-shadow-colored: 0 4px 6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.tool-btn:active{--tw-translate-y: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow: 0 1px 2px rgba(0, 0, 0, .05);--tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);box-shadow:var(--shadow-sm)}.tool-btn i{height:24px;width:24px}.\!sidebar.collapsed .tool-btn,.sidebar.collapsed .tool-btn{min-height:48px;padding:12px;padding:var(--spacing-3)}.\!sidebar.collapsed .tool-btn span{display:none}.canvas-empty.\!sidebar.collapsed .tool-btn span{opacity:0;pointer-events:none;display:none}.\!sidebar.collapsed .tool-btn span{display:none;visibility:hidden;opacity:0;pointer-events:none;contain:layout style paint}.command-palette-overlay.\!sidebar.collapsed .tool-btn span,.\!sidebar.collapsed .tool-btn span{display:none}.font-loader.\!sidebar.collapsed .tool-btn span{opacity:0;pointer-events:none}.dropdown-menu.\!sidebar.collapsed .tool-btn span{opacity:0;visibility:hidden;transform:translateY(-10px);pointer-events:none}.canvas-empty.sidebar.collapsed .tool-btn span{opacity:0;pointer-events:none;display:none}.sidebar.collapsed .tool-btn span{display:none;visibility:hidden;opacity:0;pointer-events:none;contain:layout style paint}.command-palette-overlay.sidebar.collapsed .tool-btn span,.sidebar.collapsed .tool-btn span{display:none}.font-loader.sidebar.collapsed .tool-btn span{opacity:0;pointer-events:none}.dropdown-menu.sidebar.collapsed .tool-btn span{opacity:0;visibility:hidden;transform:translateY(-10px);pointer-events:none}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.\!visible{visibility:visible!important}.visible{visibility:visible}.invisible{visibility:hidden}.collapse{visibility:collapse}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.bottom-0{bottom:0}.bottom-full{bottom:100%}.left-0{left:0}.left-1\/2{left:50%}.left-3{left:12px}.left-4{left:16px}.left-full{left:100%}.right-0{right:0}.right-3{right:12px}.right-4{right:16px}.right-5{right:20px}.right-full{right:100%}.top-1\/2{top:50%}.top-4{top:16px}.top-5{top:20px}.top-full{top:100%}.z-50{z-index:50}.z-\[1001\]{z-index:1001}.z-\[1050\]{z-index:1050}.z-\[1070\]{z-index:1070}.z-toast{z-index:1080}.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.my-4{margin-top:16px;margin-bottom:16px}.mb-1{margin-bottom:4px}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:12px}.mb-4{margin-bottom:16px}.mb-5{margin-bottom:20px}.ml-1{margin-left:4px}.ml-2{margin-left:8px}.mr-2{margin-right:8px}.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-4{margin-top:16px}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.h-0{height:0px}.h-1{height:4px}.h-10{height:40px}.h-12{height:48px}.h-3{height:12px}.h-3\.5{height:.875rem}.h-4{height:16px}.h-5{height:20px}.h-6{height:24px}.h-8{height:32px}.h-\[95vh\]{height:95vh}.h-px{height:1px}.max-h-\[200px\]{max-height:200px}.max-h-\[70vh\]{max-height:70vh}.max-h-\[90vh\]{max-height:90vh}.min-h-\[32px\]{min-height:32px}.min-h-\[40px\]{min-height:40px}.min-h-\[48px\]{min-height:48px}.w-0{width:0px}.w-10{width:40px}.w-12{width:48px}.w-3{width:12px}.w-3\.5{width:.875rem}.w-4{width:16px}.w-5{width:20px}.w-6{width:24px}.w-8{width:32px}.w-\[60px\]{width:60px}.w-\[95vw\]{width:95vw}.w-full{width:100%}.w-px{width:1px}.min-w-0{min-width:0px}.min-w-\[300px\]{min-width:300px}.min-w-\[60px\]{min-width:60px}.max-w-2xl{max-width:42rem}.max-w-\[400px\]{max-width:400px}.max-w-lg{max-width:32rem}.max-w-md{max-width:28rem}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize{resize:both}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.flex-wrap{flex-wrap:wrap}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.gap-1{gap:4px}.gap-1\.5{gap:.375rem}.gap-2{gap:8px}.gap-3{gap:12px}.gap-6{gap:24px}.self-stretch{align-self:stretch}.overflow-y-auto{overflow-y:auto}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:10px}.rounded-md{border-radius:8px}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-b{border-bottom-width:1px}.border-b-0{border-bottom-width:0px}.border-l-0{border-left-width:0px}.border-r-0{border-right-width:0px}.border-t{border-top-width:1px}.border-t-0{border-top-width:0px}.border-none{border-style:none}.border-amber-200{--tw-border-opacity: 1;border-color:rgb(253 230 138 / var(--tw-border-opacity, 1))}.border-blue-200{--tw-border-opacity: 1;border-color:rgb(191 219 254 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.border-green-200{--tw-border-opacity: 1;border-color:rgb(187 247 208 / var(--tw-border-opacity, 1))}.border-red-200{--tw-border-opacity: 1;border-color:rgb(254 202 202 / var(--tw-border-opacity, 1))}.border-red-500{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity, 1))}.border-x-transparent{border-left-color:transparent;border-right-color:transparent}.border-y-transparent{border-top-color:transparent;border-bottom-color:transparent}.border-b-gray-900{--tw-border-opacity: 1;border-bottom-color:rgb(17 24 39 / var(--tw-border-opacity, 1))}.border-l-gray-900{--tw-border-opacity: 1;border-left-color:rgb(17 24 39 / var(--tw-border-opacity, 1))}.border-r-gray-900{--tw-border-opacity: 1;border-right-color:rgb(17 24 39 / var(--tw-border-opacity, 1))}.border-t-blue-500{--tw-border-opacity: 1;border-top-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}.border-t-gray-900{--tw-border-opacity: 1;border-top-color:rgb(17 24 39 / var(--tw-border-opacity, 1))}.bg-amber-100{--tw-bg-opacity: 1;background-color:rgb(254 243 199 / var(--tw-bg-opacity, 1))}.bg-amber-50{--tw-bg-opacity: 1;background-color:rgb(255 251 235 / var(--tw-bg-opacity, 1))}.bg-black\/50{background-color:#00000080}.bg-blue-50{--tw-bg-opacity: 1;background-color:rgb(239 246 255 / var(--tw-bg-opacity, 1))}.bg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1))}.bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-gray-200{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1))}.bg-gray-300{--tw-bg-opacity: 1;background-color:rgb(209 213 219 / var(--tw-bg-opacity, 1))}.bg-gray-50{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.bg-gray-900{--tw-bg-opacity: 1;background-color:rgb(17 24 39 / var(--tw-bg-opacity, 1))}.bg-green-50{--tw-bg-opacity: 1;background-color:rgb(240 253 244 / var(--tw-bg-opacity, 1))}.bg-green-500{--tw-bg-opacity: 1;background-color:rgb(34 197 94 / var(--tw-bg-opacity, 1))}.bg-orange-50{--tw-bg-opacity: 1;background-color:rgb(255 247 237 / var(--tw-bg-opacity, 1))}.bg-red-50{--tw-bg-opacity: 1;background-color:rgb(254 242 242 / var(--tw-bg-opacity, 1))}.bg-red-500{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity, 1))}.bg-transparent{background-color:transparent}.bg-warning{--tw-bg-opacity: 1;background-color:rgb(245 158 11 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1{padding:4px}.p-1\.5{padding:.375rem}.p-2{padding:8px}.p-2\.5{padding:.625rem}.p-3{padding:12px}.p-4{padding:16px}.p-6{padding:24px}.px-1{padding-left:4px;padding-right:4px}.px-2{padding-left:8px;padding-right:8px}.px-3{padding-left:12px;padding-right:12px}.px-4{padding-left:16px;padding-right:16px}.px-6{padding-left:24px;padding-right:24px}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:4px;padding-bottom:4px}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:8px;padding-bottom:8px}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.py-4{padding-top:16px;padding-bottom:16px}.pl-10{padding-left:40px}.pl-5{padding-left:20px}.pr-10{padding-right:40px}.pr-12{padding-right:48px}.text-left{text-align:left}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-\[11px\]{font-size:11px}.text-base{font-size:1rem;line-height:1.5rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.italic{font-style:italic}.leading-relaxed{line-height:1.625}.leading-snug{line-height:1.375}.text-amber-600{--tw-text-opacity: 1;color:rgb(217 119 6 / var(--tw-text-opacity, 1))}.text-amber-700{--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity, 1))}.text-amber-800{--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity, 1))}.text-blue-500{--tw-text-opacity: 1;color:rgb(59 130 246 / var(--tw-text-opacity, 1))}.text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-blue-800{--tw-text-opacity: 1;color:rgb(30 64 175 / var(--tw-text-opacity, 1))}.text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.text-gray-600{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.text-green-600{--tw-text-opacity: 1;color:rgb(22 163 74 / var(--tw-text-opacity, 1))}.text-green-800{--tw-text-opacity: 1;color:rgb(22 101 52 / var(--tw-text-opacity, 1))}.text-orange-600{--tw-text-opacity: 1;color:rgb(234 88 12 / var(--tw-text-opacity, 1))}.text-red-600{--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity, 1))}.text-red-800{--tw-text-opacity: 1;color:rgb(153 27 27 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.underline{text-decoration-line:underline}.line-through{text-decoration-line:line-through}.opacity-25{opacity:.25}.opacity-70{opacity:.7}.opacity-75{opacity:.75}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px rgba(0, 0, 0, .1);--tw-shadow-colored: 0 10px 15px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px rgba(0, 0, 0, .07);--tw-shadow-colored: 0 4px 6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 2px rgba(0, 0, 0, .05);--tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-xl{--tw-shadow: 0 20px 25px rgba(0, 0, 0, .1);--tw-shadow-colored: 0 20px 25px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.blur{--tw-blur: blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.grayscale{--tw-grayscale: grayscale(100%);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.invert{--tw-invert: invert(100%);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.sepia{--tw-sepia: sepia(100%);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}*:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#3b82f6}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#3b82f6}.\!loading,.loading{position:relative;pointer-events:none}.\!loading:after{content:""!important}.loading:after{content:""}.\!loading:after{position:absolute;top:50%;left:50%;margin-top:-.625rem;margin-left:-.625rem;height:20px;width:20px}.\!loading:after{border-radius:9999px;border-width:2px;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-border-opacity: 1;border-top-color:rgb(59 130 246 / var(--tw-border-opacity, 1));position:absolute;border-radius:var(--radius-full);animation:spin 1s linear infinite}@media(prefers-reduced-motion:reduce){.\!loading:after{animation:none}}.\!loading:after{will-change:transform}.loading:after{position:absolute;top:50%;left:50%;margin-top:-.625rem;margin-left:-.625rem;height:20px;width:20px}.loading:after{border-radius:9999px;border-width:2px;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1));--tw-border-opacity: 1;border-top-color:rgb(59 130 246 / var(--tw-border-opacity, 1));position:absolute;border-radius:var(--radius-full);animation:spin 1s linear infinite}@media(prefers-reduced-motion:reduce){.loading:after{animation:none}}.loading:after{will-change:transform}@media(max-width:768px){.tool-grid{gap:8px;grid-template-columns:repeat(2,minmax(0,1fr))}.tool-btn{min-height:60px;padding:12px;padding:var(--spacing-3)}.sidebar.collapsed .tool-grid{grid-template-columns:repeat(1,minmax(0,1fr))}}@media(max-width:480px){.tool-grid{grid-template-columns:repeat(1,minmax(0,1fr))}.tool-btn{min-height:48px;padding:8px;flex-direction:row;justify-content:flex-start;padding:var(--spacing-2)}.tool-btn i{height:20px;width:20px}.tool-btn span{margin-left:8px;margin-left:var(--spacing-2)}}@media(prefers-contrast:high){:root{--color-border: #000000;--color-border-hover: #000000;--color-text-primary: #000000;--color-background-primary: #ffffff}[data-theme=dark]{--color-border: #ffffff;--color-border-hover: #ffffff;--color-text-primary: #ffffff;--color-background-primary: #000000}}@media print{.sidebar,.canvas-controls,.canvas-info-bar{display:none!important}.app-canvas{padding:0!important}.canvas-wrapper{border-radius:0!important;--tw-shadow: 0 0 #0000 !important;--tw-shadow-colored: 0 0 #0000 !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)!important}}:root{--bg: #ffffff;--bg-secondary: #f7f7f8;--bg-tertiary: #fafafa;--panel: #f7f7f8;--card: #ffffff;--canvas-bg: #e5e7eb;--canvas-sheet: #ffffff;--text: #111827;--text-2: #6b7280;--text-3: #9ca3af;--text-inverse: #ffffff;--primary: #6366f1;--primary-2: #4f46e5;--primary-hover: #4338ca;--primary-light: #eef2ff;--primary-dark: #312e81;--border: #e5e7eb;--border-hover: #d1d5db;--border-focus: #6366f1;--border-error: #ef4444;--success: #10b981;--success-light: #d1fae5;--danger: #ef4444;--danger-light: #fee2e2;--warning: #f59e0b;--warning-light: #fef3c7;--info: #3b82f6;--info-light: #dbeafe;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .07);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .1);--shadow-2xl: 0 25px 50px rgba(0, 0, 0, .15);--shadow-inner: inset 0 2px 4px rgba(0, 0, 0, .06);--radius-sm: 6px;--radius-md: 8px;--radius-lg: 10px;--radius-xl: 12px;--radius-2xl: 16px;--radius-full: 9999px;--spacing-1: 4px;--spacing-2: 8px;--spacing-3: 12px;--spacing-4: 16px;--spacing-5: 20px;--spacing-6: 24px;--spacing-8: 32px;--spacing-10: 40px;--spacing-12: 48px;--spacing-16: 64px;--spacing-20: 80px;--spacing-24: 96px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 30px;--font-size-4xl: 36px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--z-base: 0;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--z-toast: 1080;--z-loader: 9999}[data-theme=dark]{--bg: #0b0f14;--bg-secondary: #0f172a;--bg-tertiary: #111827;--panel: #0f172a;--card: #111827;--canvas-bg: #1f2937;--canvas-sheet: #ffffff;--text: #e5e7eb;--text-2: #9ca3af;--text-3: #6b7280;--text-inverse: #111827;--border: #1f2937;--border-hover: #374151;--border-focus: #6366f1;--border-error: #ef4444;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .5);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .6);--shadow-2xl: 0 25px 50px rgba(0, 0, 0, .7);--shadow-inner: inset 0 2px 4px rgba(0, 0, 0, .3)}body{background:var(--bg);color:var(--text);font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--color-primary: #007aff;--color-primary-hover: #0066d6;--color-primary-light: #e8f4ff;--color-primary-dark: #0051a8;--color-primary-subtle: #f5f9ff;--color-bg-primary: #ffffff;--color-bg-secondary: #f5f5f7;--color-bg-tertiary: #fafafa;--color-bg-quaternary: #f0f0f0;--color-text-primary: #1c1c1e;--color-text-secondary: #3c3c43;--color-text-tertiary: #8e8e93;--color-text-quaternary: #c7c7cc;--color-text-inverse: #ffffff;--color-success: #34c759;--color-success-light: #d4f5d4;--color-danger: #ff3b30;--color-danger-light: #ffe5e5;--color-warning: #ff9500;--color-warning-light: #fff4e5;--color-info: #007aff;--color-info-light: #e5f2ff;--color-border: #e8e8ed;--color-border-hover: #d1d1d6;--color-border-focus: #007aff;--color-border-error: #ff3b30;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);--shadow-md: 0 4px 12px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--shadow-xl: 0 16px 48px rgba(0, 0, 0, .15);--shadow-inner: inset 0 2px 4px rgba(0, 0, 0, .06);--radius-xs: 2px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 18px;--radius-2xl: 24px;--radius-full: 9999px;--spacing-0: 0px;--spacing-1: 4px;--spacing-2: 8px;--spacing-3: 12px;--spacing-4: 16px;--spacing-5: 20px;--spacing-6: 24px;--spacing-8: 32px;--spacing-10: 40px;--spacing-12: 48px;--spacing-16: 64px;--spacing-20: 80px;--spacing-24: 96px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .35s cubic-bezier(.4, 0, .2, 1);--transition-bounce: .3s cubic-bezier(.68, -.55, .265, 1.55);--font-size-xs: 12px;--font-size-sm: 14px;--font-size-base: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 30px;--font-size-4xl: 36px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--header-height: 64px;--sidebar-width: 280px;--sidebar-collapsed-width: 64px;--canvas-min-width: 400px;--canvas-min-height: 300px;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--z-toast: 1080}[data-theme=dark]{--color-bg-primary: #1c1c1e;--color-bg-secondary: #2c2c2e;--color-bg-tertiary: #3a3a3c;--color-bg-quaternary: #48484a;--color-text-primary: #ffffff;--color-text-secondary: #ebebf5;--color-text-tertiary: #8e8e93;--color-text-quaternary: #636366;--color-border: #48484a;--color-border-hover: #636366;--color-border-focus: #007aff;--color-border-error: #ff3b30;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .3);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);--shadow-md: 0 4px 12px rgba(0, 0, 0, .5);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .6);--shadow-xl: 0 16px 48px rgba(0, 0, 0, .7);--shadow-inner: inset 0 2px 4px rgba(0, 0, 0, .3)}[data-theme=high-contrast]{--color-primary: #0000ff;--color-bg-primary: #ffffff;--color-bg-secondary: #f0f0f0;--color-text-primary: #000000;--color-text-secondary: #333333;--color-border: #000000;--color-border-focus: #0000ff}@media(max-width:640px){:root{--sidebar-width: 100%;--sidebar-collapsed-width: 0;--header-height: 56px;--spacing-6: 16px;--spacing-8: 24px}}@media(max-width:480px){:root{--font-size-base: 14px;--spacing-4: 12px;--spacing-6: 16px}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);padding:10px 16px;border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);text-decoration:none;cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;-moz-user-select:none;user-select:none;position:relative;overflow:hidden}.btn:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-primary{background:var(--color-primary);color:var(--color-text-inverse);box-shadow:var(--shadow-sm)}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-secondary{background:var(--color-bg-primary);color:var(--color-text-primary);border:1px solid var(--color-border)}.btn-secondary:hover:not(:disabled){background:var(--color-bg-secondary);border-color:var(--color-border-hover)}.btn-danger{background:var(--color-danger);color:var(--color-text-inverse)}.btn-danger:hover:not(:disabled){background:#e62e24;transform:translateY(-1px)}.btn-success{background:var(--color-success);color:var(--color-text-inverse)}.btn-success:hover:not(:disabled){background:#2fb344;transform:translateY(-1px)}.btn-sm{padding:6px 12px;font-size:var(--font-size-xs)}.btn-lg{padding:14px 24px;font-size:var(--font-size-lg)}.btn-icon{width:36px;height:36px;padding:0;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--color-text-secondary);background:transparent;border:none;cursor:pointer;transition:all var(--transition-fast)}.btn-icon i,.btn-icon svg{width:18px;height:18px}.btn-icon:hover:not(:disabled){background:var(--color-bg-secondary);color:var(--color-text-primary)}.btn-icon:active:not(:disabled){transform:scale(.92);background:var(--color-bg-tertiary)}.btn-icon.active{background:var(--color-primary-light);color:var(--color-primary)}.btn-icon:disabled{opacity:.4;cursor:not-allowed}.btn-toggle{padding:8px 12px;border-radius:var(--radius-sm);background:var(--color-bg-secondary);color:var(--color-text-secondary);border:1px solid var(--color-border);transition:all var(--transition-fast)}.btn-toggle:hover:not(:disabled){background:var(--color-bg-tertiary);border-color:var(--color-border-hover)}.btn-toggle.active{background:var(--color-primary);color:var(--color-text-inverse);border-color:var(--color-primary);box-shadow:var(--shadow-sm)}.input{width:100%;padding:10px 12px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-family:inherit;color:var(--color-text-primary);transition:all var(--transition-fast);-webkit-appearance:none;-moz-appearance:none;appearance:none}.input:focus{outline:none;border-color:var(--color-border-focus);box-shadow:0 0 0 3px var(--color-primary-light);background:var(--color-bg-primary)}.input:invalid{border-color:var(--color-border-error)}.input::-moz-placeholder{color:var(--color-text-tertiary)}.input::placeholder{color:var(--color-text-tertiary)}.input:disabled{opacity:.6;cursor:not-allowed;background:var(--color-bg-quaternary)}.input-sm{padding:6px 10px;font-size:var(--font-size-xs)}.input-lg{padding:14px 16px;font-size:var(--font-size-lg)}.input-search{padding-left:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238E8E93' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:10px center;background-size:16px}.textarea{resize:vertical;min-height:80px;font-family:inherit}.slider{width:100%;height:6px;background:var(--color-bg-secondary);border-radius:3px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;transition:background var(--transition-fast)}.slider:focus{box-shadow:0 0 0 3px var(--color-primary-light)}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:var(--color-primary);cursor:pointer;border-radius:50%;border:3px solid var(--color-bg-primary);box-shadow:var(--shadow-sm);-webkit-transition:all var(--transition-fast);transition:all var(--transition-fast)}.slider::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:var(--shadow-md)}.slider::-webkit-slider-thumb:active{transform:scale(.95)}.slider::-moz-range-thumb{width:20px;height:20px;background:var(--color-primary);cursor:pointer;border-radius:50%;border:3px solid var(--color-bg-primary);box-shadow:var(--shadow-sm);-moz-transition:all var(--transition-fast);transition:all var(--transition-fast)}.slider-value{display:inline-block;margin-top:var(--spacing-1);font-size:var(--font-size-xs);color:var(--color-text-tertiary);font-weight:var(--font-weight-medium)}.checkbox-label{display:flex;align-items:center;gap:var(--spacing-2);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-size:var(--font-size-sm);color:var(--color-text-primary)}.checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:var(--color-primary)}.checkbox-label:hover{color:var(--color-text-secondary)}.color-picker{width:48px;height:40px;padding:4px;border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;background:transparent;transition:all var(--transition-fast)}.color-picker:hover{border-color:var(--color-primary);transform:scale(1.05)}.color-picker:focus{outline:none;border-color:var(--color-border-focus);box-shadow:0 0 0 3px var(--color-primary-light)}.badge{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 8px;background:var(--color-primary);color:var(--color-text-inverse);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);border-radius:12px;line-height:1}.badge-success{background:var(--color-success)}.badge-danger{background:var(--color-danger)}.badge-warning{background:var(--color-warning)}.badge-secondary{background:var(--color-text-tertiary)}.tooltip{position:relative;display:inline-block}.tooltip:before{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%);background:var(--color-text-primary);color:var(--color-text-inverse);padding:6px 8px;border-radius:var(--radius-sm);font-size:var(--font-size-xs);white-space:nowrap;opacity:0;visibility:hidden;transition:all var(--transition-fast);z-index:var(--z-tooltip);pointer-events:none}.tooltip:after{content:"";position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(100%);border:4px solid transparent;border-top-color:var(--color-text-primary);opacity:0;visibility:hidden;transition:all var(--transition-fast);z-index:var(--z-tooltip);pointer-events:none}.tooltip:hover:before,.tooltip:hover:after{opacity:1;visibility:visible}.loading{position:relative;pointer-events:none}.loading:after{content:"";position:absolute;top:50%;left:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.focus-ring:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px}.focus-ring-inset:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:-2px}.zoom-btn{width:32px;height:32px;padding:0;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--color-text-secondary);background:var(--color-bg-secondary);border:1px solid var(--color-border);cursor:pointer;transition:all var(--transition-fast)}.zoom-btn i,.zoom-btn svg{width:16px;height:16px}.zoom-btn:hover:not(:disabled){background:var(--color-bg-tertiary);border-color:var(--color-border-hover);color:var(--color-text-primary)}.zoom-btn:active:not(:disabled){transform:scale(.95)}.zoom-level{min-width:60px;text-align:center;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary);padding:6px 8px;background:var(--color-bg-secondary);border-radius:var(--radius-sm);border:1px solid var(--color-border);cursor:pointer;transition:all var(--transition-fast)}.zoom-level:hover{background:var(--color-bg-tertiary);border-color:var(--color-primary)}.zoom-control{display:flex;align-items:center;gap:var(--spacing-1);background:var(--color-bg-primary);padding:4px;border-radius:var(--radius-md);border:1px solid var(--color-border)}.export-btn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px 16px;text-align:left;width:100%;border-radius:var(--radius-md);transition:all var(--transition-fast)}.export-btn span{font-weight:var(--font-weight-medium);font-size:var(--font-size-sm)}.export-btn small{font-size:var(--font-size-xs);color:var(--color-text-tertiary);font-weight:var(--font-weight-normal)}.export-btn i,.export-btn svg{width:20px;height:20px;margin-bottom:4px}.export-formats{display:flex;flex-direction:column;gap:var(--spacing-2)}.section-title{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--spacing-3);padding-bottom:var(--spacing-2);border-bottom:1px solid var(--color-border)}.control-group{margin-bottom:var(--spacing-4)}.control-group>label:first-child{display:block;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);margin-bottom:var(--spacing-2)}.dimension-controls{display:flex;align-items:center;gap:var(--spacing-2)}.dimension-input{flex:1;display:flex;align-items:center;gap:var(--spacing-1)}.dimension-input .input{flex:1}.dimension-unit{font-size:var(--font-size-xs);color:var(--color-text-tertiary);min-width:24px}.dimension-separator{color:var(--color-text-tertiary);font-weight:var(--font-weight-medium)}.dimension-inputs{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-2)}.color-controls{display:flex;align-items:center;gap:var(--spacing-2)}.color-controls .input{flex:1;text-transform:uppercase;font-family:SF Mono,Monaco,Consolas,monospace;font-size:var(--font-size-xs)}.text-style-controls,.text-align-controls{display:flex;gap:var(--spacing-1)}.text-style-controls .btn-toggle,.text-align-controls .btn-toggle{flex:1;padding:8px}.text-align-btn i,.text-align-btn svg{width:16px;height:16px}.object-actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-2);margin-top:var(--spacing-4);padding-top:var(--spacing-4);border-top:1px solid var(--color-border)}.object-actions .btn{font-size:var(--font-size-xs);padding:8px 12px}.object-actions .btn i,.object-actions .btn svg{width:14px;height:14px}.font-preview{padding:12px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);margin-top:var(--spacing-2);font-size:24px;text-align:center;color:var(--color-text-primary)}.properties-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-8);text-align:center;color:var(--color-text-tertiary)}.empty-state-icon{width:48px;height:48px;margin-bottom:var(--spacing-4);opacity:.5}.empty-state-icon i,.empty-state-icon svg{width:100%;height:100%}.empty-state-text{font-size:var(--font-size-sm);max-width:200px;line-height:var(--line-height-relaxed)}.canvas-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:var(--color-bg-secondary);z-index:5;transition:opacity var(--transition-normal)}.canvas-empty.hidden{opacity:0;pointer-events:none}.empty-content{text-align:center;max-width:400px;padding:var(--spacing-8)}.empty-visual{margin-bottom:var(--spacing-6)}.empty-icon{width:64px;height:64px;color:var(--color-text-tertiary);opacity:.6}.empty-content h3{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-2)}.empty-content p{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-6)}.empty-actions{display:flex;gap:var(--spacing-3);justify-content:center;margin-bottom:var(--spacing-4)}.empty-tips{padding:var(--spacing-3);background:var(--color-bg-tertiary);border-radius:var(--radius-md);font-size:var(--font-size-xs);color:var(--color-text-secondary)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}body{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,Roboto,sans-serif;color:var(--color-text-primary);background:var(--color-bg-secondary);line-height:var(--line-height-normal);overflow:hidden;-webkit-user-select:none;-moz-user-select:none;user-select:none}.app-container{display:flex;flex-direction:column;height:100vh;overflow:hidden;position:relative}.app-header{height:var(--header-height);background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;padding:0 var(--spacing-6);box-shadow:var(--shadow-sm);z-index:var(--z-fixed);position:relative}[data-theme=dark] .app-header{background:#1c1c1ef2}.header-left,.header-right{display:flex;align-items:center;gap:var(--spacing-4)}.app-logo{display:flex;align-items:center;gap:var(--spacing-3)}.logo-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--color-primary) 0%,#5856d6 100%);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:var(--shadow-sm);transition:transform var(--transition-fast)}.logo-icon:hover{transform:scale(1.05)}.app-title{font-size:17px;font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);color:var(--color-text-primary)}.app-subtitle{font-size:11px;font-weight:var(--font-weight-medium);text-transform:uppercase;letter-spacing:.5px;color:var(--color-text-tertiary)}.header-divider{width:1px;height:24px;background:var(--color-border)}.header-actions{display:flex;gap:var(--spacing-2)}.app-body{flex:1;display:flex;overflow:hidden;position:relative}.sidebar{background:var(--color-bg-primary);border:1px solid var(--color-border);display:flex;flex-direction:column;transition:width var(--transition-normal);position:relative;overflow:hidden;z-index:var(--z-sticky)}.sidebar-right{width:250px;border-left:1px solid var(--color-border);border-right:none}.sidebar-toggle{position:absolute;top:50%;transform:translateY(-50%);width:24px;height:48px;background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--color-text-secondary);box-shadow:var(--shadow-sm);z-index:10;transition:all var(--transition-fast)}.sidebar-left .sidebar-toggle{right:-12px}.sidebar-right .sidebar-toggle{left:-12px}.sidebar-toggle:hover{background:var(--color-bg-secondary);color:var(--color-text-primary);transform:translateY(-50%) scale(1.05)}.sidebar-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--spacing-6);scrollbar-width:thin;scrollbar-color:var(--color-border) transparent}.sidebar.collapsed .sidebar-content{padding:var(--spacing-3)}.sidebar-section{margin-bottom:var(--spacing-8)}.sidebar-section:last-child{margin-bottom:0}.section-title{font-size:13px;font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.5px;color:var(--color-text-tertiary);margin-bottom:var(--spacing-3)}.sidebar.collapsed .section-title{display:none}.app-canvas{flex:1;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);display:flex;align-items:center;justify-content:center;padding:var(--spacing-8);overflow:auto;position:relative;min-height:0}[data-theme=dark] .app-canvas{background:linear-gradient(135deg,#2c2c2e,#1c1c1e)}.canvas-wrapper{background:var(--color-bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden;position:relative;min-width:var(--canvas-min-width);min-height:var(--canvas-min-height)}.canvas-container{position:relative;width:100%;height:100%;min-width:400px;min-height:300px;background:#fff;border:2px solid #e0e0e0;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg)}.canvas-info-bar{position:absolute;top:0;left:0;right:0;background:#fffffff2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border);padding:var(--spacing-2) var(--spacing-4);display:flex;justify-content:space-between;align-items:center;z-index:10}[data-theme=dark] .canvas-info-bar{background:#1c1c1ef2}.template-info{display:flex;gap:var(--spacing-3);font-size:13px;color:var(--color-text-secondary)}.template-size{font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.template-format{background:var(--color-primary-light);color:var(--color-primary);padding:2px 8px;border-radius:4px;font-size:11px;font-weight:var(--font-weight-medium)}.canvas-status{display:flex;gap:var(--spacing-4)}.status-item{font-size:12px;color:var(--color-text-tertiary);background:var(--color-bg-secondary);padding:2px 8px;border-radius:4px}.canvas-controls{position:absolute;top:var(--spacing-6);right:var(--spacing-6);z-index:10;display:flex;align-items:center;gap:var(--spacing-4)}.zoom-control{display:flex;align-items:center;gap:var(--spacing-1);background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-1);box-shadow:var(--shadow-md)}.zoom-btn{width:32px;height:32px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--color-text-secondary);transition:all var(--transition-fast)}.zoom-btn:hover{background:var(--color-bg-secondary);color:var(--color-text-primary);transform:scale(1.05)}.zoom-level{min-width:50px;text-align:center;font-size:13px;font-weight:var(--font-weight-medium);color:var(--color-text-primary);padding:0 var(--spacing-2)}.canvas-actions{display:flex;align-items:center;gap:var(--spacing-2)}.canvas-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f8f9fa,#e9ecef);color:var(--color-text-tertiary);text-align:center;z-index:2}[data-theme=dark] .canvas-empty{background:linear-gradient(135deg,#2c2c2e,#1c1c1e)}.canvas-empty.hidden{display:none}.empty-content{max-width:300px}.empty-icon{width:64px;height:64px;opacity:.5;margin-bottom:var(--spacing-4)}.empty-content h3{font-size:20px;font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);margin-bottom:var(--spacing-2)}.empty-content p{font-size:14px;margin-bottom:var(--spacing-6);line-height:var(--line-height-normal)}.empty-actions{display:flex;gap:var(--spacing-2);justify-content:center}@media(max-width:768px){.app-header{padding:0 var(--spacing-4)}.app-logo{gap:var(--spacing-2)}.logo-icon{width:32px;height:32px}.app-title{font-size:15px}.app-subtitle{display:none}.sidebar{position:fixed;top:0;bottom:0;z-index:var(--z-modal);box-shadow:var(--shadow-lg);transform:translate(-100%);transition:transform var(--transition-normal)}.sidebar-left{left:0}.sidebar-right{right:0;transform:translate(100%)}.sidebar.open{transform:translate(0)}.app-canvas{padding:var(--spacing-4)}.canvas-controls{top:var(--spacing-4);right:var(--spacing-4)}.btn span{display:none}}@media(max-width:480px){.app-header{padding:0 var(--spacing-3)}.header-left,.header-right{gap:var(--spacing-2)}.canvas-controls{flex-direction:column;gap:var(--spacing-2)}.zoom-control{flex-direction:column}}.block{display:block!important}.inline{display:inline!important}.inline-block{display:inline-block!important}.flex{display:flex!important}.inline-flex{display:inline-flex!important}.grid{display:grid!important}.inline-grid{display:inline-grid!important}.flex-row{flex-direction:row!important}.flex-col{flex-direction:column!important}.flex-wrap{flex-wrap:wrap!important}.flex-nowrap{flex-wrap:nowrap!important}.items-start{align-items:flex-start!important}.items-center{align-items:center!important}.items-end{align-items:flex-end!important}.items-stretch{align-items:stretch!important}.justify-start{justify-content:flex-start!important}.justify-center{justify-content:center!important}.justify-end{justify-content:flex-end!important}.justify-between{justify-content:space-between!important}.justify-around{justify-content:space-around!important}.justify-evenly{justify-content:space-evenly!important}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))!important}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))!important}.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))!important}.col-span-1{grid-column:span 1 / span 1!important}.col-span-2{grid-column:span 2 / span 2!important}.col-span-3{grid-column:span 3 / span 3!important}.col-span-4{grid-column:span 4 / span 4!important}.col-span-6{grid-column:span 6 / span 6!important}.col-span-12{grid-column:span 12 / span 12!important}.m-0{margin:0!important}.m-1{margin:var(--spacing-1)!important}.m-2{margin:var(--spacing-2)!important}.m-3{margin:var(--spacing-3)!important}.m-4{margin:var(--spacing-4)!important}.m-6{margin:var(--spacing-6)!important}.m-8{margin:var(--spacing-8)!important}.mx-auto{margin-left:auto!important;margin-right:auto!important}.mx-0{margin-left:0!important;margin-right:0!important}.mx-1{margin-left:var(--spacing-1)!important;margin-right:var(--spacing-1)!important}.mx-2{margin-left:var(--spacing-2)!important;margin-right:var(--spacing-2)!important}.mx-3{margin-left:var(--spacing-3)!important;margin-right:var(--spacing-3)!important}.mx-4{margin-left:var(--spacing-4)!important;margin-right:var(--spacing-4)!important}.my-0{margin-top:0!important;margin-bottom:0!important}.my-1{margin-top:var(--spacing-1)!important;margin-bottom:var(--spacing-1)!important}.my-2{margin-top:var(--spacing-2)!important;margin-bottom:var(--spacing-2)!important}.my-3{margin-top:var(--spacing-3)!important;margin-bottom:var(--spacing-3)!important}.my-4{margin-top:var(--spacing-4)!important;margin-bottom:var(--spacing-4)!important}.mt-0{margin-top:0!important}.mt-1{margin-top:var(--spacing-1)!important}.mt-2{margin-top:var(--spacing-2)!important}.mt-3{margin-top:var(--spacing-3)!important}.mt-4{margin-top:var(--spacing-4)!important}.mt-6{margin-top:var(--spacing-6)!important}.mt-8{margin-top:var(--spacing-8)!important}.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:var(--spacing-1)!important}.mb-2{margin-bottom:var(--spacing-2)!important}.mb-3{margin-bottom:var(--spacing-3)!important}.mb-4{margin-bottom:var(--spacing-4)!important}.mb-6{margin-bottom:var(--spacing-6)!important}.mb-8{margin-bottom:var(--spacing-8)!important}.ml-0{margin-left:0!important}.ml-1{margin-left:var(--spacing-1)!important}.ml-2{margin-left:var(--spacing-2)!important}.ml-3{margin-left:var(--spacing-3)!important}.ml-4{margin-left:var(--spacing-4)!important}.mr-0{margin-right:0!important}.mr-1{margin-right:var(--spacing-1)!important}.mr-2{margin-right:var(--spacing-2)!important}.mr-3{margin-right:var(--spacing-3)!important}.mr-4{margin-right:var(--spacing-4)!important}.p-0{padding:0!important}.p-1{padding:var(--spacing-1)!important}.p-2{padding:var(--spacing-2)!important}.p-3{padding:var(--spacing-3)!important}.p-4{padding:var(--spacing-4)!important}.p-6{padding:var(--spacing-6)!important}.p-8{padding:var(--spacing-8)!important}.px-0{padding-left:0!important;padding-right:0!important}.px-1{padding-left:var(--spacing-1)!important;padding-right:var(--spacing-1)!important}.px-2{padding-left:var(--spacing-2)!important;padding-right:var(--spacing-2)!important}.px-3{padding-left:var(--spacing-3)!important;padding-right:var(--spacing-3)!important}.px-4{padding-left:var(--spacing-4)!important;padding-right:var(--spacing-4)!important}.py-0{padding-top:0!important;padding-bottom:0!important}.py-1{padding-top:var(--spacing-1)!important;padding-bottom:var(--spacing-1)!important}.py-2{padding-top:var(--spacing-2)!important;padding-bottom:var(--spacing-2)!important}.py-3{padding-top:var(--spacing-3)!important;padding-bottom:var(--spacing-3)!important}.py-4{padding-top:var(--spacing-4)!important;padding-bottom:var(--spacing-4)!important}.pt-0{padding-top:0!important}.pt-1{padding-top:var(--spacing-1)!important}.pt-2{padding-top:var(--spacing-2)!important}.pt-3{padding-top:var(--spacing-3)!important}.pt-4{padding-top:var(--spacing-4)!important}.pb-0{padding-bottom:0!important}.pb-1{padding-bottom:var(--spacing-1)!important}.pb-2{padding-bottom:var(--spacing-2)!important}.pb-3{padding-bottom:var(--spacing-3)!important}.pb-4{padding-bottom:var(--spacing-4)!important}.pl-0{padding-left:0!important}.pl-1{padding-left:var(--spacing-1)!important}.pl-2{padding-left:var(--spacing-2)!important}.pl-3{padding-left:var(--spacing-3)!important}.pl-4{padding-left:var(--spacing-4)!important}.pr-0{padding-right:0!important}.pr-1{padding-right:var(--spacing-1)!important}.pr-2{padding-right:var(--spacing-2)!important}.pr-3{padding-right:var(--spacing-3)!important}.pr-4{padding-right:var(--spacing-4)!important}.w-full{width:100%!important}.w-auto{width:auto!important}.w-fit{width:-moz-fit-content!important;width:fit-content!important}.w-max{width:-moz-max-content!important;width:max-content!important}.w-min{width:-moz-min-content!important;width:min-content!important}.h-full{height:100%!important}.h-auto{height:auto!important}.h-fit{height:-moz-fit-content!important;height:fit-content!important}.h-max{height:-moz-max-content!important;height:max-content!important}.h-min{height:-moz-min-content!important;height:min-content!important}.min-w-0{min-width:0!important}.min-w-full{min-width:100%!important}.min-h-0{min-height:0!important}.min-h-full{min-height:100%!important}.max-w-none{max-width:none!important}.max-w-full{max-width:100%!important}.max-h-none{max-height:none!important}.max-h-full{max-height:100%!important}.static{position:static!important}.relative{position:relative!important}.absolute{position:absolute!important}.fixed{position:fixed!important}.sticky{position:sticky!important}.inset-0{inset:0!important}.top-0{top:0!important}.right-0{right:0!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.z-0{z-index:0!important}.z-10{z-index:10!important}.z-20{z-index:20!important}.z-30{z-index:30!important}.z-40{z-index:40!important}.z-50{z-index:50!important}.text-xs{font-size:var(--font-size-xs)!important}.text-sm{font-size:var(--font-size-sm)!important}.text-base{font-size:var(--font-size-base)!important}.text-lg{font-size:var(--font-size-lg)!important}.text-xl{font-size:var(--font-size-xl)!important}.text-2xl{font-size:var(--font-size-2xl)!important}.text-3xl{font-size:var(--font-size-3xl)!important}.text-4xl{font-size:var(--font-size-4xl)!important}.font-normal{font-weight:var(--font-weight-normal)!important}.font-medium{font-weight:var(--font-weight-medium)!important}.font-semibold{font-weight:var(--font-weight-semibold)!important}.font-bold{font-weight:var(--font-weight-bold)!important}.text-left{text-align:left!important}.text-center{text-align:center!important}.text-right{text-align:right!important}.text-justify{text-align:justify!important}.leading-tight{line-height:var(--line-height-tight)!important}.leading-normal{line-height:var(--line-height-normal)!important}.leading-relaxed{line-height:var(--line-height-relaxed)!important}.uppercase{text-transform:uppercase!important}.lowercase{text-transform:lowercase!important}.capitalize{text-transform:capitalize!important}.normal-case{text-transform:none!important}.underline{text-decoration:underline!important}.line-through{text-decoration:line-through!important}.no-underline{text-decoration:none!important}.text-primary{color:var(--color-text-primary)!important}.text-secondary{color:var(--color-text-secondary)!important}.text-tertiary{color:var(--color-text-tertiary)!important}.text-inverse{color:var(--color-text-inverse)!important}.bg-primary{background-color:var(--color-bg-primary)!important}.bg-secondary{background-color:var(--color-bg-secondary)!important}.bg-tertiary{background-color:var(--color-bg-tertiary)!important}.border{border:1px solid var(--color-border)!important}.border-0{border:0!important}.border-t{border-top:1px solid var(--color-border)!important}.border-r{border-right:1px solid var(--color-border)!important}.border-b{border-bottom:1px solid var(--color-border)!important}.border-l{border-left:1px solid var(--color-border)!important}.rounded-none{border-radius:0!important}.rounded-sm{border-radius:var(--radius-sm)!important}.rounded{border-radius:var(--radius-md)!important}.rounded-lg{border-radius:var(--radius-lg)!important}.rounded-xl{border-radius:var(--radius-xl)!important}.rounded-full{border-radius:var(--radius-full)!important}.shadow-none{box-shadow:none!important}.shadow-xs{box-shadow:var(--shadow-xs)!important}.shadow-sm{box-shadow:var(--shadow-sm)!important}.shadow{box-shadow:var(--shadow-md)!important}.shadow-lg{box-shadow:var(--shadow-lg)!important}.shadow-xl{box-shadow:var(--shadow-xl)!important}.opacity-0{opacity:0!important}.opacity-25{opacity:.25!important}.opacity-50{opacity:.5!important}.opacity-75{opacity:.75!important}.opacity-100{opacity:1!important}.transform{transform:translateZ(0)!important}.scale-0{transform:scale(0)!important}.scale-50{transform:scale(.5)!important}.scale-75{transform:scale(.75)!important}.scale-90{transform:scale(.9)!important}.scale-95{transform:scale(.95)!important}.scale-100{transform:scale(1)!important}.scale-105{transform:scale(1.05)!important}.scale-110{transform:scale(1.1)!important}.scale-125{transform:scale(1.25)!important}.scale-150{transform:scale(1.5)!important}.rotate-0{transform:rotate(0)!important}.rotate-1{transform:rotate(1deg)!important}.rotate-2{transform:rotate(2deg)!important}.rotate-3{transform:rotate(3deg)!important}.rotate-6{transform:rotate(6deg)!important}.rotate-12{transform:rotate(12deg)!important}.rotate-45{transform:rotate(45deg)!important}.rotate-90{transform:rotate(90deg)!important}.rotate-180{transform:rotate(180deg)!important}.transition-none{transition:none!important}.transition-all{transition:all var(--transition-fast)!important}.transition-colors{transition:color var(--transition-fast),background-color var(--transition-fast),border-color var(--transition-fast)!important}.transition-opacity{transition:opacity var(--transition-fast)!important}.transition-transform{transition:transform var(--transition-fast)!important}.duration-75{transition-duration:75ms!important}.duration-100{transition-duration:.1s!important}.duration-150{transition-duration:.15s!important}.duration-200{transition-duration:.2s!important}.duration-300{transition-duration:.3s!important}.duration-500{transition-duration:.5s!important}.duration-700{transition-duration:.7s!important}.duration-1000{transition-duration:1s!important}.ease-linear{transition-timing-function:linear!important}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)!important}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)!important}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.cursor-auto{cursor:auto!important}.cursor-default{cursor:default!important}.cursor-pointer{cursor:pointer!important}.cursor-wait{cursor:wait!important}.cursor-text{cursor:text!important}.cursor-move{cursor:move!important}.cursor-help{cursor:help!important}.cursor-not-allowed{cursor:not-allowed!important}.select-none{-webkit-user-select:none!important;-moz-user-select:none!important;user-select:none!important}.select-text{-webkit-user-select:text!important;-moz-user-select:text!important;user-select:text!important}.select-all{-webkit-user-select:all!important;-moz-user-select:all!important;user-select:all!important}.select-auto{-webkit-user-select:auto!important;-moz-user-select:auto!important;user-select:auto!important}.pointer-events-none{pointer-events:none!important}.pointer-events-auto{pointer-events:auto!important}.overflow-auto{overflow:auto!important}.overflow-hidden{overflow:hidden!important}.overflow-visible{overflow:visible!important}.overflow-scroll{overflow:scroll!important}.overflow-x-auto{overflow-x:auto!important}.overflow-x-hidden{overflow-x:hidden!important}.overflow-x-visible{overflow-x:visible!important}.overflow-x-scroll{overflow-x:scroll!important}.overflow-y-auto{overflow-y:auto!important}.overflow-y-hidden{overflow-y:hidden!important}.overflow-y-visible{overflow-y:visible!important}.overflow-y-scroll{overflow-y:scroll!important}.scrollbar-thin{scrollbar-width:thin!important}.scrollbar-none{scrollbar-width:none!important;-ms-overflow-style:none!important}.scrollbar-none::-webkit-scrollbar{display:none!important}@media(max-width:640px){.sm\:hidden{display:none!important}.sm\:block{display:block!important}.sm\:flex{display:flex!important}.sm\:grid{display:grid!important}}@media(max-width:768px){.md\:hidden{display:none!important}.md\:block{display:block!important}.md\:flex{display:flex!important}.md\:grid{display:grid!important}}@media(max-width:1024px){.lg\:hidden{display:none!important}.lg\:block{display:block!important}.lg\:flex{display:flex!important}.lg\:grid{display:grid!important}}@media(max-width:480px){:root{--header-height: 56px;--sidebar-width: 100%;--sidebar-collapsed-width: 0;--spacing-6: 16px;--spacing-8: 24px;--font-size-base: 14px}.app-header{padding:0 var(--spacing-3);height:var(--header-height)}.app-logo{gap:var(--spacing-2)}.logo-icon{width:32px;height:32px}.app-title{font-size:15px}.app-subtitle{display:none}.header-actions{gap:var(--spacing-1)}.btn{padding:10px 14px;font-size:13px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px}.btn span:not(.btn-icon){display:inline}.btn-icon{width:36px;height:36px;min-width:36px;min-height:36px}.sidebar .btn{width:100%;justify-content:flex-start}.sidebar{position:fixed;top:0;bottom:0;z-index:var(--z-modal);box-shadow:var(--shadow-xl);transform:translate(-100%);transition:transform var(--transition-normal);width:100%!important}.sidebar-left{left:0}.sidebar-right{right:0;transform:translate(100%)}.sidebar.open{transform:translate(0)}.sidebar-toggle{display:none}.app-canvas,.snapbooth-canvas-area{padding:var(--spacing-2);width:100%;height:100%;overflow:auto;position:relative;min-width:0;min-height:0}.canvas-wrapper{min-width:100%;min-height:200px;width:100%;max-width:100%}.snapbooth-canvas-area>div{width:100%!important;height:100%!important;max-width:100vw;max-height:calc(100vh - var(--header-height))}.snapbooth-canvas-area canvas{max-width:100%!important;max-height:100%!important;width:auto!important;height:auto!important}.canvas-controls{position:fixed;bottom:var(--spacing-4);right:var(--spacing-4);top:auto;flex-direction:column;gap:var(--spacing-2);z-index:var(--z-fixed)}.zoom-control{flex-direction:row;background:#fffffff2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}[data-theme=dark] .zoom-control{background:#1c1c1ef2}.tool-grid{grid-template-columns:1fr;gap:var(--spacing-2)}.tool-btn{min-height:48px;flex-direction:row;justify-content:flex-start;padding:var(--spacing-2) var(--spacing-3);text-align:left;width:100%;box-sizing:border-box}.tool-btn i,.tool-btn svg{width:20px;height:20px;min-width:20px;min-height:20px;margin-right:var(--spacing-2);flex-shrink:0}.tool-btn span{flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tool-shortcut{margin-left:auto}.action-btn{padding:var(--spacing-2) var(--spacing-3);font-size:13px}.action-shortcut{display:none}.canvas-info-bar{flex-direction:column;gap:var(--spacing-1);padding:var(--spacing-2)}.template-info{flex-direction:column;gap:var(--spacing-1)}.canvas-status{flex-direction:row;gap:var(--spacing-2)}.dropdown-menu{position:fixed;top:auto;bottom:var(--spacing-4);left:var(--spacing-4);right:var(--spacing-4);min-width:auto;max-height:50vh;overflow-y:auto}.layers-panel{margin-bottom:var(--spacing-3)}.panel-header{padding:var(--spacing-3) var(--spacing-4)}.layer-item{padding:var(--spacing-2) var(--spacing-3)}.layer-icon{width:28px;height:28px}.input{font-size:16px}.dimension-controls{flex-direction:column;gap:var(--spacing-2)}.dimension-input{min-width:auto;width:100%}.export-formats{grid-template-columns:1fr}.export-btn{padding:var(--spacing-3)}}@media(min-width:481px)and (max-width:640px){:root{--header-height: 60px;--sidebar-width: 90%}.sidebar{width:90%!important}.tool-grid{grid-template-columns:repeat(2,1fr)}.tool-btn{min-height:60px}.canvas-controls{position:fixed;bottom:var(--spacing-4);right:var(--spacing-4);top:auto}}@media(min-width:641px)and (max-width:768px){:root{--sidebar-width: 320px}.sidebar{position:relative;transform:none;width:var(--sidebar-width)}.sidebar.collapsed{width:var(--sidebar-collapsed-width)}.tool-grid{grid-template-columns:repeat(2,1fr)}.canvas-controls{position:absolute;top:var(--spacing-6);right:var(--spacing-6)}}@media(min-width:769px)and (max-width:1024px){.tool-grid{grid-template-columns:repeat(3,1fr)}.canvas-controls{position:absolute;top:var(--spacing-6);right:var(--spacing-6)}}@media(min-width:1025px){.tool-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.canvas-controls{position:absolute;top:var(--spacing-6);right:var(--spacing-6)}}@media(max-width:768px){.snapbooth-slim-sidebar{position:fixed;left:0;top:0;bottom:0;z-index:1000;width:60px;transform:translate(0);transition:transform .3s ease}.snapbooth-slim-sidebar.collapsed{transform:translate(-100%)}.snapbooth-drawer{position:fixed;inset:auto 0 0;width:100%;max-height:70vh;border-right:none;border-top:1px solid var(--color-border);border-radius:var(--radius-lg) var(--radius-lg) 0 0;transform:translateY(100%);transition:transform .3s ease;z-index:999}.snapbooth-drawer.open{transform:translateY(0)}.drawer-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.drawer-item-preview{min-height:80px}.drawer-header{padding:var(--spacing-md);position:sticky;top:0;background-color:var(--color-bg-panel);z-index:10}.drawer-content{padding:var(--spacing-md)}}@media(max-width:480px){.drawer-grid{grid-template-columns:1fr}.drawer-item-preview{min-height:120px}.slim-sidebar-icon{width:48px;height:48px;min-width:48px;min-height:48px}}@media(hover:none)and (pointer:coarse){.btn,.btn-icon{min-width:44px;min-height:44px;padding:12px}.tool-btn{min-height:60px;padding:12px 16px}.slim-sidebar-icon{min-width:44px;min-height:44px}.drawer-item,.drawer-item-preview{min-height:100px}.sidebar-toggle{width:32px;height:56px}.tool-btn:hover,.btn-icon:hover{transform:none}.slider::-webkit-slider-thumb{width:24px;height:24px}.slider::-moz-range-thumb{width:24px;height:24px}.snapbooth-canvas-area{touch-action:pan-x pan-y pinch-zoom;-webkit-overflow-scrolling:touch}}@media(min-resolution:192dpi){.logo-icon{background-size:contain}.canvas-grid-line{border-width:.5px}}@media(orientation:landscape)and (max-height:500px){.app-header{height:48px;padding:0 var(--spacing-2)}.app-logo{gap:var(--spacing-1)}.logo-icon{width:28px;height:28px}.app-title{font-size:14px}.sidebar-content{padding:var(--spacing-2)}.tool-btn{min-height:40px;padding:var(--spacing-1) var(--spacing-2)}.canvas-controls{bottom:var(--spacing-2);right:var(--spacing-2)}.snapbooth-canvas-area{overflow:auto;-webkit-overflow-scrolling:touch}}@media(orientation:portrait){.snapbooth-canvas-area{flex-direction:column}}@media(orientation:landscape){.snapbooth-canvas-area{flex-direction:row}}.snapbooth-canvas-area{display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.snapbooth-canvas-area>div:first-child{width:100%;height:100%;display:flex;align-items:center;justify-content:center}@media print{.sidebar,.canvas-controls,.canvas-info-bar,.app-header{display:none!important}.app-canvas{padding:0!important;background:#fff!important}.canvas-wrapper{box-shadow:none!important;border-radius:0!important;border:1px solid #000!important}.app-container{height:auto!important}.app-body{flex-direction:column!important}}@media(prefers-reduced-motion:reduce){.sidebar,.tool-btn,.btn-icon,.canvas-controls{transition:none}}@media(max-width:480px){[data-theme=dark] .zoom-control{background:#1c1c1ef2;border-color:var(--color-border)}}@media(max-width:480px){[data-theme=high-contrast] .tool-btn{border-width:2px}[data-theme=high-contrast] .btn-icon{border:1px solid var(--color-border)}[data-theme=high-contrast] .canvas-controls{border:2px solid var(--color-border)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes scaleOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}@keyframes bounce{0%,20%,53%,80%,to{transform:translateY(0)}40%,43%{transform:translateY(-8px)}70%{transform:translateY(-4px)}90%{transform:translateY(-2px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}@keyframes wiggle{0%,7%{transform:rotate(0)}15%{transform:rotate(-15deg)}20%{transform:rotate(10deg)}25%{transform:rotate(-10deg)}30%{transform:rotate(6deg)}35%{transform:rotate(-4deg)}40%,to{transform:rotate(0)}}@keyframes glow{0%,to{box-shadow:0 0 5px var(--color-primary)}50%{box-shadow:0 0 20px var(--color-primary),0 0 30px var(--color-primary)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes heartbeat{0%{transform:scale(1)}14%{transform:scale(1.1)}28%{transform:scale(1)}42%{transform:scale(1.1)}70%{transform:scale(1)}}.animate-fade-in{animation:fadeIn .3s ease-out}.animate-fade-out{animation:fadeOut .3s ease-out}.animate-slide-in-up{animation:slideInUp .4s ease-out}.animate-slide-in-down{animation:slideInDown .4s ease-out}.animate-slide-in-left{animation:slideInLeft .4s ease-out}.animate-slide-in-right{animation:slideInRight .4s ease-out}.animate-scale-in{animation:scaleIn .3s ease-out}.animate-scale-out{animation:scaleOut .3s ease-out}.animate-bounce{animation:bounce 1s ease-in-out infinite}.animate-pulse{animation:pulse 1.5s ease-in-out infinite}.animate-shake{animation:shake .5s ease-in-out}.animate-wiggle{animation:wiggle 1s ease-in-out}.animate-glow{animation:glow 2s ease-in-out infinite}.animate-float{animation:float 3s ease-in-out infinite}.animate-spin{animation:spin 1s linear infinite}.animate-heartbeat{animation:heartbeat 1.5s ease-in-out infinite}.btn{position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:#fff3;border-radius:50%;transform:translate(-50%,-50%);transition:width .6s,height .6s}.btn:active:before{width:300px;height:300px}.btn-primary:before{background:#ffffff4d}.btn-secondary:before{background:#0000001a}.tool-btn{position:relative;transition:all var(--transition-fast)}.tool-btn:after{content:"";position:absolute;inset:0;background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,.1) 50%,transparent 70%);transform:translate(-100%);transition:transform .6s}.tool-btn:hover:after{transform:translate(100%)}.tool-btn:active{transform:scale(.95)}.sidebar{transition:transform var(--transition-normal),width var(--transition-normal)}.sidebar.collapsed{transform:translate(0)}.sidebar-left:not(.collapsed){animation:slideInLeft .3s ease-out}.sidebar-right:not(.collapsed){animation:slideInRight .3s ease-out}.canvas-wrapper{transition:box-shadow var(--transition-normal)}.canvas-wrapper:hover{box-shadow:var(--shadow-xl)}.canvas-empty{animation:fadeIn .5s ease-out}.canvas-empty .empty-icon{animation:float 3s ease-in-out infinite}.dropdown-menu{animation:slideInDown .2s ease-out}.dropdown-item{position:relative;overflow:hidden}.dropdown-item:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.dropdown-item:hover:before{left:100%}.layer-item{transition:all var(--transition-fast);position:relative}.layer-item:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--color-primary);transform:scaleY(0);transition:transform var(--transition-fast)}.layer-item:hover:before{transform:scaleY(1)}.layer-item:active{transform:translate(4px)}.zoom-btn{transition:all var(--transition-fast)}.zoom-btn:hover{transform:scale(1.1)}.zoom-btn:active{transform:scale(.95)}.zoom-level{transition:color var(--transition-fast)}.zoom-control:hover .zoom-level{color:var(--color-primary)}.input{transition:all var(--transition-fast);position:relative}.input:focus{transform:scale(1.02)}.input:invalid{animation:shake .5s ease-in-out}.slider{transition:background var(--transition-fast)}.slider:hover{background:var(--color-bg-tertiary)}.slider::-webkit-slider-thumb{-webkit-transition:all var(--transition-fast);transition:all var(--transition-fast)}.slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:var(--shadow-lg)}.slider::-webkit-slider-thumb:active{transform:scale(1.1)}.checkbox-label input[type=checkbox]{transition:all var(--transition-fast)}.checkbox-label input[type=checkbox]:checked{animation:scaleIn .2s ease-out}.checkbox-label:hover input[type=checkbox]{transform:scale(1.1)}.color-picker{transition:all var(--transition-fast);position:relative;overflow:hidden}.color-picker:before{content:"";position:absolute;inset:0;background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,.3) 50%,transparent 70%);transform:translate(-100%);transition:transform .6s}.color-picker:hover:before{transform:translate(100%)}.color-picker:hover{transform:scale(1.05)}.badge{transition:all var(--transition-fast);position:relative}.badge:hover{transform:scale(1.1)}.badge:active{transform:scale(.95)}.tooltip{position:relative}.tooltip:before{transition:all var(--transition-fast)}.tooltip:hover:before{animation:pulse .5s ease-in-out}.loading{position:relative}.loading:after{animation:spin 1s linear infinite}.loading:before{content:"";position:absolute;inset:0;background:#fffc;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}#theme-toggle{transition:all var(--transition-fast);position:relative;overflow:hidden}#theme-toggle:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient(circle,var(--color-primary) 0%,transparent 70%);transform:translate(-50%,-50%);transition:width .6s,height .6s}#theme-toggle:active:before{width:100px;height:100px}#theme-toggle:hover{transform:rotate(15deg)}.export-btn{position:relative;overflow:hidden;transition:all var(--transition-fast)}.export-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.export-btn:hover:before{left:100%}.export-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.export-btn:active{transform:translateY(0)}@media(max-width:768px){.tool-btn:hover,.btn-icon:hover{transform:none}.sidebar{transition:transform var(--transition-normal)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.animate-bounce,.animate-pulse,.animate-float,.animate-spin,.animate-heartbeat{animation:none}}.btn,.tool-btn,.layer-item,.dropdown-item,.zoom-btn,.input,.slider,.color-picker,.badge{will-change:transform}.app-container,.sidebar,.canvas-wrapper,.canvas-container,.btn,.tool-btn,.layer-item,.dropdown-menu,.zoom-control{transform:translateZ(0);-webkit-transform:translateZ(0);will-change:transform}.sidebar{backface-visibility:hidden;perspective:1000px}.canvas-wrapper{backface-visibility:hidden;contain:layout style paint}.sidebar-content{contain:layout style}.layers-list{contain:layout style;content-visibility:auto}.tool-grid{contain:layout style}.btn,.tool-btn,.layer-item,.dropdown-item,.zoom-btn{transition:transform var(--transition-fast),background-color var(--transition-fast),border-color var(--transition-fast)}.btn:hover,.tool-btn:hover{transform:translateZ(0) scale(1.05)}.sidebar-content,.layers-list{scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.hidden{display:none!important;visibility:hidden;opacity:0;pointer-events:none}.btn:focus-visible,.tool-btn:focus-visible,.input:focus-visible,.slider:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px;transition:outline var(--transition-fast)}.app-container,.app-body{contain:layout style}@media(max-width:768px){.sidebar{contain:layout style paint}.tool-grid{contain:layout style}}[data-theme=dark]{color-scheme:dark}[data-theme=light]{color-scheme:light}@media print{*{-webkit-print-color-adjust:exact!important;color-adjust:exact!important}.app-container{contain:none}}@media(max-width:480px){.tool-btn,.layer-item{contain:layout style}.btn,.tool-btn{transition:background-color var(--transition-fast),border-color var(--transition-fast)}}*{box-sizing:border-box}html,body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeSpeed}.btn:focus-visible,.tool-btn:focus-visible,.input:focus-visible,.slider:focus-visible,.color-picker:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px;transition:outline var(--transition-fast)}.animate-fade-in,.animate-slide-in-up,.animate-slide-in-down,.animate-slide-in-left,.animate-slide-in-right,.animate-scale-in{will-change:opacity,transform}.animate-bounce,.animate-pulse,.animate-float,.animate-spin,.animate-heartbeat{will-change:transform}.btn:before,.tool-btn:after,.dropdown-item:before,.export-btn:before{will-change:transform}.app-container,.app-body,.sidebar{contain:layout style}.canvas-wrapper{contain:layout style paint}.canvas-grid{contain:layout style paint;isolation:isolate}.canvas-grid-line{contain:layout style paint}.hidden{display:none!important;visibility:hidden;opacity:0;pointer-events:none;contain:layout style paint}body{font-display:swap;text-rendering:optimizeSpeed}img{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}@media(hover:none)and (pointer:coarse){.btn,.tool-btn,.layer-item{-webkit-tap-highlight-color:transparent;touch-action:manipulation}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.btn,.tool-btn,.layer-item{will-change:auto}}@media(prefers-contrast:high){.btn,.tool-btn,.layer-item,.input{border-width:2px}}@media(min-resolution:192dpi){.logo-icon{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}.canvas-wrapper{min-height:200px;min-width:300px}.sidebar{min-width:var(--sidebar-collapsed-width)}.sidebar.collapsed .sidebar-content,.sidebar.collapsed .section-title{display:none}.canvas-wrapper{transform:translateZ(0);-webkit-transform:translateZ(0)}.dropdown-menu,.tooltip{contain:layout style paint;isolation:isolate}.app-sidebar{display:flex;flex-direction:column;width:280px;background:var(--bg-secondary, #f9fafb);border-right:1px solid var(--gray-200, #e5e7eb);transition:width .3s ease;overflow:hidden}.app-sidebar:not(.expanded){width:60px}.sidebar-tabs{display:flex;flex-direction:column;gap:4px;padding:var(--spacing-3, 12px);border-bottom:1px solid var(--gray-200, #e5e7eb)}.sidebar-tab{display:flex;align-items:center;gap:12px;padding:10px 12px;background:transparent;border:none;border-radius:var(--radius-md, 8px);cursor:pointer;transition:all .2s ease;color:var(--text-secondary, #6b7280);font-size:14px;font-weight:500;position:relative}.sidebar-tab:hover{background:var(--gray-100, #f3f4f6);color:var(--text-primary, #1f2937)}.sidebar-tab.active{background:var(--primary-color, #007aff);color:#fff}.sidebar-tab i{flex-shrink:0}.sidebar-tab-label{flex:1;text-align:left;white-space:nowrap}.sidebar-tab-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;background:var(--primary-color, #007aff);color:#fff;font-size:11px;font-weight:600;border-radius:10px}.sidebar-tab.active .sidebar-tab-badge{background:#fff;color:var(--primary-color, #007aff)}.sidebar-content{flex:1;overflow-y:auto;padding:var(--spacing-4, 16px)}.sidebar-section{display:flex;flex-direction:column;gap:12px}.sidebar-section-title{font-size:15px;font-weight:600;color:var(--text-primary, #1f2937);margin:0 0 8px}.templates-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.template-card{display:flex;flex-direction:column;align-items:center;padding:16px;background:#fff;border:1px solid var(--gray-200, #e5e7eb);border-radius:var(--radius-md, 8px);cursor:pointer;transition:all .2s ease}.template-card:hover{border-color:var(--primary-color, #007aff);box-shadow:0 2px 8px #007aff1a;transform:translateY(-2px)}.template-thumbnail{display:flex;align-items:center;justify-content:center;width:80px;height:100px;background:var(--gray-50, #f9fafb);border-radius:var(--radius-sm, 6px);margin-bottom:8px;color:var(--gray-400, #9ca3af)}.template-name{font-size:12px;font-weight:500;text-align:center;color:var(--text-primary, #1f2937)}.photos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px}.shapes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.shape-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:16px 8px;background:#fff;border:1px solid var(--gray-200, #e5e7eb);border-radius:var(--radius-md, 8px);cursor:pointer;transition:all .2s ease;color:var(--text-secondary, #6b7280)}.shape-button:hover{border-color:var(--primary-color, #007aff);background:var(--gray-50, #f9fafb);color:var(--primary-color, #007aff)}.shape-label{font-size:11px;font-weight:500}.text-style-button{display:flex;align-items:center;gap:12px;padding:12px;background:#fff;border:1px solid var(--gray-200, #e5e7eb);border-radius:var(--radius-md, 8px);cursor:pointer;transition:all .2s ease;font-size:14px;font-weight:500;color:var(--text-primary, #1f2937);width:100%;text-align:left}.text-style-button:hover{border-color:var(--primary-color, #007aff);background:var(--gray-50, #f9fafb)}.pages-list{display:flex;flex-direction:column;gap:8px}.btn-full-width{width:100%}.app-sidebar:not(.expanded) .sidebar-tab-label,.app-sidebar:not(.expanded) .sidebar-tab-badge{display:none}.app-sidebar:not(.expanded) .sidebar-tab{justify-content:center;padding:10px}.sidebar-content::-webkit-scrollbar{width:6px}.sidebar-content::-webkit-scrollbar-track{background:transparent}.sidebar-content::-webkit-scrollbar-thumb{background:var(--gray-300, #d1d5db);border-radius:3px}.sidebar-content::-webkit-scrollbar-thumb:hover{background:var(--gray-400, #9ca3af)}.sidebar{position:relative;display:flex;flex-direction:column;background:var(--color-bg-primary);border:1px solid var(--color-border);overflow:hidden;transition:all var(--transition-normal)}.sidebar-left{width:var(--sidebar-width);border-right:1px solid var(--color-border);border-left:none}.sidebar-right{width:var(--sidebar-width);border-left:1px solid var(--color-border);border-right:none}.sidebar.collapsed{width:var(--sidebar-collapsed-width)}.sidebar.collapsed .sidebar-content{opacity:0;pointer-events:none}.sidebar-toggle{position:absolute;top:50%;transform:translateY(-50%);width:24px;height:48px;background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:0 var(--radius-sm) var(--radius-sm) 0;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;color:var(--color-text-tertiary);transition:all var(--transition-fast)}.sidebar-left .sidebar-toggle{right:-12px;border-left:none}.sidebar-right .sidebar-toggle{left:-12px;border-right:none;border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.sidebar-toggle:hover{background:var(--color-bg-secondary);color:var(--color-text-primary)}.sidebar-toggle i,.sidebar-toggle svg{width:14px;height:14px}.sidebar .sidebar-content{flex:1;overflow-y:auto;padding:var(--spacing-4);transition:opacity var(--transition-fast)}.sidebar .sidebar-section{margin-bottom:var(--spacing-6)}.sidebar .sidebar-section:last-child{margin-bottom:0}.tool-list{display:flex;flex-direction:column;gap:var(--spacing-2)}.tool-list .tool-btn{flex-direction:row;justify-content:flex-start;min-height:auto;padding:var(--spacing-3) var(--spacing-4);gap:var(--spacing-3)}.tool-list .tool-btn i,.tool-list .tool-btn svg{width:20px;height:20px}.template-panel,.object-panel{display:flex;flex-direction:column;gap:var(--spacing-4)}.text-properties{margin-top:var(--spacing-4);padding-top:var(--spacing-4);border-top:1px solid var(--color-border)}.export-panel{display:flex;flex-direction:column;gap:var(--spacing-4)}.export-options{display:flex;flex-direction:column;gap:var(--spacing-3);padding-top:var(--spacing-3);border-top:1px solid var(--color-border)}.font-controls{display:flex;flex-direction:column;gap:var(--spacing-2)}.font-select{width:100%}.layers-panel{background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.layers-panel .panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-3) var(--spacing-4);background:var(--color-bg-secondary);border-bottom:1px solid var(--color-border)}.layers-panel .panel-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.layers-panel .panel-actions{display:flex;align-items:center;gap:var(--spacing-2)}.layers-list{max-height:240px;overflow-y:auto}.layer-item.selected{background:var(--color-primary-light);border-left:3px solid var(--color-primary)}.layer-icon{width:32px;height:32px;border-radius:var(--radius-sm);background:var(--color-bg-secondary);display:flex;align-items:center;justify-content:center;color:var(--color-text-tertiary)}.layer-icon i,.layer-icon svg{width:16px;height:16px}.layer-info{flex:1;min-width:0}.layer-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-type{font-size:var(--font-size-xs);color:var(--color-text-tertiary)}.layer-controls{display:flex;gap:var(--spacing-1);opacity:.5;transition:opacity var(--transition-fast)}.layer-item:hover .layer-controls,.layer-item.selected .layer-controls,.layer-item:focus-within .layer-controls{opacity:1}.layer-controls .layer-delete,.layer-controls [title*=Supprimer]{opacity:.6;color:var(--color-danger);transition:opacity var(--transition-fast),transform var(--transition-fast)}.layer-item:hover .layer-controls .layer-delete,.layer-item:hover .layer-controls [title*=Supprimer]{opacity:1}.layer-controls .layer-delete:hover,.layer-controls [title*=Supprimer]:hover{transform:scale(1.1);color:var(--color-danger)}[data-theme=dark] .sidebar{background:var(--color-bg-primary)}[data-theme=dark] .sidebar-toggle{background:var(--color-bg-secondary);border-color:var(--color-border)}[data-theme=dark] .layer-item:hover,[data-theme=dark] .layer-icon{background:var(--color-bg-tertiary)}@media(max-width:768px){.sidebar{position:fixed;top:var(--header-height);bottom:0;z-index:var(--z-fixed)}.sidebar-left{left:0;transform:translate(-100%)}.sidebar-left.visible{transform:translate(0)}.sidebar-right{right:0;transform:translate(100%)}.sidebar-right.visible{transform:translate(0)}.sidebar.collapsed{width:var(--sidebar-width)}}.panel-section{margin-bottom:var(--spacing-4, 16px);border:1px solid var(--gray-200, #e5e7eb);border-radius:var(--radius-md, 8px);overflow:hidden;background:#fff}.panel-section-header{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg-secondary, #f9fafb);border-bottom:1px solid var(--gray-200, #e5e7eb);transition:background .2s ease}.panel-section-header.collapsible:hover{background:var(--gray-100, #f3f4f6)}.panel-section-icon{flex-shrink:0;color:var(--text-secondary, #6b7280)}.panel-section-title{flex:1;margin:0;font-size:14px;font-weight:600;color:var(--text-primary, #1f2937)}.panel-section-chevron{flex-shrink:0;color:var(--text-secondary, #6b7280);transition:transform .3s ease}.panel-section.expanded .panel-section-chevron{transform:rotate(180deg)}.panel-section-content{padding:16px;transition:max-height .3s ease,opacity .3s ease;overflow:hidden}.color-input-container{display:flex;flex-direction:column;gap:8px}.color-input-label{font-size:13px;font-weight:500;color:var(--text-secondary, #6b7280)}.color-input-group{display:flex;gap:8px;align-items:center}.color-input-text{flex:1;padding:8px 12px;font-size:14px;font-family:Monaco,Courier New,monospace;border:1px solid var(--gray-300, #d1d5db);border-radius:var(--radius-md, 8px);background:#fff;transition:border-color .2s ease}.color-input-text:focus{outline:none;border-color:var(--primary-color, #007aff);box-shadow:0 0 0 3px #007aff1a}.color-input-picker{width:48px;height:40px;border:1px solid var(--gray-300, #d1d5db);border-radius:var(--radius-md, 8px);cursor:pointer;transition:border-color .2s ease}.color-input-picker:hover{border-color:var(--primary-color, #007aff)}.color-input-palette{display:grid;grid-template-columns:repeat(auto-fill,minmax(32px,1fr));gap:6px}.color-swatch{width:100%;aspect-ratio:1;border:2px solid var(--gray-200, #e5e7eb);border-radius:var(--radius-sm, 6px);cursor:pointer;transition:all .2s ease;position:relative}.color-swatch:hover{transform:scale(1.1);border-color:var(--gray-400, #9ca3af);box-shadow:0 2px 8px #0000001a}.color-swatch.selected{border-color:var(--primary-color, #007aff);border-width:3px;box-shadow:0 0 0 2px #007aff33}.color-swatch.selected:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:12px;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.5)}.numeric-input-container{display:flex;flex-direction:column;gap:8px}.numeric-input-header{display:flex;justify-content:space-between;align-items:center}.numeric-input-label{font-size:13px;font-weight:500;color:var(--text-secondary, #6b7280)}.numeric-input-value-display{font-size:13px;font-weight:600;color:var(--text-primary, #1f2937);font-family:Monaco,Courier New,monospace}.numeric-input-field{width:100%;padding:8px 12px;font-size:14px;font-family:Monaco,Courier New,monospace;border:1px solid var(--gray-300, #d1d5db);border-radius:var(--radius-md, 8px);background:#fff;transition:border-color .2s ease}.numeric-input-field:focus{outline:none;border-color:var(--primary-color, #007aff);box-shadow:0 0 0 3px #007aff1a}.numeric-input-field::-webkit-inner-spin-button,.numeric-input-field::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.font-selector-container{position:relative;display:flex;flex-direction:column;gap:8px}.font-selector-label{font-size:13px;font-weight:500;color:var(--text-secondary, #6b7280)}.font-selector-button{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;background:#fff;border:1px solid var(--gray-300, #d1d5db);border-radius:var(--radius-md, 8px);cursor:pointer;transition:all .2s ease;font-size:14px}.font-selector-button:hover:not(:disabled){border-color:var(--primary-color, #007aff);background:var(--gray-50, #f9fafb)}.font-selector-button:disabled{opacity:.5;cursor:not-allowed}.font-selector-current{flex:1;text-align:left;color:var(--text-primary, #1f2937)}.font-selector-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:#fff;border:1px solid var(--gray-300, #d1d5db);border-radius:var(--radius-md, 8px);box-shadow:0 4px 12px #0000001a;z-index:1000;max-height:300px;overflow:hidden;display:flex;flex-direction:column}.font-selector-search{width:100%;padding:10px 12px;border:none;border-bottom:1px solid var(--gray-200, #e5e7eb);font-size:14px;outline:none}.font-selector-search:focus{background:var(--gray-50, #f9fafb)}.font-selector-list{flex:1;overflow-y:auto}.font-selector-item{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;cursor:pointer;transition:background .2s ease}.font-selector-item:hover{background:var(--gray-100, #f3f4f6)}.font-selector-item.selected{background:var(--primary-color, #007aff);color:#fff}.font-selector-item-name{flex:1;font-size:14px}.font-selector-item-category{font-size:11px;padding:2px 6px;background:var(--gray-200, #e5e7eb);border-radius:4px;color:var(--text-secondary, #6b7280)}.font-selector-item.selected .font-selector-item-category{background:#fff3;color:#fff}.font-selector-empty{padding:20px;text-align:center;font-size:14px;color:var(--text-secondary, #6b7280)}.font-selector-preview{padding:12px;background:var(--gray-50, #f9fafb);border:1px solid var(--gray-200, #e5e7eb);border-radius:var(--radius-md, 8px)}.font-selector-preview-text{margin:0;font-size:16px;color:var(--text-primary, #1f2937);line-height:1.5}.font-selector-list::-webkit-scrollbar{width:6px}.font-selector-list::-webkit-scrollbar-track{background:transparent}.font-selector-list::-webkit-scrollbar-thumb{background:var(--gray-300, #d1d5db);border-radius:3px}.font-selector-list::-webkit-scrollbar-thumb:hover{background:var(--gray-400, #9ca3af)}.app-topbar{height:64px;background:var(--color-bg-primary);border-bottom:1px solid var(--color-border);display:flex;align-items:center;padding:0 var(--spacing-4);position:relative;z-index:var(--z-topbar, 100);flex-shrink:0}.topbar-content{display:flex;align-items:center;justify-content:space-between;width:100%;height:100%;gap:var(--spacing-4)}.topbar-section{display:flex;align-items:center;gap:var(--spacing-3);height:100%}.topbar-left{flex:1;min-width:0}.topbar-center{flex:0 0 auto;gap:var(--spacing-2)}.topbar-right{flex:0 0 auto;justify-content:flex-end}.document-info{display:flex;align-items:center;gap:var(--spacing-3)}.document-title{font-size:15px;font-weight:var(--font-weight-semibold);color:var(--color-text-primary);background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);padding:6px 10px;min-width:150px;max-width:300px;transition:all var(--transition-fast)}.document-title:hover{background:var(--color-bg-secondary);border-color:var(--color-border)}.document-title:focus{outline:none;background:var(--color-bg-primary);border-color:var(--color-primary);box-shadow:0 0 0 3px #007aff1a}.save-indicator{display:flex;align-items:center;gap:var(--spacing-2);font-size:13px;padding:4px 10px;border-radius:var(--radius-sm);transition:all var(--transition-fast)}.save-indicator.status-saved{color:var(--color-success, #34c759)}.save-indicator.status-unsaved{color:var(--color-warning, #ff9500)}.save-indicator.status-saving{color:var(--color-text-secondary)}.save-indicator.status-saving i{animation:spin 1s linear infinite}.save-text{font-weight:var(--font-weight-medium)}.control-group{display:flex;align-items:center;gap:var(--spacing-1);background:var(--color-bg-secondary);border-radius:var(--radius-md);padding:4px}.topbar-divider{width:1px;height:24px;background:var(--color-border)}.topbar-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);height:36px;padding:0 12px;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:14px;font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.topbar-btn:hover:not(:disabled){background:var(--color-bg-tertiary)}.topbar-btn:active:not(:disabled){transform:scale(.95)}.topbar-btn:disabled{opacity:.4;cursor:not-allowed}.topbar-btn.active{background:var(--color-primary-light);color:var(--color-primary)}.topbar-btn.btn-primary{background:var(--color-primary);color:#fff}.topbar-btn.btn-primary:hover:not(:disabled){background:var(--color-primary-hover, #0077ed)}.icon-sm{width:16px;height:16px}.icon-md{width:20px;height:20px}.btn-label{display:inline}.chevron{transition:transform var(--transition-fast)}.topbar-dropdown.open+.topbar-btn .chevron{transform:rotate(180deg)}.zoom-display{display:flex;align-items:center;justify-content:center;min-width:70px;height:36px;padding:0 12px;background:var(--color-bg-primary);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.zoom-display:hover{background:var(--color-bg-tertiary)}.zoom-value{font-size:13px;font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.zoom-input{width:60px;padding:4px 8px;font-size:13px;font-weight:var(--font-weight-semibold);text-align:center;background:var(--color-bg-primary);border:1px solid var(--color-primary);border-radius:var(--radius-sm);color:var(--color-text-primary);outline:none}.zoom-input:focus{box-shadow:0 0 0 3px #007aff1a}.export-dropdown-container{position:relative}.topbar-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:200px;background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:8px;z-index:var(--z-dropdown, 200);opacity:0;visibility:hidden;transform:translateY(-10px);transition:all var(--transition-fast)}.topbar-dropdown.open{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-item{width:100%;display:flex;align-items:center;gap:var(--spacing-3);padding:10px 12px;background:transparent;border:none;border-radius:var(--radius-sm);font-size:14px;color:var(--color-text-primary);text-align:left;cursor:pointer;transition:background var(--transition-fast)}.dropdown-item:active{transform:scale(.98)}@media(max-width:1024px){.topbar-center{gap:var(--spacing-1)}.control-group{gap:2px}.topbar-btn{padding:0 10px}}@media(max-width:768px){.app-topbar{height:56px;padding:0 var(--spacing-3)}.topbar-content{gap:var(--spacing-2)}.topbar-center{display:none}.document-title{font-size:14px;min-width:100px;max-width:150px}.save-indicator{font-size:0;padding:4px}.save-text,.btn-label{display:none}.topbar-btn{padding:0 8px;gap:0}}@media(max-width:480px){.app-topbar{height:48px;padding:0 var(--spacing-2)}.document-info{gap:var(--spacing-2)}.document-title{min-width:80px;max-width:120px;font-size:13px;padding:4px 8px}.topbar-btn{height:32px;padding:0 6px}.icon-md{width:18px;height:18px}}[data-theme=dark] .app-topbar{background:var(--color-bg-primary);border-color:var(--color-border)}[data-theme=dark] .document-title:hover{background:var(--color-bg-secondary)}[data-theme=dark] .document-title:focus{background:var(--color-bg-primary)}[data-theme=dark] .control-group{background:var(--color-bg-secondary)}[data-theme=dark] .topbar-btn:hover:not(:disabled){background:var(--color-bg-tertiary)}[data-theme=dark] .topbar-dropdown{background:var(--color-bg-primary);border-color:var(--color-border)}[data-theme=dark] .dropdown-item:hover{background:var(--color-bg-secondary)}.topbar-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.document-title:focus-visible{outline:none;box-shadow:0 0 0 3px #007aff4d}@media(prefers-contrast:high){.topbar-btn:not(:disabled){border:1px solid currentColor}.topbar-dropdown{border-width:2px}}@media(prefers-reduced-motion:reduce){.topbar-btn,.topbar-dropdown,.zoom-display,.chevron{transition:none}.save-indicator.status-saving i{animation:none}}.save-status-indicator{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:6px;font-size:13px;font-weight:500;transition:all .3s ease}.save-status-indicator .status-text{white-space:nowrap}.save-status-indicator.status-idle{opacity:.6;color:var(--text-secondary, #6b7280)}.save-status-indicator.status-saved{color:#10b981;background-color:#f0fdf4}.save-status-indicator.status-unsaved{color:#f59e0b;background-color:#fffbeb}.save-status-indicator.status-saving{color:#3b82f6;background-color:#eff6ff}.save-status-indicator.status-saving i[data-lucide=loader]{animation:spin 1s linear infinite}.save-status-indicator.status-error{color:#ef4444;background-color:#fef2f2}@media(max-width:768px){.save-status-indicator .status-text{display:none}}.contextual-toolbar{display:flex;align-items:center;gap:var(--spacing-3);padding:0 var(--spacing-4);height:100%;background:var(--color-bg-secondary, #f8f9fa);border-radius:var(--radius-md, 8px);margin:0 var(--spacing-2)}.contextual-toolbar .toolbar-group{display:flex;align-items:center;gap:var(--spacing-2)}.contextual-toolbar .toolbar-label{font-size:12px;font-weight:500;color:var(--color-text-secondary, #6b7280);white-space:nowrap}.contextual-toolbar .toolbar-select,.contextual-toolbar .toolbar-input{padding:4px 8px;font-size:13px;border:1px solid var(--color-border, #e5e7eb);border-radius:var(--radius-sm, 4px);background:var(--color-bg-primary, #ffffff);color:var(--color-text-primary, #1f2937);min-width:100px}.contextual-toolbar .toolbar-select:focus,.contextual-toolbar .toolbar-input:focus{outline:none;border-color:var(--color-primary, #007aff);box-shadow:0 0 0 3px #007aff1a}.contextual-toolbar .toolbar-input{width:60px;text-align:center}.contextual-toolbar .toolbar-color{width:32px;height:32px;border:1px solid var(--color-border, #e5e7eb);border-radius:var(--radius-sm, 4px);cursor:pointer;padding:0}.contextual-toolbar .toolbar-btn{display:flex;align-items:center;gap:var(--spacing-1);padding:6px 12px;background:transparent;border:1px solid var(--color-border, #e5e7eb);border-radius:var(--radius-sm, 4px);color:var(--color-text-primary, #1f2937);font-size:13px;cursor:pointer;transition:all .2s}.contextual-toolbar .toolbar-btn:hover{background:var(--color-bg-tertiary, #f3f4f6);border-color:var(--color-primary, #007aff)}.contextual-toolbar .toolbar-btn.active{background:var(--color-primary-light, #e3f2fd);border-color:var(--color-primary, #007aff);color:var(--color-primary, #007aff)}.contextual-toolbar .toolbar-separator{width:1px;height:24px;background:var(--color-border, #e5e7eb)}.contextual-toolbar .toolbar-text{font-size:13px;font-weight:500;color:var(--color-text-primary, #1f2937);white-space:nowrap}.contextual-toolbar .toolbar-text-secondary{font-size:11px;color:var(--color-text-secondary, #6b7280);margin-left:var(--spacing-1)}@media(max-width:1024px){.contextual-toolbar{gap:var(--spacing-2);padding:0 var(--spacing-2)}.contextual-toolbar .toolbar-label{display:none}}@media(max-width:768px){.contextual-toolbar{display:none}}@media print{.app-topbar{display:none}}.properties-panel-content{padding:var(--spacing-4);overflow-y:auto;height:100%}.properties-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-10) var(--spacing-6);text-align:center;color:var(--color-text-tertiary)}.empty-state-icon{width:64px;height:64px;display:flex;align-items:center;justify-content:center;margin-bottom:var(--spacing-4);color:var(--color-text-disabled, rgba(0, 0, 0, .3))}.empty-state-icon i,.empty-state-icon svg{width:48px;height:48px}.empty-state-text{font-size:14px;line-height:1.5;max-width:200px}.properties-header{margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-4);border-bottom:1px solid var(--color-border)}.property-type-badge{display:inline-block;margin-top:var(--spacing-2);padding:4px 10px;background:var(--color-primary-light, rgba(0, 122, 255, .1));color:var(--color-primary);border-radius:var(--radius-sm, 4px);font-size:12px;font-weight:var(--font-weight-medium, 500)}.property-group{margin-bottom:var(--spacing-4)}.property-label{display:block;font-size:13px;font-weight:var(--font-weight-medium, 500);color:var(--color-text-secondary);margin-bottom:var(--spacing-2)}.property-label input[type=checkbox]{margin-right:var(--spacing-2)}.property-input,.property-textarea{width:100%;padding:8px 12px;font-size:14px;color:var(--color-text-primary);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm, 4px);transition:all var(--transition-fast, .15s)}.property-input:hover,.property-textarea:hover{border-color:var(--color-border-hover, rgba(0, 0, 0, .3))}.property-input:focus,.property-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #007aff1a}.property-textarea{resize:vertical;min-height:80px;font-family:inherit}.properties-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-3);margin-bottom:var(--spacing-3)}.properties-stack{display:flex;flex-direction:column;gap:var(--spacing-3)}.button-group{display:flex;gap:var(--spacing-2)}.style-btn{flex:1;display:flex;align-items:center;justify-content:center;height:36px;padding:0 12px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm, 4px);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-fast, .15s)}.style-btn:hover{background:var(--color-bg-tertiary);border-color:var(--color-border-hover)}.style-btn.active{background:var(--color-primary-light, rgba(0, 122, 255, .1));border-color:var(--color-primary);color:var(--color-primary)}.style-btn i,.style-btn svg{width:18px;height:18px}.properties-actions{display:flex;flex-direction:column;gap:var(--spacing-2)}.action-btn{width:100%;display:flex;align-items:center;gap:var(--spacing-3);padding:10px 14px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md, 8px);color:var(--color-text-primary);font-size:14px;font-weight:var(--font-weight-medium, 500);text-align:left;cursor:pointer;transition:all var(--transition-fast, .15s)}.action-btn i,.action-btn svg{width:18px;height:18px;flex-shrink:0}.action-divider{height:1px;background:var(--color-border);margin:var(--spacing-2) 0}@media(max-width:1200px){.properties-grid{grid-template-columns:1fr}}@media(max-width:768px){.properties-panel-content{padding:var(--spacing-3)}.property-input,.property-textarea{font-size:13px;padding:6px 10px}.style-btn,.action-btn{font-size:13px;padding:8px 10px}}[data-theme=dark] .properties-empty-state{color:var(--color-text-tertiary)}[data-theme=dark] .property-input,[data-theme=dark] .property-textarea{background:var(--color-bg-secondary);border-color:var(--color-border);color:var(--color-text-primary)}[data-theme=dark] .property-input:hover,[data-theme=dark] .property-textarea:hover{border-color:var(--color-border-hover)}[data-theme=dark] .style-btn{background:var(--color-bg-secondary);border-color:var(--color-border)}[data-theme=dark] .style-btn:hover{background:var(--color-bg-tertiary)}[data-theme=dark] .style-btn.active{background:var(--color-primary-light);border-color:var(--color-primary)}.property-input:focus-visible,.property-textarea:focus-visible,.style-btn:focus-visible,.action-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}@media(prefers-reduced-motion:reduce){.property-input,.property-textarea,.style-btn,.action-btn{transition:none}}@media(prefers-contrast:high){.property-input,.property-textarea,.style-btn,.action-btn{border-width:2px}}.properties-panel-content::-webkit-scrollbar{width:8px}.properties-panel-content::-webkit-scrollbar-track{background:transparent}.properties-panel-content::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}.properties-panel-content::-webkit-scrollbar-thumb:hover{background:var(--color-border-hover)}.text-properties-panel{padding:var(--spacing-4)}.text-styles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:var(--spacing-3);margin-bottom:var(--spacing-3)}.text-style-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-2);padding:var(--spacing-4);background:var(--color-bg-secondary);border:2px solid var(--color-border);border-radius:var(--radius-md, 8px);cursor:pointer;transition:all var(--transition-fast, .15s);min-height:100px}.text-style-card:hover{border-color:var(--color-primary);background:var(--color-primary-light, rgba(0, 122, 255, .05));transform:translateY(-2px);box-shadow:var(--shadow-md)}.text-style-card.create-new{border-style:dashed;color:var(--color-text-secondary)}.text-style-card.create-new:hover{color:var(--color-primary)}.style-preview{font-size:32px;line-height:1}.style-name{font-size:12px;font-weight:var(--font-weight-medium, 500);color:var(--color-text-secondary);text-align:center}.text-style-card:hover .style-name{color:var(--color-primary)}.button-group.vertical{flex-direction:column}.auto-resize-btn{width:100%;display:flex;align-items:center;gap:var(--spacing-3);padding:10px 14px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm, 4px);color:var(--color-text-primary);font-size:14px;text-align:left;cursor:pointer;transition:all var(--transition-fast, .15s)}.auto-resize-btn:hover{background:var(--color-bg-tertiary);border-color:var(--color-border-hover)}.auto-resize-btn.active{background:var(--color-primary-light, rgba(0, 122, 255, .1));border-color:var(--color-primary);color:var(--color-primary)}.auto-resize-btn i,.auto-resize-btn svg{width:18px;height:18px;flex-shrink:0}.effect-group{margin-bottom:var(--spacing-3)}.effect-header{margin-bottom:var(--spacing-2)}.effect-header label{display:flex;align-items:center;gap:var(--spacing-2);cursor:pointer}.effect-header input[type=checkbox]{width:18px;height:18px;cursor:pointer}.effect-controls{padding-left:var(--spacing-6);margin-top:var(--spacing-3)}.properties-stack-sm{display:flex;flex-direction:column;gap:var(--spacing-2)}.variables-description{font-size:13px;color:var(--color-text-secondary);line-height:1.5;margin-bottom:var(--spacing-3)}.variables-list{display:flex;flex-direction:column;gap:var(--spacing-2);margin-bottom:var(--spacing-3)}.variable-item{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-3);padding:8px 12px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm, 4px);cursor:pointer;transition:all var(--transition-fast, .15s)}.variable-item:hover{background:var(--color-bg-tertiary);border-color:var(--color-primary)}.variable-item code{font-family:Courier New,monospace;font-size:13px;font-weight:var(--font-weight-medium, 500);color:var(--color-primary);background:var(--color-primary-light, rgba(0, 122, 255, .1));padding:2px 6px;border-radius:3px}.variable-value{font-size:12px;color:var(--color-text-secondary);flex:1;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.empty-state-text-sm{font-size:12px;color:var(--color-text-tertiary);text-align:center;padding:var(--spacing-4)}@media(max-width:768px){.text-styles-grid{grid-template-columns:repeat(2,1fr)}.text-style-card{min-height:80px;padding:var(--spacing-3)}.style-preview{font-size:24px}}[data-theme=dark] .text-style-card{background:var(--color-bg-secondary);border-color:var(--color-border)}[data-theme=dark] .text-style-card:hover{background:var(--color-primary-light);border-color:var(--color-primary)}[data-theme=dark] .auto-resize-btn{background:var(--color-bg-secondary);border-color:var(--color-border)}[data-theme=dark] .auto-resize-btn:hover{background:var(--color-bg-tertiary)}[data-theme=dark] .auto-resize-btn.active{background:var(--color-primary-light);border-color:var(--color-primary)}[data-theme=dark] .variable-item{background:var(--color-bg-secondary);border-color:var(--color-border)}[data-theme=dark] .variable-item:hover{background:var(--color-bg-tertiary)}.text-style-card:focus-visible,.auto-resize-btn:focus-visible,.variable-item:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}@media(prefers-reduced-motion:reduce){.text-style-card,.auto-resize-btn,.variable-item{transition:none}}.dashboard-wrapper{position:absolute;inset:0;background:linear-gradient(135deg,#f5f7fa,#e4e9f2);overflow-y:auto;z-index:1000}.dashboard-container{max-width:1200px;margin:0 auto;padding:60px 40px}.dashboard-header{text-align:center;margin-bottom:48px}.dashboard-title{display:flex;align-items:center;justify-content:center;gap:12px;font-size:36px;font-weight:700;color:var(--text-primary);margin:0 0 12px}.dashboard-subtitle{font-size:18px;color:var(--text-secondary);margin:0}.dashboard-create-section{display:flex;justify-content:center;margin-bottom:64px}.dashboard-create-btn{display:flex;align-items:center;gap:12px;padding:16px 32px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;border:none;border-radius:var(--radius-lg);font-size:18px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #3b82f64d}.dashboard-create-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #3b82f666}.dashboard-create-btn:active{transform:translateY(0)}.dashboard-section{margin-bottom:48px}.dashboard-section-header{margin-bottom:24px}.dashboard-section-title{display:flex;align-items:center;gap:8px;font-size:24px;font-weight:600;color:var(--text-primary);margin:0}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}.dashboard-card{background:#fff;border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 8px #00000014}.dashboard-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f}.dashboard-card-thumbnail{width:100%;height:200px;background:var(--gray-100);display:flex;align-items:center;justify-content:center;overflow:hidden}.dashboard-card-thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.dashboard-card-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:linear-gradient(135deg,#f8f9fa,#e9ecef)}.dashboard-card-content{padding:20px}.dashboard-card-title{font-size:16px;font-weight:600;color:var(--text-primary);margin:0 0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dashboard-card-meta{font-size:13px;color:var(--text-secondary);margin:0}.dashboard-card-description{font-size:14px;color:var(--text-secondary);margin:0;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}@media(max-width:768px){.dashboard-container{padding:40px 20px}.dashboard-title{font-size:28px}.dashboard-subtitle{font-size:16px}.dashboard-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.dashboard-card-thumbnail{height:160px}}@keyframes dashboardFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.dashboard-wrapper{animation:dashboardFadeIn .5s ease-out}.dashboard-card{animation:dashboardFadeIn .6s ease-out backwards}.dashboard-card:nth-child(1){animation-delay:.1s}.dashboard-card:nth-child(2){animation-delay:.15s}.dashboard-card:nth-child(3){animation-delay:.2s}.dashboard-card:nth-child(4){animation-delay:.25s}.dashboard-card:nth-child(5){animation-delay:.3s}.dashboard-card:nth-child(6){animation-delay:.35s}.command-palette-overlay{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1090;display:flex;align-items:flex-start;justify-content:center;padding-top:15vh;animation:fadeIn .2s ease-out}.command-palette-overlay.hidden{display:none}.command-palette{width:100%;max-width:640px;background:var(--color-bg-primary, #ffffff);border-radius:12px;box-shadow:0 25px 50px -12px #00000040;display:flex;flex-direction:column;max-height:60vh;animation:slideDown .2s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.command-palette-header{padding:16px;border-bottom:1px solid var(--color-border, #e5e7eb)}.search-container{display:flex;align-items:center;gap:12px;position:relative}.search-icon{color:var(--text-secondary, #6b7280);flex-shrink:0}.command-search-input{flex:1;border:none;outline:none;font-size:16px;color:var(--text-primary, #111827);background:transparent;padding:0}.command-search-input::-moz-placeholder{color:var(--text-tertiary, #9ca3af)}.command-search-input::placeholder{color:var(--text-tertiary, #9ca3af)}.shortcut-hint{margin-left:auto}.command-palette-body{flex:1;overflow-y:auto;min-height:200px;max-height:calc(60vh - 120px)}.command-results{padding:8px}.no-results{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;color:var(--text-secondary, #6b7280)}.no-results .icon-lg{width:48px;height:48px;margin-bottom:12px;opacity:.5}.no-results p{margin:0;font-size:14px}.command-category{margin-bottom:8px}.category-label{padding:8px 12px 4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-tertiary, #9ca3af)}.command-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:6px;cursor:pointer;transition:background-color .15s ease}.command-item:hover{background:var(--color-bg-secondary, #f9fafb)}.command-item.selected{background:var(--color-primary, #007aff);color:#fff}.command-item.selected .command-icon,.command-item.selected .command-description,.command-item.selected .command-shortcut{color:#fff;border-color:#ffffff4d}.command-icon{flex-shrink:0;color:var(--text-secondary, #6b7280);width:20px;height:20px}.command-content{flex:1;min-width:0}.command-name{font-size:14px;font-weight:500;color:var(--text-primary, #111827);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.command-item.selected .command-name{color:#fff}.command-name mark{background:var(--color-accent, #fef3c7);color:var(--text-primary, #111827);padding:0 2px;border-radius:2px}.command-item.selected .command-name mark{background:#ffffff4d;color:#fff}.command-description{font-size:12px;color:var(--text-secondary, #6b7280);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.command-shortcut{flex-shrink:0;font-size:11px;padding:3px 6px;border-radius:4px;background:var(--color-bg-secondary, #f3f4f6);border:1px solid var(--color-border, #e5e7eb);color:var(--text-secondary, #6b7280);font-family:monospace}.command-palette-footer{padding:12px 16px;border-top:1px solid var(--color-border, #e5e7eb);background:var(--color-bg-secondary, #f9fafb);border-bottom-left-radius:12px;border-bottom-right-radius:12px}.footer-hint{display:flex;align-items:center;gap:16px;font-size:12px;color:var(--text-secondary, #6b7280)}.footer-hint kbd{font-size:11px;padding:2px 6px;border-radius:3px;background:var(--color-bg-primary, #ffffff);border:1px solid var(--color-border, #e5e7eb);color:var(--text-secondary, #6b7280);font-family:monospace;margin-right:4px}.command-palette-body::-webkit-scrollbar{width:8px}.command-palette-body::-webkit-scrollbar-track{background:transparent}.command-palette-body::-webkit-scrollbar-thumb{background:var(--color-border, #e5e7eb);border-radius:4px}.command-palette-body::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary, #9ca3af)}@media(max-width:768px){.command-palette-overlay{padding-top:10vh}.command-palette{max-width:calc(100% - 32px);max-height:70vh}.command-description{display:none}}@media(prefers-reduced-motion:reduce){.command-palette-overlay,.command-palette,.command-item{animation:none;transition:none}}*{transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),opacity var(--transition-fast),box-shadow var(--transition-fast)}button,.btn,.topbar-btn,.sidebar-btn{position:relative;overflow:hidden;transform-origin:center;transition:all var(--transition-fast)}button:hover,.btn:hover,.topbar-btn:hover,.sidebar-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}button:active,.btn:active,.topbar-btn:active,.sidebar-btn:active{transform:translateY(0);box-shadow:var(--shadow-xs)}button:before,.btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .6s,height .6s,opacity .6s;opacity:0}button:active:before,.btn:active:before{width:200px;height:200px;opacity:1;transition:0s}.btn-primary{animation:subtle-pulse 3s ease-in-out infinite}@keyframes subtle-pulse{0%,to{box-shadow:0 0 #007aff66}50%{box-shadow:0 0 0 4px #007aff00}}.sidebar,.properties-panel,.modal,.dropdown{animation:slideIn .2s ease-out}@keyframes slideIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.modal-overlay{animation:fadeIn .15s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}input,textarea,select{transition:border-color var(--transition-fast),box-shadow var(--transition-fast),background-color var(--transition-fast)}input:focus,textarea:focus,select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #007aff1a;transform:scale(1.01)}.form-group label{transition:transform var(--transition-fast),font-size var(--transition-fast),color var(--transition-fast)}.form-group input:not(:-moz-placeholder)+label{transform:translateY(-1.5rem) scale(.85);color:var(--color-primary)}.form-group input:focus+label,.form-group input:not(:placeholder-shown)+label{transform:translateY(-1.5rem) scale(.85);color:var(--color-primary)}.card,.panel-section,.layer-item,.command-item{transition:transform var(--transition-fast),box-shadow var(--transition-fast),background-color var(--transition-fast)}.card:hover,.panel-section:hover,.layer-item:hover,.command-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}input[type=range]{transition:opacity var(--transition-fast)}input[type=range]:hover,input[type=range]:active{opacity:1}input[type=range]::-webkit-slider-thumb{-webkit-transition:transform var(--transition-fast),box-shadow var(--transition-fast);transition:transform var(--transition-fast),box-shadow var(--transition-fast)}input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.2);box-shadow:0 0 0 4px #007aff33}input[type=range]:active::-webkit-slider-thumb{transform:scale(1.1);box-shadow:0 0 0 6px #007aff4d}[title]:hover:after{content:attr(title);position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(-8px);padding:6px 10px;background:var(--color-text-primary);color:var(--color-text-inverse);font-size:12px;white-space:nowrap;border-radius:4px;pointer-events:none;opacity:0;animation:tooltipFadeIn .2s ease-out .5s forwards;z-index:var(--z-tooltip)}@keyframes tooltipFadeIn{0%{opacity:0;transform:translate(-50%) translateY(-4px)}to{opacity:1;transform:translate(-50%) translateY(-8px)}}svg,i[data-lucide]{transition:transform var(--transition-fast),color var(--transition-fast)}button:hover svg,button:hover i[data-lucide],.btn:hover svg,.btn:hover i[data-lucide]{transform:scale(1.1)}.icon-loading,i[data-lucide=loader],i[data-lucide=loader-2]{animation:rotate 1s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.toast,.notification,.alert{animation:toastSlideIn .3s var(--transition-bounce)}@keyframes toastSlideIn{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}.skeleton{background:linear-gradient(90deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 50%,var(--color-bg-secondary) 100%);background-size:200% 100%;animation:skeleton 1.5s ease-in-out infinite}@keyframes skeleton{0%{background-position:200% 0}to{background-position:-200% 0}}*:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:4px;animation:focusRing .3s ease-out}@keyframes focusRing{0%{outline-width:0;outline-offset:4px}to{outline-width:2px;outline-offset:2px}}.badge,.tag,.status{animation:badgePop .2s var(--transition-bounce)}@keyframes badgePop{0%{transform:scale(0)}60%{transform:scale(1.1)}to{transform:scale(1)}}html{scroll-behavior:smooth}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in-up{animation:fadeInUp .4s ease-out}.highlight-on-hover{position:relative}.highlight-on-hover:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,.1) 50%,transparent 70%);background-size:200% 200%;background-position:100% 0;transition:background-position .5s ease;pointer-events:none}.highlight-on-hover:hover:before{background-position:0 0}[data-theme=dark]{transition:background-color .3s ease,color .3s ease}[data-theme=dark] *{transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media print{*{animation:none!important;transition:none!important}}.modern-layout{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden;background:#1e1e1e}[data-theme=light] .modern-layout{background:#f5f5f7}.modern-main{display:flex;flex:1;overflow:hidden;position:relative}.modern-canvas{flex:1;display:flex;align-items:center;justify-content:center;background:#2c2c2e;overflow:hidden;position:relative}[data-theme=light] .modern-canvas{background:#e5e5e7}.modern-sidebar{width:60px;background:#1e1e1e;border-right:1px solid #2d2d2d;display:flex;flex-direction:column;position:relative;z-index:100}[data-theme=light] .modern-sidebar{background:#fff;border-right-color:#e2e8f0}.modern-sidebar-icons{display:flex;flex-direction:column;padding:8px 0;gap:4px}.modern-sidebar-icon{width:44px;height:44px;margin:0 auto;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:8px;color:#a1a1a6;cursor:pointer;transition:all .15s ease;position:relative}.modern-sidebar-icon:hover{background:#3a3a3c;color:#fff}.modern-sidebar-icon.active{background:#007aff;color:#fff}.modern-sidebar-icon.active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:20px;background:#fff;border-radius:0 2px 2px 0}[data-theme=light] .modern-sidebar-icon{color:#6b7280}[data-theme=light] .modern-sidebar-icon:hover{background:#f3f4f6;color:#111827}[data-theme=light] .modern-sidebar-icon.active{background:#2563eb;color:#fff}.modern-drawer{width:300px;background:#252525;border-right:1px solid #2d2d2d;display:flex;flex-direction:column;position:relative;z-index:99;animation:slideIn .2s ease-out}[data-theme=light] .modern-drawer{background:#fff;border-right-color:#e2e8f0}@keyframes slideIn{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.drawer-content{display:flex;flex-direction:column;height:100%;overflow:hidden}.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid #2d2d2d}.drawer-header h3{font-size:14px;font-weight:600;color:#fff;margin:0}[data-theme=light] .drawer-header h3{color:#1c1c1e}.drawer-close{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:4px;color:#a1a1a6;cursor:pointer;transition:all .15s ease}.drawer-close:hover{background:#3a3a3c;color:#fff}[data-theme=light] .drawer-close{color:#6b7280}[data-theme=light] .drawer-close:hover{background:#f3f4f6;color:#111827}[data-theme=light] .drawer-header{border-bottom-color:#e2e8f0}.drawer-body{flex:1;overflow-y:auto;padding:16px}.drawer-placeholder{color:#9ca3af;font-size:13px;text-align:center;padding:32px 16px}[data-theme=light] .drawer-placeholder{color:#6b7280}.drawer-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.drawer-item{cursor:pointer;transition:transform .15s ease}.drawer-item:hover{transform:translateY(-2px)}.drawer-item-preview{width:100%;aspect-ratio:1;border-radius:8px;display:flex;align-items:center;justify-content:center;background:#2d2d2d;border:1px solid #3a3a3c;margin-bottom:8px;overflow:hidden}.drawer-item-preview span{color:#fff;font-size:13px;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.3)}.drawer-item p{font-size:12px;color:#d1d5db;margin:0;text-align:center;font-weight:500}[data-theme=light] .drawer-item p{color:#475569}[data-theme=light] .drawer-item-preview{background:#f5f5f7;border-color:#e2e8f0}[data-theme=light] .drawer-item-preview span{color:#111827;text-shadow:none}.layout-preview{padding:12px;background:#1e1e1e!important}.layout-single{width:100%;height:100%;background:#007aff;border-radius:4px}.layout-strip{width:100%;height:100%;display:flex;flex-direction:column;gap:4px}.layout-strip>div{flex:1;background:#007aff;border-radius:2px}.layout-grid{width:100%;height:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:4px}.layout-grid>div{background:#007aff;border-radius:2px}.drawer-list{display:flex;flex-direction:column;gap:8px}.drawer-list-item{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--color-bg-secondary, #f5f5f7);border:1px solid var(--color-border, #e2e8f0);border-radius:8px;cursor:pointer;transition:all .15s ease;text-align:left;width:100%}.drawer-list-item:hover{background:var(--color-bg-tertiary, #e5e5e7);border-color:var(--color-primary, #007aff);transform:translateY(-1px);box-shadow:0 2px 8px #00000014}.drawer-list-preview{min-width:120px;padding:8px 12px;background:var(--color-bg-primary, #ffffff);border-radius:6px;border:1px solid var(--color-border, #e2e8f0);color:var(--color-text-primary, #1c1c1e);text-align:center}.drawer-list-item span{color:var(--color-text-primary, #1c1c1e);font-size:14px;font-weight:500}[data-theme=dark] .drawer-list-item{background:var(--color-bg-secondary, #2d2d2d);border-color:var(--color-border, #3a3a3c)}[data-theme=dark] .drawer-list-item:hover{background:var(--color-bg-tertiary, #3a3a3c);border-color:var(--color-primary, #007aff)}[data-theme=dark] .drawer-list-item span{color:var(--color-text-primary, #e5e7eb)}[data-theme=dark] .drawer-list-preview{background:var(--color-bg-primary, #1e1e1e);border-color:var(--color-border, #3a3a3c);color:var(--color-text-primary, #ffffff)}[data-theme=light] .drawer-list-item{background:#f5f5f7;border-color:#e2e8f0}[data-theme=light] .drawer-list-item:hover{background:#e5e5e7;border-color:#007aff}[data-theme=light] .drawer-list-item span{color:#1c1c1e}[data-theme=light] .drawer-list-preview{background:#fff;border-color:#e2e8f0}[data-theme=light] .layout-preview{background:#f5f5f7!important}.contextual-topbar{height:40px;background:#fff;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;padding:0 16px;z-index:100}[data-theme=dark] .contextual-topbar{background:#1e1e1e;border-bottom-color:#2d2d2d}.contextual-topbar-actions{display:flex;align-items:center;gap:8px;margin-left:auto}.contextual-topbar-content{display:flex;align-items:center;gap:8px;width:100%}.contextual-group{display:flex;align-items:center;gap:8px}.contextual-separator{width:1px;height:20px;background:#d1d5db;margin:0 4px}[data-theme=dark] .contextual-separator{background:#52525b}.contextual-title{font-size:14px;font-weight:600;color:#1c1c1e}[data-theme=dark] .contextual-title{color:#fff}.contextual-label{font-size:12px;color:#9ca3af;white-space:nowrap;font-weight:500}[data-theme=light] .contextual-label{color:#4b5563}.contextual-value{font-size:13px;color:#1c1c1e;min-width:50px;text-align:center;font-weight:500}[data-theme=dark] .contextual-value{color:#fff}.contextual-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:6px;color:#6b7280;cursor:pointer;transition:all .15s ease;position:relative}.contextual-btn svg{width:16px;height:16px;display:block}.contextual-btn:hover{background:#f3f4f6;color:#111827}[data-theme=dark] .contextual-btn{color:#a1a1a6}[data-theme=dark] .contextual-btn:hover{background:#3a3a3c;color:#fff}.contextual-btn.active{background:#dbeafe;color:#1d4ed8}[data-theme=dark] .contextual-btn.active{background:#1e3a8a;color:#93c5fd}.contextual-select{padding:4px 8px;background:#fff;border:1px solid #d1d5db;border-radius:6px;font-size:13px;color:#111827;cursor:pointer;transition:all .15s ease;min-width:120px;font-weight:500}.contextual-select:hover{border-color:#9ca3af;background:#f9fafb}.contextual-select:focus{outline:none;border-color:#2563eb;background:#fff;box-shadow:0 0 0 3px #2563eb1a}[data-theme=dark] .contextual-select{color:#e5e7eb;background:#2c2c2e;border-color:#52525b}[data-theme=dark] .contextual-select:hover{border-color:#71717a;background:#3a3a3c}[data-theme=dark] .contextual-select:focus{border-color:#3b82f6;background:#252525;box-shadow:0 0 0 3px #3b82f633}.contextual-color-picker{width:28px;height:28px;padding:2px;border:1.5px solid #9ca3af;border-radius:6px;cursor:pointer;background:#fff;transition:all .15s ease}.contextual-color-picker:hover{border-color:#6b7280;box-shadow:0 0 0 2px #6b72801a}[data-theme=dark] .contextual-color-picker{border-color:#71717a;background:#2c2c2e}[data-theme=dark] .contextual-color-picker:hover{border-color:#a1a1a6;box-shadow:0 0 0 2px #a1a1a633}.contextual-color-picker::-webkit-color-swatch-wrapper{padding:0}.contextual-color-picker::-webkit-color-swatch{border:none;border-radius:4px}.theme-toggle-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid #d1d5db;border-radius:6px;color:#4b5563;cursor:pointer;transition:all .15s ease;position:relative}.theme-toggle-btn svg{width:18px;height:18px;display:block;stroke-width:2.5}.theme-toggle-btn:hover{background:#f3f4f6;border-color:#9ca3af;color:#111827}[data-theme=dark] .theme-toggle-btn{border-color:#52525b;color:#d1d5db}[data-theme=dark] .theme-toggle-btn:hover{background:#3a3a3c;border-color:#71717a;color:#fff}.contextual-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:5px;background:#d1d5db;border-radius:2px;outline:none;cursor:pointer}[data-theme=dark] .contextual-slider{background:#52525b}.contextual-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#007aff;border-radius:50%;cursor:pointer;-webkit-transition:all .15s ease;transition:all .15s ease}.contextual-slider::-webkit-slider-thumb:hover{transform:scale(1.1);background:#0051a8}.contextual-slider::-moz-range-thumb{width:16px;height:16px;background:#007aff;border-radius:50%;cursor:pointer;border:none;-moz-transition:all .15s ease;transition:all .15s ease}.contextual-slider::-moz-range-thumb:hover{transform:scale(1.1);background:#0051a8}.canvas-wrapper{position:relative}.canvas-textarea-overlay{position:fixed;z-index:1000;border:2px solid #3b82f6;border-radius:4px;padding:var(--textarea-padding, 4px);background:#fff;outline:none;resize:none;transform-origin:left top;box-shadow:0 4px 12px #3b82f64d;left:var(--textarea-left, 0);top:var(--textarea-top, 0);width:var(--textarea-width, 200px);min-height:var(--textarea-height, 20px);height:auto;font-size:var(--textarea-font-size, 16px);font-family:var(--textarea-font-family, inherit);color:var(--textarea-color, #000000);line-height:var(--textarea-line-height, 1.2);text-align:var(--textarea-text-align, left);display:flex;align-items:center;vertical-align:middle;overflow-wrap:break-word;word-wrap:break-word;white-space:pre-wrap}[data-theme=dark] .canvas-textarea-overlay{background:#1e1e1e;border-color:#3b82f6;color:#fff}.canvas-safe-zone{position:absolute;pointer-events:none;border:2px dashed #ff3b30;border-radius:4px;z-index:10;transition:all .2s ease}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.quick-actions-menu{position:absolute;display:flex;align-items:center;gap:4px;background:var(--color-bg-panel, #ffffff);border:1px solid var(--color-border, #e5e7eb);border-radius:8px;box-shadow:0 4px 12px #00000026;padding:4px;box-shadow:0 4px 12px #00000080;z-index:1000;animation:fadeIn .15s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.quick-action-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:4px;color:var(--color-text-primary, #1f2937);cursor:pointer;transition:all .2s}.quick-action-btn:hover{background:var(--color-bg-secondary, #f3f4f6);color:var(--color-primary, #3b82f6)}[data-theme=dark] .quick-actions-menu{background:var(--color-bg-panel, #1e1e1e);border-color:var(--color-border, #52525b);color:var(--color-text-primary, #ffffff)}[data-theme=dark] .quick-action-btn{color:var(--color-text-primary, #ffffff)}[data-theme=dark] .quick-action-btn:hover{background:var(--color-bg-secondary, #2a2a2a);color:var(--color-primary, #60a5fa)}.quick-action-btn-old{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:6px;color:#a1a1a6;cursor:pointer;transition:all .15s ease;position:relative}.quick-action-btn svg{width:16px;height:16px;display:block;stroke-width:2.5}.quick-action-btn:hover{background:#3a3a3c;color:#fff}[data-theme=light] .quick-actions-menu{background:#fff;border:1px solid #e5e7eb;box-shadow:0 4px 12px #00000026}[data-theme=light] .quick-action-btn{color:#374151}[data-theme=light] .quick-action-btn:hover{background:#f3f4f6;color:#111827}[data-theme=dark] .quick-actions-menu{background:#1e1e1e;border:1px solid #52525b;box-shadow:0 4px 12px #00000080}[data-theme=dark] .quick-action-btn{color:#e5e7eb}[data-theme=dark] .quick-action-btn:hover{background:#3a3a3c;color:#fff}.smart-guide{position:absolute;background:#ff0080;z-index:100;pointer-events:none;opacity:.8}.smart-guide.horizontal{height:1px;left:0;right:0}.smart-guide.vertical{width:1px;top:0;bottom:0}.drawer-title{font-size:14px;font-weight:600;color:#fff;margin:0;line-height:1.4}[data-theme=light] .drawer-title{color:#111827}.drawer-close-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:6px;color:#a1a1a6;cursor:pointer;transition:all .15s ease;position:relative}.drawer-close-btn svg{width:16px;height:16px;display:block;stroke-width:2.5}.drawer-close-btn:hover{background:#3a3a3c;color:#fff}[data-theme=light] .drawer-close-btn{color:#6b7280}[data-theme=light] .drawer-close-btn:hover{background:#f3f4f6;color:#111827}.control-group{display:flex;flex-direction:column;gap:var(--spacing-sm, 8px);margin-bottom:var(--spacing-lg, 16px)}.control-group:last-child{margin-bottom:0}.control-group label{font-size:13px;font-weight:600;color:#e5e7eb;margin-bottom:var(--spacing-xs, 4px);display:block}[data-theme=light] .control-group label{color:#374151}.input{padding:8px 12px;background:#2c2c2e;border:1.5px solid #52525b;border-radius:6px;font-size:13px;color:#e5e7eb;font-family:inherit;transition:all .15s ease;width:100%;font-weight:500}.input:focus{outline:none;border-color:#3b82f6;background:#252525;box-shadow:0 0 0 3px #3b82f633}.input:hover:not(:disabled){border-color:#71717a}.input:disabled{opacity:.5;cursor:not-allowed}[data-theme=light] .input{background:#fff;border-color:#d1d5db;color:#111827}[data-theme=light] .input:focus{border-color:#2563eb;background:#fff;box-shadow:0 0 0 3px #2563eb1a}[data-theme=light] .input:hover:not(:disabled){border-color:#9ca3af}.input select,select.input{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%23a1a1a6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}[data-theme=light] .input select,[data-theme=light] select.input{background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}.btn-toggle{padding:8px 16px;background:#2c2c2e;border:1.5px solid #52525b;border-radius:6px;font-size:13px;font-weight:500;color:#e5e7eb;cursor:pointer;transition:all .15s ease;text-align:center;font-family:inherit}.btn-toggle:hover:not(:disabled){background:#3a3a3c;border-color:#71717a;color:#fff}.btn-toggle.active{background:#1e3a8a;border-color:#3b82f6;color:#93c5fd;font-weight:600}.btn-toggle:disabled{opacity:.5;cursor:not-allowed}[data-theme=light] .btn-toggle{background:#fff;border-color:#d1d5db;color:#374151}[data-theme=light] .btn-toggle:hover:not(:disabled){background:#f9fafb;border-color:#9ca3af;color:#111827}[data-theme=light] .btn-toggle.active{background:#dbeafe;border-color:#2563eb;color:#1d4ed8}.drawer-item-title{font-size:12px;font-weight:500;color:#d1d5db;text-align:center;margin-top:4px;line-height:1.4}.drawer-content .drawer-placeholder,.drawer-content span[style*="color: var(--color-text-secondary)"]{color:#9ca3af!important}[data-theme=light] .drawer-content .drawer-placeholder,[data-theme=light] .drawer-content span[style*="color: var(--color-text-secondary)"]{color:#64748b!important}.drawer-body::-webkit-scrollbar,.modern-sidebar::-webkit-scrollbar{width:6px}.drawer-body::-webkit-scrollbar-track,.modern-sidebar::-webkit-scrollbar-track{background:transparent}.drawer-body::-webkit-scrollbar-thumb,.modern-sidebar::-webkit-scrollbar-thumb{background:#52525b;border-radius:3px}.drawer-body::-webkit-scrollbar-thumb:hover,.modern-sidebar::-webkit-scrollbar-thumb:hover{background:#71717a}[data-theme=light] .drawer-body::-webkit-scrollbar-thumb,[data-theme=light] .modern-sidebar::-webkit-scrollbar-thumb{background:#cbd5e1}[data-theme=light] .drawer-body::-webkit-scrollbar-thumb:hover,[data-theme=light] .modern-sidebar::-webkit-scrollbar-thumb:hover{background:#94a3b8}.collapsible-section{border-bottom:1px solid var(--color-border, #e2e8f0);margin-bottom:var(--spacing-xs, 4px)}.collapsible-section-header{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md, 12px) var(--spacing-sm, 8px);background:transparent;border:none;cursor:pointer;transition:background-color .15s ease;font-size:var(--font-size-sm, 13px);font-weight:var(--font-weight-semibold, 600);color:var(--color-text-primary, #1e293b)}.collapsible-section-header:hover{background:var(--color-bg-secondary, #f8fafc)}.collapsible-section-title{display:flex;align-items:center;gap:var(--spacing-xs, 4px)}.collapsible-section-icon{display:flex;align-items:center;opacity:.7}.collapsible-section-chevron{color:var(--color-text-secondary, #64748b);transition:transform .2s ease}.collapsible-section-content{overflow:hidden}.collapsible-section-inner{padding:var(--spacing-sm, 8px) var(--spacing-md, 12px) var(--spacing-md, 12px)}.slider-input-group{margin-bottom:var(--spacing-md, 12px)}.slider-input-label{display:block;font-size:var(--font-size-xs, 11px);font-weight:var(--font-weight-medium, 500);color:var(--color-text-secondary, #64748b);margin-bottom:var(--spacing-xs, 4px);text-transform:uppercase;letter-spacing:.5px}.slider-input-container{display:flex;align-items:center;gap:var(--spacing-sm, 8px)}.slider-input-track{flex:1;position:relative;height:4px;background:var(--color-bg-tertiary, #f1f5f9);border-radius:2px;cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none}.slider-input-track:active{cursor:grabbing}.slider-input-fill{position:absolute;top:0;left:0;height:100%;background:var(--color-primary, #3b82f6);border-radius:2px;transition:width .1s ease}.slider-input-thumb{position:absolute;top:50%;transform:translate(-50%,-50%);width:14px;height:14px;background:var(--color-primary, #3b82f6);border:2px solid var(--color-bg-primary, #ffffff);border-radius:50%;box-shadow:0 2px 4px #0000001a;cursor:grab;transition:transform .1s ease,box-shadow .1s ease}.slider-input-thumb:hover{transform:translate(-50%,-50%) scale(1.1);box-shadow:0 2px 8px #3b82f64d}.slider-input-thumb:active{cursor:grabbing;transform:translate(-50%,-50%) scale(1.15)}.slider-input-number{display:flex;align-items:center;min-width:80px}.slider-input-number .input-compact{width:60px;padding:4px 8px;font-size:var(--font-size-sm, 13px);text-align:center}.slider-input-unit{font-size:var(--font-size-xs, 11px);color:var(--color-text-secondary, #64748b);margin-left:var(--spacing-xs, 4px);min-width:24px}.layer-search-container{margin-bottom:var(--spacing-md, 12px);padding:var(--spacing-sm, 8px);background:var(--color-bg-secondary, #f8fafc);border-radius:var(--radius-md, 8px)}.layer-search-input-wrapper{position:relative;display:flex;align-items:center;gap:var(--spacing-xs, 4px)}.layer-search-icon{position:absolute;left:var(--spacing-sm, 8px);color:var(--color-text-tertiary, #94a3b8);pointer-events:none;z-index:1}.layer-search-input{flex:1;padding:var(--spacing-xs, 4px) var(--spacing-xs, 4px) var(--spacing-xs, 4px) 28px;border:1px solid var(--color-border, #e2e8f0);border-radius:var(--radius-sm, 4px);font-size:var(--font-size-sm, 13px);background:var(--color-bg-primary, #ffffff);color:var(--color-text-primary, #1e293b);transition:border-color .15s ease,box-shadow .15s ease}.layer-search-input:focus{outline:none;border-color:var(--color-primary, #3b82f6);box-shadow:0 0 0 3px #3b82f61a}.layer-search-clear{padding:4px;border:none;background:transparent;color:var(--color-text-tertiary, #94a3b8);cursor:pointer;display:flex;align-items:center;border-radius:var(--radius-sm, 4px);transition:background-color .15s ease,color .15s ease}.layer-search-clear:hover{background:var(--color-bg-tertiary, #f1f5f9);color:var(--color-text-primary, #1e293b)}.layer-search-filter-toggle{padding:4px 8px;border:1px solid var(--color-border, #e2e8f0);background:var(--color-bg-primary, #ffffff);border-radius:var(--radius-sm, 4px);cursor:pointer;display:flex;align-items:center;position:relative;transition:all .15s ease}.layer-search-filter-toggle:hover{background:var(--color-bg-secondary, #f8fafc);border-color:var(--color-primary, #3b82f6)}.layer-search-filter-toggle.active{background:var(--color-primary-light, rgba(59, 130, 246, .1));border-color:var(--color-primary, #3b82f6);color:var(--color-primary, #3b82f6)}.layer-search-filter-badge{position:absolute;top:-4px;right:-4px;width:16px;height:16px;background:var(--color-primary, #3b82f6);color:#fff;border-radius:50%;font-size:10px;display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-bold, 700)}.layer-search-filters{display:flex;flex-wrap:wrap;gap:var(--spacing-xs, 4px);margin-top:var(--spacing-sm, 8px);padding-top:var(--spacing-sm, 8px);border-top:1px solid var(--color-border, #e2e8f0)}.layer-search-filter{padding:4px 8px;border:1px solid var(--color-border, #e2e8f0);background:var(--color-bg-primary, #ffffff);border-radius:var(--radius-sm, 4px);font-size:var(--font-size-xs, 11px);cursor:pointer;display:flex;align-items:center;gap:4px;transition:all .15s ease}.layer-search-filter:hover{background:var(--color-bg-secondary, #f8fafc);border-color:var(--color-primary, #3b82f6)}.layer-search-filter.active{background:var(--color-primary-light, rgba(59, 130, 246, .1));border-color:var(--color-primary, #3b82f6);color:var(--color-primary, #3b82f6)}.status-bar{position:fixed;bottom:0;left:0;right:0;height:24px;background:var(--color-bg-primary, #ffffff);border-top:1px solid var(--color-border, #e2e8f0);display:flex;align-items:center;justify-content:space-between;padding:0 var(--spacing-md, 12px);font-size:var(--font-size-xs, 11px);color:var(--color-text-secondary, #64748b);z-index:100;box-shadow:0 -1px 4px #0000000d}.status-bar-left,.status-bar-right{display:flex;align-items:center;gap:var(--spacing-md, 12px)}.status-item{display:flex;align-items:center;gap:var(--spacing-xs, 4px)}.status-label{font-weight:var(--font-weight-medium, 500);color:var(--color-text-secondary, #64748b)}.status-value{color:var(--color-text-primary, #1e293b)}.status-save{display:flex;align-items:center;gap:4px;padding:2px 6px;border-radius:var(--radius-sm, 4px);transition:background-color .15s ease}.status-save.saved{color:var(--color-success, #10b981)}.status-save.unsaved{color:var(--color-warning, #f59e0b)}.status-exporting{display:flex;align-items:center;gap:4px;color:var(--color-primary, #3b82f6)}.status-spinner{animation:spin 1s linear infinite}[data-theme=dark] .status-bar{background:var(--color-bg-panel, #1e1e1e);border-top-color:var(--color-border, #3a3a3c)}[data-theme=dark] .status-value{color:var(--color-text-primary, #e5e7eb)}.tooltip{padding:6px 10px;background:var(--color-bg-panel, #1e1e1e);color:var(--color-text-primary, #ffffff);border-radius:var(--radius-sm, 4px);font-size:var(--font-size-xs, 11px);font-weight:var(--font-weight-medium, 500);box-shadow:0 4px 12px #00000026;pointer-events:none;white-space:nowrap;display:flex;align-items:center;gap:var(--spacing-xs, 4px);z-index:10000;animation:tooltipFadeIn .15s ease-out}@keyframes tooltipFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.tooltip-content{color:var(--color-text-primary, #ffffff)}.tooltip-shortcut{margin-left:var(--spacing-xs, 4px);padding:2px 4px;background:#ffffff1a;border-radius:3px;font-family:SF Mono,Monaco,Consolas,monospace}.tooltip-shortcut kbd{font-size:10px;font-weight:var(--font-weight-semibold, 600);color:var(--color-text-primary, #ffffff);background:transparent;border:none;padding:0}[data-theme=light] .tooltip{background:var(--color-bg-panel, #ffffff);color:var(--color-text-primary, #1e293b);box-shadow:0 4px 12px #00000026}[data-theme=light] .tooltip-shortcut{background:var(--color-bg-secondary, #f8fafc)}[data-theme=light] .tooltip-shortcut kbd{color:var(--color-text-primary, #1e293b)}.enhanced-rulers{position:absolute;inset:0;pointer-events:none;z-index:10}.ruler-horizontal-enhanced,.ruler-vertical-enhanced{position:absolute;background:var(--color-bg-secondary, #f8fafc);border:1px solid var(--color-border, #e2e8f0);box-shadow:0 1px 3px #0000001a}.ruler-horizontal-enhanced{top:0;left:0;right:0;height:24px;border-bottom:1px solid var(--color-border, #e2e8f0)}.ruler-vertical-enhanced{top:0;left:0;bottom:0;width:24px;border-right:1px solid var(--color-border, #e2e8f0)}.ruler-unit-label{position:absolute;top:2px;left:2px;font-size:9px;font-weight:600;color:var(--color-text-secondary, #64748b);text-transform:uppercase;letter-spacing:.5px;padding:2px 4px;background:var(--color-bg-primary, #ffffff);border-radius:2px}.ruler-graduation{position:absolute;display:flex;flex-direction:column;align-items:center}.ruler-graduation.major .ruler-tick{width:1px;height:8px;background:var(--color-text-primary, #1e293b)}.ruler-graduation.medium .ruler-tick{width:1px;height:5px;background:var(--color-text-secondary, #64748b)}.ruler-graduation.minor .ruler-tick{width:1px;height:3px;background:var(--color-text-tertiary, #94a3b8)}.ruler-label{font-size:9px;color:var(--color-text-primary, #1e293b);font-weight:500;margin-top:2px;white-space:nowrap}.ruler-cursor-indicator{position:absolute;width:1px;height:100%;background:var(--color-primary, #3b82f6);pointer-events:none;z-index:20;box-shadow:0 0 2px var(--color-primary, #3b82f6)}.ruler-vertical-enhanced .ruler-cursor-indicator{width:100%;height:1px}.ruler-cursor-label{position:absolute;font-size:9px;color:var(--color-primary, #3b82f6);font-weight:600;background:var(--color-bg-primary, #ffffff);padding:2px 4px;border-radius:2px;border:1px solid var(--color-primary, #3b82f6);pointer-events:none;z-index:21;white-space:nowrap;margin-top:2px}.ruler-vertical-enhanced .ruler-cursor-label{margin-top:0;margin-left:2px}@keyframes gridSnapPulse{0%{transform:translate(-50%,-50%) scale(0);opacity:0}50%{transform:translate(-50%,-50%) scale(1.2);opacity:1}to{transform:translate(-50%,-50%) scale(1);opacity:.8}}.grid-snap-indicator{animation:gridSnapPulse .3s ease-out}.layer-item-thumbnail{width:32px;height:32px;border-radius:var(--radius-sm, 4px);background:var(--color-bg-secondary, #f8fafc);border:1px solid var(--color-border, #e2e8f0);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.layer-item-thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.layer-item-badge{display:inline-flex;align-items:center;padding:2px 6px;background:var(--color-bg-secondary, #f8fafc);border:1px solid var(--color-border, #e2e8f0);border-radius:var(--radius-sm, 4px);font-size:10px;font-weight:var(--font-weight-medium, 500);color:var(--color-text-secondary, #64748b);text-transform:uppercase;letter-spacing:.5px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-spinner{display:inline-flex;flex-direction:column;align-items:center;gap:var(--spacing-xs, 4px)}.loading-spinner svg{animation:spin 1s linear infinite}.loading-spinner-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#ffffffe6;z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}[data-theme=dark] .loading-spinner-overlay{background:#1e1e1ee6}.btn-loading{position:relative;pointer-events:none;opacity:.7}.btn-loading:after{content:"";position:absolute;top:50%;left:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border:2px solid transparent;border-top-color:currentColor;border-radius:50%;animation:spin .8s linear infinite}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.5}}.skeleton{background:linear-gradient(90deg,var(--color-bg-secondary, #f1f5f9) 0%,var(--color-bg-tertiary, #e2e8f0) 50%,var(--color-bg-secondary, #f1f5f9) 100%);background-size:200% 100%;animation:skeleton-pulse 1.5s ease-in-out infinite;border-radius:var(--radius-sm, 4px)}.skeleton-text{height:1em;margin-bottom:.5em}.skeleton-avatar{width:40px;height:40px;border-radius:50%}.skeleton-image{width:100%;height:200px;border-radius:var(--radius-md, 8px)}.btn-enhanced-hover{position:relative;overflow:hidden;transition:all .2s ease}.btn-enhanced-hover:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#fff3;transform:translate(-50%,-50%);transition:width .3s ease,height .3s ease}.btn-enhanced-hover:hover:before{width:300px;height:300px}.btn-hover-glow{transition:all .3s ease}.btn-hover-glow:hover{box-shadow:0 0 20px #3b82f666;transform:translateY(-2px)}.btn-hover-scale{transition:transform .2s ease}.btn-hover-scale:hover{transform:scale(1.05)}.btn-hover-scale:active{transform:scale(.95)}.interactive-hover{transition:all .2s ease;cursor:pointer}.interactive-hover:hover{background-color:var(--color-bg-secondary, #f1f5f9);transform:translate(4px)}.interactive-hover:active{transform:translate(2px)}.layer-item-enhanced-hover{transition:all .15s ease;position:relative}.layer-item-enhanced-hover:after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--color-primary, #3b82f6);transform:scaleY(0);transition:transform .15s ease}.layer-item-enhanced-hover:hover:after{transform:scaleY(1)}.layer-item-enhanced-hover:hover{background-color:var(--color-bg-secondary, #f1f5f9);padding-left:calc(var(--spacing-md, 12px) + 3px)}.progress-bar{width:100%;height:4px;background:var(--color-bg-secondary, #f1f5f9);border-radius:2px;overflow:hidden}.progress-bar-fill{height:100%;background:var(--color-primary, #3b82f6);border-radius:2px;transition:width .3s ease;position:relative}.progress-bar-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:progress-shimmer 1.5s infinite}@keyframes progress-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.pulse{animation:pulse 2s ease-in-out infinite}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .3s ease-out}.loader-container{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#1e293b,#0f172a);color:#fff;z-index:var(--z-loader)}.loader-spinner{width:48px;height:48px;border:3px solid rgba(255,255,255,.1);border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite}.loader-title{margin-top:var(--spacing-6);font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold)}.loader-message{margin-top:var(--spacing-2);color:#fff9;font-size:var(--font-size-sm)}.loader-error{margin-top:var(--spacing-4);color:#ef4444;font-size:var(--font-size-xs)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--spacing-2) var(--spacing-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--card);color:var(--text);cursor:pointer;transition:all var(--transition-fast);min-height:36px}.btn:hover{background:var(--bg-secondary);border-color:var(--border-hover)}.btn:focus{outline:2px solid var(--border-focus);outline-offset:2px}.btn-primary{background:var(--primary);color:var(--text-inverse);border-color:var(--primary)}.btn-primary:hover{background:var(--primary-2);border-color:var(--primary-2)}.btn-secondary{background:var(--bg-secondary);color:var(--text);border-color:var(--border)}.btn-ghost{background:transparent;border-color:transparent}.btn-ghost:hover{background:var(--bg-secondary)}.input{width:100%;padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--card);color:var(--text);transition:all var(--transition-fast);min-height:36px}.input:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 3px var(--primary-light)}.input::-moz-placeholder{color:var(--text-3)}.input::placeholder{color:var(--text-3)}.select{width:100%;padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--card);color:var(--text);transition:all var(--transition-fast);min-height:36px;cursor:pointer}.select:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 3px var(--primary-light)}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--spacing-4);box-shadow:var(--shadow-sm);transition:all var(--transition-fast)}.card:hover{box-shadow:var(--shadow-md)}.scrollbar{scrollbar-width:thin;scrollbar-color:var(--border) transparent}.scrollbar::-webkit-scrollbar{width:8px;height:8px}.scrollbar::-webkit-scrollbar-track{background:transparent}.scrollbar::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}.scrollbar::-webkit-scrollbar-thumb:hover{background:var(--border-hover)}:root{--color-bg-app: #1e1e1e;--color-bg-panel: #252526;--color-bg-canvas: #333333;--color-bg-canvas-sheet: #ffffff;--color-accent: #3b82f6;--color-accent-hover: #2563eb;--color-accent-light: rgba(59, 130, 246, .1);--color-accent-border: rgba(59, 130, 246, .3);--color-text-primary: #e5e7eb;--color-text-secondary: #9ca3af;--color-text-tertiary: #6b7280;--color-border: #3f3f46;--color-border-hover: #52525b;--color-separator: #3f3f46;--shadow-color: rgba(0, 0, 0, .3);--color-danger: #ef4444;--color-success: #10b981;--color-warning: #f59e0b}:root[data-theme=light],.light-theme{--color-bg-app: #f3f4f6;--color-bg-panel: #ffffff;--color-bg-canvas: #e5e7eb;--color-bg-canvas-sheet: #ffffff;--color-accent: #2563eb;--color-accent-hover: #1d4ed8;--color-accent-light: rgba(37, 99, 235, .1);--color-accent-border: rgba(37, 99, 235, .3);--color-text-primary: #0f172a;--color-text-secondary: #475569;--color-text-tertiary: #64748b;--color-border: #e5e7eb;--color-border-hover: #d1d5db;--color-separator: #e5e7eb;--shadow-color: rgba(0, 0, 0, .1);--color-danger: #dc2626;--color-success: #059669;--color-warning: #d97706;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, sans-serif;--font-size-xs: 11px;--font-size-sm: 12px;--font-size-base: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 24px;--spacing-2xl: 32px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-pill: 9999px;--shadow-elevation-low: 0 2px 4px var(--shadow-color);--shadow-elevation-medium: 0 4px 8px var(--shadow-color);--shadow-elevation-high: 0 8px 16px var(--shadow-color);--transition-instant: 0ms;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--topbar-height: 50px;--bottombar-height: 80px;--slim-sidebar-width: 60px;--drawer-panel-width: 300px;--right-sidebar-width: 280px}html,body{height:100%;width:100%;overflow:hidden}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text-primary);background-color:var(--color-bg-app);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}.snapbooth-pro-app{display:grid;grid-template-rows:var(--topbar-height) 1fr var(--bottombar-height);grid-template-columns:100vw;height:100vh;width:100vw;overflow:hidden;background-color:var(--color-bg-app)}.snapbooth-topbar{grid-row:1;display:grid;grid-template-columns:auto 1fr auto;align-items:center;height:var(--topbar-height);background-color:var(--color-bg-panel);border-bottom:1px solid var(--color-border);padding:0 var(--spacing-lg);gap:var(--spacing-lg);z-index:100}.topbar-left{display:flex;align-items:center;gap:var(--spacing-md)}.topbar-logo{display:flex;align-items:center;gap:var(--spacing-sm)}.logo-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--color-accent) 0%,#8b5cf6 100%);border-radius:var(--radius-md);color:#fff;font-weight:var(--font-weight-bold);font-size:var(--font-size-sm)}.logo-text{display:flex;flex-direction:column;gap:2px}.logo-title{font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);line-height:1.2}.logo-badge{font-size:var(--font-size-xs);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px}.topbar-center{display:flex;align-items:center;justify-content:center;gap:var(--spacing-md);flex:1}.topbar-tool-group{display:flex;align-items:center;gap:var(--spacing-sm)}.tool-separator{width:1px;height:24px;background-color:var(--color-separator);margin:0 var(--spacing-xs)}.topbar-right{display:flex;align-items:center;gap:var(--spacing-md)}.btn-primary-cta{display:inline-flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);background:linear-gradient(135deg,var(--color-accent) 0%,#6366f1 100%);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;box-shadow:var(--shadow-elevation-medium);transition:all var(--transition-fast)}.btn-primary-cta:hover{transform:translateY(-1px);box-shadow:var(--shadow-elevation-high);background:linear-gradient(135deg,var(--color-accent-hover) 0%,#4f46e5 100%)}.btn-ghost{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);position:relative}.btn-ghost svg{width:18px;height:18px;display:block;stroke-width:2.5;flex-shrink:0}.btn-ghost:hover{background-color:#ffffff1a;color:var(--color-text-primary)}.btn-ghost.active{background-color:var(--color-accent-light);color:var(--color-accent);font-weight:600}[data-theme=light] .btn-ghost{color:var(--color-text-secondary)}[data-theme=light] .btn-ghost:hover{background-color:#0000000d;color:var(--color-text-primary)}.input-numeric-ghost{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:var(--font-size-sm);font-family:var(--font-family);font-weight:500;min-width:60px;transition:all var(--transition-fast)}.input-numeric-ghost:hover{outline:none;background-color:#ffffff14;border-color:var(--color-border)}.input-numeric-ghost:focus{outline:none;background-color:#ffffff1a;border:1.5px solid var(--color-accent-border);box-shadow:0 0 0 2px var(--color-accent-light)}[data-theme=light] .input-numeric-ghost:hover{background-color:#0000000a}[data-theme=light] .input-numeric-ghost:focus{background-color:#0000000f}.input-numeric-ghost input{background:transparent;border:none;color:var(--color-text-primary);font-size:var(--font-size-sm);width:40px;text-align:center;padding:0}.input-numeric-ghost input:focus{outline:none}.snapbooth-main-body{grid-row:2;display:grid;grid-template-columns:var(--slim-sidebar-width) var(--drawer-panel-width) 1fr var( --right-sidebar-width );height:100%;overflow:hidden}.snapbooth-main-body.drawer-closed{grid-template-columns:var(--slim-sidebar-width) 0 1fr var(--right-sidebar-width)}@media(max-width:1024px){.snapbooth-main-body{grid-template-columns:var(--slim-sidebar-width) var(--drawer-panel-width) 1fr 0}.snapbooth-main-body.drawer-closed{grid-template-columns:var(--slim-sidebar-width) 0 1fr 0}}@media(max-width:768px){.snapbooth-main-body{grid-template-columns:0 var(--drawer-panel-width) 1fr 0}.snapbooth-main-body.drawer-closed{grid-template-columns:0 0 1fr 0}.snapbooth-slim-sidebar{position:fixed;left:0;top:var(--topbar-height);bottom:var(--bottombar-height);z-index:1000;transform:translate(-100%);transition:transform .3s ease}.snapbooth-slim-sidebar.open{transform:translate(0)}}.snapbooth-slim-sidebar{grid-column:1;display:flex;flex-direction:column;align-items:center;width:var(--slim-sidebar-width);background-color:var(--color-bg-panel);border-right:1px solid var(--color-border);padding:var(--spacing-md) 0;gap:var(--spacing-xs)}.slim-sidebar-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);position:relative}.sidebar-icon-wrapper{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.slim-sidebar-icon svg{width:20px;height:20px;display:block;stroke-width:2.5;flex-shrink:0}.slim-sidebar-icon:hover{background-color:#ffffff14;color:var(--color-text-primary)}.slim-sidebar-icon.active{background-color:var(--color-accent-light);color:var(--color-accent)}.slim-sidebar-icon.active:before{content:"";position:absolute;left:-16px;top:50%;transform:translateY(-50%);width:3px;height:24px;background-color:var(--color-accent);border-radius:0 2px 2px 0}.snapbooth-drawer{grid-column:2;width:var(--drawer-panel-width);background-color:var(--color-bg-panel);border-right:1px solid var(--color-border);display:flex;flex-direction:column;overflow:hidden;transition:width var(--transition-normal)}.snapbooth-drawer.closed{width:0;overflow:hidden;border:none}.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.drawer-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.drawer-close-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.drawer-close-btn:hover{background-color:#ffffff0d;color:var(--color-text-primary)}.drawer-content{flex:1;overflow-y:auto;padding:var(--spacing-lg)}.drawer-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--spacing-md)}.drawer-item{display:flex;flex-direction:column;gap:var(--spacing-sm);cursor:pointer;transition:all var(--transition-fast)}.drawer-item-preview{aspect-ratio:1;background-color:var(--color-bg-canvas);border-radius:var(--radius-md);border:1px solid var(--color-border);display:flex;align-items:center;justify-content:center;overflow:hidden}.drawer-item:hover .drawer-item-preview{border-color:var(--color-accent-border);box-shadow:var(--shadow-elevation-low)}.drawer-item-title{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-align:center;font-weight:500;margin-top:var(--spacing-xs);line-height:1.4}[data-theme=dark] .drawer-item-title{color:#d1d5db}[data-theme=light] .drawer-item-title{color:#475569}.snapbooth-canvas-area{grid-column:3;position:relative;background-color:var(--color-bg-canvas);overflow:hidden;display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;min-height:0}@media(max-width:768px){.snapbooth-canvas-area{grid-column:1 / -1;overflow:auto;-webkit-overflow-scrolling:touch}}.canvas-navigation-bar{position:absolute;inset:auto auto 16px 50%;transform:translate(-50%);z-index:100;display:flex;align-items:center;gap:var(--spacing-sm);background:#252526f2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-xs) var(--spacing-sm);box-shadow:var(--shadow-elevation-high)}[data-theme=light] .canvas-navigation-bar{background:#fffffff2}.nav-group{display:flex;align-items:center;gap:var(--spacing-xs)}.nav-separator{width:1px;height:24px;background:var(--color-border);margin:0 var(--spacing-xs)}.nav-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);padding:0}.nav-btn:hover{background:#ffffff1a;color:var(--color-text-primary)}[data-theme=light] .nav-btn:hover{background:#0000000d}.nav-btn:active{transform:scale(.95)}.zoom-display{min-width:60px;text-align:center;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);padding:0 var(--spacing-xs)}.nav-info{display:flex;align-items:center;padding:0 var(--spacing-sm)}.nav-info-text{font-size:var(--font-size-xs);color:var(--color-text-tertiary);white-space:nowrap}@media(max-width:768px){.canvas-navigation-bar{top:var(--spacing-sm);right:var(--spacing-sm);padding:var(--spacing-xs);gap:var(--spacing-xs)}.nav-btn{width:36px;height:36px}.zoom-display{min-width:50px;font-size:var(--font-size-xs)}.nav-info{display:none}}@media(max-width:480px){.canvas-navigation-bar{flex-wrap:wrap;max-width:calc(100% - var(--spacing-md))}.nav-separator{display:none}}.canvas-rulers{position:absolute;inset:0;pointer-events:none;z-index:10}.ruler-horizontal{position:absolute;top:0;left:0;right:0;height:24px;background-color:var(--color-bg-panel);border-bottom:1px solid var(--color-border)}.ruler-vertical{position:absolute;top:0;left:0;bottom:0;width:24px;background-color:var(--color-bg-panel);border-right:1px solid var(--color-border)}.ruler-graduation{position:absolute;font-size:10px;color:var(--color-text-tertiary);font-weight:var(--font-weight-medium)}.canvas-sheet{position:relative;background-color:var(--color-bg-canvas-sheet);box-shadow:var(--shadow-elevation-low);border-radius:var(--radius-sm)}.safe-zone{position:absolute;border:1px dashed #ef4444;pointer-events:none;z-index:5}.floating-action-pill{position:absolute;display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background-color:#000000d9;border:1px solid var(--color-border);border-radius:var(--radius-pill);box-shadow:var(--shadow-elevation-high);z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.floating-action-item{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:transparent;border:none;border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast)}.floating-action-item:hover{background-color:#ffffff1a}.floating-action-divider{width:1px;height:24px;background-color:#fff3;margin:0 var(--spacing-xs)}.snapbooth-right-sidebar{grid-column:4;width:var(--right-sidebar-width);background-color:var(--color-bg-panel);border-left:1px solid var(--color-border);display:flex;flex-direction:column;overflow:hidden}.sidebar-tabs{display:flex;border-bottom:1px solid var(--color-border);padding:0 var(--spacing-md)}.sidebar-tab{position:relative;padding:var(--spacing-md) var(--spacing-lg);background:transparent;border:none;color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast)}.sidebar-tab:hover{color:var(--color-text-primary)}.sidebar-tab.active{color:var(--color-accent)}.sidebar-tab.active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background-color:var(--color-accent)}.sidebar-tab-content{flex:1;overflow-y:auto;padding:var(--spacing-lg)}.layers-tree{display:flex;flex-direction:column;gap:var(--spacing-xs)}.layer-folder{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.layer-folder:hover{background-color:#ffffff0d}.layer-folder.locked{opacity:.5;cursor:not-allowed}.layer-item{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);padding-left:calc(var(--spacing-md) + 20px);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);border:1px solid transparent}.layer-item:hover{background-color:#ffffff0d;border-color:var(--color-border-hover, #52525b)}.layer-item.selected{background-color:var(--color-accent-light, rgba(59, 130, 246, .1));border-color:var(--color-accent-border, rgba(59, 130, 246, .3))}.layer-item.hovered{background-color:#ffffff14}.layer-icon{width:16px;height:16px;color:var(--color-text-secondary)}.layer-name{flex:1;font-size:var(--font-size-sm);color:var(--color-text-primary)}.layer-visibility{width:20px;height:20px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--color-text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:all var(--transition-fast)}.layer-visibility:hover{background-color:#ffffff1a;color:var(--color-text-primary)}.color-palette{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--spacing-sm);margin-top:var(--spacing-lg)}.color-swatch{aspect-ratio:1;border-radius:var(--radius-sm);border:1px solid var(--color-border);cursor:pointer;transition:all var(--transition-fast)}.color-swatch:hover{transform:scale(1.1);box-shadow:var(--shadow-elevation-medium);border-color:var(--color-accent)}.snapbooth-bottombar{grid-row:3;display:flex;align-items:center;justify-content:space-between;height:var(--bottombar-height);background-color:var(--color-bg-panel);border-top:1px solid var(--color-border);padding:0 var(--spacing-xl);gap:var(--spacing-xl)}.workflow-filmstrip{display:flex;align-items:center;gap:var(--spacing-md)}.workflow-step{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-md);min-width:120px;background-color:var(--color-bg-canvas);border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.workflow-step:hover{border-color:var(--color-border-hover)}.workflow-step.active{background-color:#3b82f61a;border-color:var(--color-accent);border-width:3px}.workflow-step-number{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-primary)}.workflow-step-label{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.workflow-step.active .workflow-step-label{color:var(--color-accent)}.view-controls{display:flex;align-items:center;gap:var(--spacing-lg)}.zoom-controls{display:flex;align-items:center;gap:var(--spacing-xs);background-color:var(--color-bg-canvas);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-xs)}.zoom-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.zoom-btn:hover{background-color:#ffffff0d;color:var(--color-text-primary)}.zoom-level{min-width:50px;text-align:center;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary);padding:0 var(--spacing-sm)}.toggle-safe-zone{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-bg-canvas);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.toggle-safe-zone:hover{border-color:var(--color-border-hover)}.toggle-safe-zone.active{background-color:var(--color-accent-light);border-color:var(--color-accent)}.toggle-safe-zone-label{font-size:var(--font-size-sm);color:var(--color-text-primary)}::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background-color:var(--color-border-hover)}.hidden{display:none!important}.text-center{text-align:center}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}*{margin:0;padding:0;box-sizing:border-box}*:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-sm)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}[role=button]:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}button:focus-visible,a:focus-visible,[role=button]:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px;box-shadow:0 0 0 1px var(--color-bg-primary)}:root{--color-bg-primary: #ffffff;--color-bg-secondary: #f8fafc;--color-bg-tertiary: #f1f5f9;--color-text-primary: #1e293b;--color-text-secondary: #64748b;--color-border: #e2e8f0;--color-primary: #3b82f6;--color-primary-hover: #2563eb;--color-danger: #ef4444;--color-success: #10b981;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--sidebar-width: 280px}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--color-bg-secondary);color:var(--color-text-primary);line-height:1.5;overflow:hidden;transition:background-color .2s ease,color .2s ease}.app-container{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden}.app-main{display:flex;flex:1;overflow:hidden}.app-header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;height:56px;background:var(--color-bg-primary);border-bottom:1px solid var(--color-border);box-shadow:var(--shadow-sm);z-index:100}.header-left,.header-right{display:flex;align-items:center;gap:16px}.app-logo{display:flex;align-items:center;gap:12px}.logo-icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-radius:var(--radius-md);color:#fff}.logo-text{display:flex;flex-direction:column}.app-title{font-size:18px;font-weight:700;color:var(--color-text-primary);line-height:1.2}.app-subtitle{font-size:11px;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px}.header-divider{width:1px;height:24px;background:var(--color-border);margin:0 8px}.header-toolbar{display:flex;align-items:center;gap:4px}.toolbar-separator{width:1px;height:20px;background:var(--color-border);margin:0 8px}.header-actions{display:flex;gap:8px}.sidebar{width:var(--sidebar-width);background:var(--color-bg-primary);border-right:1px solid var(--color-border);display:flex;flex-direction:column;overflow-y:auto;transition:width .2s ease,transform .2s ease;position:relative}.sidebar-right{border-right:none;border-left:1px solid var(--color-border)}.sidebar.collapsed{width:0;overflow:hidden}.sidebar-toggle{position:absolute;top:16px;right:-12px;width:24px;height:24px;background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;box-shadow:var(--shadow-sm)}.sidebar-right .sidebar-toggle{right:auto;left:-12px}.sidebar-content{padding:16px;flex:1;overflow-y:auto}.sidebar-section{margin-bottom:24px}.section-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--color-text-secondary);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--color-border)}.tool-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.tool-list,.action-list{display:flex;flex-direction:column;gap:4px}.tool-btn{display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--color-bg-secondary);border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;font-size:13px;color:var(--color-text-primary);transition:all .15s ease}.tool-btn:hover{background:var(--color-bg-tertiary);border-color:var(--color-border)}.tool-btn.active{background:#3b82f61a;border-color:var(--color-primary);color:var(--color-primary)}.tool-shortcut{margin-left:auto;font-size:10px;padding:2px 6px;background:var(--color-bg-tertiary);border-radius:4px;color:var(--color-text-secondary)}.canvas-wrapper{flex:1;display:flex;align-items:center;justify-content:center;background:var(--color-bg-tertiary);overflow:hidden;position:relative}.canvas-area{background:repeating-conic-gradient(#e5e7eb 0% 25%,#f1f5f9 0% 50%) 50% / 20px 20px}.btn{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:var(--radius-md);font-size:14px;font-weight:500;cursor:pointer;border:none;transition:all .15s ease}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-hover)}.btn-secondary{background:var(--color-bg-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.btn-secondary:hover{background:var(--color-bg-tertiary)}.btn-secondary.active{background:#3b82f61a;border-color:var(--color-primary);color:var(--color-primary)}.btn-danger{background:var(--color-danger);color:#fff}.btn-sm{padding:6px 12px;font-size:13px}.btn-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:transparent;border:none;border-radius:var(--radius-md);cursor:pointer;color:var(--color-text-secondary);transition:all .15s ease}.btn-icon:hover{background:var(--color-bg-secondary);color:var(--color-text-primary)}.btn-icon.active{background:#3b82f61a;color:var(--color-primary)}.btn-icon.disabled{opacity:.5;cursor:not-allowed}.control-group{margin-bottom:16px}.control-group label{display:block;font-size:12px;font-weight:500;color:var(--color-text-secondary);margin-bottom:6px}.input{width:100%;padding:8px 12px;border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:14px;color:var(--color-text-primary);background:var(--color-bg-primary);transition:border-color .15s ease}.input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61a}.input-with-unit{display:flex;align-items:center}.input-with-unit .input{border-top-right-radius:0;border-bottom-right-radius:0}.input-unit{padding:8px 12px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-left:none;border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md);font-size:12px;color:var(--color-text-secondary)}.textarea{min-height:80px;resize:vertical}.color-controls{display:flex;gap:8px}.color-picker{width:40px;height:36px;padding:2px;border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer}.properties-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.properties-content{display:flex;flex-direction:column}.button-group{display:flex;gap:4px}.btn-toggle{flex:1;padding:8px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;font-size:14px;color:var(--color-text-secondary);transition:all .15s ease}.btn-toggle:hover{background:var(--color-bg-tertiary)}.btn-toggle.active{background:#3b82f61a;border-color:var(--color-primary);color:var(--color-primary)}.object-actions{display:flex;flex-wrap:wrap;gap:8px}.object-actions .btn{flex:1;min-width:calc(50% - 4px)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#cbd5e1}.loader-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;width:100vw;background:var(--color-bg-secondary)}.loader-spinner{width:48px;height:48px;border:4px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.loader-title{margin-top:24px;font-size:24px;font-weight:700;color:var(--color-text-primary)}.loader-message{margin-top:8px;font-size:14px;color:var(--color-text-secondary)}.loader-error{margin-top:16px;padding:12px 16px;background:#ef44441a;border:1px solid var(--color-danger);border-radius:var(--radius-md);color:var(--color-danger);font-size:14px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}:root{--font-sans: "Plus Jakarta Sans", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace;--accent-50: #f5f0ff;--accent-100: #eadfff;--accent-200: #d6bfff;--accent-300: #b591ff;--accent-400: #9763ff;--accent-500: #7c3aed;--accent-600: #6d28d9;--accent-700: #5b21b6;--accent-800: #4c1d95;--bg-app: #f5f3f8;--bg-panel: #ffffff;--bg-panel-elev: #ffffff;--bg-canvas: #ece9f1;--bg-sheet: #ffffff;--bg-hover: #f4f1fb;--bg-active: #efe9fb;--bg-chip: #f3f0fa;--text-primary: #1a1530;--text-secondary: #5c5775;--text-tertiary: #8a86a0;--text-on-accent: #ffffff;--border-subtle: #e8e4f0;--border-default: #ddd7e8;--border-strong: #c9c2d9;--border-focus: var(--accent-500);--success: #10b981;--success-bg: #e7f7f0;--warning: #f59e0b;--warning-bg: #fdf2d8;--danger: #ef4444;--danger-bg: #feeaea;--shadow-xs: 0 1px 2px rgba(26, 21, 48, .04);--shadow-sm: 0 2px 4px rgba(26, 21, 48, .06), 0 1px 2px rgba(26, 21, 48, .04);--shadow-md: 0 4px 12px rgba(26, 21, 48, .08), 0 2px 4px rgba(26, 21, 48, .04);--shadow-lg: 0 12px 28px rgba(26, 21, 48, .12), 0 4px 8px rgba(26, 21, 48, .06);--shadow-pop: 0 24px 60px rgba(67, 28, 154, .18), 0 4px 12px rgba(26, 21, 48, .08);--shadow-accent: 0 6px 20px rgba(124, 58, 237, .28);--r-xs: 4px;--r-sm: 6px;--r-md: 10px;--r-lg: 14px;--r-xl: 20px;--r-pill: 999px;--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-5: 20px;--s-6: 24px;--s-8: 32px;--density-scale: 1}:root[data-theme=dark]{--bg-app: #0f0b19;--bg-panel: #181229;--bg-panel-elev: #1f1934;--bg-canvas: #0a0712;--bg-sheet: #ffffff;--bg-hover: #251d3d;--bg-active: #2e2548;--bg-chip: #211b36;--text-primary: #f2eefb;--text-secondary: #a8a2c2;--text-tertiary: #6e6889;--text-on-accent: #ffffff;--border-subtle: #251e3b;--border-default: #2e2548;--border-strong: #3c3160;--border-focus: var(--accent-400);--accent-500: #9763ff;--accent-600: #7c3aed;--success-bg: rgba(16, 185, 129, .15);--warning-bg: rgba(245, 158, 11, .15);--danger-bg: rgba(239, 68, 68, .15);--shadow-xs: 0 1px 2px rgba(0, 0, 0, .4);--shadow-sm: 0 2px 4px rgba(0, 0, 0, .4);--shadow-md: 0 6px 16px rgba(0, 0, 0, .5);--shadow-lg: 0 16px 36px rgba(0, 0, 0, .6);--shadow-pop: 0 24px 60px rgba(0, 0, 0, .7);--shadow-accent: 0 6px 24px rgba(151, 99, 255, .4)}html,body{font-family:var(--font-sans);background:var(--bg-app);color:var(--text-primary);font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-moz-selection{background:var(--accent-200);color:var(--text-primary)}::selection{background:var(--accent-200);color:var(--text-primary)}.auth-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--s-6);background:radial-gradient(circle at 15% 20%,rgba(124,58,237,.1),transparent 45%),radial-gradient(circle at 85% 80%,rgba(151,99,255,.08),transparent 45%),var(--bg-app);position:relative;overflow:hidden}.auth-shell:before,.auth-shell:after{content:"";position:absolute;width:480px;height:480px;border-radius:50%;filter:blur(120px);opacity:.45;pointer-events:none;z-index:0}.auth-shell:before{top:-100px;left:-120px;background:radial-gradient(circle,var(--accent-300),transparent 65%)}.auth-shell:after{bottom:-120px;right:-100px;background:radial-gradient(circle,#ffc4d6,transparent 65%)}.auth-card{position:relative;z-index:1;width:100%;max-width:420px;background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--r-xl);box-shadow:var(--shadow-pop);padding:var(--s-8);display:flex;flex-direction:column;gap:var(--s-6)}.auth-brand{display:flex;flex-direction:column;align-items:center;gap:var(--s-3);text-align:center}.auth-brand-mark{width:56px;height:56px;border-radius:var(--r-md);display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#9763ff,#7c3aed 60%,#5b21b6);box-shadow:0 6px 20px #7c3aed59;font-weight:800;font-size:22px;letter-spacing:-.02em}.auth-title{font-size:24px;font-weight:700;letter-spacing:-.02em;color:var(--text-primary);line-height:1.25}.auth-subtitle{font-size:13px;color:var(--text-secondary);font-weight:500}.auth-form{display:flex;flex-direction:column;gap:var(--s-4)}.auth-field{display:flex;flex-direction:column;gap:6px}.auth-field-label{font-size:11px;font-weight:700;color:var(--text-secondary);letter-spacing:.06em;text-transform:uppercase}.auth-input-group{position:relative;display:flex;align-items:center;background:var(--bg-chip);border:1px solid transparent;border-radius:var(--r-md);transition:all .15s ease}.auth-input-group:focus-within{background:var(--bg-panel);border-color:var(--accent-500);box-shadow:0 0 0 4px var(--accent-100)}:root[data-theme=dark] .auth-input-group:focus-within{box-shadow:0 0 0 4px #9763ff2e}.auth-input-icon{display:grid;place-items:center;width:40px;height:44px;color:var(--text-tertiary);flex-shrink:0}.auth-input-icon svg{width:18px;height:18px}.auth-input-group input{flex:1;height:44px;border:none;background:transparent;padding:0 12px 0 0;font-size:14px;color:var(--text-primary);outline:none}.auth-input-group input::-moz-placeholder{color:var(--text-tertiary)}.auth-input-group input::placeholder{color:var(--text-tertiary)}.auth-btn-primary{height:46px;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--accent-500);color:var(--text-on-accent);font-size:14px;font-weight:600;border:none;border-radius:var(--r-md);cursor:pointer;box-shadow:var(--shadow-accent);transition:transform .15s ease,background .15s ease,box-shadow .15s ease}.auth-btn-primary:hover:not(:disabled){background:var(--accent-600);transform:translateY(-1px);box-shadow:0 10px 28px #7c3aed59}.auth-btn-primary:active{transform:translateY(0)}.auth-btn-primary:disabled{opacity:.6;cursor:not-allowed}.auth-divider{display:flex;align-items:center;gap:var(--s-3);color:var(--text-tertiary);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:var(--border-subtle)}.auth-btn-secondary{height:46px;display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--bg-panel);color:var(--text-primary);font-size:14px;font-weight:600;border:1px solid var(--border-default);border-radius:var(--r-md);cursor:pointer;transition:all .15s ease}.auth-btn-secondary:hover:not(:disabled){background:var(--bg-hover);border-color:var(--border-strong)}.auth-footer{text-align:center;font-size:13px;color:var(--text-secondary)}.auth-footer a,.auth-footer button{color:var(--accent-600);font-weight:600;background:none;border:none;cursor:pointer;padding:0;font-size:inherit}.auth-footer a:hover,.auth-footer button:hover{color:var(--accent-700);text-decoration:underline}.auth-error{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-3);background:var(--danger-bg);border:1px solid rgba(239,68,68,.2);border-radius:var(--r-md);color:var(--danger);font-size:13px;font-weight:500}.sb-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 14px;height:36px;font-size:13px;font-weight:600;border-radius:var(--r-md);transition:all .15s ease;white-space:nowrap;color:var(--text-primary);border:1px solid transparent;background:transparent;cursor:pointer;font-family:inherit}.sb-btn:hover{background:var(--bg-hover)}.sb-btn:focus-visible{outline:2px solid var(--accent-500);outline-offset:1px}.sb-btn svg{width:16px;height:16px;flex-shrink:0}.sb-btn-primary{background:var(--accent-500);color:var(--text-on-accent);box-shadow:var(--shadow-accent)}.sb-btn-primary:hover{background:var(--accent-600)}.sb-btn-secondary{background:var(--bg-panel);border-color:var(--border-default)}.sb-btn-secondary:hover{background:var(--bg-hover);border-color:var(--border-strong)}.sb-btn-ghost{background:transparent}.sb-btn-ghost:hover{background:var(--bg-hover)}.sb-btn-sm{height:28px;padding:0 10px;font-size:12px}.sb-btn-lg{height:44px;padding:0 20px;font-size:14px}.sb-mode-switch{height:44px;background:var(--bg-panel);border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;padding:0 var(--s-4);gap:var(--s-3);position:relative;z-index:50;font-family:var(--font-sans);flex-shrink:0}.sb-mode-brand{display:flex;align-items:center;gap:10px;margin-right:var(--s-4);padding-right:var(--s-4);border-right:1px solid var(--border-subtle);height:100%}.sb-mode-logo-mark{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:13px;background:linear-gradient(135deg,#9763ff,#7c3aed 60%,#5b21b6);box-shadow:0 2px 8px #7c3aed66}.sb-mode-logo-text{display:inline-flex;align-items:baseline;gap:5px}.sb-mode-logo-name{font-weight:700;font-size:14px;letter-spacing:-.01em;color:var(--text-primary)}.sb-mode-logo-sub{font-size:11px;color:var(--accent-600);font-weight:600;letter-spacing:.04em;text-transform:lowercase}.sb-mode-tabs{display:flex;gap:2px}.sb-mode-tab{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--r-sm);font-size:13px;font-weight:500;color:var(--text-secondary);background:transparent;border:none;cursor:pointer;font-family:inherit;transition:all .15s ease}.sb-mode-tab:hover{background:var(--bg-hover);color:var(--text-primary)}.sb-mode-tab.is-active{background:var(--bg-active);color:var(--accent-600);font-weight:600}.sb-mode-meta{margin-left:auto;font-size:11px;color:var(--text-tertiary);font-weight:500}.sb-mode-user-btn{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:var(--r-sm, 8px);border:1px solid var(--border, rgba(255, 255, 255, .12));background:var(--bg-chip, rgba(255, 255, 255, .04));color:var(--text-secondary, #c9c9d4);font-size:12px;font-weight:600;cursor:pointer;transition:background .15s ease,color .15s ease;max-width:220px}.sb-mode-user-btn:hover{background:var(--bg-hover, rgba(255, 255, 255, .08));color:var(--text-primary, #fff)}.sb-mode-user-email{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sb-mode-user-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:50;min-width:200px;padding:6px;border-radius:var(--r-md, 12px);border:1px solid var(--border, rgba(255, 255, 255, .12));background:var(--bg-elevated, #1c1b2a);box-shadow:0 12px 32px #0006}.sb-mode-user-menu-email{padding:8px 10px;font-size:11px;color:var(--text-tertiary, #8a8a99);border-bottom:1px solid var(--border, rgba(255, 255, 255, .08));margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sb-mode-user-menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:none;border-radius:var(--r-sm, 8px);background:transparent;color:var(--danger, #f0506e);font-size:13px;font-weight:600;cursor:pointer;text-align:left;transition:background .15s ease}.sb-mode-user-menu-item:hover{background:var(--bg-hover, rgba(240, 80, 110, .12))}.sb-floating-toolbar{position:absolute;z-index:60;display:inline-flex;align-items:center;gap:2px;padding:4px;background:var(--bg-panel-elev);border:1px solid var(--border-subtle);border-radius:var(--r-md);box-shadow:var(--shadow-lg);font-family:var(--font-sans);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.sb-floating-toolbar select,.sb-floating-toolbar input{height:28px;padding:0 8px;background:transparent;border:1px solid transparent;border-radius:var(--r-sm);font-size:12px;color:var(--text-primary);font-family:inherit;font-weight:500;cursor:pointer}.sb-floating-toolbar select:hover,.sb-floating-toolbar input:hover{background:var(--bg-hover)}.sb-floating-toolbar select:focus,.sb-floating-toolbar input:focus{outline:none;border-color:var(--accent-500)}.sb-floating-toolbar .sb-fl-divider{width:1px;height:18px;background:var(--border-subtle);margin:0 4px}.sb-floating-toolbar .sb-fl-btn{width:28px;height:28px;display:grid;place-items:center;border:none;background:transparent;border-radius:var(--r-sm);color:var(--text-secondary);cursor:pointer;transition:all .12s ease;font-family:inherit}.sb-floating-toolbar .sb-fl-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.sb-floating-toolbar .sb-fl-btn.is-active{background:var(--bg-active);color:var(--accent-600)}.sb-floating-toolbar .sb-fl-swatch{width:18px;height:18px;border-radius:var(--r-xs);border:1px solid var(--border-default);cursor:pointer}.sb-floating-toolbar .sb-fl-stepper{display:inline-flex;align-items:center;background:var(--bg-chip);border-radius:var(--r-sm);overflow:hidden}.sb-floating-toolbar .sb-fl-stepper button{width:24px;height:28px;background:transparent;border:none;color:var(--text-secondary);cursor:pointer;display:grid;place-items:center}.sb-floating-toolbar .sb-fl-stepper button:hover{color:var(--accent-600)}.sb-floating-toolbar .sb-fl-stepper .sb-fl-stepper-val{min-width:34px;text-align:center;font-size:12px;font-weight:600;color:var(--text-primary);font-variant-numeric:tabular-nums;border-left:1px solid var(--border-subtle);border-right:1px solid var(--border-subtle);padding:0 4px;height:28px;display:grid;place-items:center}.sb-drawer-search{padding:12px 16px 0}.sb-drawer-search-input{display:flex;align-items:center;gap:8px;height:34px;background:var(--bg-chip);border:1px solid transparent;border-radius:var(--r-sm);padding:0 10px;transition:all .15s ease}.sb-drawer-search-input:focus-within{background:var(--bg-panel);border-color:var(--accent-500);box-shadow:0 0 0 3px var(--accent-100)}.sb-drawer-search-input input{flex:1;background:transparent;border:none;outline:none;font-size:13px;color:var(--text-primary);font-family:inherit}.sb-drawer-search-input input::-moz-placeholder{color:var(--text-tertiary)}.sb-drawer-search-input input::placeholder{color:var(--text-tertiary)}.sb-drawer-search-input svg{color:var(--text-tertiary);flex-shrink:0}.sb-drawer-filters{display:flex;gap:4px;padding:10px 16px 8px;overflow-x:auto}.sb-drawer-filter-pill{display:inline-flex;align-items:center;padding:4px 10px;border-radius:var(--r-pill);font-size:11px;font-weight:600;color:var(--text-secondary);background:var(--bg-chip);border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:all .12s ease;font-family:inherit}.sb-drawer-filter-pill:hover{color:var(--text-primary);background:var(--bg-hover)}.sb-drawer-filter-pill.is-active{background:var(--accent-500);color:#fff;border-color:var(--accent-500)}.sb-drawer-section-title{font-size:11px;font-weight:700;color:var(--text-primary);text-transform:uppercase;letter-spacing:.06em;padding:12px 16px 8px}.sb-template-thumb{aspect-ratio:4/6;border-radius:var(--r-sm);border:1px solid var(--border-subtle);display:grid;place-items:center;cursor:pointer;position:relative;overflow:hidden;transition:all .18s ease;background:linear-gradient(160deg,var(--accent-100),var(--accent-200));color:var(--accent-700);font-family:Playfair Display,serif;font-style:italic;font-size:13px;text-align:center;padding:8px;line-height:1.2}.sb-template-thumb:hover{border-color:var(--accent-500);transform:translateY(-2px);box-shadow:var(--shadow-md)}.sb-template-thumb-label{position:absolute;bottom:6px;left:50%;transform:translate(-50%);font-size:9px;font-weight:700;color:var(--accent-700);background:#ffffffd9;padding:2px 6px;border-radius:var(--r-pill);text-transform:uppercase;letter-spacing:.04em;font-family:var(--font-sans);font-style:normal;white-space:nowrap}.sb-vars-shell{height:100%;min-height:calc(100vh - 44px);overflow-y:auto;background:var(--bg-app);font-family:var(--font-sans)}.sb-vars-content{max-width:1200px;margin:0 auto;padding:32px}.sb-vars-intro{margin-bottom:24px}.sb-vars-h1{font-size:32px;font-weight:800;letter-spacing:-.02em;color:var(--text-primary);margin-bottom:8px}.sb-vars-h2{font-size:22px;font-weight:700;letter-spacing:-.01em;color:var(--text-primary);margin-bottom:6px}.sb-vars-sub{font-size:14px;color:var(--text-secondary);line-height:1.55;max-width:640px}.sb-vars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}@media(max-width:1000px){.sb-vars-grid{grid-template-columns:1fr}}.sb-vars-card{position:relative;background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--r-lg);padding:20px;transition:all .18s ease}.sb-vars-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.sb-vars-card.is-recommended{border-color:var(--accent-300);box-shadow:0 0 0 3px var(--accent-100)}.sb-vars-badge{position:absolute;top:-10px;right:16px;display:inline-flex;align-items:center;gap:4px;padding:3px 10px;background:var(--accent-500);color:#fff;border-radius:var(--r-pill);font-size:10px;font-weight:700;letter-spacing:.03em}.sb-vars-card-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:14px;gap:8px}.sb-vars-card-title{font-size:15px;font-weight:700;color:var(--text-primary)}.sb-vars-card-tag{font-size:11px;color:var(--text-tertiary);font-weight:600}.sb-vars-schema{display:flex;gap:4px;height:120px;margin-bottom:14px;border-radius:var(--r-sm);overflow:hidden}.sb-vars-schema.is-vertical{flex-direction:column}.sb-vars-schema.is-vertical .sb-vars-block{min-height:0}.sb-vars-block{display:grid;place-items:center;border-radius:var(--r-xs);font-size:9px;font-weight:600;color:var(--text-secondary);text-align:center;padding:4px;min-width:0;overflow:hidden}.sb-vars-block span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sb-vars-card-meta{font-size:12px;color:var(--text-secondary);font-weight:500;margin-bottom:6px;line-height:1.4}.sb-vars-card-audience{font-size:11px;color:var(--text-tertiary);line-height:1.4}.sb-vars-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}@media(max-width:1000px){.sb-vars-controls{grid-template-columns:1fr}}.sb-vars-ctl-card{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--r-lg);padding:18px}.sb-vars-ctl-title{font-size:14px;font-weight:700;color:var(--text-primary);margin-bottom:4px}.sb-vars-ctl-desc{font-size:12px;color:var(--text-tertiary);margin-bottom:16px;line-height:1.4}.sb-vars-ctl-demo{display:flex;align-items:center;gap:10px}@media(prefers-reduced-motion:reduce){.auth-shell:before,.auth-shell:after{display:none}}.sb-dash-shell{display:grid;grid-template-columns:260px 1fr;height:100%;min-height:calc(100vh - 44px);background:var(--bg-app);overflow:hidden;min-width:900px;color:var(--text-primary);font-family:var(--font-sans)}.sb-dash-sidebar{background:var(--bg-panel);border-right:1px solid var(--border-subtle);padding:16px;display:flex;flex-direction:column;min-height:0;overflow-y:auto}.sb-dash-nav{display:flex;flex-direction:column;gap:2px}.sb-dash-nav-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--r-sm);font-size:13px;font-weight:500;color:var(--text-secondary);text-align:left;width:100%;background:transparent;border:none;cursor:pointer;font-family:inherit;transition:all .12s ease}.sb-dash-nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}.sb-dash-nav-item.is-active{background:var(--bg-active);color:var(--accent-600);font-weight:600}.sb-dash-nav-section{font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:var(--text-tertiary);padding:0 12px;margin-bottom:6px}.sb-dash-divider{height:1px;background:var(--border-subtle);margin:16px 0}.sb-dash-team-dot{width:16px;height:16px;border-radius:4px;flex-shrink:0}.sb-dash-storage{background:var(--bg-chip);border-radius:var(--r-md);padding:12px;margin-top:16px}.sb-dash-storage-head{display:flex;justify-content:space-between;margin-bottom:6px;font-size:11px}.sb-dash-storage-head span:last-child{color:var(--text-tertiary)}.sb-dash-storage-bar{height:4px;background:var(--border-subtle);border-radius:var(--r-pill);overflow:hidden}.sb-dash-storage-bar>div{height:100%;background:linear-gradient(90deg,var(--accent-500),var(--accent-400));border-radius:var(--r-pill)}.sb-dash-main{display:flex;flex-direction:column;min-height:0;overflow:hidden}.sb-dash-topbar{height:64px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--bg-app);border-bottom:1px solid var(--border-subtle);flex-shrink:0}.sb-dash-search{flex:1;max-width:540px;height:40px;background:var(--bg-panel);border:1px solid var(--border-default);border-radius:var(--r-md);display:flex;align-items:center;padding:0 14px;gap:10px;transition:all .15s ease;color:var(--text-tertiary)}.sb-dash-search:focus-within{border-color:var(--accent-500);box-shadow:0 0 0 3px var(--accent-100)}:root[data-theme=dark] .sb-dash-search:focus-within{box-shadow:0 0 0 3px #9763ff33}.sb-dash-search input{flex:1;background:none;border:none;outline:none;font-size:13px;color:var(--text-primary);font-family:inherit}.sb-dash-search input::-moz-placeholder{color:var(--text-tertiary)}.sb-dash-search input::placeholder{color:var(--text-tertiary)}.sb-dash-search kbd{font-family:var(--font-mono);font-size:10px;padding:2px 5px;background:var(--bg-chip);border-radius:4px;color:var(--text-tertiary);font-weight:500}.sb-dash-topbar-actions{display:flex;align-items:center;gap:8px}.sb-dash-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--accent-400),var(--accent-600));color:#fff;font-size:12px;font-weight:700;display:grid;place-items:center;border:none;cursor:pointer}.sb-dash-content{flex:1;overflow-y:auto;padding:32px;max-width:1400px;width:100%;margin:0 auto}.sb-dash-hero{display:grid;grid-template-columns:1fr 420px;gap:32px;align-items:center;background:radial-gradient(circle at 20% 20%,rgba(124,58,237,.12),transparent 50%),radial-gradient(circle at 80% 80%,rgba(236,72,153,.1),transparent 50%),var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--r-xl);padding:40px 44px;position:relative;overflow:hidden}.sb-dash-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--r-pill);font-size:11px;font-weight:600;background:var(--accent-100);color:var(--accent-700);margin-bottom:10px}:root[data-theme=dark] .sb-dash-chip{background:#7c3aed33;color:var(--accent-300)}.sb-dash-h1{font-size:36px;font-weight:800;line-height:1.1;letter-spacing:-.02em;color:var(--text-primary);margin-bottom:12px;text-wrap:pretty}.sb-dash-hero-sub{font-size:15px;color:var(--text-secondary);line-height:1.55;max-width:540px;text-wrap:pretty}.sb-dash-hero-cta{display:flex;gap:10px;margin-top:18px}.sb-dash-hero-visual{height:280px;display:grid;place-items:center}.sb-dash-hero-stack{position:relative;width:280px;height:280px}.sb-dash-hero-card{position:absolute;top:50%;left:50%;width:140px;height:210px;border-radius:var(--r-md);box-shadow:var(--shadow-lg);overflow:hidden;margin:-105px 0 0 -70px;border:1px solid var(--border-default);transition:transform .4s cubic-bezier(.16,1,.3,1);display:grid;place-items:center;color:#fff;font-family:Playfair Display,serif;font-style:italic;font-size:18px;text-align:center;padding:12px}.sb-dash-hero-stack:hover .sb-dash-hero-card{transform:translate(0) rotate(0)!important}.sb-dash-hero-sparkle{position:absolute;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:#fff;background:linear-gradient(135deg,var(--accent-400),var(--accent-600));box-shadow:var(--shadow-accent);animation:sb-floaty 4s ease-in-out infinite}.sb-dash-hero-sparkle.s1{top:16px;left:8px}.sb-dash-hero-sparkle.s2{top:60%;right:4px;background:linear-gradient(135deg,#f472b6,#ec4899);width:28px;height:28px;animation-delay:-1.3s}.sb-dash-hero-sparkle.s3{bottom:12px;left:32px;background:linear-gradient(135deg,#fbbf24,#f59e0b);width:32px;height:32px;animation-delay:-2.6s}@keyframes sb-floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.sb-dash-h2{font-size:18px;font-weight:700;letter-spacing:-.01em;color:var(--text-primary)}.sb-dash-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.sb-dash-formats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:16px}@media(max-width:1200px){.sb-dash-formats{grid-template-columns:repeat(3,1fr)}}.sb-dash-format-card{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--r-md);padding:14px;display:flex;flex-direction:column;gap:12px;text-align:left;transition:all .15s ease;cursor:pointer;font-family:inherit;color:inherit}.sb-dash-format-card:hover{border-color:var(--accent-500);box-shadow:var(--shadow-md);transform:translateY(-2px)}.sb-dash-format-card.is-custom{background:var(--bg-chip);border-style:dashed;border-color:var(--border-strong)}.sb-dash-format-preview{background:linear-gradient(135deg,var(--accent-50),var(--accent-100));border-radius:var(--r-sm);display:grid;place-items:center;color:var(--accent-600);max-height:92px;margin:0 auto;width:100%}:root[data-theme=dark] .sb-dash-format-preview{background:linear-gradient(135deg,#7c3aed26,#7c3aed0d)}.sb-dash-format-card.is-custom .sb-dash-format-preview{background:var(--bg-panel);border:1.5px dashed var(--border-strong);color:var(--text-tertiary)}.sb-dash-format-name{font-size:12px;font-weight:700;color:var(--text-primary)}.sb-dash-format-sub{font-size:10px;color:var(--text-tertiary);margin-top:2px}.sb-dash-recent-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.sb-dash-project-card{background:var(--bg-panel);border-radius:var(--r-md);border:1px solid var(--border-subtle);overflow:hidden;transition:all .18s ease;cursor:pointer}.sb-dash-project-card:hover{border-color:var(--accent-500);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.sb-dash-project-thumb{aspect-ratio:4/6;position:relative;overflow:hidden;background:linear-gradient(135deg,var(--accent-100),var(--accent-200));display:grid;place-items:center;color:var(--accent-700);font-family:Playfair Display,serif;font-style:italic;font-size:28px;font-weight:600}.sb-dash-project-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.55) 100%);display:flex;align-items:flex-end;justify-content:center;padding:12px;opacity:0;transition:opacity .18s ease;gap:6px}.sb-dash-project-card:hover .sb-dash-project-overlay{opacity:1}.sb-dash-project-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:12px 14px}.sb-dash-project-name{font-size:13px;font-weight:700;color:var(--text-primary);letter-spacing:-.01em;margin-bottom:2px;text-wrap:pretty;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sb-dash-project-sub{font-size:11px;color:var(--text-tertiary)}.sb-dash-icon-btn{width:28px;height:28px;display:grid;place-items:center;border:none;background:transparent;border-radius:var(--r-sm);color:var(--text-secondary);cursor:pointer;transition:all .12s ease}.sb-dash-icon-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.sb-dash-icon-btn.is-danger:hover{color:var(--danger);background:var(--danger-bg)}.sb-dash-cat-row{display:flex;gap:4px;margin-bottom:18px;overflow-x:auto;padding-bottom:4px}.sb-dash-cat{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--r-pill);font-size:12px;font-weight:600;color:var(--text-secondary);background:transparent;border:1px solid transparent;transition:all .12s ease;white-space:nowrap;cursor:pointer;font-family:inherit}.sb-dash-cat:hover{background:var(--bg-hover);color:var(--text-primary)}.sb-dash-cat.is-active{background:var(--text-primary);color:var(--bg-panel)}.sb-dash-cat-count{font-size:10px;opacity:.7;font-weight:500}.sb-dash-empty{padding:48px;text-align:center;border:1.5px dashed var(--border-default);border-radius:var(--r-lg);color:var(--text-secondary);font-size:14px;background:var(--bg-chip)}.sb-dash-empty-title{font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:6px}.sb-dash-skeleton{background:linear-gradient(90deg,var(--bg-chip) 0%,var(--bg-hover) 50%,var(--bg-chip) 100%);background-size:200% 100%;animation:sb-shimmer 1.4s linear infinite;border-radius:var(--r-md)}@keyframes sb-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.snapbooth-topbar{display:flex!important;align-items:center;justify-content:space-between;height:56px!important;background:var(--bg-panel)!important;border-bottom:1px solid var(--border-subtle)!important;padding:0 12px!important;gap:12px!important;box-shadow:none!important;color:var(--text-primary)!important;font-family:var(--font-sans)}.snapbooth-topbar .topbar-left{display:flex!important;align-items:center;gap:12px;min-width:0;flex:0 0 auto}.snapbooth-topbar .topbar-center{display:flex!important;align-items:center;gap:2px;background:var(--bg-chip);padding:4px;border-radius:var(--r-md);flex-shrink:0;margin:0 auto}.snapbooth-topbar .topbar-right{display:flex!important;align-items:center;gap:6px!important;flex-shrink:0}.snapbooth-topbar .topbar-logo{display:flex;align-items:center;gap:10px}.snapbooth-topbar .logo-icon{width:32px;height:32px;border-radius:var(--r-sm);display:grid;place-items:center;color:#fff!important;font-weight:800!important;font-size:12px!important;letter-spacing:.02em;background:linear-gradient(135deg,#9763ff,#7c3aed 60%,#5b21b6)!important;box-shadow:0 2px 8px #7c3aed66;border:none!important}.snapbooth-topbar .logo-text{display:flex;flex-direction:column;gap:0;line-height:1.1}.snapbooth-topbar .logo-title{font-weight:700!important;font-size:14px!important;letter-spacing:-.01em!important;color:var(--text-primary)!important}.snapbooth-topbar .logo-badge{font-size:10px!important;font-weight:600!important;color:var(--accent-600)!important;text-transform:uppercase;letter-spacing:.06em;background:transparent!important;padding:0!important;border-radius:0!important}.snapbooth-topbar button{font-family:var(--font-sans)}.snapbooth-topbar .topbar-right button[class*=icon-btn],.snapbooth-topbar .topbar-right button[aria-label]{border-radius:var(--r-sm)!important}.snapbooth-topbar button[class*=bg-blue],.snapbooth-topbar button[class*=bg-primary],.snapbooth-topbar .btn-primary{background:var(--accent-500)!important;color:var(--text-on-accent)!important;box-shadow:var(--shadow-accent)!important;border-color:transparent!important}.snapbooth-topbar button[class*=bg-blue]:hover,.snapbooth-topbar button[class*=bg-primary]:hover,.snapbooth-topbar .btn-primary:hover{background:var(--accent-600)!important}.snapbooth-topbar .topbar-divider,.snapbooth-topbar [class*=divider]{background:var(--border-subtle)!important}.bottom-bar,.bottombar,[class*=BottomBar]>.bottom-bar-wrapper,.bottom-bar-wrapper{background:var(--bg-panel)!important;border-top:1px solid var(--border-subtle)!important;color:var(--text-primary)!important;font-family:var(--font-sans)}.bottom-bar [class*=zoom],.bottombar [class*=zoom]{font-variant-numeric:tabular-nums;font-weight:600!important;color:var(--text-primary)!important}.snapbooth-topbar .save-indicator,.bottom-bar .save-indicator{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--success);font-weight:500}.save-led{width:8px;height:8px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px #10b9812e;animation:sb-pulse-led 2s ease-in-out infinite}@keyframes sb-pulse-led{0%,to{box-shadow:0 0 0 3px #10b9812e}50%{box-shadow:0 0 0 5px #10b98147}}.sb-help-fab{position:fixed;bottom:64px;right:24px;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px;background:var(--accent-500);color:var(--text-on-accent);border:none;border-radius:var(--r-pill);font-size:13px;font-weight:600;cursor:pointer;box-shadow:var(--shadow-accent),var(--shadow-md);z-index:900;transition:transform .18s ease,box-shadow .18s ease;font-family:var(--font-sans)}.sb-help-fab:hover{background:var(--accent-600);transform:translateY(-2px);box-shadow:0 12px 32px #7c3aed73,var(--shadow-lg)}.sb-help-fab:active{transform:translateY(0)}.sb-help-fab kbd{font-family:var(--font-mono);font-size:10px;padding:2px 6px;background:#fff3;border-radius:4px;color:#fff;font-weight:700}.app-container,.app-main,.editor-shell{background:var(--bg-app)!important}.canvas-wrapper,.canvas-area{background:var(--bg-canvas)!important}.snapbooth-slim-sidebar{background:var(--bg-panel)!important;border-right:1px solid var(--border-subtle)!important;font-family:var(--font-sans);color:var(--text-secondary)}.snapbooth-slim-sidebar button,.snapbooth-slim-sidebar [role=button]{border-radius:var(--r-md)!important;color:var(--text-secondary)!important;transition:all .15s ease}.snapbooth-slim-sidebar button:hover,.snapbooth-slim-sidebar [role=button]:hover{background:var(--bg-hover)!important;color:var(--text-primary)!important}.snapbooth-slim-sidebar button.active,.snapbooth-slim-sidebar button[aria-pressed=true],.snapbooth-slim-sidebar [class*=is-active],.snapbooth-slim-sidebar [data-active=true]{background:var(--bg-active)!important;color:var(--accent-600)!important;position:relative}.snapbooth-slim-sidebar button.active:before,.snapbooth-slim-sidebar button[aria-pressed=true]:before,.snapbooth-slim-sidebar [class*=is-active]:before,.snapbooth-slim-sidebar [data-active=true]:before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;background:var(--accent-500);border-radius:0 3px 3px 0}.drawer-content{background:var(--bg-panel)!important;border-right:1px solid var(--border-subtle)!important;font-family:var(--font-sans);color:var(--text-primary)!important}.drawer-header{display:flex!important;align-items:center;justify-content:space-between;padding:12px 16px!important;border-bottom:1px solid var(--border-subtle)!important;background:var(--bg-panel)!important}.drawer-title{font-size:15px!important;font-weight:700!important;letter-spacing:-.01em!important;color:var(--text-primary)!important}.drawer-close-btn{width:28px!important;height:28px!important;border-radius:var(--r-sm)!important;color:var(--text-secondary)!important;background:transparent!important;border:none!important;display:grid;place-items:center;cursor:pointer;transition:all .12s ease}.drawer-close-btn:hover{background:var(--bg-hover)!important;color:var(--text-primary)!important}.drawer-grid{display:grid!important;grid-template-columns:repeat(2,1fr);gap:8px!important;padding:12px 16px!important}.drawer-item{background:var(--bg-panel)!important;border:1px solid var(--border-subtle)!important;border-radius:var(--r-sm)!important;padding:8px!important;transition:all .15s ease;cursor:pointer}.drawer-item:hover{border-color:var(--accent-500)!important;box-shadow:var(--shadow-md)!important;transform:translateY(-1px)}.drawer-item-preview{background:linear-gradient(135deg,var(--accent-50),var(--accent-100))!important;border-radius:var(--r-xs)!important;aspect-ratio:4/6;display:grid;place-items:center;color:var(--accent-600)!important}.drawer-item-title{font-size:11px!important;font-weight:600!important;color:var(--text-primary)!important;margin-top:6px!important}.drawer-list-item{display:flex!important;align-items:center;gap:10px;padding:8px 16px!important;border-radius:var(--r-sm);margin:2px 12px!important;cursor:pointer;transition:background .12s}.drawer-list-item:hover{background:var(--bg-hover)!important}.drawer-list-preview{width:36px;height:36px;border-radius:var(--r-sm);background:var(--bg-chip);display:grid;place-items:center;color:var(--text-secondary);flex-shrink:0}.snapbooth-right-sidebar{background:var(--bg-panel)!important;border-left:1px solid var(--border-subtle)!important;color:var(--text-primary)!important;font-family:var(--font-sans)}.sidebar-tabs{display:flex!important;padding:0 12px!important;gap:2px;border-bottom:1px solid var(--border-subtle)!important;background:var(--bg-panel)!important}.sidebar-tabs button,.sidebar-tabs [role=tab]{flex:1;display:flex;align-items:center;justify-content:center;gap:5px;padding:10px 0 11px!important;font-size:12px!important;font-weight:600!important;color:var(--text-tertiary)!important;background:transparent!important;border:none!important;border-bottom:2px solid transparent!important;margin-bottom:-1px;transition:all .12s ease;cursor:pointer}.sidebar-tabs button:hover,.sidebar-tabs [role=tab]:hover{color:var(--text-primary)!important}.sidebar-tabs button.active,.sidebar-tabs button[aria-selected=true],.sidebar-tabs [role=tab][aria-selected=true]{color:var(--accent-600)!important;border-bottom-color:var(--accent-500)!important}.sidebar-section,.control-group{padding:12px 16px!important;border-bottom:1px solid var(--border-subtle)!important;display:flex;flex-direction:column;gap:8px}.sidebar-section:last-child,.control-group:last-child{border-bottom:none!important}.section-title{font-size:11px!important;font-weight:700!important;color:var(--text-primary)!important;text-transform:uppercase;letter-spacing:.06em;margin:0 0 4px!important}.properties-grid{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important}.snapbooth-right-sidebar .input,.snapbooth-right-sidebar input[type=text],.snapbooth-right-sidebar input[type=number],.snapbooth-right-sidebar select{height:32px!important;padding:0 10px!important;background:var(--bg-chip)!important;border:1px solid transparent!important;border-radius:var(--r-sm)!important;font-size:12px!important;color:var(--text-primary)!important;font-family:inherit;font-weight:500;width:100%;transition:all .15s ease}.snapbooth-right-sidebar .input:hover,.snapbooth-right-sidebar input:hover,.snapbooth-right-sidebar select:hover{background:var(--bg-hover)!important}.snapbooth-right-sidebar .input:focus,.snapbooth-right-sidebar input:focus,.snapbooth-right-sidebar select:focus{outline:none!important;background:var(--bg-panel)!important;border-color:var(--accent-500)!important;box-shadow:0 0 0 3px var(--accent-100)!important}:root[data-theme=dark] .snapbooth-right-sidebar .input:focus,:root[data-theme=dark] .snapbooth-right-sidebar input:focus{box-shadow:0 0 0 3px #9763ff33!important}.input-with-unit{display:flex!important;align-items:center;background:var(--bg-chip)!important;border:1px solid transparent!important;border-radius:var(--r-sm)!important;transition:all .15s ease}.input-with-unit:focus-within{background:var(--bg-panel)!important;border-color:var(--accent-500)!important;box-shadow:0 0 0 3px var(--accent-100)!important}.input-with-unit input{background:transparent!important;border:none!important;box-shadow:none!important;flex:1}.input-with-unit input:focus{background:transparent!important;box-shadow:none!important;border:none!important}.input-unit{font-size:10px!important;color:var(--text-tertiary)!important;font-weight:600;padding:0 10px!important;text-transform:lowercase}.color-swatch{width:28px!important;height:28px!important;border-radius:var(--r-sm)!important;border:1px solid var(--border-default)!important;cursor:pointer;transition:transform .12s ease,border-color .12s;flex-shrink:0}.color-swatch:hover{transform:scale(1.1);border-color:var(--accent-500)!important}.color-palette{display:flex!important;flex-wrap:wrap;gap:4px!important}.color-controls{display:flex!important;align-items:center;gap:8px!important}.color-picker{width:32px!important;height:32px!important;border-radius:var(--r-sm)!important;border:1px solid var(--border-default)!important;cursor:pointer;flex-shrink:0;padding:0!important}.layers-tree{display:flex;flex-direction:column;gap:1px;padding:8px 0!important}.layer-group,.layers-tree>div{border-radius:var(--r-sm);padding:6px 12px!important;display:flex!important;align-items:center;gap:8px;font-size:12px;color:var(--text-primary);transition:background .12s}.layer-group:hover{background:var(--bg-hover)!important}.layer-icon{width:24px;height:24px;display:grid;place-items:center;color:var(--text-secondary);flex-shrink:0}.layer-name{flex:1;font-size:12px!important;color:var(--text-primary)!important;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-visibility,.layer-delete{color:var(--text-tertiary)!important;background:transparent!important;border:none!important;width:24px!important;height:24px!important;border-radius:var(--r-xs)!important;display:grid;place-items:center;cursor:pointer;transition:all .12s;opacity:0}.layer-group:hover .layer-visibility,.layer-group:hover .layer-delete{opacity:1}.layer-visibility:hover{color:var(--accent-600)!important;background:var(--bg-hover)!important}.layer-delete:hover{color:var(--danger)!important;background:var(--danger-bg)!important}.selection-summary{padding:10px 16px!important;background:var(--bg-active)!important;border-bottom:1px solid var(--border-subtle)!important;font-size:11px!important;color:var(--accent-700)!important;font-weight:600!important;text-transform:uppercase;letter-spacing:.04em}:root[data-theme=dark] .selection-summary{color:var(--accent-300)!important}.sb-cmd-overlay{position:fixed;inset:0;background:#0f0b1973;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1200;display:grid;align-items:flex-start;justify-content:center;padding-top:14vh;animation:sb-cmd-fade-in .18s ease-out;font-family:var(--font-sans)}@keyframes sb-cmd-fade-in{0%{opacity:0}to{opacity:1}}@keyframes sb-cmd-pop-in{0%{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.sb-cmd-shell{width:640px;max-width:calc(100vw - 32px);background:var(--bg-panel-elev);border-radius:var(--r-xl);box-shadow:var(--shadow-pop);border:1px solid var(--border-default);overflow:hidden;display:flex;flex-direction:column;max-height:70vh;animation:sb-cmd-pop-in .22s cubic-bezier(.16,1,.3,1)}.sb-cmd-search{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--border-subtle);color:var(--text-tertiary)}.sb-cmd-input{flex:1;background:transparent;border:none;outline:none;font-size:17px;font-weight:500;color:var(--text-primary);letter-spacing:-.01em;font-family:inherit}.sb-cmd-input::-moz-placeholder{color:var(--text-tertiary)}.sb-cmd-input::placeholder{color:var(--text-tertiary)}.sb-cmd-results{flex:1;overflow-y:auto;padding:6px 0}.sb-cmd-group{padding:6px 0}.sb-cmd-group-title{padding:4px 18px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--text-tertiary)}.sb-cmd-item{display:flex;align-items:center;gap:12px;padding:8px 18px;cursor:pointer;transition:background .08s ease;border-left:3px solid transparent;margin:0 6px;border-radius:7px}.sb-cmd-item:hover{background:var(--bg-hover)}.sb-cmd-item.is-active{background:var(--bg-active);border-left-color:var(--accent-500)}.sb-cmd-item-icon{width:30px;height:30px;border-radius:7px;background:var(--bg-chip);color:var(--text-secondary);display:grid;place-items:center;flex-shrink:0}.sb-cmd-item.is-active .sb-cmd-item-icon{color:var(--accent-600)}.sb-cmd-item-body{flex:1;min-width:0}.sb-cmd-item-label{font-size:13px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sb-cmd-item-sub{font-size:11px;color:var(--text-tertiary);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sb-cmd-item-shortcut{display:inline-flex;gap:3px;flex-shrink:0}.sb-kbd{font-family:var(--font-mono);font-size:10px;padding:2px 6px;background:var(--bg-chip);border:1px solid var(--border-subtle);border-radius:4px;color:var(--text-secondary);font-weight:600;min-width:18px;text-align:center}.sb-cmd-tag{display:inline-flex;align-items:center;padding:2px 8px;border-radius:var(--r-pill);font-size:10px;font-weight:700;background:linear-gradient(135deg,#9763ff,#ec4899);color:#fff;letter-spacing:.04em}.sb-cmd-foot{display:flex;align-items:center;justify-content:space-between;padding:10px 18px;border-top:1px solid var(--border-subtle);background:var(--bg-app);font-size:11px;color:var(--text-tertiary)}.sb-cmd-foot-hints{display:flex;gap:14px}.sb-cmd-foot-hints span{display:inline-flex;align-items:center;gap:4px}.sb-cmd-foot-brand{display:inline-flex;align-items:center;gap:5px;font-weight:600;color:var(--accent-600)}.sb-cmd-empty{padding:40px 20px;text-align:center;color:var(--text-secondary)}.sb-cmd-empty-emoji{font-size:32px;margin-bottom:8px}.sb-cmd-empty-title{font-weight:700;margin-bottom:4px;color:var(--text-primary)}.sb-cmd-empty-sub{font-size:12px;color:var(--text-tertiary)}:root{--kiosk-bg: #0a0712}.kiosk-view{height:100vh;display:flex;flex-direction:column;background:var(--kiosk-bg);color:#fff;overflow:hidden;font-family:var(--font-sans)}.kiosk-admin-bar{height:44px;background:#ffffff08;border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:center;padding:0 16px;gap:16px;flex-shrink:0}.kiosk-admin-left{display:flex;align-items:center;gap:6px;font-size:11px;color:#fff9;font-weight:500}.kiosk-admin-tabs{display:flex;margin-left:auto;background:#ffffff0f;border-radius:var(--r-md);padding:3px;gap:2px}.kiosk-admin-tab{padding:5px 14px;font-size:11px;font-weight:600;color:#fff9;border-radius:var(--r-sm);background:transparent;border:none;cursor:pointer;font-family:inherit}.kiosk-admin-tab:hover{color:#fff;background:#ffffff0a}.kiosk-admin-tab.is-active{background:#7c3aed59;color:#fff}.kiosk-admin-exit{background:#ffffff14;border:1px solid rgba(255,255,255,.1);color:#fff;padding:4px 10px;border-radius:var(--r-sm);font-size:11px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px}.kiosk-admin-exit:hover{background:#ffffff1f}.kiosk-frame{flex:1;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at 30% 20%,rgba(124,58,237,.25),transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(236,72,153,.18),transparent 50%),#0a0712;min-height:0}.kiosk-screen{width:100%;height:100%;max-width:1100px;max-height:800px;background:linear-gradient(180deg,#1a0f2e,#0f0823);border-radius:28px;position:relative;overflow:hidden;box-shadow:0 0 0 4px #ffffff0a,0 0 0 14px #00000080,0 40px 80px #0009}.kiosk-attract{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative;padding:60px 40px}.kiosk-attract-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}.kiosk-event-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;background:#ffffff14;border:1px solid rgba(255,255,255,.1);border-radius:999px;font-size:13px;font-weight:600;color:#fff;margin-bottom:28px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.kiosk-event-chip svg{color:#f472b6}.kiosk-h1{display:flex;flex-direction:column;font-family:Playfair Display,serif;font-size:96px;font-weight:700;line-height:.95;letter-spacing:-.03em;color:#fff;margin-bottom:24px}.kiosk-h1 .italic{font-style:italic;font-weight:500;background:linear-gradient(135deg,#f472b6,#b591ff,#9763ff);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.kiosk-h2{font-family:Playfair Display,serif;font-size:52px;font-weight:700;line-height:1.05;letter-spacing:-.02em;color:#fff;margin-bottom:6px}.kiosk-h2 .italic{font-style:italic;color:#f472b6}.kiosk-lede{font-size:17px;line-height:1.55;color:#ffffffbf;margin-bottom:40px;max-width:540px}.kiosk-cta{position:relative;padding:22px 56px;background:#fff;color:#1a0f2e;font-size:22px;font-weight:700;border-radius:999px;letter-spacing:-.01em;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;box-shadow:0 0 0 8px #ffffff0a,0 20px 60px #7c3aed66;margin-bottom:50px;animation:kiosk-pulse 2.4s ease-in-out infinite;border:none;font-family:inherit}.kiosk-cta:hover{transform:translateY(-3px) scale(1.02)}.kiosk-cta:active{transform:translateY(0) scale(.98)}.kiosk-cta-glow{position:absolute;inset:-2px;border-radius:999px;background:linear-gradient(135deg,#f472b6,#9763ff);filter:blur(20px);opacity:.5;z-index:-1}@keyframes kiosk-pulse{0%,to{box-shadow:0 0 0 8px #ffffff0a,0 20px 60px #7c3aed66}50%{box-shadow:0 0 0 14px #ffffff0f,0 20px 80px #ec48998c}}.kiosk-attract-stats{display:flex;align-items:center;gap:28px;padding:16px 28px;background:#ffffff0d;border:1px solid rgba(255,255,255,.08);border-radius:16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.kiosk-stat-n{font-size:26px;font-weight:800;color:#fff;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.kiosk-stat-l{font-size:11px;color:#ffffff8c;text-transform:uppercase;letter-spacing:.1em;font-weight:600;margin-top:2px}.kiosk-stat-divider{width:1px;height:28px;background:#ffffff1f}.kiosk-attract-hint{position:absolute;bottom:32px;left:50%;transform:translate(-50%);font-size:13px;color:#fff6;font-weight:500;animation:kiosk-float-hint 2s ease-in-out infinite;z-index:2}@keyframes kiosk-float-hint{0%,to{transform:translate(-50%) translateY(0);opacity:.4}50%{transform:translate(-50%) translateY(-4px);opacity:.7}}.kiosk-sparkles{position:absolute;inset:0;pointer-events:none;overflow:hidden}.k-sparkle{position:absolute;animation:kiosk-sparkle-float 5s ease-in-out infinite}.k-s-0{top:12%;left:8%;animation-delay:0s;color:#f472b680}.k-s-1{top:18%;right:12%;animation-delay:-1s;color:#b791ff80}.k-s-2{top:38%;left:14%;animation-delay:-2s;color:#fbbf2466}.k-s-3{top:72%;right:8%;animation-delay:-3s;color:#f472b680}.k-s-4{top:60%;left:6%;animation-delay:-1.5s;color:#b791ff66}.k-s-5{top:30%;right:6%;animation-delay:-2.5s;color:#fbbf2480}.k-s-6{top:82%;left:24%;animation-delay:-.5s;color:#b791ff80}.k-s-7{top:8%;right:28%;animation-delay:-3.5s;color:#f472b666}@keyframes kiosk-sparkle-float{0%,to{transform:translateY(0) rotate(0);opacity:.4}50%{transform:translateY(-12px) rotate(15deg);opacity:1}}.kiosk-capture{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;gap:24px}.kiosk-feed{width:min(700px,85%);aspect-ratio:4/3;border-radius:24px;overflow:hidden;position:relative;box-shadow:0 30px 80px #00000080,0 0 0 4px #ffffff0f}.kiosk-feed-img{width:100%;height:100%;position:relative;overflow:hidden}.k-feed-bg{position:absolute;inset:0;background:radial-gradient(ellipse at 30% 50%,#f8dcc9 0%,transparent 60%),radial-gradient(ellipse at 70% 60%,#c8a48d 0%,transparent 50%),linear-gradient(180deg,#3d2817,#1a0f08)}.k-feed-people{position:absolute;bottom:0;left:50%;transform:translate(-50%);display:flex;gap:8px;align-items:flex-end}.k-person{width:120px;height:220px;border-radius:60px 60px 0 0;background:linear-gradient(180deg,#f4c2a1,#8b4513 30%,#1a1530);position:relative}.k-person:before{content:"";position:absolute;top:18px;left:50%;transform:translate(-50%);width:55px;height:70px;background:#f4c2a1;border-radius:50%}.k-person.p2{background:linear-gradient(180deg,#e8b589,#6b3410 30%,#2a1a1a)}.k-person.p2:before{background:#e8b589}.k-feed-grid{position:absolute;inset:12%;border:1px solid rgba(255,255,255,.15);pointer-events:none}.k-feed-grid:before,.k-feed-grid:after{content:"";position:absolute;background:#ffffff1a}.k-feed-grid:before{inset:0 33%}.k-feed-grid:after{inset:33% 0}.kiosk-count-overlay{position:absolute;inset:0;display:grid;place-items:center}.kiosk-count-ring{position:absolute;width:200px;height:200px;border:6px solid rgba(255,255,255,.6);border-radius:50%;border-top-color:transparent;border-right-color:transparent;animation:kiosk-count-spin .9s linear infinite}@keyframes kiosk-count-spin{to{transform:rotate(360deg)}}.kiosk-count-number{font-family:Playfair Display,serif;font-size:180px;font-weight:700;color:#fff;text-shadow:0 0 60px rgba(0,0,0,.6);line-height:1;animation:kiosk-pop-num .4s cubic-bezier(.16,1,.3,1)}@keyframes kiosk-pop-num{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}.kiosk-capture-hint{position:absolute;bottom:30px;left:50%;transform:translate(-50%);padding:10px 24px;background:#00000080;border-radius:999px;font-size:16px;font-weight:600;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.kiosk-shot-dots{display:flex;gap:12px;margin-top:8px}.kiosk-shot-dot{width:44px;height:44px;border-radius:50%;background:#ffffff14;border:2px solid rgba(255,255,255,.15);display:grid;place-items:center;color:#ffffff80;font-weight:700;font-size:16px;transition:all .3s ease}.kiosk-shot-dot.done{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-color:transparent}.kiosk-shot-dot.current{background:#fff;color:#1a0f2e;border-color:#fff;box-shadow:0 0 0 6px #ffffff26;transform:scale(1.1)}.kiosk-shot-label{color:#fff9;font-size:13px}.kiosk-shot-label strong{color:#fff;font-weight:700}.kiosk-result{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;padding:40px;text-align:center;overflow:auto}.kiosk-result-header{margin-bottom:28px}.kiosk-result-sub{font-size:16px;color:#ffffffa6;margin-top:4px}.kiosk-result-stage{display:flex;gap:28px;align-items:center;margin-bottom:28px}.kiosk-print-preview{position:relative}.kiosk-print-sheet{width:260px;aspect-ratio:4/6;background:#fff;border-radius:4px;box-shadow:0 30px 80px #00000080;overflow:hidden;position:relative;z-index:2;display:grid;place-items:center;color:#1a0f2e;font-family:Playfair Display,serif;font-style:italic;font-size:22px;padding:20px}.kiosk-print-shadow{position:absolute;inset:30px -12px -12px 12px;background:linear-gradient(135deg,#7c3aed99,#ec489966);border-radius:4px;filter:blur(30px);z-index:1}.kiosk-strip{display:flex;flex-direction:column;gap:6px;padding:12px;background:#ffffff0d;border-radius:14px;border:1px solid rgba(255,255,255,.08)}.kiosk-strip-title{font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:700;color:#ffffff80;margin-bottom:4px;text-align:center}.kiosk-strip-photo{width:100px;aspect-ratio:4/3;border-radius:6px;overflow:hidden;position:relative;background:#1a0f08}.kiosk-strip-num{position:absolute;top:4px;left:4px;width:18px;height:18px;background:#0000008c;border-radius:50%;color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center}.kiosk-result-actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}.kiosk-action{display:inline-flex;align-items:center;gap:10px;padding:16px 24px;background:linear-gradient(135deg,#9763ff,#7c3aed);color:#fff;border-radius:14px;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s ease;text-align:left;box-shadow:0 10px 30px #7c3aed66;min-width:160px;border:none;font-family:inherit}.kiosk-action:hover{transform:translateY(-3px);box-shadow:0 16px 40px #7c3aed8c}.kiosk-action.secondary{background:#ffffff0f;border:1px solid rgba(255,255,255,.12);color:#fff;box-shadow:none}.kiosk-action.secondary:hover{background:#ffffff1a;box-shadow:none;transform:translateY(-2px)}.kiosk-action small{font-size:12px;font-weight:500;opacity:.75;display:block}.kiosk-delivery{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px}.kiosk-delivery-icon{position:relative;width:140px;height:140px;border-radius:50%;background:linear-gradient(135deg,#9763ff,#7c3aed);display:grid;place-items:center;color:#fff;margin-bottom:32px;box-shadow:0 20px 60px #7c3aed99}.kiosk-delivery-ring,.kiosk-delivery-ring-2{position:absolute;border-radius:50%;border:2px solid rgba(151,99,255,.4);animation:kiosk-delivery-pulse 2.4s ease-out infinite}.kiosk-delivery-ring{inset:-20px}.kiosk-delivery-ring-2{inset:-40px;animation-delay:.6s;opacity:.5}@keyframes kiosk-delivery-pulse{0%{transform:scale(.9);opacity:.8}to{transform:scale(1.3);opacity:0}}.kiosk-progress{width:100%;max-width:420px}.kiosk-progress-bar{height:8px;background:#ffffff14;border-radius:999px;overflow:hidden}.kiosk-progress-bar>div{width:78%;height:100%;background:linear-gradient(90deg,#9763ff,#f472b6);border-radius:999px;animation:kiosk-progress-shine 2s ease-in-out infinite}@keyframes kiosk-progress-shine{0%,to{opacity:.9}50%{opacity:1;box-shadow:0 0 24px #f472b680}}.kiosk-progress-label{display:flex;justify-content:space-between;margin-top:8px;font-size:12px;color:#ffffff8c;font-weight:500}.kiosk-delivery-tip{margin-top:40px;padding:12px 20px;background:#ffffff0d;border-radius:999px;font-size:13px;color:#ffffffa6;font-weight:500}.live-view{height:100%;min-height:calc(100vh - 44px);display:flex;flex-direction:column;background:var(--bg-app);overflow:hidden;font-family:var(--font-sans)}.live-topbar{background:var(--bg-panel);border-bottom:1px solid var(--border-subtle);padding:14px 24px;display:flex;align-items:center;gap:18px;flex-shrink:0}.live-topbar-brand{display:flex;align-items:center;gap:12px}.live-topbar-mark{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#9763ff,#7c3aed);color:#fff;display:grid;place-items:center}.live-topbar-title{font-size:14px;font-weight:700;color:var(--text-primary)}.live-topbar-sub{font-size:11px;color:var(--text-tertiary);margin-top:1px}.live-pulse-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#10b9811f;color:var(--success);border-radius:999px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.live-pulse-dot{width:8px;height:8px;background:var(--success);border-radius:50%;animation:kiosk-delivery-pulse 1.4s infinite}.live-elapsed{font-variant-numeric:tabular-nums;font-size:12px;font-weight:600;color:var(--text-secondary)}.live-content{flex:1;overflow:auto;padding:24px;max-width:1400px;width:100%;margin:0 auto}.live-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}@media(max-width:900px){.live-kpis{grid-template-columns:repeat(2,1fr)}}.live-kpi{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--r-lg);padding:18px 20px;display:flex;flex-direction:column;gap:8px;position:relative;overflow:hidden}.live-kpi:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--accent-100),transparent 60%);opacity:.45;pointer-events:none}:root[data-theme=dark] .live-kpi:before{background:linear-gradient(135deg,rgba(124,58,237,.15),transparent 60%)}.live-kpi-head{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}.live-kpi-label{font-size:11px;font-weight:700;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em}.live-kpi-icon{width:28px;height:28px;border-radius:8px;background:var(--accent-100);color:var(--accent-600);display:grid;place-items:center}:root[data-theme=dark] .live-kpi-icon{background:#7c3aed33}.live-kpi-value{font-size:32px;font-weight:800;color:var(--text-primary);font-variant-numeric:tabular-nums;letter-spacing:-.02em;position:relative;z-index:1}.live-kpi-trend{font-size:11px;font-weight:600;color:var(--success);display:inline-flex;align-items:center;gap:3px;position:relative;z-index:1}.live-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}@media(max-width:1100px){.live-grid{grid-template-columns:1fr}}.live-panel{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--r-lg);padding:18px 20px}.live-panel-title{font-size:13px;font-weight:700;color:var(--text-primary);margin-bottom:14px;display:flex;align-items:center;justify-content:space-between}.live-feed{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.live-feed-photo{aspect-ratio:4/6;border-radius:var(--r-sm);background:linear-gradient(135deg,var(--accent-100),var(--accent-200));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--accent-700);text-align:center;padding:8px;overflow:hidden;animation:live-feed-slide .5s cubic-bezier(.16,1,.3,1) backwards}.live-feed-format{font-family:JetBrains Mono,monospace;font-size:10px;font-weight:700;letter-spacing:.05em;padding:2px 8px;border-radius:999px;background:var(--accent-600);color:#fff}.live-feed-name{font-size:11px;font-weight:600;line-height:1.25;color:var(--text-primary);word-break:break-word;max-width:100%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.live-feed-time{font-size:10px;color:var(--accent-700);opacity:.8}.live-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px 20px;text-align:center;color:var(--text-tertiary);font-size:13px;font-weight:500}.live-empty svg{opacity:.5}@keyframes live-feed-slide{0%{opacity:0;transform:translateY(8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.live-hardware-list{display:flex;flex-direction:column;gap:10px}.live-hw-row{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--bg-chip);border-radius:var(--r-sm);font-size:12px;color:var(--text-primary);font-weight:500}.live-hw-dot{width:8px;height:8px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px #10b98133;flex-shrink:0}.live-hw-dot.warn{background:var(--warning);box-shadow:0 0 0 3px #f59e0b33}.live-hw-dot.error{background:var(--danger);box-shadow:0 0 0 3px #ef444433}.live-hw-name{flex:1}.live-hw-meta{font-size:11px;color:var(--text-tertiary)}.ob-overlay{position:fixed;inset:0;background:linear-gradient(135deg,#7c3aedf2,#591c9af2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1100;display:grid;place-items:center;padding:24px;animation:ob-fade-in .25s ease-out;font-family:var(--font-sans)}:root[data-theme=dark] .ob-overlay{background:linear-gradient(135deg,#0a0712f2,#1f1934f2)}@keyframes ob-fade-in{0%{opacity:0}to{opacity:1}}.ob-shell{width:920px;max-width:100%;max-height:calc(100vh - 48px);background:var(--bg-panel);border-radius:var(--r-xl);box-shadow:0 40px 80px #0006;display:flex;flex-direction:column;overflow:hidden;animation:ob-pop-in .32s cubic-bezier(.16,1,.3,1)}@keyframes ob-pop-in{0%{opacity:0;transform:scale(.95) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.ob-head{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid var(--border-subtle);flex-shrink:0}.ob-progress{display:flex;align-items:center;flex:1}.ob-step-pill{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-tertiary);font-weight:600}.ob-step-pill.current{color:var(--accent-600)}.ob-step-dot{width:24px;height:24px;border-radius:50%;background:var(--bg-chip);color:var(--text-tertiary);display:grid;place-items:center;font-size:11px;font-weight:700;border:2px solid var(--border-default);transition:all .2s ease}.ob-step-dot.done{background:var(--success);color:#fff;border-color:var(--success)}.ob-step-dot.current{background:var(--accent-500);color:#fff;border-color:var(--accent-500);box-shadow:0 0 0 4px var(--accent-100)}:root[data-theme=dark] .ob-step-dot.current{box-shadow:0 0 0 4px #7c3aed40}.ob-step-line{flex:1;height:2px;background:var(--border-subtle);margin:0 12px;min-width:24px}.ob-step-line.done{background:var(--success)}.ob-close{width:32px;height:32px;border-radius:var(--r-sm);display:grid;place-items:center;background:transparent;border:none;color:var(--text-secondary);cursor:pointer;transition:all .12s;font-family:inherit}.ob-close:hover{background:var(--bg-hover);color:var(--text-primary)}.ob-body{flex:1;overflow-y:auto;padding:36px 48px}.ob-step{display:flex;flex-direction:column;align-items:center;text-align:center}.ob-step-emoji{font-size:56px;margin-bottom:12px;animation:ob-floaty 3s ease-in-out infinite}@keyframes ob-floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.ob-step-title{font-family:Playfair Display,serif;font-size:32px;font-weight:700;letter-spacing:-.02em;color:var(--text-primary);margin-bottom:6px}.ob-step-sub{font-size:14px;color:var(--text-secondary);margin-bottom:32px;max-width:520px;line-height:1.5}.ob-format-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%}.ob-format{position:relative;padding:18px 14px;background:var(--bg-panel);border:1.5px solid var(--border-subtle);border-radius:var(--r-md);display:flex;flex-direction:column;align-items:center;gap:8px;transition:all .18s ease;text-align:center;cursor:pointer;font-family:inherit;color:inherit}.ob-format:hover{border-color:var(--accent-500);transform:translateY(-2px);box-shadow:var(--shadow-md)}.ob-format.is-active{border-color:var(--accent-500);background:var(--accent-50);box-shadow:0 0 0 3px var(--accent-100)}:root[data-theme=dark] .ob-format.is-active{background:#7c3aed1a;box-shadow:0 0 0 3px #7c3aed33}.ob-format.is-custom{background:var(--bg-chip);border-style:dashed}.ob-format-badge{position:absolute;top:-8px;right:10px;padding:2px 8px;background:var(--accent-500);color:#fff;border-radius:var(--r-pill);font-size:10px;font-weight:700;letter-spacing:.05em}.ob-format-preview{width:60px;background:linear-gradient(135deg,var(--accent-100),var(--accent-300));border-radius:var(--r-xs);margin-bottom:4px;border:1px solid var(--accent-300);max-height:76px}.ob-format.is-custom .ob-format-preview{background:transparent;border:1.5px dashed var(--border-strong)}.ob-format-name{font-size:14px;font-weight:700;color:var(--text-primary)}.ob-format-sub{font-size:11px;color:var(--text-tertiary);line-height:1.4}.ob-event-types{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;margin-bottom:28px}.ob-event-type{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--bg-panel);border:1.5px solid var(--border-subtle);border-radius:var(--r-md);font-size:13px;font-weight:600;color:var(--text-primary);transition:all .15s ease;text-align:left;cursor:pointer;font-family:inherit}.ob-event-type:hover{border-color:var(--border-strong)}.ob-event-emoji{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:18px;color:#fff}.ob-field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:100%;text-align:left}.ob-field{display:flex;flex-direction:column;gap:6px}.ob-field-label{font-size:11px;font-weight:700;color:var(--text-secondary);letter-spacing:.06em;text-transform:uppercase}.ob-input{height:40px;padding:0 12px;background:var(--bg-chip);border:1px solid transparent;border-radius:var(--r-sm);font-size:14px;color:var(--text-primary);font-family:inherit;width:100%;transition:all .15s ease}.ob-input:focus{outline:none;background:var(--bg-panel);border-color:var(--accent-500);box-shadow:0 0 0 3px var(--accent-100)}.ob-helper{font-size:11px;color:var(--text-tertiary);margin-top:2px}.ob-segmented{display:inline-flex;background:var(--bg-chip);border-radius:var(--r-sm);padding:3px;height:40px;width:100%}.ob-segmented button{flex:1;border:none;background:transparent;border-radius:var(--r-xs);font-size:13px;font-weight:600;color:var(--text-secondary);cursor:pointer;transition:all .12s ease;font-family:inherit}.ob-segmented button.active{background:var(--bg-panel);color:var(--accent-600);box-shadow:var(--shadow-xs)}.ob-style-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;width:100%;margin-bottom:24px}.ob-style{display:flex;flex-direction:column;gap:6px;text-align:center;padding:8px;border-radius:var(--r-md);transition:transform .18s ease;cursor:pointer;background:transparent;border:none;font-family:inherit;color:inherit}.ob-style:hover{transform:translateY(-3px)}.ob-style.is-active{background:var(--accent-50)}:root[data-theme=dark] .ob-style.is-active{background:#7c3aed1a}.ob-style-preview{aspect-ratio:4/6;border-radius:var(--r-sm);border:1px solid var(--border-subtle);overflow:hidden;position:relative;margin-bottom:6px;display:grid;place-items:center;color:#fff;font-family:Playfair Display,serif;font-style:italic;padding:12px;font-size:14px;text-align:center;line-height:1.2}.ob-style.is-active .ob-style-preview{border-color:var(--accent-500);box-shadow:0 0 0 3px var(--accent-200)}.ob-style-selected{position:absolute;top:8px;right:8px;width:24px;height:24px;background:var(--accent-500);border-radius:50%;color:#fff;display:grid;place-items:center;box-shadow:0 4px 12px #7c3aed66}.ob-style-name{font-size:13px;font-weight:700;color:var(--text-primary)}.ob-style-sub{font-size:11px;color:var(--text-tertiary)}.ob-ai-banner{display:flex;align-items:center;gap:14px;padding:14px 18px;background:linear-gradient(135deg,var(--accent-50),rgba(236,72,153,.08));border:1px solid var(--accent-300);border-radius:var(--r-md);text-align:left;width:100%}:root[data-theme=dark] .ob-ai-banner{background:linear-gradient(135deg,#7c3aed1f,#ec489914)}.ob-ai-glyph{width:40px;height:40px;background:linear-gradient(135deg,#9763ff,#ec4899);color:#fff;border-radius:10px;display:grid;place-items:center;flex-shrink:0;box-shadow:0 6px 16px #7c3aed4d}.ob-ai-title{font-weight:700;font-size:13px;color:var(--text-primary)}.ob-ai-sub{font-size:12px;color:var(--text-secondary);margin-top:2px}.ob-foot{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-top:1px solid var(--border-subtle);background:var(--bg-app);flex-shrink:0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px;-webkit-transition:background var(--transition-fast);transition:background var(--transition-fast)}::-webkit-scrollbar-thumb:hover{background:var(--color-border-hover)}.font-loader{position:fixed;inset:0;background:linear-gradient(135deg,var(--color-primary) 0%,#5856d6 100%);display:flex;align-items:center;justify-content:center;z-index:var(--z-toast);transition:opacity var(--transition-normal)}.font-loader.hidden{opacity:0;pointer-events:none}.font-loader-content{text-align:center;color:#fff}.spinner{width:60px;height:60px;border:4px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto var(--spacing-6)}@keyframes spin{to{transform:rotate(360deg)}}.font-loader-content h2{font-size:24px;font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-2)}.font-loader-content p{font-size:14px;opacity:.9;margin-bottom:var(--spacing-4)}.progress-bar-container{width:300px;height:6px;background:#fff3;border-radius:3px;overflow:hidden;margin:0 auto}.progress-bar{height:100%;background:#fff;border-radius:3px;transition:width var(--transition-normal);width:0}.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:var(--spacing-2)}.sidebar.collapsed .tool-grid{grid-template-columns:1fr}.tool-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-1);padding:var(--spacing-4);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:12px;font-weight:var(--font-weight-medium);min-height:80px;transition:all var(--transition-fast);cursor:pointer}.tool-btn:hover{background:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.tool-btn:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.tool-btn i{width:24px;height:24px}.sidebar.collapsed .tool-btn{min-height:48px;padding:var(--spacing-3)}.sidebar.collapsed .tool-btn span{display:none}.tool-shortcut{background:var(--color-bg-tertiary);color:var(--color-text-tertiary);padding:2px 4px;border-radius:3px;font-size:10px;font-weight:var(--font-weight-medium);margin-top:var(--spacing-1)}.action-list{display:flex;flex-direction:column;gap:var(--spacing-2)}.action-btn{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:14px;font-weight:var(--font-weight-medium);text-align:left;cursor:pointer;transition:all var(--transition-fast)}.action-btn:hover{background:var(--color-bg-tertiary);border-color:var(--color-border-hover);transform:translate(2px)}.action-btn:active{transform:translate(0)}.sidebar.collapsed .action-btn span{display:none}.sidebar.collapsed .action-btn{justify-content:center;padding:var(--spacing-3)}.action-shortcut{background:var(--color-bg-tertiary);color:var(--color-text-tertiary);padding:2px 6px;border-radius:3px;font-size:10px;font-weight:var(--font-weight-medium);margin-left:auto}.export-dropdown-wrapper{position:relative}.dropdown-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:200px;background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:8px;z-index:var(--z-dropdown);opacity:1;visibility:visible;transform:translateY(0);transition:all var(--transition-fast)}.dropdown-menu.hidden{opacity:0;visibility:hidden;transform:translateY(-10px);pointer-events:none}.dropdown-menu.open{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-item{width:100%;display:flex;align-items:center;gap:var(--spacing-3);padding:10px 12px;border-radius:var(--radius-sm);font-size:14px;color:var(--color-text-primary);text-align:left;cursor:pointer;transition:background var(--transition-fast)}.dropdown-item:hover{background:var(--color-bg-secondary)}.dropdown-divider{height:1px;background:var(--color-border);margin:8px 0}.chevron{width:16px;height:16px;margin-left:-4px;transition:transform var(--transition-fast)}.dropdown-menu.open .chevron{transform:rotate(180deg)}.layers-panel{background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:var(--spacing-4)}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4) var(--spacing-6);background:var(--color-bg-secondary);border-bottom:1px solid var(--color-border)}.panel-title{font-size:15px;font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.panel-actions{display:flex;align-items:center;gap:var(--spacing-2)}.layers-list{max-height:300px;overflow-y:auto}.layer-item{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);border-bottom:1px solid var(--color-border);cursor:pointer;transition:background var(--transition-fast)}.layer-item:hover{background:var(--color-bg-secondary)}.layer-item:last-child{border-bottom:none}.layer-icon{width:32px;height:32px;border-radius:var(--radius-sm);background:var(--color-bg-secondary);display:flex;align-items:center;justify-content:center;color:var(--color-text-secondary)}.layer-info{flex:1;display:flex;flex-direction:column;gap:2px}.layer-name{font-size:13px;font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.layer-type{font-size:11px;color:var(--color-text-tertiary)}.layer-controls{display:flex;gap:var(--spacing-1)}.btn-xs{width:24px;height:24px;padding:0;font-size:12px}.canvas-grid{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.6;transition:opacity var(--transition-fast)}.canvas-grid.active{opacity:.8}.canvas-grid-line{position:absolute;background:#007aff66;border:1px solid rgba(0,122,255,.2)}.canvas-grid-line.vertical{width:1px;height:100%}.canvas-grid-line.horizontal{height:1px;width:100%}@media(max-width:768px){.tool-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-2)}.tool-btn{min-height:60px;padding:var(--spacing-3)}.sidebar.collapsed .tool-grid{grid-template-columns:1fr}.canvas-controls{position:fixed;bottom:var(--spacing-4);right:var(--spacing-4);top:auto;flex-direction:column;gap:var(--spacing-2)}.zoom-control{flex-direction:row}}@media(max-width:480px){.tool-grid{grid-template-columns:1fr}.tool-btn{min-height:48px;flex-direction:row;justify-content:flex-start;padding:var(--spacing-2) var(--spacing-3)}.tool-btn i{width:20px;height:20px}.tool-btn span{margin-left:var(--spacing-2)}}[data-theme=dark] .tool-btn{background:var(--color-bg-secondary);border-color:var(--color-border)}[data-theme=dark] .tool-btn:hover{background:var(--color-primary-light);border-color:var(--color-primary)}[data-theme=dark] .action-btn{background:var(--color-bg-secondary);border-color:var(--color-border)}[data-theme=dark] .action-btn:hover{background:var(--color-bg-tertiary)}[data-theme=dark] .layer-item{border-color:var(--color-border)}[data-theme=dark] .layer-item:hover{background:var(--color-bg-secondary)}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(prefers-contrast:high){:root{--color-border: #000000;--color-border-hover: #000000;--color-text-primary: #000000;--color-bg-primary: #ffffff}[data-theme=dark]{--color-border: #ffffff;--color-border-hover: #ffffff;--color-text-primary: #ffffff;--color-bg-primary: #000000}}@media print{.sidebar,.canvas-controls,.canvas-info-bar{display:none!important}.app-canvas{padding:0!important}.canvas-wrapper{box-shadow:none!important;border-radius:0!important}}.placeholder\:text-gray-400::-moz-placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.placeholder\:text-gray-400::placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.hover\:border-gray-400:hover{--tw-border-opacity: 1;border-color:rgb(156 163 175 / var(--tw-border-opacity, 1))}.hover\:border-primary:hover{--tw-border-opacity: 1;border-color:rgb(99 102 241 / var(--tw-border-opacity, 1))}.hover\:bg-amber-100:hover{--tw-bg-opacity: 1;background-color:rgb(254 243 199 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-100:hover{--tw-bg-opacity: 1;background-color:rgb(219 234 254 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-600:hover{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1))}.hover\:bg-gray-100:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.hover\:bg-gray-200:hover{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1))}.hover\:bg-gray-50:hover{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.hover\:bg-green-100:hover{--tw-bg-opacity: 1;background-color:rgb(220 252 231 / var(--tw-bg-opacity, 1))}.hover\:bg-green-600:hover{--tw-bg-opacity: 1;background-color:rgb(22 163 74 / var(--tw-bg-opacity, 1))}.hover\:bg-red-100:hover{--tw-bg-opacity: 1;background-color:rgb(254 226 226 / var(--tw-bg-opacity, 1))}.hover\:bg-red-600:hover{--tw-bg-opacity: 1;background-color:rgb(220 38 38 / var(--tw-bg-opacity, 1))}.hover\:bg-white\/10:hover{background-color:#ffffff1a}.hover\:bg-white\/50:hover{background-color:#ffffff80}.hover\:text-gray-900:hover{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.hover\:opacity-100:hover{opacity:1}.hover\:opacity-80:hover{opacity:.8}.hover\:shadow-md:hover{--tw-shadow: 0 4px 6px rgba(0, 0, 0, .07);--tw-shadow-colored: 0 4px 6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.focus\:border-blue-500:focus{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}.focus\:border-transparent:focus{border-color:transparent}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-blue-200:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(191 219 254 / var(--tw-ring-opacity, 1))}.focus\:ring-blue-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1))}.focus\:ring-red-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity, 1))}.focus-visible\:outline-2:focus-visible{outline-width:2px}.focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\:outline-blue-500:focus-visible{outline-color:#3b82f6}.active\:scale-\[0\.95\]:active{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.active\:scale-\[0\.98\]:active{--tw-scale-x: .98;--tw-scale-y: .98;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.active\:bg-blue-700:active{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity, 1))}.active\:bg-gray-200:active{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity, 1))}.active\:bg-green-700:active{--tw-bg-opacity: 1;background-color:rgb(21 128 61 / var(--tw-bg-opacity, 1))}.active\:bg-red-700:active{--tw-bg-opacity: 1;background-color:rgb(185 28 28 / var(--tw-bg-opacity, 1))}.disabled\:transform-none:disabled{transform:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-gray-50:disabled{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.disabled\:opacity-60:disabled{opacity:.6}