/* Controls sit outside the clip; only the intact artwork is panned or scaled. */
.image-picker-host{position:relative;isolation:isolate}
.image-picker-host[data-image-picker-none='true'],.image-picker-host[data-image-picker-none='true'] .image-picker-viewport{background:#000}
.image-picker-viewport{display:block;position:relative;overflow:clip;isolation:isolate;min-width:0}
.image-picker-viewport-absolute{position:absolute;inset:0}
.image-picker-host img[data-image-framed='true']{object-fit:cover!important;object-position:var(--picker-x,50%) var(--picker-y,50%)!important;scale:var(--picker-scale,1);translate:var(--picker-tx,0px) var(--picker-ty,0px);transform-origin:center center}
.image-picker-host .image-corner{pointer-events:none}
.image-picker-host .image-picker-next{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:inherit;cursor:pointer;appearance:none;box-shadow:none;transform:none;touch-action:auto}
.image-picker-host .image-picker-next:hover{background:transparent;transform:none}
.image-picker-host .image-picker-next:focus-visible{outline:3px solid var(--eup-accent);outline-offset:-6px;background:transparent}
.image-picker-host .image-picker-next:disabled{cursor:default;opacity:1}
.image-picker-host[data-image-picker-framing='true']{overflow:visible;z-index:8}
.image-picker-host[data-image-picker-framing='true'] .image-picker-toolbar{background:#f8faf3}
.image-picker-host[data-image-picker-framing='true'] .image-picker-next{cursor:grab;touch-action:none}
.image-picker-host[data-image-picker-framing='true'] .image-picker-next:active{cursor:grabbing}
.image-picker-host .image-picker-toolbar{touch-action:manipulation;box-sizing:border-box;position:absolute;z-index:4;top:13px;left:13px;right:13px;max-width:500px;padding:8px 10px 7px;background:rgba(248,250,243,.97);border:1px solid rgba(79,99,66,.34);color:#233a32;font:400 12px/1.35 'EUP',Arial,sans-serif;text-align:left;letter-spacing:normal;text-transform:none;box-shadow:0 3px 12px rgba(22,39,26,.09)}
.image-picker-host .image-picker-row{display:flex;align-items:center;gap:8px;min-width:0}
.image-picker-host .image-picker-details{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;margin-bottom:6px}
.image-picker-host .image-picker-title{display:block;flex:1;min-width:0;overflow-wrap:anywhere;white-space:normal;font-size:12px;line-height:1.35;font-weight:500}
.image-picker-host .image-picker-counter{color:#56694b;font-size:10px;font-variant-numeric:tabular-nums;white-space:nowrap}
.image-picker-host .image-picker-number-group{display:flex;align-items:center;justify-content:center;gap:4px;min-width:0;flex:1}
.image-picker-host .image-picker-number-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.image-picker-host .image-picker-number{box-sizing:border-box;width:42px;min-width:0;height:40px;margin:0;padding:6px 3px;border:1px solid #a8b699;border-radius:0;background:#fff;color:#233a32;font:500 12px/1.2 'EUP',Arial,sans-serif;text-align:center;font-variant-numeric:tabular-nums;appearance:textfield;-moz-appearance:textfield}
.image-picker-host .image-picker-number::-webkit-inner-spin-button,.image-picker-host .image-picker-number::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.image-picker-host :is(.image-picker-previous,.image-picker-forward,.image-picker-save,.image-picker-frame,.image-picker-reset,.image-picker-restore){box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-width:40px;min-height:40px;margin:0;padding:8px 10px;border:1px solid #a8b699;border-radius:0;background:#f4f7ed;color:#233a32;font:500 12px/1.2 'EUP',Arial,sans-serif;text-transform:none;letter-spacing:normal;cursor:pointer;appearance:none;box-shadow:none;transform:none}
.image-picker-host :is(.image-picker-previous,.image-picker-forward){padding:7px;font-size:20px;font-weight:400}
.image-picker-host .image-picker-restore{min-height:30px;min-width:0;padding:5px 7px;font-size:10px;white-space:nowrap}
.image-picker-host .image-picker-save{min-width:52px;background:var(--eup-accent);border-color:var(--eup-accent)}
.image-picker-host :is(.image-picker-previous,.image-picker-forward,.image-picker-frame,.image-picker-reset,.image-picker-restore):hover:not(:disabled){background:#e9efdc;transform:none}
.image-picker-host .image-picker-save:hover:not(:disabled){background:color-mix(in srgb,var(--eup-accent) 90%,#203a31);border-color:color-mix(in srgb,var(--eup-accent) 90%,#203a31);transform:none}
.image-picker-host :is(.image-picker-previous,.image-picker-forward,.image-picker-save,.image-picker-frame,.image-picker-reset,.image-picker-restore,.image-picker-zoom,.image-picker-number):focus-visible{outline:2px solid #405b2d;outline-offset:2px}
.image-picker-host :is(.image-picker-previous,.image-picker-forward,.image-picker-save,.image-picker-frame,.image-picker-restore,.image-picker-number):disabled{cursor:default;background:#e2e8d8;border-color:#c2ccb6;color:#627254;opacity:1}
.image-picker-host .image-picker-note{display:flex;align-items:baseline;flex-wrap:wrap;gap:3px 12px;min-width:0;margin-top:5px;color:#56694b;font-size:10px;line-height:1.4}
.image-picker-host .image-picker-hint{flex-shrink:0}
.image-picker-host .image-picker-status{min-width:0;overflow-wrap:anywhere}
.image-picker-host .image-picker-status[data-state='error']{color:#873d2e}
.image-picker-host .image-picker-frame-panel{margin-top:8px;padding-top:8px;border-top:1px solid #cad4c0}
.image-picker-host .image-picker-frame-panel[hidden]{display:none}
.image-picker-host .image-picker-zoom-row{display:flex;align-items:center;gap:9px;min-width:0}
.image-picker-host .image-picker-zoom-label{font-size:11px}
.image-picker-host .image-picker-zoom{display:block;flex:1;min-width:0;width:100%;height:26px;margin:0;padding:0;accent-color:#405b2d;cursor:ew-resize}
.image-picker-host .image-picker-zoom-value{font:11px/1.3 'EUP',Arial,sans-serif;min-width:35px;text-align:right;font-variant-numeric:tabular-nums}
.image-picker-host .image-picker-frame-actions{display:flex;align-items:center;gap:12px;margin-top:6px}
.image-picker-host .image-picker-reset{min-height:34px;padding:7px;font-size:10px}
.image-picker-host .image-picker-frame-help{font-size:10px;line-height:1.4;min-width:0;color:#56694b}
@media(max-width:600px){.image-picker-host .image-picker-toolbar{top:9px;left:9px;right:9px;padding:6px 7px}.image-picker-host .image-picker-row{gap:4px}.image-picker-host .image-picker-details{gap:7px;margin-bottom:4px}.image-picker-host .image-picker-title{font-size:10px}.image-picker-host .image-picker-counter{font-size:9px}.image-picker-host .image-picker-number-group{gap:3px}.image-picker-host .image-picker-number{width:32px}.image-picker-host :is(.image-picker-previous,.image-picker-forward,.image-picker-save,.image-picker-frame){min-width:36px;min-height:40px;padding-inline:6px}.image-picker-host .image-picker-restore{min-height:28px;font-size:9px;padding-inline:6px}.image-picker-host .image-picker-save{min-width:40px}.image-picker-host .image-picker-note{gap:2px 9px;margin-top:4px}.image-picker-host .image-picker-hint,.image-picker-host .image-picker-status{font-size:9px}.image-picker-host .image-picker-frame-actions{gap:8px}.image-picker-host .image-picker-frame-help{font-size:9px}.image-picker-host .image-picker-frame-panel{margin-top:6px;padding-top:6px}}

/* Only the expanded panel leaves small pictures; Done stays on the artwork. */
[data-image-picker-overflow-open]{overflow:visible!important}
@media(max-width:600px){.image-picker-host[data-image-picker-framing="true"] .image-picker-frame-panel{position:absolute;top:var(--picker-panel-top,calc(100% + 8px));left:-1px;right:-1px;margin-top:0;padding:9px;background:#f8faf3;border:1px solid #a8b699;box-shadow:0 3px 12px rgba(22,39,26,.12)}}
