/* Source image only: tilt and zoom never add a generated foil layer. */
.card-zoom-layer{position:relative;flex:none;width:92%;height:92%;transform-origin:center;will-change:transform}
.card-face{position:relative;width:100%;height:100%;border-radius:3.5% / 2.5%;overflow:hidden;isolation:isolate;transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transform-origin:center;will-change:transform;backface-visibility:hidden}
.modalart .card-face img{position:relative;width:100%;height:100%;border-radius:inherit;transform:none;will-change:auto}
.card-face .fallback{display:grid;place-items:center;width:100%;height:100%;font-size:12px}
/* Only discreet icons remain in the heading; no text block covers the card. */
.viewer-actions{display:flex;align-items:center;flex:none;gap:4px}
.card-motion-toggle,.card-zoom-reset{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:10px;border:0;border-radius:10px;color:var(--muted);background:transparent;touch-action:manipulation}
.card-motion-toggle svg,.card-zoom-reset svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.card-motion-toggle[data-motion-active=true]{color:var(--accent)}
.card-motion-toggle:disabled{opacity:.45;cursor:default}
.card-zoom-reset[hidden]{display:none}
.viewer-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(prefers-reduced-motion:reduce){.card-face{transform:none;will-change:auto}.card-zoom-layer{will-change:auto}}
