.art-frame{position:relative;width:100%;container:art/inline-size}.art-frame[data-fit=contain]{height:100%;container-type:size}.art-box{--art-w:var(--art-compact-w);--art-h:var(--art-compact-h);--art-cqw:100cqw;--art-cqh:100cqh;--art-scale:min(tan(atan2(var(--art-cqw),var(--art-w))),tan(atan2(var(--art-max-height,640px),var(--art-h))),var(--art-max-scale,1.5));position:relative;height:calc(var(--art-h) * var(--art-scale))}.art-frame[data-fit=contain] .art-box{--art-scale:min(tan(atan2(var(--art-cqw),var(--art-w))),tan(atan2(var(--art-cqh),var(--art-h))),var(--art-max-scale,1.5));height:100%}.art-stage{position:absolute;left:50%;top:0;width:var(--art-w);height:var(--art-h);translate:-50% 0;transform-origin:top center;scale:var(--art-scale)}.art-frame[data-fit=contain] .art-stage{top:50%;translate:-50% -50%;transform-origin:center}.art-wide{display:none}@container art (min-width: 600px){.art-frame[data-fit=width] .art-box[data-wide]{--art-w:var(--art-wide-w);--art-h:var(--art-wide-h)}.art-frame[data-fit=width] .art-box[data-wide] .art-wide{display:flex}.art-frame[data-fit=width] .art-box[data-wide] .art-narrow{display:none}}@container art (min-width: 600px) and (min-height: 320px){.art-frame[data-fit=contain] .art-box[data-wide]{--art-w:var(--art-wide-w);--art-h:var(--art-wide-h)}.art-frame[data-fit=contain] .art-box[data-wide] .art-wide{display:flex}.art-frame[data-fit=contain] .art-box[data-wide] .art-narrow{display:none}}.art-frame [data-art-motion]{--art-from-x:0px;--art-from-y:16px;--art-from-scale:1;--art-delay:calc(var(--art-i, 0) * var(--art-step, 80ms))}.art-frame [data-art-motion=arrive]{--art-from-y:-16px}.art-frame [data-art-motion=left]{--art-from-x:-24px;--art-from-y:0px}.art-frame [data-art-motion=right]{--art-from-x:24px;--art-from-y:0px}.art-frame [data-art-motion=pop]{--art-from-y:0px;--art-from-scale:0.85}.art-frame [data-art-motion=fade]{--art-from-y:0px}.art-frame [data-art-motion=swap-in]{--art-from-y:0.6em}.art-frame [data-art-motion=slide]{--art-from-x:-20px}.art-frame [data-art-motion=draw-x]{transform-origin:left center}.art-frame [data-art-motion=draw-y]{transform-origin:center top}.art-frame [data-art-motion=swap-out],.art-frame [data-art-motion=sweep]{opacity:0}@keyframes art-enter{0%{opacity:0;translate:var(--art-from-x) var(--art-from-y);scale:var(--art-from-scale)}to{opacity:1;translate:none;scale:none}}@keyframes art-draw-x{0%{scale:0 1}to{scale:none}}@keyframes art-draw-y{0%{scale:1 0}to{scale:none}}@keyframes art-swap-out{0%{opacity:1;translate:none}to{opacity:0;translate:0 -.6em}}@keyframes art-slide{0%{translate:var(--art-from-x) 0}to{translate:none}}@keyframes art-press{0%,to{scale:none}40%{scale:.95}}@keyframes art-sweep{0%{opacity:0;translate:0 0}15%,85%{opacity:1}to{opacity:0;translate:0 var(--art-sweep-distance,160px)}}@media (prefers-reduced-motion:no-preference){.art-frame[data-flow=armed] :is([data-art-motion=rise],[data-art-motion=arrive],[data-art-motion=left],[data-art-motion=right],[data-art-motion=pop],[data-art-motion=fade],[data-art-motion=swap-in]){opacity:0;translate:var(--art-from-x) var(--art-from-y);scale:var(--art-from-scale)}.art-frame[data-flow=armed] [data-art-motion=draw-x]{scale:0 1}.art-frame[data-flow=armed] [data-art-motion=draw-y]{scale:1 0}.art-frame[data-flow=armed] [data-art-motion=swap-out]{opacity:1}.art-frame[data-flow=armed] [data-art-motion=slide]{translate:var(--art-from-x) 0}.art-frame[data-flow=in] :is([data-art-motion=rise],[data-art-motion=arrive],[data-art-motion=left],[data-art-motion=right],[data-art-motion=pop],[data-art-motion=fade],[data-art-motion=swap-in]){transition-property:translate,scale,opacity;transition-duration:var(--transition-duration-steady),var(--transition-duration-steady),var(--transition-duration-slow);transition-timing-function:var(--ease-steady),var(--ease-steady),var(--ease-standard);transition-delay:var(--art-delay)}.art-frame[data-flow=in] :is([data-art-motion=draw-x],[data-art-motion=draw-y]){transition-property:scale;transition-duration:var(--transition-duration-steady);transition-timing-function:var(--ease-steady);transition-delay:var(--art-delay)}.art-frame[data-flow=in] [data-art-motion=swap-out]{translate:0 -.6em;transition-property:translate,opacity;transition-duration:var(--transition-duration-steady),var(--transition-duration-base);transition-timing-function:var(--ease-steady),var(--ease-standard);transition-delay:var(--art-delay)}.art-frame[data-flow=in] [data-art-motion=slide]{transition-property:translate;transition-duration:var(--transition-duration-quick);transition-timing-function:var(--ease-quick);transition-delay:var(--art-delay)}.art-frame[data-entrance=load] [data-art-motion=press],.art-frame[data-flow=in] [data-art-motion=press]{animation-name:art-press;animation-duration:var(--transition-duration-quick);animation-timing-function:var(--ease-quick);animation-delay:var(--art-delay)}.art-frame[data-entrance=load] [data-art-motion=sweep],.art-frame[data-flow=in] [data-art-motion=sweep]{animation-name:art-sweep;animation-duration:var(--transition-duration-steady);animation-timing-function:var(--ease-steady);animation-delay:var(--art-delay);animation-fill-mode:both}.art-frame[data-entrance=load] [data-art-motion]{--art-delay:calc(var(--art-load-delay, 360ms) + var(--art-i, 0) * var(--art-step, 80ms))}.art-frame[data-entrance=load] :is([data-art-motion=rise],[data-art-motion=arrive],[data-art-motion=left],[data-art-motion=right],[data-art-motion=pop],[data-art-motion=fade],[data-art-motion=swap-in]){animation-name:art-enter;animation-duration:var(--transition-duration-steady);animation-timing-function:var(--ease-steady);animation-fill-mode:both;animation-delay:var(--art-delay)}.art-frame[data-entrance=load] [data-art-motion=draw-x]{animation-name:art-draw-x;animation-duration:var(--transition-duration-steady);animation-timing-function:var(--ease-steady);animation-fill-mode:both;animation-delay:var(--art-delay)}.art-frame[data-entrance=load] [data-art-motion=draw-y]{animation-name:art-draw-y;animation-duration:var(--transition-duration-steady);animation-timing-function:var(--ease-steady);animation-fill-mode:both;animation-delay:var(--art-delay)}.art-frame[data-entrance=load] [data-art-motion=slide]{animation-name:art-slide;animation-duration:var(--transition-duration-quick);animation-timing-function:var(--ease-quick);animation-fill-mode:both;animation-delay:var(--art-delay)}.art-frame[data-entrance=load] [data-art-motion=swap-out]{animation-name:art-swap-out;animation-duration:var(--transition-duration-steady);animation-timing-function:var(--ease-steady);animation-fill-mode:both;animation-delay:var(--art-delay)}}