/* preview_panelanime.html の選択された動きだけを実ゲームへ適用。 */
.cell.jump.mochiFind{animation-name:mochiHop;transform-origin:50% 100%}
@keyframes mochiHop{
  0%,100%{transform:none}18%{transform:translateY(4px) scale(1.16,.74)}
  42%{transform:translateY(calc(-10px * var(--find-amount,1))) scale(.92,1.1)}
  62%{transform:translateY(0) scale(1.07,.91)}80%{transform:translateY(-2px) scale(.98,1.03)}92%{transform:scale(1.01,.99)}
}
#board .cell.jump.strongFindGlow::before{box-shadow:0 0 10px 4px #fff2a0,0 0 24px 8px #ffd630d9,0 0 40px 14px #ffb8008c;animation-name:strongFindGlow}
@keyframes strongFindGlow{0%,100%{opacity:0}12%,85%{opacity:1}}
body #cdNum,body #cdStart{color:#fff;-webkit-text-stroke:8px #f4552e;paint-order:stroke fill;text-shadow:0 8px 0 #c33f1f}
body #cdNum.tick{animation:motionCountdownDrop .9s cubic-bezier(.2,.9,.3,1.3) both}
#cdNum{position:relative}
#cdNum.tick::before{content:'';position:absolute;left:50%;top:50%;width:270px;height:270px;margin:-135px 0 0 -135px;border:6px solid #f8ae66;border-radius:50%;animation:motionCountdownRing .9s ease-out both;z-index:-1}
@keyframes motionCountdownDrop{0%{opacity:0;transform:translateY(-40px) scale(1.4)}25%{opacity:1;transform:translateY(4px) scale(.9,1.1)}40%{transform:scale(1.05,.95)}55%,85%{opacity:1;transform:none}100%{opacity:0;transform:scale(1.1)}}
@keyframes motionCountdownRing{0%,22%{opacity:0;transform:scale(.6)}35%{opacity:.9}80%,100%{opacity:0;transform:scale(1.5)}}
.scoreOdometer{display:inline-block;height:1.15em;line-height:1.15;overflow:hidden;vertical-align:bottom;transform-origin:50% 85%;min-width:.65em}
.scoreStrip{display:flex;flex-direction:column;line-height:1.15}
.scoreStrip>span{display:block;flex:none;height:1.15em;white-space:nowrap;text-align:center}
.scCard,.olTeamScoreCard{position:relative}
.liveLeaderCrown{position:absolute;left:0;top:0;z-index:18;width:44px;height:44px;font-size:34px;line-height:44px;text-align:center;pointer-events:none;opacity:0;filter:drop-shadow(0 2px 0 #b96b3680);transition:transform .32s cubic-bezier(.22,.8,.35,1),opacity .09s .23s}
.liveLeaderCrown.leading{opacity:1;transition:transform .32s cubic-bezier(.22,.8,.35,1),opacity .09s}
#timerDisp{position:relative;z-index:20}
#vsBox{position:relative;z-index:20}
.stageArrival{position:absolute;left:50%;bottom:calc(50% + 184px);transform:translateX(-50%);z-index:21;display:flex;align-items:center;justify-content:center;gap:24px;width:max-content;max-width:94%;pointer-events:none}
.arrivalPortrait{position:relative;width:168px;height:168px;flex:none;display:grid;place-items:center}
.arrivalPortrait::before{content:'';position:absolute;inset:-7px;border:4px dashed #d5a052;border-radius:50%;background:#fff2cc88;animation:motionBossHalo 1.6s ease-out both}
.arrivalPortrait img{position:relative;top:-20px;width:100%;height:100%;object-fit:contain;animation:motionBossArrival 1.6s cubic-bezier(.2,.8,.3,1) both;filter:drop-shadow(0 4px 0 #60466333)}
.arrivalName{display:flex;flex-direction:column;gap:8px;min-width:252px;max-width:472px;padding:15px 32px;background:#fffaf0;border:4px solid #d5a052;border-radius:20px;box-shadow:0 6px 0 #d5a05244;animation:motionBossName 1.6s cubic-bezier(.2,.8,.3,1) both}
.arrivalName small{font:bold 20px sans-serif;letter-spacing:.2em;color:#bc8841}
.arrivalName strong{font-family:var(--tile-font,'Mochiy Pop One'),sans-serif;font-size:44px;line-height:1.25;color:#715275}
@keyframes motionBossArrival{0%{opacity:0;transform:translateX(-25px) scale(.8)}42%{opacity:1;transform:translateY(-3px) scale(1.08)}65%,100%{opacity:1;transform:none}}
@keyframes motionBossHalo{0%{opacity:0;transform:rotate(-65deg) scale(.55)}30%,75%{opacity:.8}100%{opacity:0;transform:rotate(65deg) scale(1.13)}}
@keyframes motionBossName{0%,18%{opacity:0;transform:translateX(28px) scaleX(.7)}49%{opacity:1;transform:translateX(-3px)}68%,100%{opacity:1;transform:none}}
.stageUnlockMotion{display:flex;align-items:center;justify-content:center;gap:12px;margin:16px 0 10px;pointer-events:none}
.unlockStage{position:relative;display:flex;flex-direction:column;align-items:center;width:140px;padding:7px 10px;border:3px solid #e3c691;border-radius:18px;background:#fff9e9;color:#795676;font-weight:800;font-size:18px}
.unlockStage img{height:62px;width:74px;object-fit:contain}
.unlockStage.next{border-color:#dda740;animation:motionStageUnlock 1.55s cubic-bezier(.2,.8,.3,1) both}
.unlockPath{width:76px;height:7px;border-radius:6px;background:#e9bb5c;transform-origin:left;animation:motionStageConnect 1.55s ease-out both}
.unlockNew,.unlockClear{position:absolute;right:-12px;top:-14px;padding:3px 10px;border-radius:999px;background:#eaa84a;color:#fff;font-size:15px}
.unlockClear{background:#82b49a}.unlockNew{animation:motionStageNew 1.55s cubic-bezier(.2,.8,.3,1) both}
@keyframes motionStageUnlock{0%,20%{transform:scale(.8);opacity:.55}55%{transform:translateY(-7px) scale(1.1);opacity:1}74%,100%{transform:none;opacity:1}}
@keyframes motionStageConnect{0%{transform:scaleX(.05)}40%,100%{transform:scaleX(1)}}
@keyframes motionStageNew{0%,45%{opacity:0;transform:scale(.4) rotate(-15deg)}73%{opacity:1;transform:scale(1.15) rotate(5deg)}90%,100%{opacity:1;transform:none}}
#btnTitleStart.motionButtonPuff{animation:motionButtonPuff .68s cubic-bezier(.2,.8,.3,1) both}
#btnTitleStart.motionButtonPuff::after{content:'';position:absolute;inset:-8px;border:2px solid #deac68;border-radius:inherit;pointer-events:none;animation:motionButtonRing .68s ease-out both}
@keyframes motionButtonPuff{0%,100%{transform:none}20%{transform:translateY(3px) scale(.95,.91)}52%{transform:translateY(-3px) scale(1.05,1.07)}75%{transform:scale(.98)}}
@keyframes motionButtonRing{0%,20%{opacity:0;transform:scale(.94)}47%{opacity:.8}100%{opacity:0;transform:scale(1.15)}}
#timerDisp.motionTimerNudge{animation:motionTimerTap .85s ease-in-out 2}
#timerDisp.motionTimerNudge::after{content:'';position:absolute;inset:-5px;border:2px solid currentColor;border-radius:inherit;pointer-events:none;animation:motionTimerRing .85s ease-out 2 both}
@keyframes motionTimerTap{0%,75%,100%{transform:none}24%{transform:scale(1.075)}}
@keyframes motionTimerRing{0%{opacity:.8;transform:scale(.93)}85%,100%{opacity:0;transform:scale(1.24)}}
.olCard .face{position:relative}
.olReadyTick{position:absolute;right: -21px;bottom: -10px;display:grid;place-items:center;width: 40px;height: 40px;border:3px solid #fff;border-radius:50%;background: #00c464;color:#fff;font: bold 22px sans-serif;line-height: 1;box-shadow:0 2px 3px #466f4933}
.motionReadyConfirm .face{animation:motionReadyConfirm 1s cubic-bezier(.2,.8,.3,1) both}
.motionReadyConfirm .face::after{content:'';position:absolute;inset:-8px;border:3px solid #91bfa3;border-radius:50%;animation:motionReadyRing 1s ease-out both;pointer-events:none}
.motionReadyConfirm .olReadyTick{animation:motionReadyTick 1s cubic-bezier(.2,.8,.3,1) both}
@keyframes motionReadyConfirm{0%,100%{transform:none}28%{transform:scale(.92)}48%{transform:scale(1.09)}73%{transform:scale(.98)}}
@keyframes motionReadyRing{0%,20%{opacity:0;transform:scale(.9)}45%{opacity:.8}100%{opacity:0;transform:scale(1.35)}}
@keyframes motionReadyTick{0%,18%{opacity:0;transform:scale(.2) rotate(-45deg)}52%{opacity:1;transform:scale(1.18) rotate(10deg)}74%,100%{opacity:1;transform:none}}
.comboNumber{-webkit-text-stroke-width:3.5px}
body.lightMode #cdNum,body.lightMode #cdStart{-webkit-text-stroke:8px #f4552e;text-shadow:none}
body.lightMode #cdNum.tick{animation:none!important;opacity:1}
body.lightMode #cdNum::before,body.lightMode .arrivalPortrait::before{display:none}
body.lightMode .stageArrival *,body.lightMode .stageUnlockMotion *,body.lightMode .motionReadyConfirm *{animation:none!important}
body.lightMode .liveLeaderCrown{transition:none}
@media(prefers-reduced-motion:reduce){
  #board .cell.jump,#board .cell.longFindGlow::before{animation-name:none!important}
  #cdNum.tick{animation:none!important;opacity:1}#cdNum::before,.arrivalPortrait::before{display:none}
  .stageArrival *,.stageUnlockMotion *,.motionReadyConfirm *,#btnTitleStart.motionButtonPuff,#btnTitleStart.motionButtonPuff::after,#timerDisp.motionTimerNudge,#timerDisp.motionTimerNudge::after{animation:none!important}
  .liveLeaderCrown{transition:none}
}