/* タイトルロゴの見た目と動き（組み立ては js/logo.js） */
.pk-logo { display: block; position: relative; aspect-ratio: var(--pk-ratio, 646.5 / 309.57); margin: 0; }
.pk-box { position: absolute; inset: 0; display: block; }
.pk-box .pk-ch, .pk-link { position: absolute; display: block; overflow: visible; }
.pk-link .pk-ch { inset: 0; width: 100%; height: 100%; }
.pk-box .pk-ch { pointer-events: auto; touch-action: manipulation; cursor: pointer; -webkit-tap-highlight-color: transparent; }
[data-noboing] .pk-ch { pointer-events: none; cursor: inherit; }

/* いつも：ふわふわ。文字ごとに少しずらす */
.pk-box > .pk-ch { transform-origin: 50% 88%; transform-box: fill-box; rotate: var(--r, 0deg); animation: pkBob 2.8s ease-in-out infinite; animation-delay: calc(var(--i) * -.56s); }
.pk-box > .pk-ch[data-i="0"] { --r: -4deg; }
.pk-box > .pk-ch[data-i="1"] { --r: 3deg; }
.pk-box > .pk-ch[data-i="2"] { --r: -2deg; }
.pk-box > .pk-ch[data-i="3"] { --r: 3deg; }
.pk-box > .pk-ch[data-i="4"] { --r: 7deg; animation-name: pkBobTall; }
.pk-link { animation: pkLink 3.4s ease-in-out infinite; animation-delay: calc(var(--i) * -.32s); }
@keyframes pkBob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -3.2%; } }
@keyframes pkBobTall { 0%, 100% { translate: 0 0; rotate: 7deg; } 50% { translate: 0 -2.6%; rotate: 11deg; } }
@keyframes pkLink { 0%, 100% { translate: 0 0; } 50% { translate: 0 -2.4%; } }

/* はじめ：しぼんだ風船が 順に ぷくっと ふくらむ（.pk-in を付けると動く） */
.pk-wait .pk-ch { scale: 0; }
.pk-in .pk-box > .pk-ch { animation: pkInflate .78s cubic-bezier(.3, 1.2, .5, 1) both, pkBob 2.8s ease-in-out infinite; animation-delay: calc(var(--i) * .11s), calc(var(--i) * -.56s); }
.pk-in .pk-box > .pk-ch[data-i="4"] { animation-name: pkInflate, pkBobTall; }
.pk-in .pk-link .pk-ch { transform-origin: 50% 70%; animation: pkLinkIn .5s cubic-bezier(.3, 1.5, .5, 1) both; animation-delay: calc(.56s + var(--i) * .07s); }
@keyframes pkInflate {
  0% { scale: .12 .06; opacity: 0; }
  12% { opacity: 1; }
  34% { scale: .62 .46; }
  38% { scale: .56 .54; }
  62% { scale: 1.2 1.12; }
  76% { scale: .92 1.06; }
  88% { scale: 1.05 .97; }
  100% { scale: 1 1; opacity: 1; }
}
@keyframes pkLinkIn { 0% { scale: .1 .5; opacity: 0; } 40% { opacity: 1; } 100% { scale: 1 1; opacity: 1; } }

/* さわると ぷにっ */
.pk-box .pk-ch.boing { animation: pkBoing .56s cubic-bezier(.3, 1.2, .5, 1) both !important; }
@keyframes pkBoing { 0% { scale: 1 1; } 22% { scale: 1.24 .74; } 48% { scale: .86 1.2; } 72% { scale: 1.07 .95; } 100% { scale: 1 1; } }

.pk-still .pk-ch, .pk-still .pk-link { animation: none !important; scale: 1 !important; }
@media (prefers-reduced-motion: reduce) { .pk-ch, .pk-link { animation: none !important; scale: 1 !important; } }
