@font-face{font-family:Arketa;src:url(/OOArketa-Regular.otf)format("opentype");font-weight:400;font-style:normal;font-display:swap}:root{--font:"Arketa", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--bg:#fff;--bg-subtle:#f5f5f3;--border:#e8e8e6;--border-mid:#d4d4d0;--text:#000;--text-dim:#3a3a3a;--text-muted:#999994;--fs-body:.88rem;--fs-caption:.72rem}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font);font-size:var(--fs-body);color:var(--text-dim);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}button,input,select,textarea{font-family:inherit}::selection{color:inherit;background:#c5d5e8}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ccc;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#aaa}input:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:0;outline:2px solid #888}button:focus-visible{outline-offset:2px;outline:2px solid #555}.app{grid-template-rows:1fr auto;grid-template-columns:320px 1fr;height:100vh;display:grid}.sidebar{background:var(--bg);border-right:1px solid var(--border);grid-row:1/3;overflow-y:auto}.brand{align-items:baseline;gap:8px;padding:18px 18px 6px;display:flex}.brand h1{color:var(--text);letter-spacing:.5px;font-size:1rem;font-weight:400}.brand .muted{color:var(--text-muted);font-size:var(--fs-caption)}.drop{border:1px dashed var(--border-mid);text-align:center;color:var(--text-muted);font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:.6px;cursor:pointer;border-radius:4px;margin:8px 18px 12px;padding:16px;display:block}.drop input{display:none}.drop:hover{border-color:var(--text-dim);color:var(--text-dim)}.sec{border-top:1px solid var(--border)}.sec-head{cursor:pointer;width:100%;font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:1px;color:var(--text);background:0 0;border:none;justify-content:space-between;align-items:center;padding:14px 18px 6px;display:flex}.sec-head .chev{color:var(--text-muted);font-size:10px}.sec-body{padding:8px 18px 16px}.row2{grid-template-columns:1fr 1fr;gap:8px;display:grid}.row3{grid-template-columns:1fr 1fr 1fr;gap:6px;display:grid}.grid4{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}button{font-family:inherit}.pill{background:var(--bg);color:var(--text-dim);border:1px solid var(--border);font-size:var(--fs-body);cursor:pointer;text-transform:uppercase;letter-spacing:.6px;font-size:var(--fs-caption);border-radius:3px;padding:10px 8px;transition:background .12s,border-color .12s}.pill:hover{background:var(--bg-subtle)}.pill.active{background:var(--bg-subtle);border-color:var(--text);color:var(--text)}.pill.danger{color:#b04444;border-color:#e8b8b8}.pill.danger:hover{background:#fbecec}.pill:disabled{opacity:.4;cursor:not-allowed}.primary{background:var(--bg);width:100%;color:var(--text);border:1.5px solid var(--text);font-size:var(--fs-body);cursor:pointer;border-radius:3px;margin-top:12px;padding:12px;transition:background .12s}.primary:hover{background:var(--bg-subtle)}.primary:disabled{opacity:.35;cursor:not-allowed;background:var(--bg)}.ghost{border:1px solid var(--border);width:100%;color:var(--text-dim);font-size:var(--fs-body);cursor:pointer;background:0 0;border-radius:3px;margin-top:6px;padding:10px}.ghost:hover{background:var(--bg-subtle)}.ghost:disabled{opacity:.4;cursor:not-allowed}.slider{margin:8px 0 12px}.slider-row{font-size:var(--fs-body);color:var(--text-dim);justify-content:space-between;margin-bottom:6px;display:flex}.slider-row .value{color:var(--text)}.slider input[type=range]{width:100%;accent-color:var(--text)}.swatches{grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:10px;display:grid}.swatch{aspect-ratio:1;border:1px solid var(--border);cursor:pointer;border-radius:3px;padding:0}.swatch.active{outline:2px solid var(--text);outline-offset:1px}.custom-row{grid-template-columns:auto 28px 28px 1fr;align-items:center;gap:6px;display:grid}.custom-label{font-size:var(--fs-body);color:var(--text-dim)}.color-well{border:1px solid var(--border);cursor:pointer;border-radius:3px;width:28px;height:28px;display:block;overflow:hidden}.color-well input[type=color]{opacity:0;cursor:pointer;border:none;width:100%;height:100%}.hex{border:1px solid var(--border);font-family:inherit;font-size:var(--fs-caption);color:var(--text);background:#fbecec;border-radius:3px;width:100%;padding:6px 8px}.fmt{background:var(--bg);border:1px solid var(--border);color:var(--text-dim);font-size:var(--fs-caption);cursor:pointer;border-radius:3px;flex-direction:column;align-items:center;gap:4px;padding:10px 4px 8px;transition:background .12s,border-color .12s;display:flex}.fmt:hover{background:var(--bg-subtle)}.fmt.active{background:var(--bg-subtle);border-color:var(--text);color:var(--text)}.res{background:var(--bg);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;border-radius:3px;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;display:flex}.res strong{color:var(--text);font-weight:400;font-size:var(--fs-body)}.res span{font-size:var(--fs-caption);color:var(--text-muted)}.res.active{background:var(--bg-subtle);border-color:var(--text)}.res.active span{color:var(--text-dim)}.count{font-size:var(--fs-body);color:var(--text-dim);margin:10px 0 6px}.count strong{color:var(--text);font-weight:400}.folder-row{justify-content:space-between;align-items:center;gap:8px;margin:6px 0;display:flex}.folder-name{font-size:var(--fs-body);color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.folder-row .pill{flex:none;padding:8px 10px}.hint{font-size:var(--fs-caption);color:var(--text-muted);margin-top:4px;line-height:1.4}.select-fileformat{background:var(--bg);border:1px solid var(--border);width:100%;font-size:var(--fs-body);color:var(--text-dim);cursor:pointer;border-radius:3px;margin-top:10px;padding:8px 10px}.stage{background:var(--bg-subtle);justify-content:center;align-items:center;padding:28px;display:flex;overflow:hidden}.stage canvas{object-fit:contain;max-width:100%;max-height:100%;box-shadow:0 1px 2px #0000000a,0 4px 16px #0000000f}.empty{color:var(--text-muted);font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:.8px}.strip{background:var(--bg);border-top:1px solid var(--border);gap:6px;padding:10px 14px;display:flex;overflow-x:auto}.thumb{border:1px solid var(--border);background:var(--bg-subtle);cursor:pointer;border-radius:3px;flex:none;width:52px;height:52px;padding:0;position:relative;overflow:hidden}.thumb img{object-fit:cover;width:100%;height:100%}.thumb.active{border-color:var(--text)}.thumb.selected{outline:2px solid var(--text);outline-offset:1px}.thumb .check{color:#fff;background:var(--text);border-radius:50%;justify-content:center;align-items:center;width:14px;height:14px;font-size:10px;display:flex;position:absolute;top:2px;right:4px}