.modal.has-hero{--hero-h:116px;--hero-out:66px;max-height:none;margin-top:var(--hero-out);flex-direction:column;padding:0;display:flex;position:relative;overflow:visible}.modal.has-hero>.modal-hero{width:var(--hero-h);height:var(--hero-h);transform:translate(-50%, calc(-1 * var(--hero-out)));pointer-events:none;z-index:2;position:absolute;top:0;left:50%}.modal-hero>img,.modal-hero>.art-fallback{object-fit:contain;filter:drop-shadow(0 10px 12px #00000047);place-items:center;width:100%;height:100%;font-size:72px;line-height:1;animation:.6s cubic-bezier(.2,1.6,.4,1) 80ms both hero-pop;display:grid}.modal.has-hero>.modal-scroll{overscroll-behavior:contain;scrollbar-width:thin;min-height:0;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;overflow-y:auto}@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}}