/* assets/imgmin.css */
.nr-imgmin{
  --im-bg: var(--wp--preset--color--base, #fff);
  --im-surface: color-mix(in oklab, var(--im-bg), black 6%);
  --im-text: var(--wp--preset--color--contrast, inherit);
  --im-muted: color-mix(in oklab, var(--im-text), transparent 55%);
  --im-primary: var(--wp--preset--color--primary, #0a66c2);
  --im-border: color-mix(in oklab, var(--im-text), transparent 80%);
  color: var(--im-text);
}

.nr-imgmin__title{margin:0 0 .5rem 0; font-weight:600}
.nr-imgmin__intro{margin:0 0 1rem 0; color:var(--im-muted)}

.nr-imgmin__grid{display:grid; gap:1rem; grid-template-columns:1fr}
@media(min-width: 900px){.nr-imgmin__grid{grid-template-columns: 1fr 1fr}}

.nr-imgmin__card{background:var(--im-surface); border:1px solid var(--im-border); border-radius:8px; padding:1rem}
.nr-imgmin__card-title{margin:0 0 .6rem 0; font-weight:600}

.nr-imgmin__drop{position:relative; border:2px dashed var(--im-border); border-radius:8px; min-height:120px; display:flex; align-items:center; justify-content:center; padding:1rem; background:var(--im-bg); cursor:pointer}
.nr-imgmin__drop:focus{outline:2px solid var(--im-primary)}
.nr-imgmin__file{position:absolute; inset:0; opacity:0; cursor:pointer}
.nr-imgmin__drop-text{text-align:center; color:var(--im-muted)}
.nr-imgmin__drop-text strong{color:var(--im-text)}
.nr-imgmin__link{color:var(--im-primary)}

.nr-imgmin__label{display:block; margin:.6rem 0; font-size:.95em}
.nr-imgmin__input, .nr-imgmin__select{width:100%; padding:.55rem .7rem; border:1px solid var(--im-border); border-radius:6px; background:var(--im-bg); color:inherit; font:inherit; box-sizing:border-box}
.nr-imgmin__check{display:inline-flex; align-items:center; gap:.5rem; margin:.4rem 0}

.nr-imgmin__range{width:100%}
.nr-imgmin__range-val{font-size:.9em; color:var(--im-muted)}

.nr-imgmin__actions{display:flex; gap:.6rem; margin-top:.8rem; flex-wrap:wrap}
.nr-imgmin__btn{appearance:none; border:1px solid var(--im-primary); background:var(--im-primary); color:#fff; padding:.5rem .9rem; border-radius:6px; cursor:pointer; font:inherit}
.nr-imgmin__btn--alt{background:transparent; color:var(--im-primary)}
.nr-imgmin__btn--ghost{background:transparent; color:inherit; border-color:var(--im-border)}

.nr-imgmin__previews{display:grid; grid-template-columns:1fr 1fr; gap:.8rem}
.nr-imgmin__figure{margin:0}
.nr-imgmin__figure figcaption{font-size:.9em; color:var(--im-muted); margin-bottom:.3rem}
.nr-imgmin__figure img{width:100%; max-height:360px; object-fit:contain; background:var(--im-bg); border:1px solid var(--im-border); border-radius:6px}

.nr-imgmin__meta{margin-top:.6rem; font-size:.95em}
.nr-imgmin__error{color:#b00020; min-height:1.25em; margin-top:.4rem}

/* Modal */
.nr-imgmin__modal[aria-hidden="false"]{display:block}
.nr-imgmin__modal[hidden]{display:none}
.nr-imgmin__modal{position:fixed; inset:0; z-index:9999}
.nr-imgmin__modal-backdrop{position:absolute; inset:0; background:rgba(0,0,0,.5)}
.nr-imgmin__modal-dialog{position:absolute; inset:auto; left:50%; top:50%; transform:translate(-50%,-50%); width:min(96vw, 1000px); background:var(--im-bg); border:1px solid var(--im-border); border-radius:10px; overflow:hidden; display:flex; flex-direction:column}
.nr-imgmin__modal-header, .nr-imgmin__modal-footer{padding:.6rem .8rem; background:var(--im-surface); border-bottom:1px solid var(--im-border)}
.nr-imgmin__modal-footer{border-top:1px solid var(--im-border); border-bottom:none; display:flex; gap:.6rem; justify-content:flex-end}
.nr-imgmin__modal-title{margin:0; font-weight:600}
.nr-imgmin__modal-close{appearance:none; background:transparent; border:none; font-size:1.25rem; margin-left:auto; cursor:pointer}
.nr-imgmin__modal-body{padding:.6rem .8rem}

.nr-imgmin__cropbar{display:flex; gap:1rem; align-items:center; margin-bottom:.5rem}
.nr-imgmin__cropwrap{width:100%; overflow:auto}
.nr-imgmin__cropcanvas{width:100%; height:auto; background:#111}

/* Crop overlays/handles (drawn on canvas; CSS here for general look) */

.nr-imgmin *{box-sizing:border-box}