.upload-drop-zone{display:block;padding:27px 20px;text-align:center;border:2px dashed color-mix(in srgb,var(--content-bg) 65%,var(--content-text) 35%);border-radius:9px;background:color-mix(in srgb,var(--content-bg) 96%,var(--content-text) 4%);color:var(--content-text);cursor:pointer;font-size:14px;font-weight:600;transition:background-color .15s,border-color .15s;margin-bottom:16px}
.upload-drop-zone small{display:block;margin-top:6px;font-size:12px;font-weight:400;opacity:.75}
.upload-drop-zone:hover,.upload-drop-zone.is-dragging{border-color:#42648a;background:color-mix(in srgb,var(--content-bg) 90%,#42648a 10%)}
.upload-drop-zone:focus-visible{outline:3px solid #42648a;outline-offset:4px}
[data-upload-status]{font-size:12px;margin:0 0 16px;overflow-wrap:anywhere}
.upload-status-error{color:#9a3442;font-weight:600}
.image-viewer{border:1px solid color-mix(in srgb,var(--content-bg) 82%,var(--content-text) 18%);border-radius:10px;overflow:hidden;margin-bottom:24px;background:var(--content-bg);color:var(--content-text)}
.image-viewer-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid color-mix(in srgb,var(--content-bg) 82%,var(--content-text) 18%)}
.image-viewer-toolbar[hidden]{display:none}
[data-zoom-label]{display:inline-block;min-width:48px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums}
.image-viewer-toolbar button:disabled{opacity:.45;cursor:default}
.image-viewport{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:clamp(280px,65vh,760px);overflow:hidden;background:#e9edf2;touch-action:none;user-select:none}
.image-viewport:focus-visible{outline:3px solid #42648a;outline-offset:-3px}
.image-viewport .viewer-image{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.image-viewer-ready .image-viewport .viewer-image{position:absolute;left:0;top:0;max-width:none;max-height:none;object-fit:initial;transform-origin:0 0;will-change:transform;pointer-events:none}
.image-viewport.can-pan{cursor:grab}
.image-viewport.is-panning{cursor:grabbing}
.image-viewer-help{margin:0;padding:10px 14px;border-top:1px solid color-mix(in srgb,var(--content-bg) 82%,var(--content-text) 18%);font-size:11px;opacity:.7}
@media(max-width:760px){.image-viewport{height:clamp(280px,55vh,600px)}.image-viewer-toolbar{padding:10px;gap:6px}.image-viewer-toolbar .btn{padding:7px 10px}.upload-drop-zone{padding:24px 15px}}