:root{--editor-bg: #1a1a1a;--editor-surface: #2a2a2a;--editor-text: #ffffff;--editor-accent: #3390ec;--editor-border: #3a3a3a;--editor-danger: #e53935;--editor-topbar-height: 0px;--editor-thumbnails-height: 88px;--editor-bottombar-height: 52px;--editor-layers-width: 200px;--editor-handle-size: 12px;--editor-handle-touch-size: 36px;--editor-transition: .2s ease}*,*:before,*:after{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;box-sizing:border-box}html,body{margin:0;padding:0;height:100%;touch-action:none;background-color:var(--editor-bg);color:var(--editor-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;color-scheme:dark}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;padding:0;line-height:1}button:focus-visible{outline:2px solid var(--editor-accent);outline-offset:2px}.editor-topbar{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--editor-topbar-height);background-color:var(--editor-surface);border-bottom:1px solid var(--editor-border);display:flex;align-items:center;padding:0 8px;gap:8px}.editor-topbar-back{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:6px;color:var(--editor-accent);font-size:15px;font-weight:500;flex-shrink:0;transition:background-color var(--editor-transition)}.editor-topbar-back:hover{background-color:#3390ec1f}.editor-topbar-back:active{background-color:#3390ec33}.editor-topbar-title{flex:1;font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.editor-thumbnails{position:fixed;top:var(--editor-topbar-height);left:0;right:0;z-index:90;height:var(--editor-thumbnails-height);background-color:var(--editor-surface);border-bottom:1px solid var(--editor-border);display:flex;flex-direction:row;align-items:center;gap:8px;padding:8px 12px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none}.editor-thumbnails::-webkit-scrollbar{display:none}.editor-thumbnail{flex-shrink:0;border-radius:4px;border:2px solid var(--editor-border);overflow:hidden;cursor:pointer;position:relative;background-color:var(--editor-bg);transition:border-color var(--editor-transition),box-shadow var(--editor-transition)}.editor-thumbnail:hover{border-color:#3390ec99}.editor-thumbnail--active{border-color:var(--editor-accent);box-shadow:0 0 0 1px var(--editor-accent)}.editor-thumbnail-index{position:absolute;bottom:2px;right:3px;font-size:9px;color:#ffffffb3;background-color:#00000080;border-radius:2px;padding:0 2px;line-height:1.4;pointer-events:none}.editor-thumbnail img{width:100%;height:100%;object-fit:cover;display:block}.editor-preview-area{position:fixed;top:calc(var(--editor-topbar-height) + var(--editor-thumbnails-height));left:0;right:0;bottom:calc(var(--editor-bottombar-height) + env(safe-area-inset-bottom,0px));display:flex;align-items:center;justify-content:center;overflow:hidden;background-color:var(--editor-bg);touch-action:none}.editor-preview-container{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.editor-preview-wrapper{position:relative;overflow:hidden;flex-shrink:0}.editor-preview-iframe{display:block;border:none;outline:none;background-color:#fff}.editor-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:auto;overflow:hidden}.editor-hit-target{position:absolute;background-color:transparent;cursor:move;pointer-events:auto;touch-action:none;border:2px solid transparent;border-radius:2px;transition:border-color var(--editor-transition)}.editor-hit-target:hover{border-color:#3390ec80}.editor-hit-target--selected{border-color:var(--editor-accent);box-shadow:0 0 0 1px #3390ec4d}.editor-hit-target--locked{pointer-events:none;border-color:transparent!important}.editor-hit-target--selected:after{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:4px;pointer-events:none}.editor-handle{position:absolute;background-color:transparent;pointer-events:auto;touch-action:none;z-index:1;display:flex;align-items:center;justify-content:center}.editor-handle:after{content:"";width:var(--editor-handle-size);height:var(--editor-handle-size);min-width:var(--editor-handle-size);min-height:var(--editor-handle-size);background-color:#fff;border:2px solid var(--editor-accent);border-radius:2px;pointer-events:none;flex-shrink:0}.editor-aspect-lock{position:absolute;bottom:calc(100% + 6px);right:0;width:24px;height:24px;border-radius:4px;background-color:var(--editor-surface);border:1px solid var(--editor-border);display:flex;align-items:center;justify-content:center;pointer-events:auto;cursor:pointer;color:var(--editor-text);opacity:.7;transition:opacity var(--editor-transition),border-color var(--editor-transition);z-index:2}.editor-aspect-lock:hover{opacity:1}.editor-aspect-lock--locked{border-color:var(--editor-accent);color:var(--editor-accent);opacity:1}.editor-layers{position:fixed;top:calc(var(--editor-topbar-height) + var(--editor-thumbnails-height));right:0;width:var(--editor-layers-width);bottom:calc(var(--editor-bottombar-height) + env(safe-area-inset-bottom,0px));background-color:var(--editor-surface);border-left:1px solid var(--editor-border);z-index:80;display:flex;flex-direction:column;overflow:visible;transform:translate(100%);transition:transform var(--editor-transition);will-change:transform}.editor-layers--open{transform:translate(0)}.editor-layers-toggle{position:absolute;top:50%;left:-28px;transform:translateY(-50%);width:28px;height:48px;background-color:var(--editor-surface);border:1px solid var(--editor-border);border-right:none;border-radius:6px 0 0 6px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--editor-text);font-size:12px;transition:background-color var(--editor-transition);z-index:1}.editor-layers-toggle:hover{background-color:#ffffff14}.editor-layers-header{padding:10px 12px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#ffffff80;border-bottom:1px solid var(--editor-border);flex-shrink:0}.editor-layers-list{flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--editor-border) transparent}.editor-layers-list::-webkit-scrollbar{width:4px}.editor-layers-list::-webkit-scrollbar-track{background:transparent}.editor-layers-list::-webkit-scrollbar-thumb{background-color:var(--editor-border);border-radius:2px}.editor-layer-item{display:flex;flex-direction:row;align-items:center;padding:6px 8px;gap:4px;border-bottom:1px solid var(--editor-border);cursor:pointer;transition:background-color var(--editor-transition);min-height:40px}.editor-layer-item:hover{background-color:#ffffff0d}.editor-layer-item--selected{background-color:#3390ec26;border-left:2px solid var(--editor-accent)}.editor-layer-item--hidden{opacity:.4}.editor-layer-reorder{display:flex;flex-direction:column;gap:2px;flex-shrink:0}.editor-layer-btn{display:flex;align-items:center;justify-content:center;width:18px;height:14px;border-radius:3px;color:#fff9;font-size:10px;transition:background-color var(--editor-transition),color var(--editor-transition)}.editor-layer-btn:hover{background-color:#ffffff1a;color:var(--editor-text)}.editor-layer-btn:disabled{opacity:.2;cursor:not-allowed}.editor-layer-label{flex:1;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--editor-text);min-width:0}.editor-layer-actions{display:flex;flex-direction:row;gap:2px;flex-shrink:0}.editor-layer-icon-btn{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:4px;color:#ffffff80;font-size:12px;transition:background-color var(--editor-transition),color var(--editor-transition)}.editor-layer-icon-btn:hover{background-color:#ffffff1a;color:var(--editor-text)}.editor-layer-icon-btn--danger:hover{background-color:#e5393526;color:var(--editor-danger)}.editor-bottombar{position:fixed;bottom:0;left:0;right:0;z-index:100;box-sizing:content-box;height:var(--editor-bottombar-height);padding:0 12px;padding-bottom:env(safe-area-inset-bottom,0px);background-color:var(--editor-surface);border-top:1px solid var(--editor-border);display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:8px}.editor-bottombar-left{display:flex;flex-direction:row;align-items:center;gap:2px}.editor-bottombar-right{display:flex;flex-direction:row;align-items:center;gap:8px}.editor-history-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background-color:#ffffff0f;color:var(--editor-text);font-size:16px;transition:background-color var(--editor-transition),opacity var(--editor-transition)}.editor-history-btn:hover{background-color:#ffffff1f}.editor-history-btn:disabled{opacity:.3;cursor:not-allowed}.editor-grid-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background-color:#ffffff0f;color:var(--editor-text);opacity:.5;transition:background-color var(--editor-transition),opacity var(--editor-transition),color var(--editor-transition)}.editor-grid-btn:hover{background-color:#ffffff1f;opacity:.8}.editor-grid-btn--active{opacity:1;color:var(--editor-accent);background-color:#3390ec26}.editor-guide-line{position:absolute;background-color:#f36;pointer-events:none;z-index:9999}.editor-export-btn{display:flex;align-items:center;gap:6px;padding:0 16px;height:36px;border-radius:8px;background-color:var(--editor-accent);color:#fff;font-size:14px;font-weight:600;transition:background-color var(--editor-transition),opacity var(--editor-transition);white-space:nowrap}.editor-export-btn:hover{background-color:#2b7fd4}.editor-export-btn:active{background-color:#2470c0}.editor-export-btn:disabled{opacity:.5;cursor:not-allowed}.editor-loading{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background-color:var(--editor-bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}.editor-loading-spinner{width:36px;height:36px;border:3px solid var(--editor-border);border-top-color:var(--editor-accent);border-radius:50%;animation:editor-spin .7s linear infinite}@keyframes editor-spin{to{transform:rotate(360deg)}}.editor-loading-text{font-size:14px;color:#ffffff80}.editor-skeleton{background:linear-gradient(90deg,var(--editor-surface) 25%,rgba(255,255,255,.06) 50%,var(--editor-surface) 75%);background-size:200% 100%;animation:editor-shimmer 1.4s infinite;border-radius:4px}@keyframes editor-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.editor-skeleton--thumbnail{width:48px;height:60px;flex-shrink:0}.editor-skeleton--preview{width:100%;height:100%;border-radius:6px}.editor-toast-container{position:fixed;bottom:calc(var(--editor-bottombar-height) + 12px);left:50%;transform:translate(-50%);z-index:300;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}.editor-toast{padding:10px 16px;border-radius:10px;background-color:#2a2a2aeb;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--editor-text);font-size:13px;font-weight:500;border:1px solid var(--editor-border);white-space:nowrap;max-width:min(320px,calc(100vw - 32px));text-align:center;pointer-events:auto;animation:editor-toast-in .2s ease forwards;box-shadow:0 4px 16px #0006}.editor-toast--success{border-color:#3390ec80}.editor-toast--error{border-color:#e5393580;color:#ff6b6b}.editor-toast--exiting{animation:editor-toast-out .2s ease forwards}@keyframes editor-toast-in{0%{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes editor-toast-out{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(8px) scale(.96)}}.editor-error{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background-color:var(--editor-bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;text-align:center}.editor-error-icon{font-size:40px;color:var(--editor-danger)}.editor-error-title{font-size:17px;font-weight:600;color:var(--editor-text)}.editor-error-message{font-size:14px;color:#fff9;max-width:280px;line-height:1.5}.editor-error-close{margin-top:8px;padding:10px 24px;border-radius:8px;background-color:var(--editor-surface);border:1px solid var(--editor-border);color:var(--editor-text);font-size:14px;font-weight:500;transition:background-color var(--editor-transition)}.editor-error-close:hover{background-color:#ffffff14}.editor-export-done{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background-color:var(--editor-bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;text-align:center;color:var(--editor-text);font-size:15px;line-height:1.5}.editor-export-done__close{padding:12px 32px;border-radius:8px;background-color:var(--editor-accent);border:none;color:#fff;font-size:15px;font-weight:600;cursor:pointer}.editor-text-editor{position:absolute;top:0;right:0;bottom:0;left:0;z-index:60;pointer-events:none}.editor-text-toolbar{position:absolute;display:flex;flex-direction:column;gap:2px;padding:4px 6px;background-color:var(--editor-surface);border:1px solid var(--editor-border);border-radius:6px;pointer-events:auto;z-index:1}.editor-text-toolbar__row{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.editor-text-toolbar__size{width:50px;padding:4px 6px;border:1px solid var(--editor-border);border-radius:4px;background-color:var(--editor-bg);color:var(--editor-text);font-size:12px;text-align:center}.editor-text-toolbar__family{max-width:120px;padding:4px 6px;border:1px solid var(--editor-border);border-radius:4px;background-color:var(--editor-bg);color:var(--editor-text);font-size:12px}.editor-text-toolbar__color{width:28px;height:28px;padding:2px;border:1px solid var(--editor-border);border-radius:4px;background-color:var(--editor-bg);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.editor-text-toolbar__color::-webkit-color-swatch-wrapper{padding:0}.editor-text-toolbar__color::-webkit-color-swatch{border:none;border-radius:2px}.editor-text-toolbar__btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:1px solid var(--editor-border);border-radius:4px;background-color:transparent;color:var(--editor-text);font-size:13px;cursor:pointer}.editor-text-toolbar__btn--active{background-color:var(--editor-accent);border-color:var(--editor-accent);color:#fff}.editor-text-toolbar__done{margin-left:auto;padding:4px 12px;border:none;border-radius:4px;background-color:var(--editor-accent);color:#fff;font-size:12px;font-weight:600;cursor:pointer}.editor-text-editor__area{position:absolute;outline:2px solid var(--editor-accent);outline-offset:2px;border-radius:2px;overflow:hidden;word-wrap:break-word;white-space:pre-wrap;cursor:text;line-height:1.2;pointer-events:auto;-webkit-user-select:text;user-select:text}.editor-layer-text-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:3px;background-color:#ffffff14;color:var(--editor-accent);font-size:11px;font-weight:700;flex-shrink:0;margin-right:4px}.editor-text-btn{padding:4px 10px;border:1px solid var(--editor-border);border-radius:6px;background-color:transparent;color:var(--editor-text);font-size:12px;font-weight:500;cursor:pointer;transition:background-color var(--editor-transition)}.editor-text-btn:hover{background-color:#ffffff0f}.editor-text-btn:disabled{opacity:.4;cursor:not-allowed}@media(min-width:600px){:root{--editor-layers-width: 220px;--editor-handle-touch-size: 16px}.editor-layers{transform:translate(0);border-left:1px solid var(--editor-border)}.editor-layers-toggle{display:none}.editor-preview-area{right:var(--editor-layers-width)}}