@property --ribbon-x{syntax:"<length>";inherits:false;initial-value:0}.ribbon{--ribbon-card:49.4vw;--ribbon-gap:1.95vw;--ribbon-step:calc(var(--ribbon-card) + var(--ribbon-gap));--ribbon-rise:calc(var(--ribbon-step) * .1407);--ribbon-w:711;--ribbon-h:460;--ribbon-ink:var(--ink-on-paper);--ribbon-frame:calc(var(--ribbon-card) * var(--ribbon-h) / var(--ribbon-w));--ribbon-band:calc(var(--ribbon-frame) + 4 * var(--ribbon-rise));--ribbon-slide:calc(100vh + var(--ribbon-band));block-size:var(--ribbon-band);view-timeline-name:--ribbon;view-timeline-axis:block;position:relative;overflow:clip}.ribbon__track{position:absolute;inset-block-end:calc(var(--ribbon-rise) * 2);inset-inline-start:0}@supports (animation-timeline:view()){.ribbon__track{animation:linear both ribbon-in;animation-timeline:--ribbon;animation-range:cover}}@keyframes ribbon-in{0%{translate:calc(var(--ribbon-slide) / -2) calc(var(--ribbon-slide) / -2 * -.1407)}to{translate:calc(var(--ribbon-slide) / 2) calc(var(--ribbon-slide) / 2 * -.1407)}}.ribbon__pager{gap:var(--ribbon-gap);inline-size:max-content;translate:calc(var(--ribbon-x,0px) + 50cqi - var(--ribbon-card) / 2) calc(var(--ribbon-x,0px) * -.1407);touch-action:pan-y;cursor:grab;-webkit-user-select:none;user-select:none;margin:0;padding:0;list-style:none;display:flex}.ribbon__pager:active{cursor:grabbing}.ribbon__tile{inline-size:var(--ribbon-card);aspect-ratio:var(--ribbon-w) / var(--ribbon-h);translate:calc(var(--ribbon-k,0) * var(--ribbon-tiles) * var(--ribbon-step)) calc(var(--ribbon-i) * var(--ribbon-rise) * -1);content-visibility:auto;flex:none;position:relative;overflow:clip}.ribbon__tile[data-near]{content-visibility:visible}.ribbon__tile picture{display:contents}.ribbon__img{object-fit:cover;block-size:100%;inline-size:100%;position:absolute;inset:0}@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.ribbon__img{transform-origin:50% 100%;animation:linear both ribbon-settle;animation-timeline:--ribbon;animation-range:entry cover 70%}}}@keyframes ribbon-settle{0%{scale:1.15}to{scale:1}}.ribbon__nav{gap:0;display:flex;position:absolute;inset-block-end:clamp(4.5rem,7vw,6.5rem);inset-inline-end:max(var(--container-pad), env(safe-area-inset-right,0px))}.ribbon__arrow{aspect-ratio:1;border:1px solid color-mix(in srgb, var(--ribbon-ink) 16%, transparent);inline-size:5rem;color:var(--ribbon-ink);cursor:pointer;background:0 0;border-radius:50%;place-items:center;padding:0;transition:border-color .25s;display:grid;position:relative}.ribbon__arrow:first-child{transform:translate(1rem)}.ribbon__arrow:hover{border-color:color-mix(in srgb, var(--ribbon-ink) 40%, transparent)}.ribbon__icon{block-size:1.55rem;inline-size:1.55rem;position:relative}.ribbon__ring{pointer-events:none;block-size:100%;inline-size:100%;position:absolute;inset:0;overflow:visible}.ribbon__ring rect{fill:none;stroke-width:1px;stroke-dasharray:321%;transform-origin:50%}.ribbon__status{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;margin:0;position:absolute;overflow:hidden}@media (max-width:767.98px){.ribbon{--ribbon-card:86vw;--ribbon-gap:3vw;--ribbon-w:5;--ribbon-h:4}.ribbon__track{animation:none;translate:none}.ribbon__tile{background:var(--ribbon-lqip) 25% 50% / cover no-repeat;content-visibility:visible}.ribbon__pager[data-live]{will-change:translate}.ribbon__img{object-position:25% 50%;animation:none;scale:none}}@media (prefers-reduced-motion:reduce){.ribbon__track{animation:none;translate:none}.ribbon__pager{transition:none}}
