/* V2.7：さわれるキャラクター・オーラ・コイン（ホームとゲームで共通） */
.yc{position:relative;flex:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.yc svg{display:block}
.yc-aura,.yc-rot,.yc-fx{position:absolute;inset:0;pointer-events:none}
.yc-move,.yc-idle,.yc-sway{position:absolute;inset:0;transform-origin:50% 92%}
.yc-sway>svg{position:absolute;inset:0;width:100%;height:100%}
.yc-hat{position:absolute;inset:0;width:100%;height:100%}
.yc-hit{position:absolute;inset:0;border:0;background:transparent;border-radius:50%;cursor:pointer;padding:0;-webkit-tap-highlight-color:transparent}
.yc-breathe{animation:ycBreathe 2.8s ease-in-out infinite}
.yc-sway{animation:ycSway 4.2s ease-in-out infinite}
.yc-hop{animation:ycHop 1.1s ease-in-out infinite}
.yc-egg .yc-sway svg{filter:brightness(0);opacity:.13}
.yc-gold .yc-sway>svg:first-child,.tr-char.yc-gold svg{filter:sepia(.55) saturate(2.4) hue-rotate(-10deg) brightness(1.06)}
@keyframes ycBreathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.04,.96)}}
@keyframes ycSway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@keyframes ycHop{0%,100%{transform:translateY(0) scale(1)}20%{transform:scale(1.08,.9)}55%{transform:translateY(-20px) scale(.95,1.06)}}

/* 吹き出し（韓国語＋小さい日本語） */
.yc-bub{position:absolute;left:50%;top:-16%;transform:translateX(-50%);background:#fff;border-radius:16px;padding:6px 12px;display:flex;flex-direction:column;align-items:center;white-space:nowrap;box-shadow:0 2px 10px rgba(29,43,79,.18);pointer-events:none;z-index:3;line-height:1.35}
.yc-bub[hidden]{display:none}
.yc-bub.on{animation:ycBub .35s cubic-bezier(.3,1.6,.5,1)}
.yc-bub b{font:800 15px "Nanum Gothic","Apple SD Gothic Neo",sans-serif;color:#233f5e}
.yc-bub small{font-size:10.5px;color:#5f6f82;font-weight:700}
@keyframes ycBub{from{transform:translateX(-50%) scale(.4);opacity:0}}

/* うごき */
.m-jump{animation:mJump .7s cubic-bezier(.3,.7,.4,1)}@keyframes mJump{0%{transform:scale(1.1,.85)}35%{transform:translateY(-46px) scale(.92,1.1)}70%{transform:scale(1.08,.9)}100%{transform:none}}
.m-spin{animation:mSpin .8s cubic-bezier(.4,0,.2,1)}@keyframes mSpin{0%{transform:none}40%{transform:translateY(-24px) rotate(200deg)}100%{transform:rotate(360deg)}}
.m-flip{animation:mFlip .8s ease-in-out}@keyframes mFlip{50%{transform:scaleX(-1) translateY(-10px)}}
.m-squish{animation:mSq .7s cubic-bezier(.3,1.6,.5,1)}@keyframes mSq{25%{transform:scale(1.3,.65)}60%{transform:scale(.9,1.12)}}
.m-jelly{animation:mJel .9s ease-out}@keyframes mJel{15%{transform:scale(1.18,.84)}30%{transform:scale(.86,1.14)}45%{transform:scale(1.1,.92)}60%{transform:scale(.95,1.05)}75%{transform:scale(1.03,.97)}}
.m-no{animation:mNo .8s ease-in-out}@keyframes mNo{20%{transform:rotate(-11deg)}40%{transform:rotate(10deg)}60%{transform:rotate(-8deg)}80%{transform:rotate(5deg)}}
.m-nod{animation:mNod .8s ease-in-out}@keyframes mNod{25%,75%{transform:scale(1.04,.9)}50%,100%{transform:none}}
.m-pop{animation:mPop .7s cubic-bezier(.3,1.6,.5,1)}@keyframes mPop{40%{transform:scale(1.38)}70%{transform:scale(.92)}}
.m-hopl{animation:mHl .8s ease-in-out}@keyframes mHl{45%{transform:translate(-34px,-30px) rotate(-16deg)}80%{transform:translate(-6px,0) rotate(-3deg)}}
.m-hopr{animation:mHr .8s ease-in-out}@keyframes mHr{45%{transform:translate(34px,-30px) rotate(16deg)}80%{transform:translate(6px,0) rotate(3deg)}}
.m-double{animation:mDbl 1s ease-in-out}@keyframes mDbl{20%{transform:translateY(-34px)}40%{transform:scale(1.1,.88)}62%{transform:translateY(-48px)}84%{transform:scale(1.08,.9)}}
.m-float{animation:mFlt 1.6s ease-in-out}@keyframes mFlt{40%{transform:translateY(-44px) rotate(-4deg)}70%{transform:translateY(-40px) rotate(4deg)}}
.m-beat{animation:mBeat .9s ease-in-out}@keyframes mBeat{15%{transform:scale(1.16)}30%{transform:scale(1)}45%{transform:scale(1.22)}65%{transform:scale(1)}}
.m-dance{animation:mDance 1.4s ease-in-out}@keyframes mDance{12%{transform:translateX(-14px) rotate(-9deg)}25%{transform:translate(0,-12px)}37%{transform:translateX(14px) rotate(9deg)}50%{transform:translate(0,-12px)}62%{transform:translateX(-14px) rotate(-9deg)}75%{transform:translate(0,-12px)}87%{transform:translateX(14px) rotate(9deg)}}
.m-roll{animation:mRoll 1.3s ease-in-out}@keyframes mRoll{45%{transform:translateX(42px) rotate(360deg)}100%{transform:translateX(0) rotate(720deg)}}
.m-shy{animation:mShy 1.3s ease-in-out}@keyframes mShy{30%,65%{transform:scale(.72) translateY(6px)}}
.m-pat{animation:mPat .9s ease-in-out}@keyframes mPat{20%,60%{transform:scale(1.1,.86)}40%,80%{transform:none}}
.m-hold{animation:mHold .45s ease-out forwards}@keyframes mHold{to{transform:scale(1.22,.74)}}
.m-boing{animation:mBoing .9s cubic-bezier(.2,.8,.3,1)}@keyframes mBoing{0%{transform:scale(1.22,.74)}35%{transform:translateY(-90px) scale(.86,1.16)}75%{transform:scale(1.1,.88)}}
.m-dizzy{animation:mDiz 1.4s ease-in-out}@keyframes mDiz{10%{transform:rotate(-14deg)}25%{transform:rotate(12deg)}40%{transform:rotate(-10deg)}55%{transform:rotate(8deg)}70%{transform:rotate(-5deg)}}
.m-party{animation:mParty 1.8s ease-in-out}@keyframes mParty{15%{transform:translateY(-30px) rotate(-12deg)}30%{transform:translateY(0) scale(1.1,.9)}50%{transform:translateY(-50px) rotate(360deg)}70%{transform:rotate(360deg) scale(1.1,.9)}85%{transform:rotate(360deg) translateY(-16px)}100%{transform:rotate(360deg)}}

/* さわったときの効果（1〜2秒で消える） */
.yp{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;opacity:0;will-change:transform,opacity}
.yp svg{width:100%;height:100%}
.yp-heart,.yp-note{animation:ypRise 1.3s ease-out forwards}
@keyframes ypRise{0%{opacity:0;transform:translate(0,0) scale(.3)}20%{opacity:1;transform:translate(calc(var(--dx)*.3),-20px) scale(1.1)}100%{opacity:0;transform:translate(var(--dx),-120px) scale(.9) rotate(var(--r))}}
.yp-star,.yp-spark{animation:ypBurst 1s cubic-bezier(.2,.8,.3,1) forwards}
@keyframes ypBurst{0%{opacity:0;transform:translate(0,0) scale(.2)}25%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1) rotate(var(--r))}}
.yp-conf{width:8px;height:12px;margin:-6px 0 0 -4px;border-radius:2px;animation:ypConf 1.4s cubic-bezier(.2,.7,.4,1) forwards}
@keyframes ypConf{0%{opacity:0;transform:translate(0,0)}15%{opacity:1;transform:translate(calc(var(--dx)*.5),-70px) rotate(90deg)}100%{opacity:0;transform:translate(var(--dx),60px) rotate(var(--r))}}
.yp-wave{left:0;top:0;width:100%;height:100%;margin:0;border-radius:50%;border:3px solid rgba(255,214,110,.9);box-sizing:border-box;animation:ypWave .9s ease-out forwards}
@keyframes ypWave{0%{opacity:1;transform:scale(.5)}100%{opacity:0;transform:scale(1.5)}}
.yc-plus{position:absolute;left:50%;top:10%;display:flex;align-items:center;gap:3px;font:800 18px "M PLUS Rounded 1c",sans-serif;color:#A87412;transform:translateX(-50%);animation:ycPlus 1.4s ease-out forwards;white-space:nowrap}
.yc-plus svg{width:20px;height:20px}
@keyframes ycPlus{0%{opacity:0;transform:translate(-50%,10px) scale(.6)}20%{opacity:1;transform:translate(-50%,-6px) scale(1.15)}100%{opacity:0;transform:translate(-50%,-50px)}}

/* オーラ（画像なし：グラデーション＋小さな絵） */
.ya-glow,.ya-ring,.ya-ring2,.ya-rays,.ya-wave,.ya-rainbow{position:absolute;border-radius:50%}
.ya-glow{inset:-6%;background:radial-gradient(circle,rgba(255,236,170,.95) 0%,rgba(255,214,110,.45) 38%,rgba(255,214,110,0) 68%);animation:yaGlow 2.6s ease-in-out infinite;will-change:transform,opacity}
.ya-ring{inset:-4%;background:conic-gradient(from 0deg,rgba(255,230,150,0),rgba(255,244,200,.95),rgba(255,210,94,0) 30%,rgba(255,244,200,.9) 55%,rgba(255,210,94,0) 75%,rgba(255,244,200,.95));-webkit-mask:radial-gradient(circle,transparent 57%,#000 59%,#000 63%,transparent 65%);mask:radial-gradient(circle,transparent 57%,#000 59%,#000 63%,transparent 65%);animation:yaSpin 5s linear infinite;will-change:transform}
.ya-ring2{inset:6%;background:conic-gradient(#FFF6D6,rgba(255,210,94,0) 25%,#FFE08A 50%,rgba(255,210,94,0) 75%,#FFF6D6);-webkit-mask:radial-gradient(circle,transparent 60%,#000 62%,#000 65%,transparent 67%);mask:radial-gradient(circle,transparent 60%,#000 62%,#000 65%,transparent 67%);animation:yaSpin 3.2s linear infinite reverse}
.ya-rays{inset:-40%;background:repeating-conic-gradient(from 0deg,rgba(255,226,140,.55) 0deg 6deg,rgba(255,226,140,0) 6deg 22deg);-webkit-mask:radial-gradient(circle,#000 18%,transparent 62%);mask:radial-gradient(circle,#000 18%,transparent 62%);animation:yaSpin 14s linear infinite;will-change:transform}
.ya-wave{inset:8%;border:2.5px solid rgba(255,220,130,.85);opacity:0;animation:yaWave 3s ease-out infinite}
.ya-rainbow{inset:-4%;background:conic-gradient(#ff9aa8,#ffd27a,#fff3a0,#9fe3b4,#8fd0ff,#b8a6ff,#ff9aa8);-webkit-mask:radial-gradient(circle,transparent 58%,#000 60%,#000 65%,transparent 67%);mask:radial-gradient(circle,transparent 58%,#000 60%,#000 65%,transparent 67%);animation:yaSpin 4s linear infinite;will-change:transform}
.ya-spark{position:absolute;width:16px;height:16px;animation:yaTw 1.9s ease-in-out infinite}
.ya-spark svg,.ya-hrise svg,.ya-petal svg,.ya-orbit i svg{width:100%;height:100%}
.ya-hrise{position:absolute;bottom:12%;width:14%;height:14%;opacity:0;animation:yaHr 3.6s ease-in infinite}
.ya-petals{position:absolute;inset:-10% 0 0 0;overflow:hidden;border-radius:50%}
.ya-petal{position:absolute;top:-8%;width:10%;height:10%;opacity:0;animation:yaPet 4s linear infinite}
.ya-orbit{position:absolute;inset:0;animation:yaSpin 6s linear infinite}
.ya-orbit i{position:absolute;width:16%;height:16%}
@keyframes yaSpin{to{transform:rotate(360deg)}}
@keyframes yaGlow{0%,100%{opacity:.55;transform:scale(.95)}50%{opacity:1;transform:scale(1.05)}}
@keyframes yaTw{0%,100%{opacity:0;transform:scale(.3) rotate(0deg)}50%{opacity:1;transform:scale(1) rotate(45deg)}}
@keyframes yaWave{0%{opacity:.9;transform:scale(.6)}100%{opacity:0;transform:scale(1.35)}}
@keyframes yaHr{0%{opacity:0;transform:translateY(0) scale(.5)}20%{opacity:.95}100%{opacity:0;transform:translateY(-140%) translateX(8px) scale(1)}}
@keyframes yaPet{0%{opacity:0;transform:translate(0,0) rotate(0)}15%{opacity:1}100%{opacity:0;transform:translate(24px,700%) rotate(320deg)}}

/* コイン */
.coin-pill{display:inline-flex;align-items:center;gap:5px;background:#fff;border-radius:999px;padding:4px 12px 4px 6px;font:800 16px "M PLUS Rounded 1c",sans-serif;color:#233f5e;box-shadow:0 1px 3px rgba(35,63,94,.14)}
.coin-i{display:inline-block;width:22px;height:22px}.coin-i svg{width:100%;height:100%;display:block}

/* 超越変身 */
.tr-ov{position:fixed;inset:0;z-index:60;background:radial-gradient(120% 70% at 50% 40%,#34507a 0%,#1d2b4f 60%,#141d36 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:#fff;font-family:"M PLUS Rounded 1c",sans-serif}
.tr-stage{width:220px;height:220px;position:relative}
.tr-a{position:absolute;inset:0}
.tr-char{position:absolute;inset:0}.tr-char svg{width:100%;height:100%}
.tr-shake{position:absolute;inset:0;animation:trCharge .9s ease-in forwards;transform-origin:50% 90%}
.tr-cg{animation:trCg .9s ease-in forwards}
.tr-reveal{position:absolute;inset:0;animation:trReveal .7s cubic-bezier(.3,1.5,.5,1) both}
.tr-flash{position:fixed;inset:0;background:#fff;animation:trFlash .6s ease-out forwards;pointer-events:none}
.tr-text{display:flex;flex-direction:column;align-items:center;gap:6px;animation:trReveal .6s .2s both}
.tr-text[hidden]{display:none}
.tr-text b{font-size:30px;color:#FFE08A;letter-spacing:.06em}
.tr-text small{font-size:13px;color:#C9D3EA}
.tr-text button{margin-top:10px;border:0;border-radius:14px;background:#FFD25E;color:#1d2b4f;font:800 17px "M PLUS Rounded 1c",sans-serif;padding:12px 48px;cursor:pointer}
@keyframes trCharge{30%{transform:translateX(-3px) scale(1.02)}45%{transform:translateX(3px) scale(1.04)}60%{transform:translateX(-4px) scale(1.06)}75%{transform:translateX(4px) scale(1.08)}100%{transform:scale(1.14,.86)}}
@keyframes trCg{from{transform:scale(.4);opacity:.2}to{transform:scale(1.3);opacity:1}}
@keyframes trFlash{0%{opacity:0}25%{opacity:1}100%{opacity:0}}
@keyframes trReveal{from{transform:scale(.3) translateY(30px);opacity:0}}

@media (prefers-reduced-motion:reduce){
  .yc-breathe,.yc-sway,.yc-hop,.ya-glow,.ya-ring,.ya-ring2,.ya-rays,.ya-wave,.ya-rainbow,.ya-spark,.ya-hrise,.ya-petal,.ya-orbit{animation:none}
}
