#viewport { background-image: url('../poster-light.webp'); background-repeat: no-repeat; background-position: center 46%; background-size: auto 86%; }
:root[data-theme="dark"] #viewport { background-image: url('../poster.webp'); }
#model-canvas { opacity: 0; }
#viewport[data-preview="ready"] #model-canvas,
#viewport[data-preview="error"] #model-canvas { opacity: 1; transition: opacity 180ms ease; }
#viewport[data-preview="ready"] { background-image: none; }
#loading:not(.updating) { top: auto; bottom: 78px; transform: translateX(-50%); flex-direction: row; max-width: calc(100% - 32px); }
.load-hint { color: var(--muted); font-size: 12px; }
#loading.updating .load-hint { display: none; }
.pose-photo { min-height: 44px; display: inline-flex; align-items: center; color: var(--accent); text-decoration: none; }
.panel-intro { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.panel-intro h2 { margin: 0; }
@media (max-width: 680px) {
  :root { --stage-mobile-height: clamp(340px, 58svh, 520px); }
  .document-button { max-width: calc(100vw - 188px); }
  #loading:not(.updating) { bottom: 64px; }
}
@media (prefers-reduced-motion: reduce) {
  #model-canvas { transition: none; }
}