
.backglass-motion { position:relative; width:100%; order:0; }
.backglass-motion video { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.backglass-motion [hidden] { display:none!important; }
.backglass-motion.is-playing img { visibility:hidden; }
.backglass-motion button { position:absolute; bottom:1rem; right:1rem; z-index:3; min-height:44px; padding:.65rem 1rem; border:2px solid white; border-radius:.3rem; background:#17120e; color:white; font:bold 1rem/1.3 sans-serif; cursor:pointer; pointer-events:auto; }
.backglass-motion button:focus-visible { outline:3px solid #ffdc55; outline-offset:3px; }

/* Reserve a separate control row below the artwork. */
.backglass-motion{margin-bottom:5rem}
.backglass-motion.backglass-motion button{top:calc(100% + .75rem);bottom:auto;right:auto;left:50%;transform:translateX(-50%);white-space:nowrap}

body[data-character-edges] .guide-character-art.backglass-motion{margin-bottom:5rem!important}

/* Illustrated feature clips: the control sits in its own row under the picture. */
.backglass-motion.feature-motion{display:grid;margin-bottom:1.5rem}
.backglass-motion.feature-motion .feature-motion-frame{position:relative;grid-area:1/1}
.backglass-motion.feature-motion .feature-motion-frame>a,
.backglass-motion.feature-motion .feature-motion-frame>img{display:block;width:100%}
.backglass-motion.feature-motion video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.backglass-motion.backglass-motion.feature-motion button{position:static;grid-area:2/1;top:auto;right:auto;bottom:auto;left:auto;transform:none;justify-self:center;margin-top:.75rem}
