.modal.has-hero{--hero-h: 116px;--hero-out: 66px;position:relative;overflow:visible;padding:0;max-height:none;margin-top:var(--hero-out);display:flex;flex-direction:column}.modal.has-hero>.modal-hero{position:absolute;left:50%;top:0;width:var(--hero-h);height:var(--hero-h);transform:translate(-50%,calc(-1 * var(--hero-out)));pointer-events:none;z-index:2}.modal-hero>img,.modal-hero>.art-fallback{display:grid;place-items:center;width:100%;height:100%;object-fit:contain;font-size:72px;line-height:1;filter:drop-shadow(0 10px 12px rgba(0,0,0,.28));animation:hero-pop .6s .08s cubic-bezier(.2,1.6,.4,1) both}.modal.has-hero>.modal-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;max-height:calc(100vh - 40px - var(--hero-out));max-height:calc(100dvh - 40px - var(--hero-out));padding:calc(var(--hero-h) - var(--hero-out) + 2px) 18px 16px;border-radius:inherit}@keyframes hero-pop{0%{opacity:0;transform:translateY(26px) scale(.5)}60%{opacity:1;transform:translateY(-6px) scale(1.06)}to{transform:none}}@media(max-height:700px){.modal.has-hero{--hero-h: 96px;--hero-out: 54px}}@media(prefers-reduced-motion:reduce){.modal-hero>img,.modal-hero>.art-fallback{animation:none}}