/* Story Garden reading buddy motion system v1.200 */
.sn-companion-stage .sn-companion-hero,
.sn-companion-stage #nestHero {
  transition-property: none !important;
}

.sn-companion-stage #nestHero {
  transform-origin: center bottom !important;
}

@media (hover: hover) and (pointer: fine) {
  .sn-companion-stage #nestHero,
  .sn-companion-stage .sn-hero-pet-layer {
    cursor: grab !important;
  }

  .sn-companion-stage .is-dragging-buddy {
    cursor: grabbing !important;
  }
}

.sn-companion-stage .sn-hero-stack {
  backface-visibility: hidden;
  transform: translateZ(0);
  transform-origin: center bottom;
}

.sn-companion-stage .sn-hero-variant-image,
.sn-companion-stage .sn-hero-pet-image {
  backface-visibility: hidden;
  transform: translateZ(0);
}

.sn-companion-stage .is-dragging-buddy.sn-buddy-layout-positioned {
  transform: translate(-50%, -50%) translate3d(var(--sn-buddy-drag-x, 0px), var(--sn-buddy-drag-y, 0px), 0) !important;
  transition: none !important;
  will-change: transform;
}

.sn-companion-stage .is-dragging-buddy:not(.sn-buddy-layout-positioned) {
  transform: translate3d(var(--sn-buddy-drag-x, 0px), var(--sn-buddy-drag-y, 0px), 0) !important;
  transition: none !important;
  will-change: transform;
}

.sn-companion-stage .sn-hero-pet-layer.is-counter-dragging-buddy {
  transform: translate3d(var(--sn-buddy-counter-x, 0px), var(--sn-buddy-counter-y, 0px), 0) !important;
  transition: none !important;
}

.sn-companion-stage .sn-hero-pet-layer.is-dragging-buddy.sn-buddy-layout-positioned {
  transform: translate3d(var(--sn-buddy-drag-x, 0px), var(--sn-buddy-drag-y, 0px), 0) !important;
}

.sn-companion-stage.is-buddy-motion-ready:not(.is-arranging-buddy):not(.is-buddy-reading):not(.is-buddy-success):not(.is-buddy-encouraging):not(.is-buddy-celebrating) #nestHero > .sn-hero-stack {
  animation: snBuddyIdle 5.8s cubic-bezier(.45, 0, .55, 1) infinite;
}

.sn-companion-stage.is-buddy-reading #nestHero > .sn-hero-stack {
  animation: snBuddyReading 1.15s ease-in-out infinite;
}

.sn-companion-stage.is-buddy-success #nestHero > .sn-hero-stack {
  animation: snBuddySuccess 620ms cubic-bezier(.2, .82, .28, 1.18) both;
}

.sn-companion-stage.is-buddy-encouraging #nestHero > .sn-hero-stack {
  animation: snBuddyEncourage 520ms cubic-bezier(.22, .7, .3, 1) both;
}

.sn-companion-stage.is-buddy-celebrating #nestHero > .sn-hero-stack {
  animation: snBuddyCelebrate 860ms cubic-bezier(.18, .78, .24, 1.16) both;
}

.sn-companion-stage.has-positioned-pet #nestHero > .sn-hero-stack {
  animation: none !important;
}

.sn-companion-stage.is-buddy-blinking .sn-hero-variant-image {
  animation: snBuddyBlink 170ms ease-in-out both;
  transform-origin: center 38%;
}

.sn-companion-stage.is-buddy-motion-ready:not(.is-arranging-buddy) .sn-hero-pet-layer:not(.is-dragging-buddy):not(.sn-buddy-layout-positioned) {
  animation: snBuddyPetIdle 4.7s .65s ease-in-out infinite;
}

.sn-companion-stage .sn-buddy-art-enter {
  opacity: 0;
  transition: opacity 180ms ease-out !important;
}

.sn-companion-stage .sn-buddy-art-enter.is-visible {
  opacity: 1;
}

.sn-companion-stage .sn-buddy-art-exit {
  opacity: 0 !important;
  transition: opacity 160ms ease-in !important;
  pointer-events: none !important;
}

.sn-companion-stage .sn-buddy-life-spark {
  position: absolute;
  z-index: 12;
  top: 18%;
  right: 5%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff7ae;
  box-shadow: 0 0 0 3px rgba(255, 247, 174, .18), 0 0 10px rgba(255, 210, 70, .58);
  opacity: 0;
  pointer-events: none;
}

.sn-companion-stage.is-buddy-success .sn-buddy-life-spark,
.sn-companion-stage.is-buddy-celebrating .sn-buddy-life-spark {
  animation: snBuddySpark 620ms ease-out both;
}

@keyframes snBuddyIdle {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  38% { transform: translate3d(-.6px, -1.5px, 0) scale(1.006, 1.012); }
  68% { transform: translate3d(.7px, -.5px, 0) scale(.998, 1.004); }
}

@keyframes snBuddyReading {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(0, -2px, 0) rotate(.7deg); }
}

@keyframes snBuddySuccess {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  38% { transform: translate3d(0, -7px, 0) scale(1.025); }
  68% { transform: translate3d(0, -1px, 0) scale(.995); }
}

@keyframes snBuddyEncourage {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  35% { transform: translate3d(-2px, 0, 0) rotate(-1deg); }
  70% { transform: translate3d(2px, -1px, 0) rotate(1deg); }
}

@keyframes snBuddyCelebrate {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
  28% { transform: translate3d(0, -10px, 0) rotate(-2deg) scale(1.035); }
  58% { transform: translate3d(0, -3px, 0) rotate(2deg) scale(1.012); }
  78% { transform: translate3d(0, -6px, 0) rotate(-.8deg) scale(1.02); }
}

@keyframes snBuddyBlink {
  0%, 100% { transform: translateZ(0) scaleY(1); }
  50% { transform: translateZ(0) scaleY(.975); }
}

@keyframes snBuddyPetIdle {
  0%, 100% { translate: 0 0; rotate: 0deg; }
  50% { translate: 0 -2px; rotate: -1.2deg; }
}

@keyframes snBuddySpark {
  0% { opacity: 0; transform: translate3d(-4px, 7px, 0) scale(.3); }
  42% { opacity: 1; transform: translate3d(0, -2px, 0) scale(1.2); }
  100% { opacity: 0; transform: translate3d(5px, -12px, 0) scale(.55); }
}

body.sn-modal-open .sn-companion-stage #nestHero > .sn-hero-stack,
body.sn-modal-open .sn-companion-stage .sn-hero-pet-layer,
html.sn-document-hidden .sn-companion-stage #nestHero > .sn-hero-stack,
html.sn-document-hidden .sn-companion-stage .sn-hero-pet-layer {
  animation-play-state: paused !important;
}

@media (prefers-reduced-motion: reduce) {
  .sn-companion-stage #nestHero > .sn-hero-stack,
  .sn-companion-stage .sn-hero-variant-image,
  .sn-companion-stage .sn-hero-pet-layer,
  .sn-companion-stage .sn-buddy-life-spark {
    animation: none !important;
    transition: none !important;
  }
}

/* JK/SK responsive reading typography v1.202 */
.sn-story-card-v3 .sn-passage[data-sn-early-reader] {
  min-height: clamp(150px, 25dvh, 280px) !important;
  display: grid !important;
  align-content: center !important;
  justify-content: stretch !important;
  gap: clamp(8px, 1.5vh, 16px) !important;
  padding-block: clamp(10px, 2vh, 22px) !important;
  overflow-x: hidden !important;
}

.sn-story-card-v3 .sn-passage[data-sn-early-reader] .sn-line-btn,
.sn-story-card-v3 .sn-passage[data-sn-early-reader].line-mode-active .sn-line-btn {
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: clamp(58px, 8.5vh, 94px) !important;
  margin: 0 !important;
  padding: clamp(10px, 1.8vh, 20px) clamp(12px, 3vw, 30px) !important;
  display: block !important;
  text-align: center !important;
  text-wrap: balance;
  overflow-wrap: normal;
  word-break: normal;
  font-size: var(--sn-story-font-size, clamp(2rem, 5vw, 4rem)) !important;
  line-height: var(--sn-story-line-height, 1.24) !important;
  letter-spacing: .01em;
}

.sn-story-card-v3 .sn-passage[data-sn-early-reader="jk"] .sn-line-btn {
  font-weight: 850 !important;
}

.sn-story-card-v3 .sn-passage[data-sn-early-reader="sk"] .sn-line-btn {
  font-weight: 800 !important;
}

@media (max-width: 620px) {
  .sn-story-card-v3 .sn-passage[data-sn-early-reader] {
    min-height: clamp(138px, 24dvh, 210px) !important;
    gap: 8px !important;
    padding-block: 10px !important;
  }

  .sn-story-card-v3 .sn-passage[data-sn-early-reader] .sn-line-btn,
  .sn-story-card-v3 .sn-passage[data-sn-early-reader].line-mode-active .sn-line-btn {
    min-height: 58px !important;
    padding: 10px 8px !important;
  }
}

@media (max-width: 380px) {
  .sn-story-card-v3 .sn-passage[data-sn-early-reader] {
    min-height: 132px !important;
  }
}
