/* mobile-home-repair-20261015: load after joint-refine-20261015/home-refine.css.
   These links use a 2D spring now. Do not leave their old 3D shine plane in
   front of the unpromoted copy, or permanently promote ten idle glass cards. */
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link {
  transform-style: flat;
  perspective: none;
  will-change: auto;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link::before {
  z-index: 0;
  transform: none !important;
  will-change: auto;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link > .tile-icon,
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link > .private-link-copy {
  position: relative;
  z-index: 1;
  backface-visibility: visible;
  transform-style: flat;
}
html body.motion-site.home-glass-refresh #main #private.private-unified .private-link > .private-link-copy {
  display: block;
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow: visible;
}

/* A mobile page can be much taller than the viewport. Keep the readable
   tray in normal paint order; the small orbit remains the authored motion. */
@media (max-width: 900px), (hover: none), (pointer: coarse) {
  html body.motion-site.home-glass-refresh #main #private.private-unified {
    animation: none !important;
    transform: none !important;
    opacity: 1;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    will-change: auto;
  }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link,
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link > .tile-icon,
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link > .private-link-copy {
    will-change: auto;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-orbits > .private-orbit-one {
    width: 220px;
  }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-orbits > .private-orbit-two {
    animation: none !important;
    width: 200px;
  }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-orbits > :is(.private-orbit-three,.private-light-two) {
    display: none;
  }
  html body.motion-site.home-glass-refresh #main #private.private-unified .private-link::before {
    box-shadow: inset 0 1px 0 var(--nq-glass-reflection);
  }
}

/* The existing observer and freeze/reduced-motion rules still own playback;
   no new loop, loading gate, content cloning, or navigation handler is added. */

/* Preserve the cutout subject on mobile compositor rebuilds. The decoded poster
   remains the default surface until the controller confirms a fresh frame. */
@media (max-width: 650px), (hover: none) and (pointer: coarse) {
  html body.motion-site #character-studio .character-portrait {
    z-index: 0;
    isolation: isolate;
  }
  html body.motion-site #character-studio :is(.character-copy, .character-topline, .character-bottomline) {
    z-index: 2;
  }
  html body.motion-site #character-studio .character-portrait img {
    transform: none !important;
    filter: none !important;
    will-change: auto;
    transition: opacity .18s ease;
  }
  /* The parent retains the existing bottom fade. Avoid stacking two additional
     composite masks on an already transparent cutout or alpha canvas. */
  html body.motion-site #character-studio:not([data-style="reference"]) .character-portrait :is(img, canvas) {
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }
  html body.motion-site #character-studio:not([data-portrait-state="frame"]) .character-portrait img.is-active {
    opacity: 1 !important;
    visibility: visible !important;
  }
  html body.motion-site #character-studio:not([data-portrait-state="frame"]) .character-turntable {
    opacity: 0 !important;
  }
  html body.motion-site #character-studio .character-turntable {
    transition: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  html body.motion-site #character-studio .character-portrait img { transition: none; }
}
