/* Keep the saved composition visible at every card size. */
.product-art>img{object-fit:contain}
.product-image-field{min-width:0}
.image-saved{display:flex;align-items:center;gap:16px;padding:14px;margin-top:14px;border:1px solid var(--line);border-radius:12px}
.image-saved>img{width:130px;max-height:110px;object-fit:contain;border-radius:8px}
.image-saved-actions{display:flex;align-items:flex-start;flex-direction:column;gap:9px;min-width:0}
.image-saved-actions>span{font-size:.85rem;color:var(--muted)}
.image-editor{min-width:0;margin:18px 0 0;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--bg)}
.image-editor legend{padding:0 8px;font-weight:700;color:var(--accent)}
.image-editor .hint{margin:0 0 12px}
.image-editor select{margin-bottom:12px}
.image-dimensions{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:12px}
.image-dimensions>span{padding-bottom:20px;color:var(--muted)}
.image-dimensions input{direction:ltr;margin-top:6px;text-align:center;font-variant-numeric:tabular-nums}
.image-editor input[type=range]{width:100%;padding:0;min-height:32px;border:0;accent-color:var(--accent);cursor:pointer}
.image-editor input[type=range]:disabled{opacity:.4;cursor:default}
.image-editor output{float:left;font-size:.85rem;color:var(--accent)}
.image-position-controls{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.image-crop-controls{margin:0 0 14px}
.image-canvas-stage{display:flex;justify-content:center;align-items:center;min-height:120px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--panel);overflow:hidden}
.image-canvas-stage canvas{display:block;max-width:100%;height:auto;border:1px solid var(--line);background-color:#e5e7eb;background-image:conic-gradient(#c9cdd3 25%,transparent 0 50%,#c9cdd3 0 75%,transparent 0);background-size:18px 18px}
.image-canvas-stage canvas.is-croppable{touch-action:none;cursor:grab}
.image-canvas-stage canvas.is-croppable:active{cursor:grabbing}
.image-dimension-note{font-size:.85rem;text-align:center;color:var(--accent);margin:10px 0}
.image-editor-actions{display:flex;flex-wrap:wrap;gap:8px}
.image-editor-status{font-size:.9rem;margin:10px 0 0;color:var(--accent)}
.product-image-field [hidden]{display:none!important}
.product-image-field[aria-busy=true]{cursor:progress}
@media(max-width:600px){.image-editor{padding:12px}.image-dimensions{gap:8px}.image-saved{gap:10px;padding:10px}.image-saved>img{width:90px}.image-saved-actions .btn{font-size:.8rem}.image-editor-actions .btn{flex:1 1 auto}.image-position-controls{gap:10px}}
