.home-mubu-preview{
  position:fixed;inset:0;z-index:12050;
  display:block;
  opacity:0;visibility:hidden;pointer-events:none;
  background:rgba(2,8,12,.965);
  backdrop-filter:blur(16px) saturate(.9);
  -webkit-backdrop-filter:blur(16px) saturate(.9);
  transition:opacity .24s ease,visibility 0s linear .24s;
  overflow:hidden;
}
.home-mubu-preview.is-open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .24s ease,visibility 0s}
.home-mubu-preview-stage{
  width:100vw;height:100dvh;min-height:100vh;
  box-sizing:border-box;
  padding:clamp(10px,1.25vw,22px) clamp(18px,2vw,36px);
  display:grid;
  grid-template-columns:minmax(0,.68fr) minmax(0,1.58fr) minmax(0,.8fr) minmax(0,1.28fr);
  grid-template-rows:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(12px,1.2vw,22px);
  overflow:auto;
  align-items:center;
  isolation:isolate;
}
.home-mubu-preview-frame{
  margin:0;min-width:0;min-height:0;
  position:relative;
  z-index:1;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;background:transparent;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 14px 42px rgba(0,0,0,.24);
  transform:translateY(0) scale(1);
  transform-origin:center center;
  transition:
    transform .58s cubic-bezier(.16,1,.3,1),
    box-shadow .58s cubic-bezier(.16,1,.3,1),
    border-color .34s ease,
    filter .34s ease;
}
.home-mubu-preview-frame img{
  display:block;width:100%;height:100%;
  object-fit:cover;object-position:center;
  background:transparent;
  transform:scale(1.001);
  transition:transform .72s cubic-bezier(.16,1,.3,1),filter .36s ease;
}
.home-mubu-preview-frame:hover,
.home-mubu-preview-frame:focus-within{
  z-index:30;
  border-color:rgba(255,255,255,.34);
  transform:translateY(-22px) scale(1.045);
  filter:brightness(1.05) saturate(1.06);
  box-shadow:
    0 42px 92px rgba(0,0,0,.56),
    0 0 46px rgba(255,255,255,.10),
    inset 0 1px 0 rgba(255,255,255,.08);
}
.home-mubu-preview-frame:hover img,
.home-mubu-preview-frame:focus-within img{
  transform:scale(1.055);
  filter:saturate(1.04) contrast(1.02);
}
/* Full-screen layout: three 9:16 crops and two 16:9 crops may fill height. */
.mubu-frame-2{
  grid-column:1;
  grid-row:1;
  aspect-ratio:9 / 16;
  align-self:start;
}
.mubu-frame-1{
  grid-column:2 / 4;
  grid-row:1;
  aspect-ratio:16 / 9;
  align-self:center;
}
.mubu-frame-4{
  grid-column:4;
  grid-row:1 / 3;
  aspect-ratio:9 / 16;
  align-self:center;
}
.mubu-frame-3{
  grid-column:1 / 3;
  grid-row:2;
  aspect-ratio:16 / 9;
  align-self:end;
}
.mubu-frame-5{
  grid-column:3;
  grid-row:2;
  aspect-ratio:9 / 16;
  align-self:end;
  justify-self:center;
  width:86%;
}
.home-mubu-preview-close{
  position:fixed;z-index:3;right:clamp(14px,1.4vw,26px);top:clamp(12px,1.4vw,24px);
  width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.36);
  background:rgba(4,16,24,.54);color:#fff;font-size:27px;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}
.home-mubu-preview-close:hover{transform:scale(1.06);background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.7)}
html.home-mubu-preview-lock,body.home-mubu-preview-lock{overflow:hidden!important;overscroll-behavior:none}
@media(max-width:900px){
  .home-mubu-preview-stage{padding:10px;gap:8px;grid-template-columns:.72fr 1.46fr .82fr 1.16fr}
}
@media(max-width:700px){
  .home-mubu-preview-stage{
    padding:56px 10px 12px;
    gap:10px;
    grid-template-columns:1fr;
    grid-template-rows:none;
    align-items:start;
  }
  .home-mubu-preview-frame{border-radius:0}
  .mubu-frame-1,
  .mubu-frame-2,
  .mubu-frame-3,
  .mubu-frame-4,
  .mubu-frame-5{
    grid-column:auto;
    grid-row:auto;
    width:100%;
    justify-self:stretch;
    align-self:auto;
  }
  .mubu-frame-2,
  .mubu-frame-4,
  .mubu-frame-5{aspect-ratio:9 / 16}
  .mubu-frame-1,
  .mubu-frame-3{aspect-ratio:16 / 9}
}
@media(prefers-reduced-motion:reduce){
  .home-mubu-preview,
  .home-mubu-preview-close,
  .home-mubu-preview-frame,
  .home-mubu-preview-frame img{transition:none}
  .home-mubu-preview-frame:hover,
  .home-mubu-preview-frame:focus-within{transform:none}
}