/* v432 TOP TOY ENGINE
   Added as an isolated layer so the v428 layout, ARG routes and existing controls stay intact. */

#homeView{
  --toy-night-level:0;
  --toy-wind:0;
  --toy-wind-tilt:0deg;
}

.top-toy-world{
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
  -webkit-tap-highlight-color:transparent;
  font-family:"DotGothic16","MS Gothic",monospace;
}
.top-toy-world--hero{
  position:absolute;
  /* Do not create a z-index stacking context here.
     Rainbow/sun need to sit above the existing logo while fish/cat keep their original layers. */
  z-index:auto;
  left:0;
  right:0;
  top:0;
  height:100%;
  overflow:visible;
}
.top-toy-world--sticker{
  position:absolute;
  z-index:4;
  inset:0;
  overflow:hidden;
}
.top-toy{
  position:absolute;
  display:block;
  margin:0;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  pointer-events:auto;
  touch-action:none;
  cursor:grab;
  -webkit-user-drag:none;
}
.top-toy:active{cursor:grabbing}
.top-toy img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.top-toy:focus-visible{outline:2px dashed rgba(122,108,176,.82);outline-offset:4px;border-radius:10px}

/* ---------- HERO toys ---------- */
.toy-rainbow{
  left:2.5%;
  top:2.2%;
  width:clamp(126px,18vw,238px);
  aspect-ratio:640/364;
  /* Above the logo hit area so pointer events reach the rainbow itself. */
  z-index:8;
}
.toy-rainbow-art{
  position:absolute;
  inset:0;
  display:block;
  transform:skewX(var(--toy-rainbow-wind,0deg));
  transform-origin:50% 100%;
}
/* v432: one visible rainbow only. The previous three clipped copies could separate on Safari. */
.toy-rainbow-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  transform-origin:var(--toy-rainbow-origin,50% 88%);
  will-change:transform;
  filter:drop-shadow(0 4px 3px rgba(122,105,171,.13));
}
.toy-rainbow.is-tension .toy-rainbow-image{animation:toy-rainbow-tension .08s steps(2,end) infinite}
@keyframes toy-rainbow-tension{0%{translate:-1px 0}100%{translate:1px 0}}

.toy-sun{
  right:12%;
  top:2%;
  width:clamp(58px,7.2vw,104px);
  aspect-ratio:1;
  /* Above the logo hit area so dragging works on touch devices. */
  z-index:9;
  will-change:transform;
  filter:drop-shadow(0 4px 4px rgba(255,191,111,.18));
}
.toy-sun.is-returning{filter:drop-shadow(0 0 13px rgba(255,231,150,.7))}

.toy-fish{
  left:7%;
  bottom:8%;
  width:clamp(150px,19vw,280px);
  aspect-ratio:900/339;
  z-index:4;
  will-change:transform;
  filter:drop-shadow(0 8px 5px rgba(80,94,136,.17));
}
.toy-fish.is-dragging{filter:drop-shadow(0 10px 8px rgba(80,94,136,.25)) brightness(1.03)}

.toy-cat{
  right:4%;
  bottom:2.2%;
  width:clamp(74px,9vw,132px);
  aspect-ratio:474/640;
  z-index:5;
  will-change:transform;
  /* Keep the photo visually unchanged, but stop the transparent rectangle around
     it from stealing taps from the girls/UI underneath. */
  clip-path:polygon(48% 0,82% 0,84% 17%,100% 25%,92% 43%,92% 100%,7% 100%,0 83%,17% 55%,26% 38%,39% 27%);
  filter:drop-shadow(0 7px 5px rgba(98,89,124,.15));
}
.toy-cat-hint{
  position:absolute;
  right:72%;
  bottom:78%;
  width:max-content;
  max-width:160px;
  padding:6px 8px;
  border:2px dotted #aa98d1;
  border-radius:8px;
  color:#6c6196;
  background:rgba(255,255,255,.97);
  box-shadow:3px 3px 0 rgba(159,143,197,.18);
  font-size:9px;
  line-height:1.35;
  white-space:nowrap;
  pointer-events:none;
}
.toy-cat-hint:not([hidden]){animation:toy-hint-in .18s ease-out both}
@keyframes toy-hint-in{from{opacity:0;transform:translateY(4px) scale(.92)}to{opacity:1;transform:none}}

/* ---------- lower / stickerbook toys ---------- */
.toy-crt{
  left:2.2%;
  bottom:485px;
  width:clamp(118px,13vw,190px);
  aspect-ratio:1;
  cursor:default;
  touch-action:manipulation;
}
.toy-crt>img{position:absolute;inset:0}
.toy-crt-screen{
  position:absolute;
  left:14.5%;
  top:14.7%;
  width:72%;
  height:51%;
  overflow:auto;
  padding:8px 7px 16px;
  border-radius:12%;
  color:#cceaff;
  background:rgba(22,31,83,.08);
  opacity:.06;
  box-shadow:inset 0 0 15px rgba(97,174,255,.12);
  transition:opacity .2s ease,background .2s ease,box-shadow .2s ease;
  pointer-events:auto;
  scrollbar-width:thin;
  scrollbar-color:#88a9de transparent;
}
.toy-crt-screen:before{
  content:"";
  position:sticky;
  z-index:3;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  margin-bottom:-100%;
  background:repeating-linear-gradient(0deg,rgba(192,226,255,.08) 0 1px,transparent 1px 3px);
  pointer-events:none;
}
.toy-crt-screen pre{
  position:relative;
  z-index:2;
  min-height:100%;
  margin:0;
  color:#d5efff;
  text-shadow:0 0 4px rgba(141,208,255,.8);
  font:700 clamp(6px,.62vw,9px)/1.42 "DotGothic16","MS Gothic",monospace;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  text-align:left;
}
.toy-crt-screen small{
  position:sticky;
  z-index:4;
  left:0;
  bottom:0;
  display:block;
  margin-top:4px;
  color:#ffcfeb;
  font-size:6px;
  line-height:1.2;
  text-align:left;
  text-shadow:0 0 3px rgba(255,255,255,.6);
}
.toy-crt-paste-catcher{
  position:absolute;
  z-index:8;
  inset:0;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  outline:0;
  resize:none;
  overflow:hidden;
  opacity:.001;
  color:transparent;
  background:transparent;
  caret-color:transparent;
  font-size:16px; /* prevents iOS focus zoom */
  line-height:1;
  -webkit-appearance:none;
  appearance:none;
  -webkit-user-select:text;
  user-select:text;
  touch-action:manipulation;
}
.toy-crt.is-on .toy-crt-paste-catcher{pointer-events:none}
.toy-crt.is-ready:not(.is-on) .toy-crt-screen{
  opacity:.42;
  background:rgba(25,38,91,.76);
  box-shadow:inset 0 0 16px rgba(117,193,255,.36),0 0 8px rgba(117,193,255,.18);
}
.toy-crt.is-on .toy-crt-screen{
  opacity:1;
  background:linear-gradient(180deg,rgba(18,28,79,.96),rgba(28,43,103,.94));
  box-shadow:inset 0 0 19px rgba(117,193,255,.65),0 0 13px rgba(117,193,255,.35);
}
.toy-crt.is-on .toy-crt-screen:after{
  content:"";
  position:absolute;
  inset:-8%;
  z-index:1;
  opacity:.2;
  background:radial-gradient(circle at 34% 24%,#9de9ff 0 1px,transparent 2px),radial-gradient(circle at 72% 67%,#f2c6ff 0 1px,transparent 2px);
  background-size:11px 13px,17px 19px;
  animation:toy-crt-noise .24s steps(2,end) infinite;
  pointer-events:none;
}
.toy-crt.is-noise-hit .toy-crt-screen{animation:toy-crt-hit .18s steps(2,end) 3}
@keyframes toy-crt-noise{0%{transform:translate(0,0)}50%{transform:translate(-2px,1px)}100%{transform:translate(1px,-1px)}}
@keyframes toy-crt-hit{0%,100%{filter:none;transform:none}50%{filter:contrast(1.8) brightness(1.35);transform:translateX(2px)}}

.toy-egg{
  right:4%;
  bottom:470px;
  width:clamp(88px,10vw,148px);
  aspect-ratio:1;
  transform-origin:50% 70%;
  touch-action:manipulation;
}
.toy-egg-normal,.toy-egg-melt{position:absolute;inset:0;transition:opacity .18s ease,filter .18s ease}
.toy-egg-melt{opacity:0}
.toy-egg.is-melted{animation:toy-egg-puddle 5s cubic-bezier(.2,.8,.2,1) both}
.toy-egg.is-melted .toy-egg-normal{opacity:.12;filter:blur(1.4px)}
.toy-egg.is-melted .toy-egg-melt{opacity:1;filter:blur(.35px)}
@keyframes toy-egg-puddle{0%{scale:1 1}8%{scale:1.08 .92}18%{scale:1.14 .86}82%{scale:1.12 .88}100%{scale:1 1}}
.toy-melt-copy{
  position:absolute;
  left:50%;
  top:42%;
  width:max-content;
  transform:translate(-50%,-50%);
  color:#d07da8;
  text-shadow:1px 1px 0 #fff;
  font-size:clamp(9px,.8vw,12px);
  line-height:1.25;
  opacity:0;
  pointer-events:none;
}
.toy-egg.is-melted .toy-melt-copy{animation:toy-melt-copy 4.8s ease-out .08s both}
@keyframes toy-melt-copy{0%{opacity:0;transform:translate(-50%,-45%) scaleY(.8)}15%{opacity:1;transform:translate(-50%,-50%) scaleY(1)}72%{opacity:.8;transform:translate(-50%,35%) scaleY(1.65)}100%{opacity:0;transform:translate(-50%,95%) scaleY(2.15);filter:blur(1px)}}

.toy-ramune{
  left:11%;
  bottom:175px;
  width:clamp(46px,5.4vw,78px);
  aspect-ratio:194/640;
  will-change:transform;
}
.toy-ramune.is-charged img{filter:drop-shadow(0 0 7px rgba(119,211,244,.45))}
.toy-ramune.is-popping{animation:toy-ramune-pop-shake .32s steps(2,end) 2}
@keyframes toy-ramune-pop-shake{0%{rotate:-4deg}25%{rotate:5deg}50%{rotate:-6deg}75%{rotate:4deg}100%{rotate:0}}
.toy-ramune-pop{
  display:none; /* v432 uses the large shared Heisei-deco onomatopoeia instead. */
  position:absolute;
  left:50%;
  top:3%;
  translate:-50% -80%;
  color:#7fa2d9;
  font-size:10px;
  font-weight:bold;
  opacity:0;
  pointer-events:none;
}
.toy-ramune.is-popping .toy-ramune-pop{animation:toy-pop-word .55s ease-out both}
@keyframes toy-pop-word{0%{opacity:0;scale:.6}22%{opacity:1;scale:1.15}100%{opacity:0;translate:-50% -150%;scale:.9}}

.toy-fan{
  right:8%;
  bottom:135px;
  width:clamp(96px,10vw,146px);
  height:auto;
  aspect-ratio:140/190;
  cursor:pointer;
  touch-action:manipulation;
  --fan-duration:0s;
  filter:drop-shadow(0 5px 2px rgba(122,112,164,.15));
}
.toy-fan-svg{display:block;width:100%;height:100%;overflow:visible}
.toy-fan-shadow{fill:rgba(113,104,151,.14)}
.toy-fan-stand{fill:#eef0ff;stroke:#9184bb;stroke-width:4;stroke-linejoin:round}
.toy-fan-base-shape{fill:#f7f4ff;stroke:#8f80b9;stroke-width:4;stroke-linejoin:round}
.toy-fan-cage-outer{fill:#f8fbff;stroke:#8879b7;stroke-width:5}
.toy-fan-cage-inner{fill:none;stroke:#c7d0ed;stroke-width:3}
.toy-fan-grille{fill:none;stroke:#b8b3d6;stroke-width:1.8;opacity:.78}
.toy-fan-rotor{fill:#d8b6e7;stroke:#9c8ac3;stroke-width:1.5;transform-origin:70px 61px;animation:toy-fan-spin var(--fan-duration) linear infinite;animation-play-state:paused}
.toy-fan-hub-svg{fill:#fff0b9;stroke:#8e81bd;stroke-width:3}
.toy-fan-controls rect{fill:#fff;stroke:#9a8dc1;stroke-width:1.2}
.toy-fan-controls text{fill:#8273b0;font:700 6px "DotGothic16","MS Gothic",monospace;text-anchor:middle}
@keyframes toy-fan-spin{to{transform:rotate(360deg)}}
.toy-fan[data-fan-step]:not([data-fan-step="0"]) .toy-fan-rotor{animation-play-state:running}
.toy-fan[data-fan-step="1"] .toy-fan-controls rect:nth-of-type(2),
.toy-fan[data-fan-step="2"] .toy-fan-controls rect:nth-of-type(3),
.toy-fan[data-fan-step="3"] .toy-fan-controls rect:nth-of-type(4),
.toy-fan[data-fan-step="4"] .toy-fan-controls rect:nth-of-type(5){fill:#db8fbc}
.toy-fan[data-fan-step="4"] .toy-fan-controls text:last-child{fill:#fff}
.toy-fan[data-fan-step="4"]{filter:drop-shadow(0 0 7px rgba(145,181,236,.32))}
.toy-fan.is-step-change{animation:toy-fan-bump .18s ease-out}
@keyframes toy-fan-bump{0%{scale:1}45%{scale:1.035}100%{scale:1}}

/* ---------- system logs / bubbles ---------- */
.top-toy-system-log{
  position:fixed;
  z-index:2147482500;
  left:50%;
  bottom:max(86px,calc(72px + env(safe-area-inset-bottom)));
  width:min(460px,calc(100vw - 24px));
  display:grid;
  justify-items:center;
  gap:5px;
  translate:-50% 0;
  pointer-events:none;
}
.top-toy-system-log>span{
  max-width:100%;
  padding:6px 10px;
  border:1px solid rgba(111,106,157,.58);
  border-radius:7px;
  color:#665d91;
  background:rgba(255,255,255,.94);
  box-shadow:2px 3px 0 rgba(121,112,168,.14);
  font:700 9px/1.3 "DotGothic16","MS Gothic",monospace;
  letter-spacing:.03em;
  text-align:center;
  animation:toy-log-in .18s ease-out both;
}
.top-toy-system-log>span.is-leaving{opacity:0;translate:0 6px;transition:opacity .18s ease,translate .18s ease}
@keyframes toy-log-in{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}

.top-toy-bubble-layer{position:fixed;z-index:2147482200;inset:0;overflow:hidden;pointer-events:none}
.top-toy-bubble{
  position:absolute;
  left:0;
  top:0;
  width:14px;
  height:14px;
  border:2px solid rgba(155,208,241,.72);
  border-radius:50%;
  background:radial-gradient(circle at 32% 30%,rgba(255,255,255,.95) 0 17%,rgba(206,238,255,.18) 19% 58%,rgba(173,216,244,.12) 60% 100%);
  box-shadow:inset -2px -2px 0 rgba(177,214,240,.16),0 0 4px rgba(178,220,248,.25);
  opacity:0;
  will-change:transform,opacity;
}

/* ---------- shared world effects ---------- */
#homeView .home-first-view:after{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  background:transparent;
  transition:background .42s ease,opacity .42s ease;
}
#homeView.toy-sunset .home-first-view:after{background:linear-gradient(180deg,rgba(239,168,180,.05),rgba(76,77,139,.06))}
#homeView.toy-night .home-first-view:after{background:radial-gradient(circle at 24% 15%,rgba(92,104,166,.08),transparent 32%)}
#homeView.toy-dawn .home-first-view:after{background:linear-gradient(180deg,rgba(64,78,135,.06),rgba(241,191,193,.03))}
#homeView .stickerbook-paper{transition:filter .42s ease}
#homeView.toy-night .stickerbook-paper{filter:brightness(.82) saturate(.83)}
#homeView.toy-sunset .stickerbook-paper,#homeView.toy-dawn .stickerbook-paper{filter:brightness(.94) saturate(.92)}
#homeView.toy-night .toy-crt.is-on .toy-crt-screen{box-shadow:inset 0 0 22px rgba(127,214,255,.86),0 0 20px rgba(112,202,255,.68)}
#homeView.toy-night .sparkles span{color:#d9e9ff!important;text-shadow:0 0 6px rgba(184,220,255,.75)}
.top-toy-night-stars{position:absolute;z-index:0;inset:0;opacity:0;transition:opacity .35s ease;pointer-events:none}
.top-toy-night-stars i{position:absolute;color:#e8f0ff;font-style:normal;font-size:11px;text-shadow:0 0 5px rgba(192,220,255,.8);animation:toy-star-twinkle 1.8s steps(2,end) infinite}
.top-toy-night-stars i:nth-child(1){left:8%;top:17%}.top-toy-night-stars i:nth-child(2){left:28%;top:8%;animation-delay:.2s}.top-toy-night-stars i:nth-child(3){left:44%;top:21%;animation-delay:.6s}.top-toy-night-stars i:nth-child(4){left:62%;top:10%;animation-delay:.9s}.top-toy-night-stars i:nth-child(5){right:12%;top:27%;animation-delay:.4s}.top-toy-night-stars i:nth-child(6){right:5%;top:12%;animation-delay:1.1s}.top-toy-night-stars i:nth-child(7){left:17%;top:42%;animation-delay:.8s}.top-toy-night-stars i:nth-child(8){right:24%;top:46%;animation-delay:.1s}
#homeView.toy-night .top-toy-night-stars,#homeView.toy-dawn .top-toy-night-stars{opacity:1}
@keyframes toy-star-twinkle{0%,45%{opacity:.22}50%,100%{opacity:1}}

#homeView.toy-wind-max .hero-tap-speech:not(.is-hiding){transform:translateX(-50%) rotate(2deg)}
#homeView.toy-wind-max .dennou-cat-prompt,#homeView.toy-wind-max .dennou-cat-speech{rotate:1.5deg}
#homeView.toy-wind-max .top-toy-night-stars i{animation-duration:.85s}

/* MAX wind visibly catches nearby copy without moving its layout box.
   The original text remains readable/clickable; separate glyph clones fly away above it. */
#homeView.toy-wind-max .stickerbook-info-board header strong,
#homeView.toy-wind-max .stickerbook-guide-body p,
#homeView.toy-wind-max .stickerbook-weather-body p,
#homeView.toy-wind-max .stickerbook-news-body li span,
#homeView.toy-wind-max .stickerbook-speech,
#homeView.toy-wind-max #observerCounterPanel span,
#homeView.toy-wind-max #observerCounterPanel small,
#homeView.toy-wind-max .game-menu .menu-label b,
#homeView.toy-wind-max .game-menu .menu-label small{
  animation:toy-wind-text-buffet .36s ease-in-out infinite alternate;
  transform-origin:left center;
  will-change:transform;
}
#homeView.toy-wind-max .stickerbook-news-body li:nth-child(2n) span,
#homeView.toy-wind-max .stickerbook-weather-body p:nth-child(2n),
#homeView.toy-wind-max .game-menu button:nth-child(2n) .menu-label b{animation-delay:-.18s}
@keyframes toy-wind-text-buffet{
  from{transform:translate3d(-1px,0,0) skewX(-.4deg)}
  to{transform:translate3d(5px,-1px,0) skewX(2.2deg)}
}

.top-toy-wind-text-layer{
  position:fixed;
  z-index:2147482250;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  contain:strict;
}
.top-toy-wind-text-layer>i{
  position:absolute;
  display:block;
  margin:0;
  padding:0;
  font-style:normal;
  line-height:1;
  white-space:pre;
  text-shadow:0 1px 0 rgba(255,255,255,.8);
  will-change:transform,opacity;
  animation:toy-wind-glyph-fly var(--wind-time,.9s) cubic-bezier(.18,.7,.16,1) forwards;
}
@keyframes toy-wind-glyph-fly{
  0%{opacity:.95;transform:translate3d(0,0,0) rotate(0deg) scale(1)}
  22%{opacity:1;transform:translate3d(12px,-2px,0) rotate(4deg) scale(1.04)}
  100%{opacity:0;transform:translate3d(var(--wind-dx,140px),var(--wind-dy,-8px),0) rotate(var(--wind-rot,18deg)) scale(.88)}
}



/* ---------- whole viewport night overlay ---------- */
.top-toy-night-overlay{
  position:fixed;
  z-index:2147482100;
  inset:0;
  pointer-events:none;
  opacity:0;
  background:rgba(10,13,38,0);
  transition:opacity .42s ease,background .42s ease;
  will-change:opacity,background;
}
.top-toy-night-overlay.is-sunset{opacity:1;background:rgba(28,24,58,.30)}
.top-toy-night-overlay.is-night{opacity:1;background:rgba(5,8,28,.64)}
.top-toy-night-overlay.is-dawn{opacity:1;background:rgba(25,27,61,.32)}

/* ---------- large Heisei deco onomatopoeia ---------- */
.top-toy-onoma-layer{
  position:fixed;
  z-index:2147482450;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  contain:layout paint style;
  font-family:"DotGothic16","MS Gothic",monospace;
}
.top-toy-onoma{
  --onoma-x:50vw;
  --onoma-y:45vh;
  --onoma-rot:-4deg;
  --onoma-scale:1;
  position:absolute;
  left:var(--onoma-x);
  top:var(--onoma-y);
  max-width:min(92vw,760px);
  margin:0;
  padding:.06em .18em .13em;
  translate:-50% -50%;
  color:#ff87bc;
  background:linear-gradient(180deg,#fff7a9 0%,#ff9fca 37%,#b9d9ff 72%,#d8b5ff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:clamp(1.4px,.32vw,3.4px) rgba(255,255,255,.98);
  font-size:clamp(40px,12vw,104px);
  font-weight:900;
  line-height:.92;
  letter-spacing:-.055em;
  text-align:center;
  white-space:nowrap;
  text-shadow:
    3px 3px 0 rgba(255,119,184,.78),
    -3px 2px 0 rgba(126,198,255,.72),
    0 6px 0 rgba(159,123,205,.34),
    0 0 10px rgba(255,255,255,.72);
  filter:drop-shadow(0 3px 0 rgba(128,94,169,.25));
  opacity:0;
  transform:rotate(var(--onoma-rot)) scale(var(--onoma-scale));
  transform-origin:center;
  will-change:transform,opacity,filter;
  animation:toy-onoma-pop 1.05s cubic-bezier(.18,.8,.18,1) forwards;
}
.top-toy-onoma::before,.top-toy-onoma::after{
  position:absolute;
  -webkit-text-fill-color:#fff6a8;
  -webkit-text-stroke:1px #d994cf;
  color:#fff6a8;
  text-shadow:1px 1px 0 #9dd8ff;
  font-size:.35em;
  line-height:1;
}
.top-toy-onoma::before{content:"✦";left:-.18em;top:-.25em;transform:rotate(-15deg)}
.top-toy-onoma::after{content:"♡";right:-.18em;bottom:-.18em;transform:rotate(12deg)}
@keyframes toy-onoma-pop{
  0%{opacity:0;transform:rotate(calc(var(--onoma-rot) - 5deg)) scale(.46)}
  18%{opacity:1;transform:rotate(calc(var(--onoma-rot) + 2deg)) scale(1.11)}
  34%{transform:rotate(var(--onoma-rot)) scale(.98)}
  72%{opacity:1;transform:rotate(var(--onoma-rot)) scale(1)}
  100%{opacity:0;transform:translate3d(0,-22px,0) rotate(calc(var(--onoma-rot) + 3deg)) scale(.94)}
}
.top-toy-onoma.is-wind{font-size:clamp(48px,15vw,126px);animation-name:toy-onoma-wind}
@keyframes toy-onoma-wind{
  0%{opacity:0;transform:translate3d(-55px,4px,0) rotate(-8deg) scale(.54)}
  15%{opacity:1;transform:translate3d(0,0,0) rotate(-4deg) scale(1.08)}
  54%{opacity:1;transform:translate3d(28px,-2px,0) rotate(1deg) skewX(-5deg) scale(1)}
  100%{opacity:0;transform:translate3d(min(40vw,330px),-15px,0) rotate(10deg) skewX(-14deg) scale(.86)}
}
.top-toy-onoma.is-stretch{animation-name:toy-onoma-stretch;transform-origin:left center}
@keyframes toy-onoma-stretch{
  0%{opacity:0;transform:translate3d(-18px,0,0) rotate(-5deg) scale(.5,.8)}
  22%{opacity:1;transform:translate3d(0,0,0) rotate(-2deg) scale(1.18,.96)}
  65%{opacity:1;transform:translate3d(25px,0,0) rotate(1deg) scale(1.34,.93)}
  100%{opacity:0;transform:translate3d(55px,-10px,0) rotate(3deg) scale(1.48,.88)}
}
.top-toy-onoma.is-melt{animation-name:toy-onoma-melt}
@keyframes toy-onoma-melt{
  0%{opacity:0;transform:rotate(-3deg) scale(.62,.72)}
  20%{opacity:1;transform:rotate(-2deg) scale(1.04,1)}
  68%{opacity:1;transform:translate3d(0,18px,0) rotate(1deg) scale(1.04,1.28)}
  100%{opacity:0;filter:blur(1.5px);transform:translate3d(0,62px,0) rotate(2deg) scale(.96,1.75)}
}
.top-toy-onoma.is-fizz{animation-name:toy-onoma-fizz;font-size:clamp(38px,11vw,92px)}
@keyframes toy-onoma-fizz{
  0%{opacity:0;transform:translate3d(0,28px,0) rotate(4deg) scale(.6)}
  18%{opacity:1;transform:translate3d(0,0,0) rotate(-2deg) scale(1.08)}
  72%{opacity:1;transform:translate3d(0,-36px,0) rotate(2deg) scale(1)}
  100%{opacity:0;transform:translate3d(20px,-92px,0) rotate(7deg) scale(.86)}
}
.top-toy-onoma.is-glitch{animation:toy-onoma-glitch .72s steps(2,end) forwards}
@keyframes toy-onoma-glitch{
  0%{opacity:0;transform:translate3d(-8px,0,0) skewX(-8deg) scale(.7)}
  16%{opacity:1;transform:translate3d(5px,-2px,0) skewX(8deg) scale(1.08)}
  32%{transform:translate3d(-6px,2px,0) skewX(-5deg) scale(1)}
  55%{opacity:1;transform:translate3d(3px,0,0) skewX(3deg) scale(1.02)}
  100%{opacity:0;transform:translate3d(18px,-5px,0) skewX(-10deg) scale(.92)}
}
.top-toy-onoma.is-quiet{
  font-size:clamp(34px,9vw,68px);
  letter-spacing:.02em;
  background:linear-gradient(180deg,#eaf0ff,#bfc8ec 58%,#9b96c7);
  -webkit-background-clip:text;background-clip:text;
  text-shadow:2px 2px 0 rgba(255,255,255,.7),-2px 2px 0 rgba(137,171,224,.42);
  animation-duration:.9s;
}
.top-toy-onoma.is-quiet::before{content:"·"}.top-toy-onoma.is-quiet::after{content:"✧"}
.top-toy-onoma.is-small{font-size:clamp(30px,8vw,62px)}

/* ---------- responsive ---------- */
@media(max-width:980px){
  .toy-crt{left:1.5%;bottom:470px}
  .toy-egg{right:2.5%;bottom:455px}
  .toy-ramune{left:7%;bottom:170px}
  .toy-fan{right:5%;bottom:125px}
}
@media(max-width:760px){
  .toy-rainbow{left:1%;top:1%;width:clamp(82px,23vw,112px)}
  .toy-sun{right:16%;top:1%;width:clamp(46px,13vw,62px)}
  .toy-fish{left:3%;bottom:10%;width:clamp(112px,34vw,150px)}
  .toy-cat{right:1%;bottom:1%;width:clamp(66px,19vw,88px)}
  .toy-cat-hint{right:58%;bottom:86%;max-width:142px;font-size:8px}
  .toy-crt{left:1.5%;bottom:470px;width:clamp(92px,27vw,126px)}
  .toy-egg{right:1%;bottom:455px;width:clamp(78px,23vw,104px)}
  .toy-ramune{left:4%;bottom:155px;width:clamp(42px,12vw,58px)}
  .toy-fan{right:2%;bottom:120px;width:clamp(82px,23vw,105px);height:auto}
  .toy-crt-screen{padding:5px 4px 12px}.toy-crt-screen pre{font-size:5.5px}.toy-crt-screen small{font-size:5px}
  .top-toy-system-log{bottom:max(76px,calc(68px + env(safe-area-inset-bottom)));width:calc(100vw - 18px)}
  .top-toy-system-log>span{font-size:8px;padding:5px 8px}
  .top-toy-onoma{font-size:clamp(38px,13vw,72px);max-width:94vw}
  .top-toy-onoma.is-wind{font-size:clamp(46px,16vw,88px)}
}
@media(max-width:420px){
  .toy-rainbow{top:.5%;width:84px}
  .toy-sun{right:17%;width:48px}
  .toy-fish{left:1%;bottom:11%;width:118px}
  .toy-cat{right:0;bottom:.5%;width:70px}
  .toy-crt{bottom:440px;width:96px}
  .toy-egg{bottom:432px;width:82px}
  .toy-ramune{bottom:142px;width:45px}
  .toy-fan{bottom:105px;width:86px;height:auto}
}

@media(prefers-reduced-motion:reduce){
  .toy-rainbow.is-tension .toy-rainbow-art,
  .toy-crt.is-on .toy-crt-screen:after,
  .toy-crt.is-noise-hit .toy-crt-screen,
  .toy-ramune.is-popping,
  .top-toy-night-stars i{animation:none!important}
  #homeView .home-first-view:after,#homeView .stickerbook-paper{transition-duration:.12s!important}
  .toy-fan-rotor{animation-duration:max(var(--fan-duration),.7s)!important}
  .top-toy-system-log>span{animation:none!important}
  .top-toy-night-overlay{transition-duration:.12s!important}
  .top-toy-onoma{animation-duration:.55s!important}
  #homeView.toy-wind-max .stickerbook-info-board header strong,
  #homeView.toy-wind-max .stickerbook-guide-body p,
  #homeView.toy-wind-max .stickerbook-weather-body p,
  #homeView.toy-wind-max .stickerbook-news-body li span,
  #homeView.toy-wind-max .stickerbook-speech,
  #homeView.toy-wind-max #observerCounterPanel span,
  #homeView.toy-wind-max #observerCounterPanel small,
  #homeView.toy-wind-max .game-menu .menu-label b,
  #homeView.toy-wind-max .game-menu .menu-label small{animation-duration:.8s!important}
}