@font-face{font-family:Material Symbols Rounded;font-style:normal;font-weight:100 700;font-display:block;src:url(/fonts/material-symbols-rounded.woff2)format("woff2")}@font-face{font-family:Fredoka;font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/fredoka.woff2)format("woff2")}:root,[data-theme=dark]{--bg:#1b1733;--panel:#282249;--panel-2:#352d61;--border:#3f3672;--ink:#0f0b22;--text:#fff7e8;--muted:#b3aad8;--accent:#ffcc1a;--accent-2:#ff5aa5;--accent-text:#2b1a00;--danger:#ff4d5e;--good:#3ddc84;--canvas-bg:#120f24;--grid:#ffffff0f;--grid-major:#ffffff29;--axis:#ff5aa5;--input:#1d1838;--hover:#ffffff17;--shadow:0 10px 30px #00000073;--dots:#ffffff09;--top:#ff8a2b;--top-2:#ff7314;--top-text:#2b1300;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=light]{--bg:#ffe9a6;--panel:#fff8e6;--panel-2:#fff;--border:#f0d79a;--ink:#3b2a12;--text:#2d2140;--muted:#8a7a69;--accent:#ff7a1a;--accent-2:#e8388a;--accent-text:#fff;--danger:#e5303f;--good:#1fb866;--canvas-bg:#fffdf5;--grid:#3c280a14;--grid-major:#3c280a33;--axis:#e8388a;--input:#fff;--hover:#ff8c1e1f;--shadow:0 10px 30px #7846002e;--dots:#a0640012;--top:#ffcc1a;--top-2:#fb0;--top-text:#3b2a12;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root{--spring:cubic-bezier(.34, 1.56, .64, 1);--snap:cubic-bezier(.2, .9, .3, 1)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;overflow:hidden}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font:500 13.5px/1.35 Fredoka,ui-rounded,system-ui,-apple-system,sans-serif}button,input,select,textarea{font:inherit;color:inherit}.icon{white-space:nowrap;-webkit-font-feature-settings:"liga";font-feature-settings:"liga";font-variation-settings:"FILL" 0, "wght" 600, "GRAD" 0, "opsz" 24;transition:font-variation-settings .15s, transform .18s var(--spring);vertical-align:middle;-webkit-user-select:none;user-select:none;direction:ltr;font-family:Material Symbols Rounded;font-size:20px;font-style:normal;font-weight:400;line-height:1;display:inline-block}.icon.fill,button:hover:not(:disabled)>.icon,button.on>.icon,button.primary>.icon{font-variation-settings:"FILL" 1, "wght" 650, "GRAD" 0, "opsz" 24}.icon.spin{animation:.9s linear infinite spin}button{background:var(--panel-2);border:2px solid var(--ink);cursor:pointer;min-height:28px;box-shadow:0 3px 0 var(--ink);transition:transform .12s var(--spring), box-shadow .12s var(--snap), background-color .15s, color .15s, filter .15s;border-radius:10px;justify-content:center;align-items:center;gap:4px;padding:3px 10px;font-weight:600;display:inline-flex;position:relative;overflow:hidden;transform:translateY(0)}button:after{content:"";pointer-events:none;background:radial-gradient(70px circle at var(--mx,50%) var(--my,50%), #ffffff47, transparent 60%);opacity:0;transition:opacity .15s;position:absolute;inset:0}button:hover:not(:disabled):after{opacity:1}button:hover:not(:disabled){box-shadow:0 4px 0 var(--ink);transform:translateY(-1px)}button:active:not(:disabled){box-shadow:0 1px 0 var(--ink);transition-duration:40ms;transform:translateY(2px)scale(.97)}button:disabled{opacity:.4;cursor:default;box-shadow:0 2px 0 var(--ink)}button.primary{background:var(--accent);color:var(--accent-text)}button.danger{color:var(--danger)}button.on{background:var(--accent);color:var(--accent-text);animation:pop .25s var(--spring)}button.ghost{box-shadow:none;background:0 0;border-color:#0000;padding:2px 6px}button.ghost:active:not(:disabled){box-shadow:none}button.ghost:hover:not(:disabled)>.icon{transform:rotate(-8deg)scale(1.15)}button.small{min-height:22px;padding:1px 6px;font-size:12px}input,select,textarea{background:var(--input);border:2px solid var(--border);border-radius:9px;min-width:0;padding:3px 8px;transition:border-color .15s,box-shadow .15s}input:hover,select:hover,textarea:hover{border-color:color-mix(in srgb, var(--accent) 50%, var(--border))}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 30%, transparent);outline:none}input[type=color]{cursor:pointer;border-radius:8px;width:30px;height:26px;padding:0;overflow:hidden}input[type=checkbox]{accent-color:var(--accent);cursor:pointer;width:16px;height:16px;transition:transform .15s var(--spring)}input[type=checkbox]:active{transform:scale(.8)}input[type=range]{accent-color:var(--accent);box-shadow:none;background:0 0;border:none;padding:0}label{align-items:center;gap:6px;display:flex}.app{grid-template-rows:46px 1fr 26px;grid-template-columns:52px 260px 1fr 280px;height:100%;display:grid}.topbar{color:var(--top-text);background:repeating-linear-gradient(-45deg, var(--top) 0 14px, var(--top-2) 14px 28px);border-bottom:3px solid var(--ink);z-index:5;grid-column:1/-1;align-items:center;gap:6px;padding:0 10px;display:flex}.topbar button.ghost:hover:not(:disabled){background:#ffffff4d}.topbar .brand{letter-spacing:.3px;align-items:center;gap:6px;margin-right:6px;font-size:18px;font-weight:700;display:flex}.topbar .brand .logo{background:var(--accent-2);color:#fff;border:2px solid var(--ink);width:30px;height:30px;box-shadow:0 3px 0 var(--ink);transition:transform .3s var(--spring);border-radius:10px;place-items:center;display:grid}.topbar .brand:hover .logo{transform:rotate(-12deg)scale(1.1)}.topbar .brand span.b2{color:#fff;-webkit-text-stroke:1px var(--ink);paint-order:stroke fill}.topbar .name{border-color:var(--ink);width:200px}.topbar .spacer{flex:1}.topbar .status{align-items:center;gap:3px;min-width:84px;font-size:12px;font-weight:600;display:inline-flex}.topbar .status .icon{font-size:17px}.topbar .status.saved .icon{animation:pop .35s var(--spring)}.toolbar{background:var(--panel);background-image:radial-gradient(var(--dots) 1.5px, transparent 1.6px);border-right:3px solid var(--ink);background-size:12px 12px;flex-direction:column;align-items:center;gap:3px;padding:8px 0;display:flex;position:relative;overflow:hidden auto}.toolbar .tool-ind{background:var(--tc,var(--accent));border:2px solid var(--ink);width:38px;height:36px;box-shadow:0 3px 0 var(--ink);transition:transform .28s var(--spring), background-color .2s;pointer-events:none;border-radius:12px;position:absolute;top:0;left:0}.toolbar button.tool{width:38px;height:36px;box-shadow:none;z-index:1;color:var(--text);background:0 0;border-color:#0000;border-radius:12px;padding:0}.toolbar button.tool .icon{font-size:22px}.toolbar button.tool:hover{background:var(--hover);box-shadow:none;transform:translate(calc(var(--dx,0) * 4px), calc(var(--dy,0) * 4px))}.toolbar button.tool:hover .icon{color:var(--tc);animation:wiggle .35s var(--snap)}.toolbar button.tool.on{color:#fff;background:0 0;animation:none}.toolbar button.tool.on:hover .icon{color:#fff}.toolbar button.tool.on .icon{animation:hop .35s var(--spring);filter:drop-shadow(0 1px #00000073)}.toolbar .sep{border-top:2px dashed var(--border);width:28px;margin:4px 0}.swatchpair{cursor:pointer;width:38px;height:42px;margin-top:4px;position:relative}.swatchpair div{border:2px solid var(--ink);width:25px;height:25px;box-shadow:0 2px 0 var(--ink);transition:background-color .2s, transform .2s var(--spring);border-radius:8px;position:absolute}.swatchpair:hover .p{transform:translate(-1px,-1px)rotate(-6deg)}.swatchpair:hover .s{transform:translate(1px,1px)rotate(6deg)}.swatchpair:active div{transform:scale(.9)}.swatchpair .p{z-index:1;top:0;left:1px}.swatchpair .s{bottom:2px;right:1px}.side{background:var(--panel);border-right:3px solid var(--ink);flex-direction:column;min-height:0;display:flex;overflow:hidden}.side.right{border-right:none;border-left:3px solid var(--ink)}.tabs{border-bottom:2px solid var(--border);gap:6px;padding:8px 8px 6px;display:flex}.tabs button{color:var(--muted);background:var(--panel-2);flex:1;padding:5px}.tabs button.active{color:var(--accent-text);background:var(--accent);animation:pop .25s var(--spring)}.section{border-bottom:2px solid var(--border);animation:fadeUp .22s var(--snap) backwards;padding:8px 10px}.section h4{text-transform:uppercase;letter-spacing:.7px;color:var(--muted);align-items:center;gap:6px;min-height:26px;margin:0 0 6px;font-size:12px;font-weight:700;display:flex}.section h4 .grow{flex:1}.scroll{flex:1;min-height:0;overflow-y:auto}.row{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:6px;display:flex}.row>.grow{flex:1}.muted{color:var(--muted)}.small{font-size:11.5px}.swatches{grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:7px;display:grid}.swatch{border:2px solid var(--ink);cursor:pointer;background:var(--panel-2);box-shadow:0 3px 0 var(--ink);transition:transform .15s var(--spring), box-shadow .15s;animation:popIn .25s var(--spring) backwards;border-radius:10px;position:relative;overflow:hidden}.swatch:hover{transform:translateY(-2px) rotate(calc(var(--dx,0) * 6deg));box-shadow:0 5px 0 var(--ink)}.swatch:active{box-shadow:0 1px 0 var(--ink);transform:translateY(2px)scale(.95)}.swatch .chip{height:28px}.swatch .lbl{white-space:nowrap;text-overflow:ellipsis;padding:1px 4px;font-size:10.5px;font-weight:600;overflow:hidden}.swatch.primary{outline:3px solid var(--accent);outline-offset:1px;animation:pop .3s var(--spring)}.swatch.secondary:after{content:"R";color:#fff;background:var(--accent-2);border:1.5px solid var(--ink);border-radius:6px;padding:0 3px;font-size:10px;font-weight:700;position:absolute;top:2px;right:4px}.swatch .key{color:#fff;text-shadow:0 0 2px #000,0 1px #000;font-size:10px;font-weight:700;position:absolute;top:2px;left:4px}.empty-chip{background:repeating-conic-gradient(#8884 0 25%, transparent 0 50%) 0 0 / 10px 10px}.assets{grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:8px;display:grid}.asset{border:2px solid var(--ink);cursor:pointer;background:var(--panel-2);box-shadow:0 3px 0 var(--ink);transition:transform .15s var(--spring), box-shadow .15s;animation:popIn .25s var(--spring) backwards;border-radius:12px;padding:4px}.asset:hover{transform:translateY(-2px) rotate(calc(var(--dx,0) * 5deg));box-shadow:0 5px 0 var(--ink)}.asset:hover .thumb img{transform:scale(1.08)}.asset:active{box-shadow:0 1px 0 var(--ink);transform:translateY(2px)scale(.96)}.asset.active{outline:3px solid var(--accent);outline-offset:1px}.asset .thumb{aspect-ratio:1;background:repeating-conic-gradient(#8882 0 25%, transparent 0 50%) 0 0 / 12px 12px;border-radius:8px;place-items:center;display:grid;overflow:hidden}.asset .thumb img{max-width:100%;max-height:100%;image-rendering:pixelated;transition:transform .2s var(--spring)}.asset .lbl{white-space:nowrap;text-overflow:ellipsis;margin-top:3px;font-size:10.5px;font-weight:600;overflow:hidden}.dropzone{border:2px dashed var(--border);text-align:center;color:var(--muted);transition:all .15s var(--spring);cursor:pointer;border-radius:12px;padding:10px;font-size:12px}.dropzone:hover{border-color:var(--accent);color:var(--text)}.dropzone.over{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, transparent);transform:scale(1.03)}.canvas-wrap{background:var(--canvas-bg);min-width:0;min-height:0;position:relative;overflow:hidden}.canvas-wrap canvas.main{touch-action:none;outline:none;width:100%;height:100%;position:absolute;inset:0}.optbar{pointer-events:none;flex-wrap:wrap;align-items:center;gap:8px;display:flex;position:absolute;top:10px;left:10px;right:10px}.optbar>*{pointer-events:auto}.pill{background:var(--panel);border:2px solid var(--ink);box-shadow:0 3px 0 var(--ink), var(--shadow);animation:dropIn .25s var(--spring) backwards;border-radius:14px;align-items:center;gap:5px;padding:4px 6px;display:flex}.pill>span{padding:0 2px}.pill input[type=number]{width:54px}.statusbar{background:var(--panel);border-top:3px solid var(--ink);color:var(--muted);font-variant-numeric:tabular-nums;grid-column:1/-1;align-items:center;gap:16px;padding:0 12px;font-size:12px;font-weight:600;display:flex}.statusbar .grow{flex:1}.minimap{cursor:crosshair;border-bottom:3px solid var(--ink);width:100%;height:170px;display:block}.layer{cursor:pointer;transition:background-color .15s, transform .15s var(--spring);animation:fadeUp .2s var(--snap) backwards;border:2px solid #0000;border-radius:10px;align-items:center;gap:2px;padding:3px 4px;display:flex}.layer:hover{background:var(--hover);transform:translate(2px)}.layer.active{background:color-mix(in srgb, var(--accent) 22%, transparent);border-color:var(--accent)}.layer .nm{text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:600;overflow:hidden}.layer button{min-height:24px;padding:0 3px}.layer button .icon{font-size:18px}.kv{border-collapse:collapse;width:100%}.kv td{padding:2px}.kv input{width:100%}.kv tr{animation:fadeUp .18s var(--snap) backwards}.kv .inh td{color:var(--muted);font-style:italic}.kv td.x{width:26px}.modal-bg{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:50;background:#0f082380;place-items:center;animation:.14s ease-out fadeIn;display:grid;position:fixed;inset:0}.modal{background:var(--panel);border:3px solid var(--ink);box-shadow:0 6px 0 var(--ink), var(--shadow);width:min(620px,94vw);max-height:88vh;animation:modalIn .26s var(--spring);border-radius:20px;flex-direction:column;display:flex;overflow:hidden}.modal header{border-bottom:3px solid var(--ink);color:var(--top-text);background:repeating-linear-gradient(-45deg, var(--top) 0 14px, var(--top-2) 14px 28px);align-items:center;padding:10px 12px 10px 16px;font-size:16px;font-weight:700;display:flex}.modal header .grow{flex:1}.modal header button.ghost:hover:not(:disabled){background:#ffffff59}.modal header button.ghost:hover:not(:disabled)>.icon{transform:rotate(90deg)scale(1.15)}.modal .body{padding:14px 16px;overflow-y:auto}.modal .body h4{text-transform:uppercase;letter-spacing:.7px;color:var(--accent);margin:16px 0 8px;font-size:13px}.modal footer{border-top:2px solid var(--border);justify-content:flex-end;gap:8px;padding:10px 16px 14px;display:flex}.modal-bg.leaving{animation:.16s ease-in forwards fadeOut}.modal-bg.leaving .modal{animation:.16s ease-in forwards modalOut}.form{grid-template-columns:150px 1fr;align-items:center;gap:8px 10px;display:grid}.form .full{grid-column:1/-1}.form textarea{resize:vertical;min-height:70px}.menu{background:var(--panel);border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink), var(--shadow);z-index:40;transform-origin:0 0;min-width:240px;animation:menuIn .2s var(--spring);color:var(--text);border-radius:14px;padding:5px;position:absolute}.menu button{text-align:left;width:100%;box-shadow:none;background:0 0;border:none;border-radius:9px;justify-content:flex-start;gap:8px;padding:5px 8px;font-weight:500;display:flex}.menu button .icon{color:var(--muted);font-size:18px}.menu button:hover:not(:disabled){background:var(--accent);color:var(--accent-text);box-shadow:none;transform:translate(3px)}.menu button:hover:not(:disabled) .icon{color:var(--accent-text)}.menu button:active:not(:disabled){box-shadow:none}.menu button .k{opacity:.6;margin-left:auto;font-size:11px}.menu .sep{border-top:2px dashed var(--border);margin:4px 0}.queue{background:var(--panel);border:3px solid var(--ink);width:350px;max-height:50%;box-shadow:0 4px 0 var(--ink), var(--shadow);transition:max-height .25s var(--snap);animation:dropIn .3s var(--spring);border-radius:16px;flex-direction:column;display:flex;position:absolute;bottom:10px;right:10px;overflow:hidden}.queue header{border-bottom:2px solid var(--border);align-items:center;gap:6px;min-height:34px;padding:5px 8px;font-weight:700;display:flex}.queue header .grow{flex:1}.job{border-bottom:2px solid var(--border);animation:fadeUp .22s var(--snap) backwards;align-items:flex-start;gap:6px;padding:6px 8px;display:flex}.job .info{flex:1;min-width:0}.job .prompt{white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}.job .st{color:var(--muted);font-size:11px}.job .st.error{color:var(--danger)}.job .st.running{color:var(--accent)}.job .st.done{color:var(--good)}.job .thumbs{gap:4px;margin-top:4px;display:flex}.job .thumbs img{object-fit:contain;border:2px solid var(--ink);background:var(--panel-2);cursor:pointer;width:36px;height:36px;animation:popIn .3s var(--spring) backwards;transition:transform .15s var(--spring);border-radius:8px}.job .thumbs img:hover{transform:scale(1.12)rotate(-4deg)}.spinner{border:2.5px solid var(--accent);vertical-align:-1px;border-right-color:#0000;border-radius:50%;width:11px;height:11px;animation:.7s linear infinite spin;display:inline-block}.help-grid{grid-template-columns:180px 1fr;gap:5px 12px;display:grid}.help-grid kbd,kbd{background:var(--panel-2);border:2px solid var(--ink);border-bottom-width:3px;border-radius:7px;padding:0 5px;font-family:ui-monospace,monospace;font-size:11px}.toast{z-index:60;background:var(--accent);color:var(--accent-text);border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink), var(--shadow);animation:toastIn .35s var(--spring);border-radius:999px;align-items:center;gap:6px;padding:7px 14px;font-weight:700;display:flex;position:fixed;bottom:40px;left:50%;transform:translate(-50%)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pop{0%{transform:scale(.88)}60%{transform:scale(1.06)}to{transform:scale(1)}}@keyframes popIn{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes hop{0%{transform:translateY(0)scale(1)}35%{transform:translateY(-4px)scale(1.15,.9)}70%{transform:translateY(0)scale(.95,1.08)}to{transform:none}}@keyframes wiggle{0%,to{transform:rotate(0)}30%{transform:rotate(-12deg)scale(1.1)}65%{transform:rotate(8deg)scale(1.1)}}@keyframes fadeIn{0%{opacity:0}}@keyframes fadeOut{to{opacity:0}}@keyframes fadeUp{0%{opacity:0;transform:translateY(6px)}}@keyframes dropIn{0%{opacity:0;transform:translateY(-8px)scale(.92)}}@keyframes modalIn{0%{opacity:0;transform:translateY(24px)scale(.86)rotate(-1.5deg)}}@keyframes modalOut{to{opacity:0;transform:translateY(14px)scale(.92)}}@keyframes menuIn{0%{opacity:0;transform:scale(.85)translateY(-6px)}}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,30px)scale(.7)}to{opacity:1;transform:translate(-50%)scale(1)}}[data-motion=off] *,[data-motion=off] :before,[data-motion=off] :after{transition:none!important;animation:none!important}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.theme-ic{animation:spinIn .4s var(--spring)}@keyframes spinIn{0%{opacity:0;transform:rotate(-120deg)scale(.4)}}.settings-btn:hover:not(:disabled)>.icon{transform:rotate(60deg)scale(1.1)!important}.tabs button .icon,button>.icon+*{pointer-events:none}.topbar input{color:var(--text)}button:after{background:radial-gradient(circle at var(--mx,50%) var(--my,50%), #fff9 0, #ffffff47 30%, #ffffff1a 65%, #ffffff0a 100%);mix-blend-mode:overlay}[data-theme=dark] button:after{mix-blend-mode:normal;opacity:0}[data-theme=dark] button:hover:not(:disabled):after{opacity:.55}button:not(.ghost):not(.tool):hover:not(:disabled){filter:brightness(1.07)saturate(1.15);box-shadow:0 4px 0 var(--ink), 0 0 0 3px color-mix(in srgb, var(--accent) 60%, transparent)}button:not(.ghost):not(.tool):active:not(:disabled){box-shadow:0 1px 0 var(--ink), 0 0 0 3px color-mix(in srgb, var(--accent) 60%, transparent)}button.ghost:hover:not(:disabled){background:var(--hover);box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--accent) 55%, transparent)}button.danger-solid{background:var(--danger);color:#fff}button.danger-solid>.icon{font-variation-settings:"FILL" 1, "wght" 650, "GRAD" 0, "opsz" 24}.ask{align-items:center;gap:14px;display:flex}.ask-main{flex-direction:column;flex:1;gap:8px;min-width:0;display:flex}.ask p{color:var(--muted);margin:0;line-height:1.45}.ask input{width:100%;padding:7px 10px;font-size:15px}.ask-ic{background:var(--accent);width:48px;height:48px;color:var(--accent-text);border:2px solid var(--ink);box-shadow:0 3px 0 var(--ink);animation:popIn .32s var(--spring) both, wiggle .5s .25s var(--snap);border-radius:15px;flex:none;place-items:center;display:grid}.ask-ic.danger{background:var(--danger);color:#fff}.ask-ic .icon{font-size:28px}.seg{gap:6px;display:inline-flex}.layer-stats{align-items:center;gap:2px;margin-left:6px;font-size:11px;display:inline-flex}.layer-stats .icon{opacity:.7;margin-left:4px}.layer-stats{flex:none}[data-fitted]{overflow-wrap:anywhere;text-overflow:clip!important}