:root{--md-sys-color-primary:#d0bcff;--md-sys-color-on-primary:#381e72;--md-sys-color-primary-container:#4f378b;--md-sys-color-on-primary-container:#eaddff;--md-sys-color-secondary:#ccc2dc;--md-sys-color-on-secondary:#332d41;--md-sys-color-secondary-container:#4a4458;--md-sys-color-on-secondary-container:#e8def8;--md-sys-color-tertiary:#efb8c8;--md-sys-color-on-tertiary:#492532;--md-sys-color-tertiary-container:#633b48;--md-sys-color-on-tertiary-container:#ffd8e4;--md-sys-color-error:#f2b8b5;--md-sys-color-on-error:#601410;--md-sys-color-error-container:#8c1d18;--md-sys-color-on-error-container:#f9dedc;--md-sys-color-surface:#141218;--md-sys-color-on-surface:#e6e0e9;--md-sys-color-surface-variant:#49454f;--md-sys-color-on-surface-variant:#cac4d0;--md-sys-color-surface-container-lowest:#0f0d13;--md-sys-color-surface-container-low:#1d1b20;--md-sys-color-surface-container:#211f26;--md-sys-color-surface-container-high:#2b2930;--md-sys-color-surface-container-highest:#36343b;--md-sys-color-outline:#938f99;--md-sys-color-outline-variant:#49454f;--md-sys-color-inverse-surface:#e6e0e9;--md-sys-color-inverse-on-surface:#322f35;--md-sys-color-inverse-primary:#6750a4;--md-sys-color-background:#141218;--md-sys-color-on-background:#e6e0e9;--md-sys-color-scrim:#000;--md-sys-color-success:#a8dab5;--md-sys-color-on-success:#003920;--md-sys-color-success-container:#005233;--md-sys-color-on-success-container:#c4f0d6;--md-sys-typescale-display-large:700 57px/64px var(--md-sys-typescale-font);--md-sys-typescale-display-medium:700 45px/52px var(--md-sys-typescale-font);--md-sys-typescale-display-small:600 36px/44px var(--md-sys-typescale-font);--md-sys-typescale-headline-large:600 32px/40px var(--md-sys-typescale-font);--md-sys-typescale-headline-medium:600 28px/36px var(--md-sys-typescale-font);--md-sys-typescale-headline-small:600 24px/32px var(--md-sys-typescale-font);--md-sys-typescale-title-large:500 22px/28px var(--md-sys-typescale-font);--md-sys-typescale-title-medium:500 16px/24px var(--md-sys-typescale-font);--md-sys-typescale-title-small:500 14px/20px var(--md-sys-typescale-font);--md-sys-typescale-body-large:400 16px/24px var(--md-sys-typescale-font);--md-sys-typescale-body-medium:400 14px/20px var(--md-sys-typescale-font);--md-sys-typescale-body-small:400 12px/16px var(--md-sys-typescale-font);--md-sys-typescale-label-large:500 14px/20px var(--md-sys-typescale-font);--md-sys-typescale-label-medium:500 12px/16px var(--md-sys-typescale-font);--md-sys-typescale-label-small:500 11px/16px var(--md-sys-typescale-font);--md-sys-typescale-font:"Outfit", "Inter", system-ui, -apple-system, sans-serif;--md-sys-typescale-font-mono:"JetBrains Mono", ui-monospace, monospace;--md-sys-shape-none:0px;--md-sys-shape-extra-small:4px;--md-sys-shape-small:8px;--md-sys-shape-medium:12px;--md-sys-shape-large:16px;--md-sys-shape-extra-large:28px;--md-sys-shape-full:9999px;--md-sys-elevation-0:none;--md-sys-elevation-1:0px 1px 3px 1px #00000026, 0px 1px 2px 0px #0000004d;--md-sys-elevation-2:0px 2px 6px 2px #00000026, 0px 1px 2px 0px #0000004d;--md-sys-elevation-3:0px 4px 8px 3px #00000026, 0px 1px 3px 0px #0000004d;--md-sys-elevation-4:0px 6px 10px 4px #00000026, 0px 2px 3px 0px #0000004d;--md-sys-elevation-5:0px 8px 12px 6px #00000026, 0px 4px 4px 0px #0000004d;--md-sys-motion-easing-emphasized:cubic-bezier(.2, 0, 0, 1);--md-sys-motion-easing-emphasized-decelerate:cubic-bezier(.05, .7, .1, 1);--md-sys-motion-easing-emphasized-accelerate:cubic-bezier(.3, 0, .8, .15);--md-sys-motion-easing-standard:cubic-bezier(.2, 0, 0, 1);--md-sys-motion-easing-standard-decelerate:cubic-bezier(0, 0, 0, 1);--md-sys-motion-easing-standard-accelerate:cubic-bezier(.3, 0, 1, 1);--md-sys-motion-duration-short1:50ms;--md-sys-motion-duration-short2:.1s;--md-sys-motion-duration-short3:.15s;--md-sys-motion-duration-short4:.2s;--md-sys-motion-duration-medium1:.25s;--md-sys-motion-duration-medium2:.3s;--md-sys-motion-duration-medium3:.35s;--md-sys-motion-duration-medium4:.4s;--md-sys-motion-duration-long1:.45s;--md-sys-motion-duration-long2:.5s;--md-sys-motion-duration-long3:.55s;--md-sys-motion-duration-long4:.6s;--md-sys-state-hover-opacity:.08;--md-sys-state-focus-opacity:.12;--md-sys-state-pressed-opacity:.12;--md-sys-state-dragged-opacity:.16;--bg-main:var(--md-sys-color-background);--bg-sidebar:var(--md-sys-color-surface-container);--bg-workspace:var(--md-sys-color-surface-container-low);--bg-card:var(--md-sys-color-surface-container-high);--bg-input:var(--md-sys-color-surface-container-highest);--accent:var(--md-sys-color-primary);--accent-hover:var(--md-sys-color-primary);--accent-light:#d0bcff1f;--accent-border:#d0bcff4d;--text-primary:var(--md-sys-color-on-surface);--text-secondary:var(--md-sys-color-on-surface-variant);--text-muted:var(--md-sys-color-outline);--border:var(--md-sys-color-outline-variant);--border-light:#49454f80;--danger:var(--md-sys-color-error);--danger-hover:var(--md-sys-color-error-container);--success:var(--md-sys-color-success);--success-hover:var(--md-sys-color-success-container);--sans:var(--md-sys-typescale-font);--mono:var(--md-sys-typescale-font-mono)}body{background-color:var(--md-sys-color-background);color:var(--md-sys-color-on-background);font-family:var(--md-sys-typescale-font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:100vh;margin:0;font-size:14px;line-height:20px;overflow:hidden}#app{flex-direction:column;height:100vh;display:flex}#app:has(.dropzone-container){overflow:hidden auto}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--md-sys-color-on-surface-variant);border-radius:var(--md-sys-shape-full);background-clip:content-box;border:2px solid #0000}::-webkit-scrollbar-thumb:hover{background:var(--md-sys-color-outline);background-clip:content-box}#app{flex-direction:column;width:100vw;height:100vh;display:flex;overflow:hidden}.editor-header{background-color:var(--md-sys-color-surface-container);border-bottom:1px solid var(--md-sys-color-outline-variant);z-index:10;justify-content:space-between;align-items:center;gap:8px;height:64px;padding:0 16px;display:flex}.logo-section{align-items:center;display:flex}.logo-icon{border-radius:10px;width:40px;height:40px}.header-center{align-items:center;gap:8px;display:flex}.header-btn-group{align-items:center;gap:2px;display:flex}.header-btn-group--spaced{gap:8px}.header-right{align-items:center;gap:8px;display:flex}.editor-body{flex:1;justify-content:center;min-height:0;display:flex;position:relative;overflow:hidden}.editor-body:has(.dropzone-container){justify-content:stretch;overflow:hidden auto}.left-toolbar{background-color:var(--md-sys-color-surface-container);border-right:1px solid var(--md-sys-color-outline-variant);z-index:5;flex-direction:column;align-items:center;gap:4px;width:80px;padding:12px 0;display:flex}.toolbar-btn{border-radius:var(--md-sys-shape-full);width:56px;height:32px;color:var(--md-sys-color-on-surface-variant);cursor:pointer;transition:all var(--md-sys-motion-duration-short4) var(--md-sys-motion-easing-standard);background:0 0;border:none;justify-content:center;align-items:center;gap:4px;font-size:12px;font-weight:500;display:flex;position:relative}.toolbar-btn:hover{color:var(--md-sys-color-on-surface);background-color:#d0bcff14}.toolbar-btn.active{background-color:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.toolbar-btn .tooltip{background-color:var(--md-sys-color-inverse-surface);color:var(--md-sys-color-inverse-on-surface);border-radius:var(--md-sys-shape-extra-small);white-space:nowrap;pointer-events:none;opacity:0;transition:all var(--md-sys-motion-duration-short4) var(--md-sys-motion-easing-standard);box-shadow:var(--md-sys-elevation-2);padding:6px 12px;font-size:12px;font-weight:500;position:absolute;left:68px;transform:translate(-5px)}.toolbar-btn:hover .tooltip{opacity:1;transform:translate(0)}.toolbar-spacer{flex:1}.side-panel{background-color:var(--md-sys-color-surface-container-low);border-right:1px solid var(--md-sys-color-outline-variant);z-index:4;flex-direction:column;width:320px;display:flex}.panel-header{border-bottom:1px solid var(--md-sys-color-outline-variant);padding:16px}.panel-header h2{font:var(--md-sys-typescale-title-medium);color:var(--md-sys-color-on-surface);margin:0}.panel-header p{font:var(--md-sys-typescale-body-small);color:var(--md-sys-color-on-surface-variant);margin:4px 0 0}.panel-content{flex-direction:column;flex:1;gap:20px;padding:20px;display:flex;overflow-y:auto}.workspace-container{background-color:var(--bg-workspace);cursor:grab;touch-action:none;flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.workspace-container:active{cursor:grabbing}.canvas-wrapper{-webkit-user-select:none;user-select:none;background-image:linear-gradient(45deg,#24242b 25%,#0000 25%),linear-gradient(-45deg,#24242b 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#24242b 75%),linear-gradient(-45deg,#0000 75%,#24242b 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;position:relative;box-shadow:0 10px 30px #00000080}.canvas-wrapper canvas{width:100%;height:100%;display:block}.btn{border-radius:var(--md-sys-shape-full);height:40px;font:var(--md-sys-typescale-label-large);font-family:var(--md-sys-typescale-font);background-color:var(--md-sys-color-surface-container-highest);color:var(--md-sys-color-on-surface);cursor:pointer;transition:all var(--md-sys-motion-duration-short4) var(--md-sys-motion-easing-standard);border:none;justify-content:center;align-items:center;gap:8px;padding:0 24px;display:inline-flex;position:relative;overflow:hidden}.btn:before{content:"";background-color:var(--md-sys-color-on-surface);opacity:0;transition:opacity var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);position:absolute;inset:0}.btn:hover:not(:disabled):before{opacity:var(--md-sys-state-hover-opacity)}.btn:active:not(:disabled):before{opacity:var(--md-sys-state-pressed-opacity)}.btn:disabled{opacity:.38;cursor:not-allowed}.btn-primary{background-color:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary)}.btn-primary:before{background-color:var(--md-sys-color-on-primary)}.btn-danger{background-color:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container)}.btn-danger:before{background-color:var(--md-sys-color-on-error-container)}.btn-success{background-color:var(--md-sys-color-success-container);color:var(--md-sys-color-on-success-container)}.btn-success:before{background-color:var(--md-sys-color-on-success-container)}.btn-icon-only{width:40px;padding:0}.dropzone-container{box-sizing:border-box;background-color:var(--md-sys-color-surface-container-lowest);flex-direction:column;justify-content:flex-start;align-items:center;width:100%;max-width:100%;padding:24px;display:flex;overflow-x:hidden}.dropzone-box{border:2px dashed var(--md-sys-color-outline-variant);border-radius:var(--md-sys-shape-extra-large);text-align:center;box-sizing:border-box;background-color:var(--md-sys-color-surface-container);max-width:480px;transition:all var(--md-sys-motion-duration-medium2) var(--md-sys-motion-easing-emphasized);cursor:pointer;padding:48px}.dropzone-box:hover,.dropzone-box.dragover{border-color:var(--md-sys-color-primary);background-color:var(--md-sys-color-surface-container-high);box-shadow:var(--md-sys-elevation-1);transform:translateY(-2px)}.drop-icon-wrapper{border-radius:var(--md-sys-shape-extra-large);background-color:var(--md-sys-color-primary-container);width:80px;height:80px;transition:all var(--md-sys-motion-duration-medium2) var(--md-sys-motion-easing-emphasized);justify-content:center;align-items:center;margin:0 auto 20px;display:flex}.dropzone-box:hover .drop-icon-wrapper{background-color:var(--md-sys-color-primary);transform:scale(1.05)}.dropzone-box:hover .drop-icon-wrapper svg{color:var(--md-sys-color-on-primary)}.drop-title{font:var(--md-sys-typescale-title-large);color:var(--md-sys-color-on-surface);margin-bottom:8px}.drop-subtitle{font:var(--md-sys-typescale-body-medium);color:var(--md-sys-color-on-surface-variant)}.home-color-dropdown{background-color:var(--md-sys-color-surface-container-high);border:1px solid var(--md-sys-color-outline-variant);border-radius:var(--md-sys-shape-medium);z-index:100;flex-direction:column;gap:8px;margin-top:4px;padding:12px;display:flex;position:absolute;top:100%;left:0;right:0;box-shadow:0 8px 24px #0006}.home-color-presets{grid-template-columns:repeat(6,1fr);gap:6px;margin-top:4px;display:grid}.home-color-swatch{aspect-ratio:1;cursor:pointer;border:2px solid #0000;border-radius:8px;width:100%;transition:all .15s}.home-color-swatch:hover{border-color:var(--md-sys-color-outline);transform:scale(1.15)}.dropzone-box h3{margin:0 0 8px;font-size:20px;font-weight:600}.dropzone-box p{color:var(--text-secondary);margin:0 0 24px;font-size:14px}.preset-samples{text-align:center;margin-top:36px}.preset-samples p{color:var(--text-muted);margin-bottom:12px;font-size:13px}.sample-grid{justify-content:center;gap:12px;display:flex}.sample-card{cursor:pointer;border:2px solid #0000;border-radius:8px;width:100px;height:70px;transition:all .2s;position:relative;overflow:hidden}.sample-card img{object-fit:cover;width:100%;height:100%}.sample-card span{color:#fff;background:#000000b3;padding:3px 0;font-size:10px;font-weight:500;position:absolute;bottom:0;left:0;right:0}.sample-card:hover{border-color:var(--accent-hover);transform:scale(1.05)}.slider-group{flex-direction:column;gap:8px;display:flex}.slider-label{font:var(--md-sys-typescale-label-medium);color:var(--md-sys-color-on-surface-variant);justify-content:space-between;display:flex}.slider-label span:last-child{color:var(--md-sys-color-primary);font-family:var(--md-sys-typescale-font-mono);font-size:12px}.slider-input-wrapper{align-items:center;gap:12px;display:flex}.slider-input-wrapper input[type=range]{appearance:none;background:var(--md-sys-color-surface-container-highest);border-radius:var(--md-sys-shape-full);outline:none;flex:1;height:4px}.slider-input-wrapper input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--md-sys-color-primary);cursor:pointer;width:20px;height:20px;box-shadow:var(--md-sys-elevation-1);transition:transform var(--md-sys-motion-duration-short2) var(--md-sys-motion-easing-standard), box-shadow var(--md-sys-motion-duration-short2) var(--md-sys-motion-easing-standard);border:none;border-radius:50%}.slider-input-wrapper input[type=range]::-webkit-slider-thumb:hover{box-shadow:var(--md-sys-elevation-2);transform:scale(1.1)}.slider-input-wrapper input[type=range]::-webkit-slider-thumb:active{box-shadow:var(--md-sys-elevation-3);transform:scale(1.2)}.slider-reset-btn{border-radius:var(--md-sys-shape-full);width:32px;height:32px;color:var(--md-sys-color-on-surface-variant);cursor:pointer;transition:all var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.slider-reset-btn:hover{color:var(--md-sys-color-on-surface);background-color:#d0bcff14}.adjustment-color-row{background-color:var(--md-sys-color-surface-container);border-radius:var(--md-sys-shape-small);justify-content:space-between;align-items:center;gap:8px;margin-top:8px;padding:8px 12px;display:flex}.adjustment-color-label{font:var(--md-sys-typescale-label-small);color:var(--md-sys-color-on-surface-variant);text-transform:uppercase;letter-spacing:.05em}.adjustment-color-picker{appearance:none;border:2px solid var(--md-sys-color-outline-variant);border-radius:var(--md-sys-shape-extra-small);cursor:pointer;width:28px;height:22px;transition:border-color var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);background:0 0;flex-shrink:0;padding:0}.adjustment-color-picker:hover{border-color:var(--md-sys-color-outline)}.adjustment-color-picker::-webkit-color-swatch-wrapper{padding:0}.adjustment-color-picker::-webkit-color-swatch{border:none;border-radius:2px}.filter-category{flex-direction:column;gap:8px;display:flex}.filter-category-header{font:var(--md-sys-typescale-label-small);color:var(--md-sys-color-on-surface-variant);text-transform:uppercase;letter-spacing:.08em;border-top:1px solid var(--md-sys-color-outline-variant);margin-top:8px;padding:8px 0 0}.filter-category:first-child .filter-category-header{border-top:none;margin-top:0;padding-top:0}.filters-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.filter-preset-card{border-radius:var(--md-sys-shape-medium);background-color:var(--md-sys-color-surface-container);border:1px solid var(--md-sys-color-outline-variant);cursor:pointer;transition:all var(--md-sys-motion-duration-short4) var(--md-sys-motion-easing-standard);flex-direction:column;display:flex;overflow:hidden}.filter-preset-card:hover{border-color:var(--md-sys-color-outline);box-shadow:var(--md-sys-elevation-1);transform:translateY(-2px)}.filter-preset-card.active{border-color:var(--md-sys-color-primary);background-color:var(--md-sys-color-primary-container)}.filter-preview-box{background-color:var(--md-sys-color-surface-container-highest);width:100%;height:80px;overflow:hidden}.filter-preview-box img{object-fit:cover;width:100%;height:100%}.filter-name{font:var(--md-sys-typescale-label-medium);font-family:var(--md-sys-typescale-font);text-align:center;color:var(--md-sys-color-on-surface);padding:10px 8px}.crop-presets{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.crop-ratio-btn{border-radius:var(--md-sys-shape-small);font:var(--md-sys-typescale-label-small);font-family:var(--md-sys-typescale-font);background-color:var(--md-sys-color-surface-container);border:1px solid var(--md-sys-color-outline-variant);color:var(--md-sys-color-on-surface-variant);cursor:pointer;transition:all var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:10px 4px;display:flex;position:relative;overflow:hidden}.crop-ratio-btn:before{content:"";background-color:var(--md-sys-color-on-surface);opacity:0;transition:opacity var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);position:absolute;inset:0}.crop-ratio-btn:hover:before{opacity:var(--md-sys-state-hover-opacity)}.crop-ratio-btn:hover{border-color:var(--md-sys-color-outline)}.crop-ratio-btn.active{background-color:var(--md-sys-color-secondary-container);border-color:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.crop-ratio-btn.active:before{opacity:0}.crop-icon-shape{border:1.5px solid;border-radius:2px;margin-bottom:2px}.ratio-1-1{width:14px;height:14px}.ratio-16-9{width:20px;height:11px}.ratio-9-16{width:11px;height:20px}.ratio-4-3{width:18px;height:13px}.ratio-3-2{width:18px;height:12px}.ratio-2-3{width:12px;height:18px}.ratio-5-4{width:18px;height:14px}.ratio-4-5{width:14px;height:18px}.ratio-21-9{width:21px;height:9px}.ratio-9-21{width:9px;height:21px}.ratio-label{font-size:11px;font-weight:600;line-height:1}.ratio-name{opacity:.7;font-size:9px;line-height:1}.resolution-inputs{align-items:center;gap:8px;display:flex}.resolution-field{flex-direction:column;flex:1;gap:4px;display:flex}.resolution-field label{color:var(--text-secondary);font-size:10px}.resolution-input{border-radius:var(--md-sys-shape-small);border:1px solid var(--md-sys-color-outline-variant);background-color:var(--md-sys-color-surface-container);width:100%;height:32px;color:var(--md-sys-color-on-surface);font-size:12px;font-family:var(--md-sys-typescale-font);text-align:center;box-sizing:border-box;padding:0 8px}.resolution-input:focus{border-color:var(--md-sys-color-primary);outline:none}.resolution-x{color:var(--text-secondary);margin-top:16px;font-size:14px}.transform-actions{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.crop-actions-row{gap:10px;margin-top:auto;display:flex}.crop-actions-row button{flex:1}.crop-overlay{pointer-events:none;position:absolute;inset:0;overflow:visible}.crop-box{box-sizing:border-box;pointer-events:auto;cursor:move;border:1.5px solid #ffffffd9;position:absolute;overflow:visible;box-shadow:0 0 0 99999px #000000b3}.crop-handles-overlay{pointer-events:none;z-index:20;position:absolute;overflow:visible}.crop-handle{pointer-events:auto;z-index:10;background:0 0;position:absolute}.crop-handle.tl,.crop-handle.tr,.crop-handle.bl,.crop-handle.br{pointer-events:auto;z-index:10;background:0 0;border-radius:0;width:16px;height:16px;position:absolute}.crop-handle.tl{cursor:nwse-resize;border-top:4px solid #fff;border-left:4px solid #fff;border-top-left-radius:10px;top:-8px;left:-8px}.crop-handle.tr{cursor:nesw-resize;border-top:4px solid #fff;border-right:4px solid #fff;border-top-right-radius:10px;top:-8px;right:-8px}.crop-handle.bl{cursor:nesw-resize;border-bottom:4px solid #fff;border-left:4px solid #fff;border-bottom-left-radius:10px;bottom:-8px;left:-8px}.crop-handle.br{cursor:nwse-resize;border-bottom:4px solid #fff;border-right:4px solid #fff;border-bottom-right-radius:10px;bottom:-8px;right:-8px}.crop-handle.t,.crop-handle.b,.crop-handle.l,.crop-handle.r{background-color:#fff;box-shadow:0 0 2px #000000b3}.crop-handle.t,.crop-handle.b,.crop-handle.l,.crop-handle.r{transform:scale(var(--inv-zoom,1));background-color:#fff;box-shadow:0 0 2px #000000b3}.crop-handle.t{cursor:ns-resize;width:56px;height:4px;margin-left:-28px;top:-8px;left:50%}.crop-handle.b{cursor:ns-resize;width:56px;height:4px;margin-left:-28px;bottom:-8px;left:50%}.crop-handle.l{cursor:ew-resize;width:4px;height:56px;margin-top:-28px;top:50%;left:-8px}.crop-handle.r{cursor:ew-resize;width:4px;height:56px;margin-top:-28px;top:50%;right:-8px}.crop-handle.t{top:calc(-8px * var(--inv-zoom,1));cursor:ns-resize;border-radius:10px;left:50%}.crop-handle.b{top:calc(100% + 4px * var(--inv-zoom,1));cursor:ns-resize;border-radius:10px;left:50%}.crop-handle.l{left:calc(-8px * var(--inv-zoom,1));cursor:ew-resize;border-radius:10px;top:50%}.crop-handle.r{left:calc(100% + 4px * var(--inv-zoom,1));cursor:ew-resize;border-radius:10px;top:50%}.crop-handle.tl,.crop-handle.tr,.crop-handle.bl,.crop-handle.br{width:16px;height:16px}.crop-handle.t:after,.crop-handle.b:after{content:"";pointer-events:auto;width:56px;height:44px;position:absolute;left:0}.crop-handle.t:after{top:-17px}.crop-handle.b:after{bottom:-17px}.crop-handle.l:after,.crop-handle.r:after{content:"";pointer-events:auto;width:44px;height:56px;position:absolute;top:0}.crop-handle.l:after{left:-17px}.crop-handle.r:after{right:-17px}.crop-grid-h1,.crop-grid-h2,.crop-grid-v1,.crop-grid-v2{pointer-events:none;background-color:#ffffff40;position:absolute}.crop-grid-h1{height:1px;top:33.33%;left:0;right:0}.crop-grid-h2{height:1px;top:66.66%;left:0;right:0}.crop-grid-v1{width:1px;top:0;bottom:0;left:33.33%}.crop-grid-v2{width:1px;top:0;bottom:0;left:66.66%}.shape-btn{background-color:var(--bg-card);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:10px 0;font-size:11px;font-weight:500;transition:all .2s;display:flex}.shape-btn:hover{color:var(--text-primary);border-color:var(--text-secondary)}.shape-btn.active{background-color:var(--accent-light);border-color:var(--accent);color:var(--text-primary)}.color-presets-row{flex-wrap:wrap;gap:8px;display:flex}.color-circle{cursor:pointer;border:2px solid #0000;border-radius:50%;width:24px;height:24px;transition:all .1s;position:relative}.color-circle.active{border-color:#fff;transform:scale(1.15);box-shadow:0 0 6px #fff6}.fill-type-row{background-color:var(--bg-input);border:1px solid var(--border);border-radius:8px;grid-template-columns:repeat(4,1fr);gap:4px;padding:4px;display:grid}.fill-type-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:6px 4px;font-family:inherit;font-size:11px;font-weight:600;transition:all .15s}.fill-type-btn:hover:not(:disabled){color:var(--text-primary);background-color:#ffffff0a}.fill-type-btn.active{background-color:var(--accent);color:#fff;box-shadow:0 2px 6px #8b5cf659}.fill-type-btn:disabled{opacity:.4;cursor:not-allowed}.fill-subpanel{border:1px solid var(--border);background-color:#0000002e;border-radius:8px;flex-direction:column;gap:6px;margin-top:8px;padding:10px;display:flex}.seg-control{background-color:var(--bg-input);border:1px solid var(--border);box-sizing:border-box;border-radius:6px;gap:2px;width:100%;padding:2px;display:flex}.seg-btn{color:var(--text-secondary);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:4px;flex:1;padding:5px 6px;font-family:inherit;font-size:11px;font-weight:600;transition:all .15s}.seg-btn:hover:not(.active){color:var(--text-primary);background-color:#ffffff0a}.seg-btn.active{background-color:var(--bg-card);color:var(--accent);box-shadow:0 1px 3px #0000004d}.gradient-stop-row{align-items:center;gap:6px;display:flex}.gradient-stop-row input[type=color]{-webkit-appearance:none;border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:6px;flex-shrink:0;width:26px;height:26px;padding:0}.gradient-stop-row input[type=color]::-webkit-color-swatch-wrapper{padding:0}.gradient-stop-row input[type=color]::-webkit-color-swatch{border:none;border-radius:4px}.gradient-stop-row input[type=number]{text-align:center;font-variant-numeric:tabular-nums;background-color:var(--bg-input);border:1px solid var(--border);width:46px;height:26px;color:var(--text-primary);appearance:textfield;border-radius:4px;padding:0 4px;font-size:11px}.gradient-stop-row input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.gradient-stop-row input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.custom-color-picker{align-items:center;gap:10px;display:flex}.custom-color-picker input[type=color]{-webkit-appearance:none;cursor:pointer;background:0 0;border:none;border-radius:8px;width:32px;height:32px}.custom-color-picker input[type=color]::-webkit-color-swatch-wrapper{padding:0}.custom-color-picker input[type=color]::-webkit-color-swatch{border:1px solid var(--border);border-radius:8px}.text-layers-list{border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:8px;max-height:180px;padding:8px;display:flex;overflow-y:auto}.text-layer-item{background-color:var(--bg-card);cursor:pointer;border:1px solid #0000;border-radius:6px;justify-content:space-between;align-items:center;padding:8px 12px;transition:all .15s;display:flex}.text-layer-item:hover{border-color:var(--border)}.text-layer-item.active{background-color:var(--accent-light);border-color:var(--accent-border)}.layer-text-preview{white-space:nowrap;text-overflow:ellipsis;max-width:180px;font-size:13px;overflow:hidden}.layer-actions{gap:4px;display:flex}.layer-delete-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:4px}.layer-delete-btn:hover{color:var(--danger-hover)}.text-field-group{flex-direction:column;gap:6px;display:flex}.text-field-group label{color:var(--text-secondary);font-size:12px}.text-input{background-color:var(--md-sys-color-surface-container-highest);border:none;border-bottom:2px solid var(--md-sys-color-on-surface-variant);border-radius:var(--md-sys-shape-extra-small) var(--md-sys-shape-extra-small) 0 0;color:var(--md-sys-color-on-surface);font:var(--md-sys-typescale-body-large);font-family:var(--md-sys-typescale-font);transition:border-color var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);box-sizing:border-box;outline:none;width:100%;padding:16px 16px 12px}.text-input:focus{border-bottom-color:var(--md-sys-color-primary)}.text-input::placeholder{color:var(--md-sys-color-on-surface-variant)}.select-dropdown{background-color:var(--md-sys-color-surface-container-highest);border:none;border-bottom:2px solid var(--md-sys-color-on-surface-variant);border-radius:var(--md-sys-shape-extra-small) var(--md-sys-shape-extra-small) 0 0;color:var(--md-sys-color-on-surface);font:var(--md-sys-typescale-body-large);font-family:var(--md-sys-typescale-font);cursor:pointer;transition:border-color var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);box-sizing:border-box;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23cac4d0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;outline:none;width:100%;padding:12px 40px 12px 16px}.select-dropdown:focus{border-bottom-color:var(--md-sys-color-primary)}.modal-overlay{background-color:var(--md-sys-color-scrim);z-index:100;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--md-sys-color-surface-container-high);border-radius:var(--md-sys-shape-extra-large);width:100%;max-width:440px;box-shadow:var(--md-sys-elevation-3);flex-direction:column;gap:16px;padding:24px;display:flex}.modal-title{justify-content:space-between;align-items:center;margin:0;display:flex}.modal-title h3{font:var(--md-sys-typescale-headline-small);color:var(--md-sys-color-on-surface);margin:0}.modal-close-btn{border-radius:var(--md-sys-shape-full);width:40px;height:40px;color:var(--md-sys-color-on-surface-variant);cursor:pointer;transition:all var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.modal-close-btn:hover{color:var(--md-sys-color-on-surface);background-color:#d0bcff14}.modal-body{flex-direction:column;gap:16px;display:flex}.modal-footer{justify-content:flex-end;gap:8px;margin-top:8px;display:flex}.modal-footer button{min-width:80px}.toggle-group{border-radius:var(--md-sys-shape-full);border:1px solid var(--md-sys-color-outline);background-color:#0000;padding:0;display:flex;overflow:hidden}.toggle-item{text-align:center;font:var(--md-sys-typescale-label-large);font-family:var(--md-sys-typescale-font);cursor:pointer;color:var(--md-sys-color-on-surface);transition:all var(--md-sys-motion-duration-short4) var(--md-sys-motion-easing-standard);border-right:1px solid var(--md-sys-color-outline);border-radius:0;flex:1;padding:10px 16px;position:relative;overflow:hidden}.toggle-item:last-child{border-right:none}.toggle-item:hover{background-color:#d0bcff14}.toggle-item.active{background-color:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container)}.zoom-controls{background-color:var(--md-sys-color-surface-container-high);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--md-sys-shape-full);z-index:5;box-shadow:var(--md-sys-elevation-2);align-items:center;gap:4px;padding:4px;display:flex;position:absolute;bottom:12px;left:50%;transform:translate(-50%)}.zoom-percent{font:var(--md-sys-typescale-label-medium);font-family:var(--md-sys-typescale-font-mono);text-align:center;min-width:48px;color:var(--md-sys-color-on-surface);padding:0 12px}.checkbox-row{color:var(--text-secondary);cursor:pointer;align-items:center;gap:8px;font-size:13px;font-weight:500;display:flex}.checkbox-row input{cursor:pointer}.alignment-guide-v{background-color:var(--accent);width:1px;box-shadow:0 0 6px var(--accent);pointer-events:none;z-index:1000;position:absolute;top:0;bottom:0}.alignment-guide-h{background-color:var(--accent);height:1px;box-shadow:0 0 6px var(--accent);pointer-events:none;z-index:1000;position:absolute;left:0;right:0}.layer-selection-box{border:1.5px dashed var(--accent);box-sizing:border-box;z-index:100;pointer-events:none;position:absolute}.selection-handle{background-color:var(--text-primary);border:2px solid var(--accent);pointer-events:auto;box-sizing:border-box;width:12px;height:12px;transform:translate(-50%, -50%) scale(var(--inv-zoom,1));z-index:102;border-radius:50%;position:absolute;box-shadow:0 1px 3px #0006}.selection-handle:after{content:"";pointer-events:auto;width:60px;height:60px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.selection-handle.tl{cursor:nwse-resize;top:0;left:0}.selection-handle.tr{cursor:nesw-resize;top:0;left:100%}.selection-handle.bl{cursor:nesw-resize;top:100%;left:0}.selection-handle.br{cursor:nwse-resize;top:100%;left:100%}.selection-handle.t{cursor:ns-resize;top:0;left:50%}.selection-handle.b{cursor:ns-resize;top:100%;left:50%}.selection-handle.l{cursor:ew-resize;top:50%;left:0}.selection-handle.r{cursor:ew-resize;top:50%;left:100%}.selection-move-handle{cursor:move;pointer-events:auto;z-index:101;position:absolute;inset:0}.layers-list-wrapper{border-radius:var(--md-sys-shape-medium);background-color:var(--md-sys-color-surface-container);padding:2px;position:relative}.layer-add-btn{gap:4px;height:40px;padding:0}.layers-list{border:1px solid var(--border);border-radius:var(--md-sys-shape-medium);scrollbar-width:none;background-color:#0003;flex-direction:column;gap:4px;max-height:200px;padding:4px;display:flex;overflow-y:auto}.layers-list::-webkit-scrollbar{display:none}.layers-list-arrow{border:1px solid var(--md-sys-color-outline-variant);background-color:var(--md-sys-color-surface-container-high);width:24px;height:24px;color:var(--md-sys-color-on-surface);cursor:pointer;z-index:5;border-radius:50%;justify-content:center;align-items:center;transition:all .15s;display:flex;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 2px 6px #0000004d}.layers-list-arrow:hover{background-color:var(--md-sys-color-secondary-container);border-color:var(--md-sys-color-secondary)}.layers-list-arrow-up{top:-12px}.layers-list-arrow-down{bottom:-12px}.layer-item-row{background-color:var(--md-sys-color-surface-container-high);border-radius:var(--md-sys-shape-small);cursor:pointer;transition:all var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);border:none;flex-direction:column;align-items:stretch;gap:4px;padding:6px 10px;display:flex;position:relative}.layer-item-row:before{content:"";background-color:var(--md-sys-color-on-surface);opacity:0;border-radius:inherit;z-index:-1;transition:opacity var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);position:absolute;inset:0}.layer-item-row:hover:before{opacity:var(--md-sys-state-hover-opacity)}.layer-item-row.active{background-color:var(--md-sys-color-secondary-container)}.layer-item-row.active:before{opacity:0}.layer-item-top{align-items:center;gap:8px;min-width:0;display:flex}.layer-item-icon{color:var(--md-sys-color-on-surface-variant);flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;display:flex}.layer-item-name{font:var(--md-sys-typescale-body-medium);color:var(--md-sys-color-on-surface);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.layer-item-actions{justify-content:space-between;align-items:center;gap:0;display:flex}.layer-action-btn{border-radius:var(--md-sys-shape-full);width:26px;height:26px;color:var(--md-sys-color-on-surface-variant);cursor:pointer;transition:all var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex;position:relative}.layer-action-btn:before{content:"";background-color:var(--md-sys-color-on-surface);opacity:0;border-radius:inherit;transition:opacity var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);position:absolute;inset:0}.layer-action-btn:hover:before{opacity:var(--md-sys-state-hover-opacity)}.layer-action-btn.active{color:var(--md-sys-color-primary)}.layer-action-btn.danger:hover{color:var(--md-sys-color-error)}.layer-action-btn.danger:hover:before{opacity:0}.align-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.align-grid .btn{height:30px;padding:0 4px;font-size:11px}.advanced-row{gap:8px;display:flex}.advanced-row>div{flex:1}.shadow-color-picker{background-color:var(--bg-card);border:1px solid var(--border);border-radius:8px;align-items:center;gap:8px;height:36px;padding:0 10px;display:flex}.shadow-color-picker input[type=color]{width:24px;height:24px}.shape-select-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.shape-btn{height:36px;font-size:12px;font-weight:500;font-family:var(--sans);border:1px solid var(--border);background-color:var(--bg-card);color:var(--text-primary);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:6px;transition:all .15s;display:inline-flex}.shape-btn:hover{background-color:var(--bg-input)}.shape-btn.active{border-color:var(--accent);color:var(--accent);background-color:#8b5cf626}.property-accordion-section{border:1px solid var(--border);background-color:var(--bg-card);border-radius:8px;margin-bottom:8px;overflow:hidden}.accordion-header{cursor:pointer;-webkit-user-select:none;user-select:none;text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);background-color:#ffffff05;justify-content:space-between;align-items:center;padding:10px 14px;font-size:11px;font-weight:700;transition:all .2s;display:flex}.accordion-header:hover{color:var(--text-primary);background-color:#ffffff0d}.property-accordion-section.active .accordion-header{color:var(--accent);border-bottom:1px solid var(--border);background-color:#8b5cf60f}.accordion-body{background-color:#0000000d;flex-direction:column;gap:12px;padding:14px;display:flex}.box-model-field{background-color:var(--bg-input);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:4px;padding:6px;display:flex}.box-model-row{align-items:stretch;gap:4px;display:flex}.box-model-row-center{justify-content:center}.box-model-row-sides{justify-content:space-between}.box-model-input{text-align:center;font-variant-numeric:tabular-nums;background-color:var(--bg-card);border:1px solid var(--border);width:52px;height:26px;color:var(--text-primary);appearance:textfield;border-radius:4px;outline:none;padding:0 4px;font-size:11px;transition:border-color .15s,box-shadow .15s}.box-model-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.box-model-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.box-model-input:hover{border-color:#ffffff2e}.box-model-input:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-light)}.box-model-center-indicator{border:1px dashed var(--border);background-color:#ffffff05;border-radius:4px;flex:1}.header-separator{background-color:var(--border);width:1px;height:20px;margin:0 16px}.mobile-panel-toggle,.mobile-sidebar-overlay{display:none}@media (width<=1023px){html{font-size:12px}.editor-header{gap:4px;height:48px;padding:0 8px}.logo-icon{border-radius:8px;width:36px;height:36px}.logo-text{display:none}.header-center{flex-shrink:0;gap:4px;display:flex}.btn-label{display:none}.header-change-btn{flex-shrink:0;display:inline-flex}.header-right{flex-shrink:0;gap:4px}.header-right .btn{padding:0 12px}.header-separator{background-color:var(--border);width:1px;height:20px;margin:0 8px}.editor-body{flex-direction:column;position:relative}.left-toolbar{border-right:none;border-top:1px solid var(--border);flex-direction:row;flex-shrink:0;order:10;justify-content:center;align-items:center;gap:4px;width:100%;height:56px;padding:0 8px}.toolbar-btn{border-radius:10px;flex:1;width:44px;max-width:60px;height:44px}.toolbar-btn .tooltip{display:none}.side-panel{z-index:50;border-right:1px solid var(--border);width:88vw;max-width:340px;transition:transform .28s cubic-bezier(.4,0,.2,1);position:fixed;top:52px;bottom:56px;left:0;transform:translate(-100%);box-shadow:4px 0 24px #0009}.side-panel.mobile-open{transform:translate(0)}.mobile-sidebar-overlay{z-index:49;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:#0000008c;display:block;position:fixed;inset:0}.workspace-container{flex:1;min-height:0}.zoom-controls{gap:2px;padding:3px;bottom:8px}.zoom-percent{min-width:36px;padding:0 6px;font-size:11px}.panel-header{padding:14px 16px}.panel-header h2{font-size:16px}.panel-content{gap:16px;padding:14px 16px}.toggle-item{padding:8px 10px;font-size:12px}.dropzone-container{justify-content:flex-start;align-items:stretch;padding:12px 8px;overflow-x:hidden}.dropzone-container>.dropzone-header{margin-bottom:16px!important}.dropzone-container>.dropzone-header h1{font-size:24px!important}.dropzone-container>.dropzone-header p{font-size:13px!important}.setup-workspace-grid{flex-direction:column!important;align-items:stretch!important;gap:12px!important;padding:0!important}.setup-workspace-grid>div{flex:none!important;width:100%!important;min-width:0!important;max-width:100%!important}.setup-card{box-sizing:border-box!important;padding:20px!important}.setup-card-wrapper{flex:none!important;width:100%!important;min-width:0!important;max-width:100%!important}.dropzone-box{text-align:center;padding:24px 16px;box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-height:200px!important}.drop-icon-wrapper{border-radius:14px;width:52px;height:52px;margin-bottom:12px}.modal-content{max-width:calc(100vw - 24px);margin:12px;padding:18px}.filters-grid{grid-template-columns:repeat(2,1fr)}.layer-item-actions{gap:1px}.layer-action-btn{padding:3px}.crop-presets{grid-template-columns:repeat(2,1fr)}.transform-actions{grid-template-columns:repeat(2,1fr);gap:6px}}@media (width<=1024px){html{font-size:12px}.editor-header{gap:4px;height:48px;padding:0 8px}.logo-icon{border-radius:8px;width:36px;height:36px}.logo-text{display:none}.header-center{flex-shrink:0;gap:4px;display:flex}.btn-label{display:none}.header-change-btn{flex-shrink:0;display:inline-flex}.header-right{flex-shrink:0;gap:4px}.header-right .btn{padding:0 12px}.editor-body{flex-direction:column;padding-bottom:56px;position:relative}.left-toolbar{border-right:none;border-top:1px solid var(--border);background-color:var(--bg-sidebar);z-index:20;flex-direction:row;flex-shrink:0;order:10;justify-content:center;align-items:center;gap:4px;width:100%;height:56px;padding:0 8px;position:fixed;bottom:0;left:0;right:0}.toolbar-btn{border-radius:10px;flex:1;width:44px;max-width:56px;height:44px}.toolbar-btn .tooltip{display:none}.side-panel{z-index:50;border-right:1px solid var(--border);width:88vw;max-width:340px;transition:transform .28s cubic-bezier(.4,0,.2,1);position:fixed;top:52px;bottom:56px;left:0;transform:translate(-100%);box-shadow:4px 0 24px #0009}.side-panel.mobile-open{transform:translate(0)}.mobile-sidebar-overlay{z-index:49;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:#0000008c;display:block;position:fixed;inset:0}.workspace-container{flex:1;min-height:0}.zoom-controls{gap:2px;padding:3px;bottom:8px}.zoom-percent{min-width:36px;padding:0 6px;font-size:11px}.toggle-item{padding:8px 10px;font-size:12px}.dropzone-container{justify-content:flex-start;align-items:stretch;padding:12px 8px;overflow-x:hidden}.dropzone-container>.dropzone-header{margin-bottom:16px!important}.dropzone-container>.dropzone-header h1{font-size:24px!important}.dropzone-container>.dropzone-header p{font-size:13px!important}.setup-workspace-grid{flex-direction:column!important;align-items:stretch!important;gap:12px!important;padding:0!important}.setup-workspace-grid>div{flex:none!important;width:100%!important;min-width:0!important;max-width:100%!important}.setup-card{box-sizing:border-box!important;padding:20px!important}.setup-card-wrapper{flex:none!important;width:100%!important;min-width:0!important;max-width:100%!important}.dropzone-box{text-align:center;padding:24px 16px;box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-height:200px!important}.drop-icon-wrapper{border-radius:14px;width:52px;height:52px;margin-bottom:12px}.modal-content{max-width:calc(100vw - 24px);margin:12px;padding:18px}.filters-grid{grid-template-columns:repeat(2,1fr)}.layer-item-actions{gap:1px}.layer-action-btn{padding:3px}.crop-presets{grid-template-columns:repeat(2,1fr)}.transform-actions{grid-template-columns:repeat(2,1fr);gap:6px}.panel-header{padding:14px 16px}.panel-header h2{font-size:16px}.panel-content{gap:16px;padding:14px 16px}.header-separator{background-color:var(--border);width:1px;height:20px;margin:0 8px}body{overflow:hidden}.mobile-crop-apply-popup{z-index:30;-webkit-backdrop-filter:blur(12px);border:1px solid var(--border);background-color:#111115eb;border-radius:14px;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;animation:.18s ease-out mobile-crop-popup-in;display:flex;position:absolute;bottom:64px;left:12px;right:12px;box-shadow:0 12px 32px #00000073}.mobile-crop-apply-popup-info{color:var(--text-primary);white-space:nowrap;align-items:center;gap:6px;font-size:13px;font-weight:600;display:flex}.mobile-crop-apply-popup-actions{flex:1;justify-content:flex-end;gap:8px;display:flex}.mobile-crop-apply-popup-actions .btn{padding:8px 12px;font-size:13px}@keyframes mobile-crop-popup-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}}.project-list-wrapper{flex-direction:column;gap:10px;display:flex;position:relative}.project-list-scroll{scrollbar-width:none;flex-direction:column;gap:10px;max-height:260px;display:flex;overflow-y:auto}.project-list-scroll::-webkit-scrollbar{display:none}.project-list-arrow{border:1px solid var(--md-sys-color-outline-variant);background-color:var(--md-sys-color-surface-container-high);width:28px;height:28px;color:var(--md-sys-color-on-surface);cursor:pointer;z-index:5;border-radius:50%;justify-content:center;align-items:center;transition:all .15s;display:flex;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 2px 6px #0000004d}.project-list-arrow:hover{background-color:var(--md-sys-color-secondary-container);border-color:var(--md-sys-color-secondary)}.project-list-arrow-up{top:-14px}.project-list-arrow-down{bottom:-14px}.recent-project-item{position:relative}.recent-project-item.is-menu-open{border-color:var(--accent-border);background-color:#8b5cf60f}.recent-project-menu-btn{color:var(--text-secondary);background-color:#ffffff0a;transition:background-color .15s,color .15s,border-color .15s}.recent-project-menu-btn:hover,.recent-project-item.is-menu-open .recent-project-menu-btn{background-color:var(--accent-light);color:var(--accent);border-color:var(--accent-border)}.recent-project-menu{z-index:200;background-color:var(--bg-sidebar,#16161b);border:1px solid var(--border);border-radius:10px;flex-direction:column;gap:2px;min-width:220px;padding:6px;animation:.12s ease-out recent-menu-in;display:flex;position:fixed;box-shadow:0 14px 32px #0000008c}@keyframes recent-menu-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.recent-project-menu-item{width:100%;color:var(--text-primary);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;padding:8px 10px;font-size:12px;font-weight:500;transition:background-color .15s,color .15s;display:flex;position:relative}.recent-project-menu-item:hover{color:var(--accent-hover);background-color:#ffffff0f}.recent-project-menu-item.recent-project-menu-danger{color:var(--danger)}.recent-project-menu-item.recent-project-menu-danger:hover{color:var(--danger-hover,#fca5a5);background-color:#ef44441f}.recent-project-menu-item span:first-of-type{flex:1}.recent-project-menu-tag{letter-spacing:.04em;text-transform:uppercase;color:var(--text-secondary);border:1px solid var(--border);background-color:#ffffff0d;border-radius:4px;margin-left:auto;padding:1px 6px;font-size:10px;font-weight:600}.recent-project-menu-item.recent-project-menu-submenu-trigger{padding-right:8px}.recent-project-menu-divider{background-color:var(--border);height:1px;margin:4px 2px}.recent-project-submenu{z-index:210;background-color:var(--bg-sidebar,#16161b);border:1px solid var(--border);border-radius:10px;flex-direction:column;gap:2px;min-width:160px;padding:6px;animation:.12s ease-out recent-menu-in;display:flex;position:fixed;box-shadow:0 14px 32px #0000008c}