*{box-sizing:border-box}body{color:#eee;background:#1c1c1e;margin:0;font-family:system-ui,sans-serif}.toolbar{border-bottom:1px solid #333;align-items:center;gap:24px;padding:12px 24px;display:flex}.toolbar h1{margin:0;font-size:20px}.file-button,button,.slider,.toolbar h1{white-space:nowrap}.file-button,button{color:inherit;font:inherit;cursor:pointer;background:#2c2c2e;border:1px solid #555;border-radius:6px;padding:8px 14px}button:disabled{opacity:.4;cursor:default}.slider{align-items:center;gap:8px;display:flex}.message{background:#5a1f1f;border-radius:6px;margin:12px 24px 0;padding:8px 12px}.workspace{grid-template-columns:1fr 1fr;gap:24px;height:calc(100vh - 70px);padding:24px;display:grid}.panel{justify-content:center;align-items:center;min-height:0;display:flex;container-type:size}.panel>*{flex:none}.original{border:2px dashed #444;border-radius:8px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.original.dragover{border-color:#aaa}.placeholder{color:#888}.original img{object-fit:contain;max-width:100%;max-height:100%}.grid{grid-template-columns:repeat(var(--columns,1), 1fr);width:min(100cqw, 100cqh * var(--columns,1) / var(--rows,1));width:round(down, min(100cqw, 100cqh * var(--columns,1) / var(--rows,1)), calc(var(--columns,1) * 1px));display:grid}.tile{aspect-ratio:1;cursor:grab}.tile.dragging{opacity:.4}.tile.drop-target{box-shadow:inset 0 0 0 3px #fff}.tile.selected{box-shadow:inset 0 0 0 3px #000,inset 0 0 0 5px #fff}.hint{color:#888;margin:0 0 0 auto;font-size:13px}