/* Restore direct image rendering: no SVG filter or external mask dependency. */
.storybook .story-art{position:relative;display:block;width:100%;max-width:none;aspect-ratio:4/3;min-width:0;background:transparent;border:0;box-shadow:none;overflow:visible;}
.storybook .story-art img{position:absolute;inset:0;display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;opacity:1;visibility:visible;filter:none;-webkit-mask-image:none;mask-image:none;transform:scale(1);transition:transform .7s cubic-bezier(.22,1,.36,1);}
.storybook .story-detail img{inset:8%;width:84%;height:84%;}
/* Native CSS gradients have no downloadable asset that can fail closed.
   Browsers lacking the compositing support keep the complete original image. */
@supports (mask-composite:intersect) or (-webkit-mask-composite:source-in){
 .storybook .story-art img{
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%),linear-gradient(0deg,transparent 0%,#000 5%,#000 95%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%),linear-gradient(0deg,transparent 0%,#000 5%,#000 95%,transparent 100%);
  -webkit-mask-size:100% 100%;mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-composite:source-in;mask-composite:intersect;
 }
}
.storybook .story-image-gallery .story-art{max-width:640px;}
@media(hover:hover) and (pointer:fine){.storybook .story-art:hover img{transform:scale(1.025);}}
@media(max-width:640px){
 .storybook .story-art{width:100%;max-width:none;align-self:stretch;aspect-ratio:4/3;}
 .storybook .story-image-gallery .story-art{max-width:none;}
 .storybook .story-art img{transition:none;transform:none;}
}
@media(prefers-reduced-motion:reduce){.storybook .story-art img{transition:none!important;transform:none!important;}}