.kfs-field{position:relative;container:kfs / inline-size;height:220px;width:100%;max-width:none!important;overflow:clip;background:inherit;pointer-events:none;user-select:none;margin:0!important;padding:0!important;border:0;}
.kfs-field::before{content:"";position:absolute;inset:0;background-image:var(--kfs-background);--kfs-background:image-set(url("assets/garage-mobile-1x.jpg?ver=20261009-r14") 1x,url("assets/garage-mobile-2x.jpg?ver=20261009-r14") 2x);background-size:auto 100%;background-position:center bottom;background-repeat:repeat-x;pointer-events:none;border:0;}
.kfs-person{position:absolute;bottom:14px;left:0;width:128px;height:112px;margin:0!important;padding:0!important;background-repeat:no-repeat;background-size:1100% 100%;background-position:80% 0;cursor:default;pointer-events:none;border:0;box-shadow:none;display:none;}
.kfs-person:nth-child(-n+3){display:block;}
.kfs-person:nth-child(1){transform:translate3d(calc(16.666667cqi - 64px),0,0);z-index:3;}
.kfs-person:nth-child(2){transform:translate3d(calc(50cqi - 64px),-4px,0);z-index:2;}
.kfs-person:nth-child(3){transform:translate3d(calc(83.333333cqi - 64px),-8px,0);z-index:1;}
@container kfs (min-width:600px){
 .kfs-person{width:192px;height:168px;bottom:22px;}
 .kfs-person:nth-child(-n+5){display:block;}
 .kfs-person:nth-child(1){transform:translate3d(calc(10cqi - 96px),0,0);}
 .kfs-person:nth-child(2){transform:translate3d(calc(30cqi - 96px),-4px,0);}
 .kfs-person:nth-child(3){transform:translate3d(calc(50cqi - 96px),-8px,0);}
 .kfs-person:nth-child(4){transform:translate3d(calc(70cqi - 96px),0,0);z-index:3;}
 .kfs-person:nth-child(5){transform:translate3d(calc(90cqi - 96px),-4px,0);z-index:2;}
 .kfs-field::before{background-image:var(--kfs-background);--kfs-background:image-set(url("assets/garage-desktop-1x.jpg?ver=20261009-r14") 1x,url("assets/garage-desktop-2x.jpg?ver=20261009-r14") 2x);}
}
/* The field cannot query its own container. Its reserved height uses viewport,
   while people and image selection respond to the actual field width. */
@media(min-width:600px){.kfs-field{height:320px;}}
@container kfs (min-width:1000px){
 .kfs-person:nth-child(-n+8){display:block;}
 .kfs-person:nth-child(1){transform:translate3d(calc(6.25cqi - 96px),0,0);}
 .kfs-person:nth-child(2){transform:translate3d(calc(18.75cqi - 96px),-4px,0);}
 .kfs-person:nth-child(3){transform:translate3d(calc(31.25cqi - 96px),-8px,0);}
 .kfs-person:nth-child(4){transform:translate3d(calc(43.75cqi - 96px),0,0);}
 .kfs-person:nth-child(5){transform:translate3d(calc(56.25cqi - 96px),-4px,0);}
 .kfs-person:nth-child(6){transform:translate3d(calc(68.75cqi - 96px),-8px,0);z-index:1;}
 .kfs-person:nth-child(7){transform:translate3d(calc(81.25cqi - 96px),0,0);z-index:3;}
 .kfs-person:nth-child(8){transform:translate3d(calc(93.75cqi - 96px),-4px,0);z-index:2;}
}
.ktb-footer.kfs-footer{padding-block-start:0;}
.ktb-footer.kfs-footer>.kfs-field{width:calc(100% + 4rem);margin-inline:-2rem!important;margin-block-end:0!important;}

.kfs-field:not(.kfs-loading):not(.kfs-ready)::before{background-image:none;}
.kfs-field:not(.kfs-ready)::before,.kfs-field:not(.kfs-ready) .kfs-person{visibility:hidden;}

/* Umi only: keep the source sole at y=312/336 on the existing floor. */
.kfs-person.kfs-umi{--kfs-scale:1.15;width:calc(128px * var(--kfs-scale));height:calc(112px * var(--kfs-scale));bottom:calc(14px - 8px * (var(--kfs-scale) - 1));}
@container kfs (min-width:600px){
 .kfs-person.kfs-umi{width:calc(192px * var(--kfs-scale));height:calc(168px * var(--kfs-scale));bottom:calc(22px - 12px * (var(--kfs-scale) - 1));transform:translate3d(calc(70cqi - 96px * var(--kfs-scale)),0,0);}
}
@container kfs (min-width:1000px){
 .kfs-person.kfs-umi{transform:translate3d(calc(43.75cqi - 96px * var(--kfs-scale)),0,0);}
}

/* No scripting: retain the reserved field and revision12 CSS placement, frame #8. */
@media (scripting: none){
 .kfs-field:not(.kfs-loading):not(.kfs-ready)::before{background-image:var(--kfs-background);}
 .kfs-field:not(.kfs-ready)::before,.kfs-field:not(.kfs-ready) .kfs-person{visibility:visible;}
 .kfs-color .kfs-sora{background-image:url("assets/sora-color.png");}
 .kfs-color .kfs-shizu{background-image:url("assets/shizu-color.png");}
 .kfs-color .kfs-hana{background-image:url("assets/hana-color.png");}
 .kfs-color .kfs-umi{background-image:url("assets/umi-color.png");}
 .kfs-color .kfs-tsuki{background-image:url("assets/tsuki-color.png");}
 .kfs-color .kfs-nami{background-image:url("assets/nami-color.png");}
 .kfs-color .kfs-hoshi{background-image:url("assets/hoshi-color.png");}
 .kfs-color .kfs-fuu{background-image:url("assets/fuu-color.png");}
}

/* Karitabi only: external footer gaps move inside the main content. */
.wp-site-blocks > footer.wp-block-template-part:has(.ktb-footer){margin-block-start:0;}
.ktb-footer.kfs-footer{margin-block-start:0;}