/* 생산/사료 분석 움직임 — feed-analysis-motion.js 가 body 에 fam(움직여도 됨) 을, 칸마다 fam-in · fam-rows · fam-dots · fam-card · fam-dir · fam-hit 을 붙이고 뗀다.
   ① 여섯 칸 차례로 톡 · 숫자 올라감  ② 연도를 바꾸면 표 줄이 차례로  ③ 달을 바꾸면 카드 숫자가 굴러감 · ▲▼
   ④ 저장하면 다시 계산돼 바뀐 칸이 차례로 반짝  ⑤ 자동 채움 점 톡.  움직임 줄이기 · 태극이면 fam 이 붙지 않는다. */
body { --fam-ease: cubic-bezier(.22, 1, .36, 1); --fam-spring: cubic-bezier(.34, 1.56, .64, 1); }

/* ① */
body.fam #faSum.fam-in .fa-t { animation: fam-pop .5s var(--fam-spring) both; animation-delay: calc(var(--i, 0) * .07s); }
/* ② */
body.fam #sheet.fam-rows tbody tr { animation: fam-row .4s var(--fam-ease) both; animation-delay: calc(var(--r, 0) * .03s); }
/* ③ */
body.fam #faMonth .fa-card.fam-card .fa-g, body.fam #faMonth .fa-card.fam-card .fa-kv { animation: fam-fade .35s ease-out both; }
body.fam #faMonth .fa-kv b.fam-dir::after { display: inline-block; margin-left: 4px; font-size: .7em; animation: fam-blip 1.3s ease-out both; }
body.fam #faMonth .fa-kv b.fam-dir[data-fam-dir="up"]::after { content: '▲'; color: var(--ink-soft); }   /* 방향만 (좋고 나쁨은 칸마다 다르다) */
body.fam #faMonth .fa-kv b.fam-dir[data-fam-dir="down"]::after { content: '▼'; color: var(--ink-soft); }
/* ④ */
body.fam #sheet td.fam-hit { animation: fam-hit 1.2s ease-out both; animation-delay: calc(var(--n, 0) * .04s); }
body.fam .fa-t.fam-hit { animation: fam-glow 1.2s ease-out both; }
/* ⑤ */
body.fam #sheet.fam-dots td.dot::after { animation: fam-dot .45s var(--fam-spring) both; animation-delay: calc(.4s + var(--d, 0) * .03s); }

@keyframes fam-pop { 0% { opacity: 0; transform: scale(.7); } 60% { opacity: 1; transform: scale(1.05); } 100% { opacity: 1; transform: none; } }
@keyframes fam-row { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes fam-fade { from { opacity: .2; } to { opacity: 1; } }
@keyframes fam-blip { 0% { opacity: 0; transform: translateY(4px); } 20%, 70% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes fam-hit { 0% { box-shadow: inset 0 0 0 2px var(--accent); background-color: color-mix(in srgb, var(--accent) 30%, transparent); } 100% { box-shadow: inset 0 0 0 0 transparent; } }
@keyframes fam-glow { 0% { box-shadow: 0 0 0 2px var(--c), 0 0 18px color-mix(in srgb, var(--c) 45%, transparent); } 100% { box-shadow: 0 0 0 0 transparent; } }
@keyframes fam-dot { 0% { transform: scale(0); } 60% { transform: scale(1.8); } 100% { transform: none; } }

@media (prefers-reduced-motion: reduce) {
  #faSum *, #faSum .fa-t, #faMonth *, #sheet tr, #sheet td, #sheet td::after { animation: none !important; }
}
@media print { #faSum .fa-t, #sheet tr, #sheet td { animation: none !important; } }