.visual-reel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:64px;position:relative}.visual-frame{display:block;width:100%;min-width:0;border:0;padding:0;background:transparent;color:inherit;cursor:zoom-in;position:relative;transform-origin:50% 70%;will-change:translate,rotate}.visual-frame img{display:block;width:100%;height:100%;object-fit:cover;transition:filter .2s}.visual-frame:hover img{filter:brightness(1.045)}.visual-frame:focus-visible{outline:3px solid currentColor;outline-offset:7px}.cele-magic{align-items:center;margin-top:65px}.cele-magic .visual-frame{aspect-ratio:3/4;border-radius:18px;overflow:hidden}.cele-magic .visual-frame:nth-child(2){margin-top:55px}.mamo-film{gap:15px;margin-top:70px}.mamo-film .visual-frame{aspect-ratio:4/3;border-radius:9px;overflow:hidden}.mamo-film .visual-frame:nth-child(2){margin-top:35px}.mamo-film .visual-frame:nth-child(3){margin-top:70px}.k-sketch{align-items:center;gap:35px}.k-sketch .visual-frame{aspect-ratio:3/4}.k-sketch img{object-fit:contain}.k-sketch .visual-frame:first-child{background:#fbf7ed;border:12px solid #fbf7ed;rotate:-3deg}.k-sketch .visual-frame:nth-child(3){rotate:3deg}.fig-parade{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:75px;align-items:center}.fig-parade .visual-frame{background:#92dece;border-radius:90px 90px 20px 20px;padding:18px;aspect-ratio:3/4}.fig-parade img{object-fit:contain}.fig-parade .visual-frame:nth-child(even){margin-top:55px;background:#f493bd;border-radius:20px 20px 90px 90px}.visual-dialog{border:0;padding:48px 18px 18px;border-radius:12px;background:#faf9f2;max-width:94vw;max-height:94svh;overflow:auto}.visual-dialog::backdrop{background:#141414e8}.visual-dialog img{display:block;max-width:86vw;max-height:80svh;object-fit:contain;width:auto;margin:auto}.visual-dialog button{position:absolute;right:12px;top:8px;width:32px;height:32px;border:0;background:transparent;color:#141414;cursor:pointer}.visual-dialog button:before,.visual-dialog button:after{content:'';position:absolute;left:5px;top:15px;width:22px;height:2px;background:currentColor;rotate:45deg}.visual-dialog button:after{rotate:-45deg}.visual-dialog button:focus-visible{outline:3px solid #167a77}
@media(max-width:700px){.visual-reel{gap:14px;margin-top:42px}.cele-magic{grid-template-columns:1fr 1fr}.cele-magic .visual-frame:first-child{grid-column:1/-1;aspect-ratio:4/3}.cele-magic .visual-frame:nth-child(2){margin-top:0}.mamo-film{grid-template-columns:1fr}.mamo-film .visual-frame{max-width:92%}.mamo-film .visual-frame:nth-child(2){margin:5px 0 5px auto}.mamo-film .visual-frame:nth-child(3){margin-top:0}.k-sketch{grid-template-columns:1fr 1fr;gap:18px}.k-sketch .visual-frame:first-child{grid-column:1/-1;max-width:75%;margin:0 auto 15px}.fig-parade{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.fig-parade .visual-frame{padding:12px}.fig-parade .visual-frame:nth-child(even){margin-top:22px}.visual-dialog img{max-width:82vw}}
@media(prefers-reduced-motion:reduce){.visual-frame{translate:none!important;rotate:0deg!important}.visual-frame img{transition:none}}
/* Seventeen original characters, with a seamless rightward hover loop. */
.fig-parade{display:block;overflow:hidden;margin:75px -4% 0;padding:14px 0 24px;position:relative;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.parade-track{display:flex;width:max-content;animation:fig-rightward 110s linear infinite;animation-play-state:paused;transform:translateX(-50%);will-change:transform}
.parade-group{display:flex;align-items:center;gap:18px;padding-right:18px;flex-shrink:0}
.fig-parade .visual-frame{flex:0 0 210px;width:210px;height:285px;max-width:none;aspect-ratio:auto;padding:20px;translate:none!important;rotate:0deg!important;margin:0;background:#92dece;border-radius:100px 100px 22px 22px;overflow:hidden}
.fig-parade .visual-frame:nth-child(even){margin-top:40px;background:#f493bd;border-radius:22px 22px 100px 100px}
.fig-parade .visual-frame:after{content:attr(data-name);position:absolute;left:0;right:0;bottom:14px;text-align:center;font-size:26px;font-weight:900;letter-spacing:-.025em;line-height:1.1;color:#fff;text-shadow:0 1px 4px #173d3440;opacity:1;transition:opacity .2s}.fig-parade .visual-frame:hover:after,.fig-parade .visual-frame:focus-visible:after{opacity:1}
@keyframes fig-rightward{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@media(hover:hover) and (pointer:fine){.fig-parade:hover .parade-track{animation-play-state:running}}
.fig-parade:has(.visual-frame:focus-visible){overflow-x:auto;mask-image:none}.fig-parade:has(.visual-frame:focus-visible) .parade-track{animation:none;transform:none}.fig-parade:has(.visual-frame:focus-visible) .parade-copy{display:none}
@media(max-width:700px){.fig-parade{margin-top:45px}.fig-parade .visual-frame{flex-basis:155px;width:155px;height:215px;padding:15px}.parade-group{gap:13px;padding-right:13px}.fig-parade .visual-frame:nth-child(even){margin-top:25px}}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.fig-parade{overflow-x:auto;mask-image:none;-webkit-overflow-scrolling:touch}.parade-track{animation:none;transform:none}.parade-copy{display:none}}

/* Shared scale preserves the cast’s relative heights at every breakpoint. */
.fig-parade{--cast-height:360px;--tile-width:260px;--tile-space:74px}
.fig-parade .parade-group{align-items:flex-end;min-height:calc(var(--cast-height) + var(--tile-space))}
.fig-parade .visual-frame{flex-basis:var(--tile-width);width:var(--tile-width);height:calc(var(--tile-space) + var(--cast-height) * var(--character-scale, .55));display:flex;align-items:flex-end;justify-content:center;padding:24px 22px 50px;background:var(--character-color,#92dece)}
.fig-parade .visual-frame:nth-child(even){margin-top:0;background:var(--character-color,#f493bd)}
.fig-parade .visual-frame img{height:calc(var(--cast-height) * var(--character-scale, .55));width:auto;max-width:100%;object-fit:contain;object-position:center bottom;flex:none}
@media(max-width:700px){.fig-parade{--cast-height:260px;--tile-width:190px;--tile-space:64px}.fig-parade .visual-frame{padding:20px 15px 44px}.fig-parade .visual-frame:after{font-size:22px;bottom:12px}}
/* Pointer-driven momentum; touch and reduced motion retain native scrolling. */
.fig-parade.has-inertia .parade-track{animation:none}
.fig-parade.has-inertia,.fig-parade.has-inertia .visual-frame{cursor:grab;user-select:none}
.fig-parade.has-inertia.is-dragging,.fig-parade.has-inertia.is-dragging .visual-frame{cursor:grabbing}
.fig-parade.has-inertia img{-webkit-user-drag:none}
.fig-parade.has-inertia:has(.visual-frame:focus-visible) .parade-track{transform:none!important}