/* ============================================================
 * ノベル演出のキーフレーム置き場
 * ============================================================
 * シナリオJSONの "anim" から名前で呼び出せます。
 *   例: { "chara": { "slot": "ragna", "anim": "nv-shake .35s ease" } }
 * 新しい動きが欲しくなったら、下にならって @keyframes を足すだけ。
 * (名前は nv- で始めておくと他のCSSとぶつかりません)
 *
 * 注意: 立ち絵のanimはスロット枠に掛かります。移動系は transform ではなく
 * translate / scale / rotate プロパティで書くと、立ち絵のセンタリングや
 * シナリオ指定のtransformと干渉しません(下の見本はすべてその書き方です)。
 * ============================================================ */

/* 揺れ(驚き・衝撃) */
@keyframes nv-shake {
  0%, 100% { translate: 0 0; }
  20% { translate: -12px 0; } 40% { translate: 10px 0; }
  60% { translate: -7px 0; }  80% { translate: 4px 0; }
}

/* 跳ね(喜び) */
@keyframes nv-bounce {
  0%, 100% { translate: 0 0; }
  30% { translate: 0 -26px; }
  55% { translate: 0 0; }
  70% { translate: 0 -10px; }
}

/* 白フラッシュ(bgやstillに) */
@keyframes nv-flash {
  0% { filter: brightness(3); }
  100% { filter: brightness(1); }
}

/* 沈み込み(落胆) */
@keyframes nv-sink {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 14px; }
}