/* ============================================================
 * ENGINE Design Lab — motion.css
 * デザインシステムの実体（③）。アニメーションの定義（design.md §7）。
 *
 * 🔴 ルール（design.md §7・変えないでほしいこと）:
 *   1. 祝いの演出は1回だけ（ease 1）。ループさせると安っぽくなる。
 *   2. ポイント・ストリーク・効果音は不採用。ゲーミフィケーションは視覚のみ
 *      （「聡明・伴走者」の人格を守るための明示的な決定）。
 *   3. トランジションは .12s（操作）／.3s（状態）／.6s（メーター）の3段が基本。
 *
 * まなみさんが磨いてよいのは「時間・イージング・回数」の値そのもの。
 * どのアクション（送信・結果到達・メーターの伸び）に何を付けるかの設計は変えない。
 * ============================================================ */

/* ---- 解析中スピナー（.ana .spin）。.8s linear infinite ---- */
@keyframes anaspin { to { transform: rotate(360deg); } }
.ana .spin { animation: anaspin .8s linear infinite; }

/* ---- タイピング3点（チャットの返答待ち）。1.2s、.2s/.4sずらし ---- */
@keyframes tblink {
  0%, 80%, 100% { opacity: .25; transform: translateY(0); }
  40% { opacity: 1; transform: translateY(-3px); }
}
.typing .dot { animation: tblink 1.2s infinite; }

/* ---- スケルトン（読み込み中プレースホルダ）。1.2s ease-in-out infinite ---- */
@keyframes shim { 0% { opacity: .45; } 50% { opacity: .9; } 100% { opacity: .45; } }
.skel { animation: shim 1.2s ease-in-out infinite; }

/* ---- 結果ヘッドラインの登場。.5s ease・1回だけ ---- */
@keyframes pop { 0% { transform: scale(.96); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
.disc-hero.reveal { animation: pop .5s ease; }

/* ---- ヘッドラインのキーワードに金の走り。1.5s ease・1回だけ ---- */
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
.disc-hero.reveal .em {
  background: linear-gradient(100deg, var(--brand) 40%, #edd189 50%, var(--brand) 60%);
  background-size: 200% 100%;
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  animation: shimmer 1.5s ease 1;
}

/* ---- メーターが伸びた時。1.1s ease・1回だけ ---- */
@keyframes glowpulse {
  0% { box-shadow: 0 0 0 rgba(193,150,45,0); }
  45% { box-shadow: 0 0 14px rgba(193,150,45,.55); }
  100% { box-shadow: 0 0 0 rgba(193,150,45,0); }
}
.meter .fill.glow, .pcard .fill.glow { animation: glowpulse 1.1s ease 1; }

/* ---- 適職のアンロック（ぼかしが溶ける）。.8s ease・1回だけ ---- */
@keyframes unblur { from { filter: blur(7px); opacity: .6; } to { filter: blur(0); opacity: 1; } }
.unblur-once { animation: unblur .8s ease 1; }

/* ---- 状態遷移（.3s）・メーター伸長（.6s） ---- */
.meter .fill, .pcard .fill { transition: width .6s ease; }
.swprog .fill { transition: width .3s; }
.ana .astep { transition: color .3s; }

/* ---- 操作フィードバック（.12s） ---- */
.btn { transition: border-color .12s, background .12s, transform .12s; }