.bento-reel{--bento-gap:clamp(8px, 1.65cqw, 13px);--bento-radius:clamp(10px, 1.95cqw, 15px);box-sizing:border-box;background:var(--shell-white);width:100%;height:100%;position:relative;overflow:hidden;container-type:inline-size}.bento-reel__canvas,.bento-reel__scenes,.bento-reel__grid{width:100%;height:100%}.bento-reel__canvas{inset:var(--bento-gap);width:auto;height:auto;position:absolute}.bento-reel__scenes{position:relative}.bento-reel__grid{gap:var(--bento-gap);visibility:hidden;grid-template-rows:repeat(2,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));display:grid;position:absolute;inset:0}.bento-reel__grid[data-active=true]{visibility:visible}.bento-reel__tile,.bento-reel__tile figure{background:var(--shell-white);min-width:0;min-height:0;margin:0;position:relative;overflow:hidden}.bento-reel__tile{border-radius:var(--bento-radius);isolation:isolate;width:100%;height:100%}.bento-reel__tile img{object-fit:cover;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}.bento-reel__tile[data-fit=contain] img{object-fit:contain;padding:20%}.bento-reel__tile[data-fit=contain]{background:#0b0b0e}.bento-reel__tile:after,.bento-reel__tile figure:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #0a0a0c12}.bento-reel__tile--stack{gap:var(--bento-gap);background:0 0;grid-template-columns:repeat(2,minmax(0,1fr));display:grid;overflow:visible}.bento-reel__tile--stack:after{display:none}.bento-reel__tile--stack figure{border-radius:var(--bento-radius)}.bento-reel__stack-pair{gap:var(--bento-gap);grid-template-rows:repeat(2,minmax(0,1fr));min-width:0;min-height:0;display:grid}.bento-reel__strip-window{z-index:2;background:var(--shell-white);pointer-events:none;visibility:hidden;position:absolute;overflow:hidden}.bento-reel__strip-window[data-active=true]{visibility:visible}.bento-reel__strip-window[data-position=top],.bento-reel__strip-window[data-position=bottom]{width:100%;height:calc((100% - var(--bento-gap)) / 2);left:0}.bento-reel__strip-window[data-position=top]{top:0}.bento-reel__strip-window[data-position=bottom]{bottom:0}.bento-reel__strip-window[data-position=right]{width:calc((100% - var(--bento-gap)) / 2);height:100%;top:0;right:0}.bento-reel__strip{gap:var(--bento-gap);will-change:transform;backface-visibility:hidden;width:100%;height:100%;display:flex}.bento-reel__strip-window[data-axis=x] .bento-reel__strip{flex-direction:row}.bento-reel__strip-window[data-axis=x] .bento-reel__tile{flex:0 0 calc((100% - var(--bento-gap)) / 2)}.bento-reel__strip-window[data-axis=y] .bento-reel__strip{flex-direction:column}.bento-reel__strip-window[data-axis=y] .bento-reel__tile{flex:0 0 calc((100% - var(--bento-gap)) / 2)}.bento-reel__strip-window[data-active=true][data-direction=left] .bento-reel__strip{animation:.62s cubic-bezier(.72,0,.2,1) both bento-strip-left}.bento-reel__strip-window[data-active=true][data-direction=right] .bento-reel__strip{animation:.62s cubic-bezier(.72,0,.2,1) both bento-strip-right}.bento-reel__strip-window[data-active=true][data-direction=down] .bento-reel__strip{animation:.62s cubic-bezier(.72,0,.2,1) both bento-strip-down}.bento-reel__strip-window[data-active=true][data-direction=left][data-steps="2"] .bento-reel__strip{animation-name:bento-strip-left-two;animation-duration:.9s}.bento-reel__strip-window[data-active=true][data-direction=right][data-steps="2"] .bento-reel__strip{animation-name:bento-strip-right-two;animation-duration:.9s}@keyframes bento-strip-left{0%{transform:translate(0)}to{transform:translateX(calc(-50% - var(--bento-gap) / 2))}}@keyframes bento-strip-right{0%{transform:translateX(calc(-50% - var(--bento-gap) / 2))}to{transform:translate(0)}}@keyframes bento-strip-down{0%{transform:translateY(calc(-50% - var(--bento-gap) / 2))}to{transform:translateY(0)}}@keyframes bento-strip-left-two{0%{transform:translate(0)}to{transform:translateX(calc(-100% - var(--bento-gap)))}}@keyframes bento-strip-right-two{0%{transform:translateX(calc(-100% - var(--bento-gap)))}to{transform:translate(0)}}@media (prefers-reduced-motion:reduce){.bento-reel__strip{animation-duration:1ms!important}}