/* entrance animation — fade-up を上位互換で拡張（deck-anim キット / 詳細は _anim_library/） */
@media (prefers-reduced-motion:no-preference){
  /* タイミング基底（動きの既定は fade-up） */
  [data-deck-active] .anim{ animation: fade-up .5s both; }
  [data-deck-active] .anim2{ animation: fade-up .5s .12s both; }
  [data-deck-active] .anim3{ animation: fade-up .5s .24s both; }
  [data-deck-active] .anim4{ animation: fade-up .5s .36s both; }
  [data-deck-active] .anim5{ animation: fade-up .5s .48s both; }
  [data-deck-active] .anim6{ animation: fade-up .5s .60s both; }
  [data-deck-active] .anim-i{ animation: fade-up .5s both; animation-delay: calc(var(--i,0) * .1s); }
  /* モーション variant（animation-name のみ上書き＝1要素1アニメ維持・data-cue 安全） */
  [data-deck-active] .a-fade { animation-name: a-fade; }
  [data-deck-active] .a-up   { animation-name: fade-up; }
  [data-deck-active] .a-down { animation-name: a-down; }
  [data-deck-active] .a-right{ animation-name: a-right; }
  [data-deck-active] .a-left { animation-name: a-left; }
  [data-deck-active] .a-zoom { animation-name: a-zoom; }
  [data-deck-active] .a-pop  { animation-name: a-pop; animation-timing-function: cubic-bezier(.34,1.56,.64,1); }
  [data-deck-active] .a-blur { animation-name: a-blur; }
  /* コンテンツ・モーション */
  [data-deck-active] .grow-y { transform-origin:bottom center; animation: grow-y .7s .2s cubic-bezier(.2,.7,.2,1) both; }
  [data-deck-active] .grow-x { transform-origin:left center;   animation: grow-x .55s .25s cubic-bezier(.2,.7,.2,1) both; }
  [data-deck-active] .nudge-x{ animation: nudge-x .9s .35s ease-in-out both; }
}
.grow-y{ transform-origin:bottom center; } .grow-x{ transform-origin:left center; }
@keyframes fade-up{ from{ opacity:0; transform: translateY(16px);} to{ opacity:1; transform:none;} }
@keyframes a-fade { from{ opacity:0; } to{ opacity:1; } }
@keyframes a-down { from{ opacity:0; transform: translateY(-16px);} to{ opacity:1; transform:none; } }
@keyframes a-right{ from{ opacity:0; transform: translateX(-28px);} to{ opacity:1; transform:none; } }
@keyframes a-left { from{ opacity:0; transform: translateX(28px); } to{ opacity:1; transform:none; } }
@keyframes a-zoom { from{ opacity:0; transform: scale(.94);       } to{ opacity:1; transform:none; } }
@keyframes a-pop  { from{ opacity:0; transform: scale(.8);        } to{ opacity:1; transform:none; } }
@keyframes a-blur { from{ opacity:0; filter: blur(12px); transform: translateY(10px);} to{ opacity:1; filter: blur(0); transform:none; } }
@keyframes grow-y { from{ transform: scaleY(0);} to{ transform: scaleY(1);} }
@keyframes grow-x { from{ transform: scaleX(0);} to{ transform: scaleX(1);} }
@keyframes nudge-x{ 0%{ transform:none;} 55%{ transform: translateX(10px);} 100%{ transform:none;} }

/* ===== v2 ===== コンテンツが「育つ」演出（2026-07-02・スパイク検証済み / 詳細 _anim_library/README_deck-anim.md）
   規律: 1スライドに育つ演出1〜2個まで／count-upはHero数値のみ／sweepは結論1フレーズのみ
   count-up: <span class="count-up" style="--n-to:8000"></span>（中身空・数字はcounterが描く）
   draw-line: 対象SVGの <path>/<polyline> に pathLength="1" 必須 */
@property --n { syntax: '<integer>'; inherits: false; initial-value: 0; }
@media (prefers-reduced-motion:no-preference){
  [data-deck-active] .count-up { counter-reset: n var(--n); animation: v2-count 1.4s .2s cubic-bezier(.2,.7,.2,1) both; }
  [data-deck-active] .draw-line{ stroke-dasharray:1; animation: v2-draw 1.5s .2s cubic-bezier(.2,.7,.2,1) both; }
  [data-deck-active] .sweep    { animation: v2-sweep .9s .3s cubic-bezier(.2,.7,.2,1) both; }
  [data-deck-active] .a-wipe   { animation-name: v2-wipe; }
  [data-deck-active] .a-settle { animation-name: v2-settle; animation-duration: 1.2s; }
}
.count-up{ counter-reset: n var(--n-to, 0); font-variant-numeric: tabular-nums; }
.count-up::after{ content: counter(n); }
.hl-sweep{
  background-image: linear-gradient(color-mix(in srgb, var(--accent) 32%, transparent),
                                    color-mix(in srgb, var(--accent) 32%, transparent));
  background-repeat:no-repeat; background-size:100% 46%; background-position:0 88%;
}
@keyframes v2-count { from{ --n:0; } to{ --n: var(--n-to, 100); } }
@keyframes v2-draw  { from{ stroke-dashoffset:1; } to{ stroke-dashoffset:0; } }
@keyframes v2-sweep { from{ background-size:0% 46%; } to{ background-size:100% 46%; } }
@keyframes v2-wipe  { from{ opacity:0; clip-path: inset(0 100% 0 0);} to{ opacity:1; clip-path: inset(0 0 0 0);} }
@keyframes v2-settle{ from{ opacity:0; transform: scale(1.06);} to{ opacity:1; transform:none;} }