/* Only the generated eye regions change during a blink; the scene stays registered. */
body[data-page='home'] .sky-backdrop { background-image: none; animation: none; overflow: hidden; }
body[data-page='home'] .sky-backdrop::after { background: linear-gradient(180deg, transparent 23%, #fffaf00d 42%, #fffaf0 74%); }
.scene-svg { display: block; width: 100%; height: 100%; }
.sky-backdrop>.scene-svg { animation: tein-scene-sway 18s ease-in-out infinite; animation-play-state: running; transform-origin: center top; }
.blink-frame { opacity: 0; animation-name: tein-eye-blink; animation-duration: 5.6s; animation-timing-function: step-end; animation-iteration-count: infinite; animation-play-state: running; }
.blink-boy { animation-delay: -1.8s; }
.blink-mage { animation-duration: 4.9s; animation-delay: -.2s; }
.blink-pet { animation-duration: 6.8s; animation-delay: -3.1s; }
.blink-rider { animation-duration: 7.4s; animation-delay: -4.2s; }
.motion-paused .blink-frame { opacity: 0 !important; animation-play-state: paused !important; }
.motion-paused .scene-svg { animation-play-state: paused !important; }
.mobile-character-stage { display: none; }
@keyframes tein-eye-blink { 0%, 94%, 98%, 100% { opacity: 0; } 95%, 97% { opacity: 1; } }
@keyframes tein-scene-sway { 0%, 100% { transform: scale(1.025) translateX(-3px); } 50% { transform: scale(1.025) translateX(3px); } }
@media (max-width: 820px) {
  .site-header { width: calc(100% - 28px); height: 72px; margin-top: 12px; padding: 8px 14px; display: flex; align-items: center; justify-content: space-between; border: 1px solid #d8bd84; border-radius: 10px; background: linear-gradient(180deg, #9a7a4d, #745033); box-shadow: 0 6px 18px #6b4b2820; }
  .mobile-brand { display: block; }
  .mobile-brand img { width: 112px; height: auto; }
  .nav-toggle { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #ecd1987a; border-radius: 8px; color: #fff1c5; background: #fff5ce18; font-size: 26px; line-height: 1; }
  .nav { display: none; position: absolute; left: 0; right: 0; top: 81px; grid-template-columns: 1fr; gap: 4px; padding: 9px; background: #765337; border-radius: 10px; max-height: 70vh; max-height: calc(100svh - 110px); overflow-y: auto; overscroll-behavior: contain; }
  .nav.open { display: grid; }
  .nav-link { min-height: 56px; padding: 10px 16px; align-items: flex-start; border-radius: 6px !important; }
  .nav-link strong { font-size: 16px; }
  .nav-link small { font-size: 9px; letter-spacing: 1px; }
  .nav-link.active::after { right: 14px; bottom: 23px; }
  .nav-download { min-height: 64px; margin: 3px 0; border-radius: 6px; flex-direction: row; gap: 10px; }
  .nav-download>span, .nav-download small { margin: 0; }
  .nav-download strong { font-size: 21px; }
  .nav-download small { font-size: 12px; }
  body[data-page='home'] .sky-backdrop { height: 760px; background: linear-gradient(180deg, #c7e9f0, #f2f7e9 63%, #fffaf0); }
  body[data-page='home'] .sky-backdrop::after { background: none; }
  body[data-page='home'] .sky-backdrop>.scene-svg { display: none; }
  .hero { min-height: 0; padding: 32px 14px 30px; }
  .hero-kicker { font-size: 8px; letter-spacing: 1.6px; gap: 10px; color: #6d7154; text-shadow: none; }
  .hero-kicker span { width: 18px; background: #9da77b; }
  .hero-logo { width: min(290px, 78vw); margin: 10px 0 16px; }
  .mobile-character-stage { display: block; width: min(680px, 100%); aspect-ratio: 1672 / 941; margin: 0 auto; border: 2px solid #d1b474; border-radius: 13px; overflow: hidden; background: #def0f1; box-shadow: 0 5px 18px #73522b14; }
  .hero h1 { font-size: 22px; line-height: 1.6; margin: 22px 0 9px; }
  .hero-description { max-width: 520px; font-size: 13px; line-height: 1.85; margin-bottom: 19px; }
  .hero-actions { width: min(460px, 100%); display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .hero-actions .btn { min-height: 48px; padding: 11px 12px; gap: 9px; font-size: 13px; }
  .hero-caption { font-size: 8px; letter-spacing: 1.5px; margin-top: 19px; }
  .motion-toggle { min-height: 44px; min-width: 190px; padding: 8px 16px; margin-top: 12px; font-size: 12px; }
  .portal-link { min-height: 86px; }
  .portal-link>span:nth-child(2) { min-width: 0; }
  .portal-link strong { font-size: 13px; white-space: normal; line-height: 1.5; }
  .portal-link small { font-size: 8px; line-height: 1.6; }
  .banner-controls button { width: 44px; height: 44px; }
  .news-filters button { min-height: 44px; padding-inline: 14px; font-size: 12px; }
  .section-description { font-size: 13px; line-height: 1.8; }
  .news-body h3 { font-size: 18px; }
  .news-body p { font-size: 14px; line-height: 1.8; }
  .read-more { min-height: 44px; font-size: 12px; align-items: center; }
  .field label { font-size: 13px; }
  .input-wrap input { font-size: 16px; }
  .peek { min-width: 44px; min-height: 44px; font-size: 12px; }
  .hint, .error, .availability { font-size: 11px; }
  .checkline { min-height: 44px; font-size: 12px; }
  .checkline input { width: 18px; height: 18px; }
  .submit-btn { min-height: 48px; font-size: 14px; }
  .site-footer nav a { display: inline-flex; min-height: 44px; align-items: center; font-size: 12px; }
}
@media (max-width: 360px) {
  .hero-actions { grid-template-columns: 1fr; }
  .hero h1 { font-size: 20px; }
  .portal-icon { width: 25px; height: 25px; flex-shrink: 0; }
  .portal-link { padding-inline: 8px; gap: 7px; }
  .portal-link strong { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .blink-frame { opacity: 0 !important; animation: none !important; }
  .sky-backdrop>.scene-svg { animation: none !important; }
}