/* Touch actions are supplementary: ordinary taps, scrolling and existing menus remain. */
@media (max-width: 760px) {
    .pin .pin-visual { touch-action: pan-y; -webkit-touch-callout: none; }
    .pin .pin-visual img { -webkit-user-drag: none; -webkit-touch-callout: none; }
}
.pin-gesture-active { -webkit-user-select: none; user-select: none; }
.pin-gesture-overlay { position: fixed; inset: 0; z-index: 2500; pointer-events: none; }
.pin-gesture-scrim { position: absolute; inset: 0; background: rgb(0 0 0 / 62%); animation: pin-gesture-reveal 110ms ease-out; }
.pin-gesture-clone {
    position: fixed !important; margin: 0 !important; padding: 0 !important;
    border: 0 !important; outline: 0 !important; background: transparent !important;
    border-radius: 14px; overflow: hidden; pointer-events: none !important;
    transform: scale(1.025); transform-origin: center; box-shadow: 0 8px 28px #0004;
}
.pin-gesture-clone > .pin-open { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; outline: 0; }
.pin-gesture-clone img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pin-gesture-overlay .pin-gesture-action {
    position: fixed; width: 48px; height: 48px; min-width: 48px; padding: 0;
    display: grid; place-items: center; border: 0; border-radius: 50%;
    background: #fff; color: #242424; box-shadow: 0 2px 9px #0003;
    outline: 0; pointer-events: none; -webkit-touch-callout: none;
    transform: scale(1); transition: transform 100ms ease, background-color 100ms ease, color 100ms ease;
    animation: pin-gesture-reveal 110ms ease-out;
}
.pin-gesture-action svg { width: 24px; height: 24px; }
.pin-gesture-overlay .pin-gesture-action.is-target { background: #e60023; color: #fff; transform: scale(1.08); }
.pin-gesture-overlay .pin-gesture-action:disabled { opacity: .48; }
.pin-gesture-label {
    position: absolute; top: 54px; left: 50%; transform: translateX(-50%);
    color: #fff; font: 600 11px/14px system-ui, sans-serif; white-space: nowrap;
    text-shadow: 0 1px 3px #000c;
}
@keyframes pin-gesture-reveal { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
    .pin-gesture-scrim, .pin-gesture-overlay .pin-gesture-action { animation: none; transition: none; }
}
.pin-gesture-clone .asset-frame { width: 100%; height: 100%; max-height: none; aspect-ratio: auto; }