.hero-drawing{position:relative;aspect-ratio:16/9;background:#fff;margin:10px;overflow:hidden;border-radius:6px}
.canvas .hero-drawing>img,.hero-drawing>video{display:block;width:100%;height:100%;aspect-ratio:16/9;object-fit:contain;padding:0;margin:0}
.hero-drawing>video{position:absolute;inset:0;opacity:0;pointer-events:none}
.hero-drawing.has-played>video{opacity:1}.hero-drawing.has-played>img{visibility:hidden}
.hero-animation-toggle{position:absolute;bottom:10px;right:10px;z-index:1;background:#fff;color:#173e3c;border:1px solid #a5bab4;box-shadow:0 2px 10px #142a3a12;border-radius:20px;font:600 12px/1.2 Arial,sans-serif;padding:9px 13px;cursor:pointer}
.hero-animation-toggle[hidden]{display:none}.hero-animation-toggle:focus-visible{outline:3px solid #006e68;outline-offset:3px}
.hero-drawing [role=status]{position:absolute;left:10px;bottom:10px;right:110px;font-size:11px;line-height:1.4;background:#fff;color:#526473;margin:0}
.hero-drawing [role=status]:empty{display:none}