:root{--bg: #eef2f6;--panel: #ffffff;--ink: #0f1419;--muted: #5d6874;--line: #d9e0e7;--accent: #1a7fb8;--accent-ink: #fff;--stage: #e3e9ef;--shadow: 0 10px 30px rgba(10, 30, 50, .14), 0 2px 6px rgba(10, 30, 50, .08);--src-line: #1f9d55;--src-image: #1a7fb8;--src-scaled: #c47f00;--src-font: #d6336c;--src-missing: #888;--font: "Special Elite", ui-monospace, "Courier New", monospace;color-scheme:light dark}@media (prefers-color-scheme: dark){:root{--bg: #07090c;--panel: #0f1318;--ink: #e6eef5;--muted: #8593a1;--line: #1f2831;--accent: #1f94d1;--accent-ink: #fff;--stage: #000000;--shadow: 0 10px 30px rgba(0, 0, 0, .6), 0 2px 6px rgba(0, 0, 0, .4);--src-line: #4cd38a;--src-image: #5bb8e8;--src-scaled: #f0b440;--src-font: #ff6b9a}}*{box-sizing:border-box}html,body{margin:0;height:100%}body{font:14px/1.4 var(--font);font-synthesis-weight:none;background:var(--bg);color:var(--ink);display:flex;flex-direction:column;overflow:hidden}button{font:inherit;color:inherit;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:6px 11px;cursor:pointer;white-space:nowrap}button:hover:not(:disabled){border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}button.big{padding:10px 20px;font-size:15px}.topbar{display:flex;align-items:center;gap:16px;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap}.brand{display:flex;align-items:center;gap:8px;font-size:16px}.brand img{display:block}.jw{display:inline-block;white-space:nowrap}.jc{display:inline-block;transform-origin:center}.tools{display:flex;align-items:center;gap:8px;margin-left:auto;flex-wrap:wrap}.tools[hidden]{display:none}.sep{width:1px;height:22px;background:var(--line);margin:0 4px}.toggle{display:flex;align-items:center;gap:6px;color:var(--muted);cursor:pointer;-webkit-user-select:none;user-select:none}.zoom,.pager{display:flex;align-items:center}.zoom button,.pager button{border-radius:0;margin-left:-1px;min-width:34px}.zoom button:first-child,.pager button:first-child{border-radius:8px 0 0 8px}.zoom button:last-child,.pager button:last-child{border-radius:0 8px 8px 0}.pager[hidden]{display:none}.ver{position:relative}.ver-name{max-width:220px;overflow:hidden;text-overflow:ellipsis}.ver-name:after{content:" ▾";color:var(--muted)}.ver-name.unsaved{color:var(--muted)}.ver-name .ver-edited{color:var(--accent);font-size:12.5px}.menu{position:absolute;top:calc(100% + 6px);left:0;z-index:30;width:300px;max-height:60vh;overflow:auto;padding:4px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow)}.menu[hidden]{display:none}.menu-head,.menu-foot{font-size:11.5px;color:var(--muted);padding:6px 8px 4px}.menu-foot{border-top:1px solid var(--line);margin-top:4px;padding-top:7px}.menu-item{display:flex;align-items:center;gap:6px;padding:5px 6px 5px 8px;border-radius:7px;cursor:pointer;min-height:32px}.menu-item:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}.menu-item.on{background:color-mix(in srgb,var(--accent) 7%,transparent)}.mi-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mi-tag{font-size:11px;color:var(--accent);margin-left:4px}.mi-when{color:var(--muted);font-size:12px;white-space:nowrap}.menu-item button{padding:2px 8px;font-size:12px}.menu-item .mi-del{border-color:transparent;background:none;color:var(--muted);padding:2px 6px}.menu-empty{color:var(--muted);font-size:12.5px;padding:4px 8px 8px}.pager span{padding:0 10px;color:var(--muted);font-variant-numeric:tabular-nums}#stage{flex:1;overflow:auto;background:var(--stage);position:relative;display:grid;place-items:center;padding:32px}.empty{width:min(560px,100%)}.empty[hidden]{display:none}.drop{background:var(--panel);border:1.5px dashed color-mix(in srgb,var(--muted) 45%,transparent);border-radius:18px;padding:40px 32px;text-align:center}.drop-icon img{display:block;margin:0 auto}.drop h1{font-size:24px;font-weight:400;margin:10px 0 6px}.drop p{color:var(--muted);margin:0 auto 20px;max-width:400px}.examples{margin-top:22px;display:flex;flex-wrap:wrap;gap:6px;justify-content:center;align-items:center}.examples[hidden]{display:none}.examples span{color:var(--muted);width:100%;margin-bottom:2px;font-size:13px}.examples button{font-size:12.5px;padding:4px 9px;max-width:100%;overflow:hidden;text-overflow:ellipsis}.brand{cursor:pointer;-webkit-user-select:none;user-select:none}.recent{margin-top:28px}.recent[hidden]{display:none}.recent h2{font-size:13px;font-weight:600;color:var(--muted);margin:0 0 10px 2px}.recent-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.recent-card{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:0;overflow:hidden;border-radius:10px;cursor:pointer;background:var(--panel);border:1px solid var(--line)}.recent-card:hover,.recent-card:focus-visible{border-color:color-mix(in srgb,var(--accent) 50%,var(--line));outline:none}.recent-card .thumb{height:110px;background:var(--stage) center / cover no-repeat;border-bottom:1px solid var(--line)}.recent-card .meta{padding:7px 10px 8px;min-width:0}.recent-card .name{font-size:13px;font-weight:550;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recent-card .when{font-size:11.5px;color:var(--muted)}.recent-card .cached{color:var(--src-line)}.recent-card .remove{position:absolute;top:6px;right:6px;width:24px;height:24px;padding:0;border-radius:50%;line-height:22px;text-align:center;font-size:15px;background:color-mix(in srgb,var(--panel) 85%,transparent);color:var(--muted);opacity:0;transition:opacity .1s}.recent-card:hover .remove,.recent-card .remove:focus-visible{opacity:1}@media (hover: none){.recent-card .remove{opacity:1}}.canvas-wrap{position:relative;box-shadow:var(--shadow);flex:none}.canvas-wrap[hidden]{display:none}#canvas{display:block;width:100%;height:100%;background:#fff}#canvas.pixelated{image-rendering:pixelated}.canvas-wrap.comparing:after{content:attr(data-cmp);position:absolute;top:10px;left:10px;background:var(--ink);color:var(--bg);font-size:12px;padding:3px 8px;border-radius:6px}.overlay{position:absolute;top:0;right:0;bottom:0;left:0}.line-box{position:absolute;border-radius:3px;cursor:text;transition:background-color .1s,box-shadow .1s}.line-box:hover,.overlay.show .line-box{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--accent) 70%,transparent);background:color-mix(in srgb,var(--accent) 8%,transparent)}.line-box.active{box-shadow:0 0 0 2px var(--accent);background:transparent}.comparing .overlay,.comparing .editor{visibility:hidden}.editor{position:absolute;z-index:5;width:520px;max-width:calc(100vw - 32px);background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:10px}.ed-input{width:100%;font:15px/1.3 var(--font);padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);outline:none}.ed-input:focus{border-color:var(--accent)}.ed-preview{font:12px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;margin:8px 2px 6px;color:var(--muted);word-break:break-all;max-height:72px;overflow:auto}.ed-preview .src-orig{color:var(--muted)}.src-line{color:var(--src-line);font-weight:700}.src-image{color:var(--src-image);font-weight:700}.src-scaled{color:var(--src-scaled);font-weight:700}.src-font{color:var(--src-font);font-weight:700;text-decoration:underline wavy}.src-missing{color:var(--src-missing);text-decoration:line-through}.legend{font:11.5px/1.4 var(--font);color:var(--muted);margin-top:4px;display:flex;flex-wrap:wrap;align-items:center;gap:4px}.legend i{width:10px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor;margin-right:2px}.ed-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.grow{flex:1}.ed-status{color:var(--muted);font-size:12px}.seg{display:flex}.seg button{border-radius:0;margin-left:-1px;padding:4px 8px;font-size:12px;text-transform:none}.seg button:first-child{border-radius:7px 0 0 7px;margin-left:0}.seg button:last-child{border-radius:0 7px 7px 0}.seg button.on{background:color-mix(in srgb,var(--accent) 14%,var(--panel));border-color:var(--accent);position:relative;z-index:1}.editor .ed-row>button{padding:5px 10px;font-size:13px}.ed-all{display:flex;align-items:center;gap:5px;font-size:12px;margin-left:4px;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.ed-all input{margin:0;accent-color:var(--accent);cursor:inherit}.ed-all.off{color:var(--muted);cursor:default}.ed-count{color:var(--accent);font-weight:650}.busy{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:color-mix(in srgb,var(--bg) 40%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:20}.busy[hidden]{display:none}.busy-card{background:var(--panel);border-radius:14px;box-shadow:var(--shadow);padding:18px 22px;width:300px}.busy-title{font-weight:600;margin-bottom:10px}.bar{height:6px;background:var(--line);border-radius:3px;overflow:hidden}.bar>div{height:100%;background:var(--accent);width:0;transition:width .2s}.bar.indeterminate>div{width:35%!important;animation:slide 1.1s ease-in-out infinite}@keyframes slide{0%{transform:translate(-100%)}to{transform:translate(300%)}}.drop-hint{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 18%,transparent);border:3px dashed var(--accent);pointer-events:none;font-size:22px;font-weight:650;color:var(--accent)}.drop-hint[hidden]{display:none}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%);background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:10px;z-index:40;box-shadow:var(--shadow);font-size:13.5px}.toast[hidden]{display:none}@media (max-width: 640px){#stage{padding:16px}.topbar{padding:8px 16px}}.meta{width:min(640px,calc(100vw - 32px));max-height:calc(100vh - 48px);padding:18px 20px 0;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.meta::backdrop{background:color-mix(in srgb,var(--bg) 50%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.meta h2{margin:0 0 4px;font-size:17px}.meta-note{margin:0 0 12px;color:var(--muted);font-size:12.5px}.meta-note code{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:11.5px;color:var(--ink);-webkit-user-select:all;user-select:all}.meta-important{color:#d92d2d}@media (prefers-color-scheme: dark){.meta-important{color:#ff6161}}.meta-row{display:grid;grid-template-columns:150px 1fr 52px;gap:8px;align-items:center;margin-bottom:5px}.meta-row button{padding:4px 6px;font-size:12.5px}.meta input,.meta textarea{font:inherit;font-size:13px;color:inherit;background:var(--bg);border:1px solid var(--line);border-radius:7px;padding:5px 8px;min-width:0}.meta input:focus,.meta textarea:focus{outline:none;border-color:var(--accent)}.meta input:read-only.meta-key{background:none;border-color:transparent;padding-left:0;color:var(--muted)}label.meta-key{color:var(--muted);font-size:13px}.meta input:disabled{opacity:.6}.meta-short{width:70px}.meta .meta-mono{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:12px}.meta-del{border-color:transparent!important;background:none;color:var(--muted)}.meta-add{margin:2px 0 14px;font-size:12.5px;padding:4px 9px}.meta details{margin:8px 0 4px}.meta summary{cursor:pointer;color:var(--muted);font-size:13px;margin-bottom:8px}.meta textarea{width:100%;resize:vertical}.meta-foot{display:flex;gap:8px;margin-top:10px;padding:10px 0 18px;position:sticky;bottom:-18px;background:var(--panel);border-top:1px solid var(--line)}.meta-foot .grow{flex:1}