/* View transforms never change the image/canvas pixel dimensions. */
.image-frame {transform-origin:50% 50%;direction:ltr;unicode-bidi:isolate;}
.image-stage {touch-action:none;overscroll-behavior:contain;direction:ltr;}
.image-stage:focus-visible {outline:2px solid #9dccaf;outline-offset:3px;}
.image-stage[data-pan="true"] {cursor:grab;}
.image-stage[data-panning="true"] {cursor:grabbing;}
.image-stage[data-pan="true"] #mask-canvas {pointer-events:none;cursor:inherit;}
#brush-cursor[data-mode="erase"] {background:transparent;border-style:dashed;box-shadow:0 0 0 1px #111;}
.view-controls {display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 6px;color:#e4eee7;}
.view-controls button {border:1px solid #65766a;border-radius:6px;background:#263d30;color:#fff;min-width:38px;min-height:38px;padding:6px 12px;font:inherit;font-size:12px;cursor:pointer;}
.view-controls label {display:flex;align-items:center;gap:8px;font-size:12px;min-width:0;}
.view-controls input {width:clamp(70px,12vw,150px);accent-color:#b6d4bd;direction:ltr;}
.view-controls output {min-width:4ch;text-align:end;font-variant-numeric:tabular-nums;direction:ltr;}
.view-controls button:disabled {opacity:.4;cursor:default;}
.view-controls :focus-visible,.mask-tools button:focus-visible {outline:2px solid #b5d4b8;outline-offset:3px;}
.view-hint {margin:0 0 12px;font-size:11px;color:#b4c2b7;line-height:1.6;}
.mask-tools {display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 8px;}
.mask-tools button {flex:1;min-height:40px;padding:8px 6px;border:1px solid #b7c5bb;border-radius:6px;background:#fff;color:#234a3c;font:inherit;font-size:12px;cursor:pointer;}
.mask-tools button[aria-pressed="true"] {background:#234a3c;color:#fff;border-color:#234a3c;}
.mask-tools button:disabled {opacity:.45;cursor:default;}
.mask-tool-note {font-size:11px;line-height:1.6;color:#5b6b60;margin:0 0 18px;}
@media(max-width:680px){.view-controls{gap:6px}.view-controls label{font-size:11px;gap:5px}.view-controls input{width:75px}.view-controls button{padding:6px 9px}.view-hint{font-size:10px}.mask-tools button{min-height:44px}}

.mask-tools button,.view-controls button {touch-action:manipulation;}