/* DuelVerse — Feel & feedback (Area 3). Transform/opacity motion only.
   No-JS contract: every hidden start state below is scoped under
   html.motion-in, a class motion-feel.js adds. Without JS (or with
   reduced motion) nothing here hides or moves anything. */
:root{--mf-gold:#e8b34b;--mf-ease:cubic-bezier(.22,.9,.28,1)}
/* 1+2 · Reveal (page-load + scroll, one-shot via .inview) */
html.motion-in .mf-reveal{opacity:0;transform:translateY(14px)}
html.motion-in .mf-reveal.inview{opacity:1;transform:none;
  transition:opacity .55s ease,transform .55s var(--mf-ease);
  transition-delay:calc(var(--mf-i,0)*55ms)}
/* 4 · Toast/notice polish — no toast system exists in the app today;
   this styles the conventional hooks if one is added, motion only. */
.toast,.notice,[role="status"]{animation:mfToastIn .38s var(--mf-ease)}
@keyframes mfToastIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
/* 4 · Praise polish: Crown Clash card + near-miss stat glow on reveal */
.grand-cup.inview{animation:mfCupGlow 1.6s ease .15s 1}
@keyframes mfCupGlow{0%{box-shadow:0 0 0 rgba(232,179,75,0)}35%{box-shadow:0 0 0 1px rgba(232,179,75,.55),0 14px 38px rgba(232,179,75,.22)}100%{box-shadow:0 0 0 rgba(232,179,75,0)}}
.my-stat-hot.inview strong{display:inline-block;animation:mfPop .5s var(--mf-ease) .2s 1}
@keyframes mfPop{0%{opacity:.4;transform:scale(.92)}100%{opacity:1;transform:scale(1)}}
/* 5 · League table life */
.league-table tbody tr{transition:background-color .18s ease}
.league-table tbody tr:hover{background:rgba(167,139,250,.07)}
.league-table tbody tr td{position:relative;overflow:hidden}
.league-table tbody tr td::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.09) 50%,transparent 70%);
  opacity:0;transform:translateX(-70%)}
.league-table tbody tr:hover td::after{opacity:1;transform:translateX(70%);transition:opacity .45s ease,transform .55s ease}
.league-table tbody tr.you{animation:mfYou 2.8s ease-in-out infinite}
@keyframes mfYou{0%,100%{box-shadow:inset 0 0 0 999px rgba(232,179,75,0)}50%{box-shadow:inset 0 0 0 999px rgba(232,179,75,.07)}}
/* Countdown tick (class toggled by motion-feel.js; logic stays in site.js/league.js) */
.mf-tick{display:inline-block;animation:mfTick .3s ease}
@keyframes mfTick{0%{opacity:.55;transform:translateY(2px) scale(.97)}100%{opacity:1;transform:none}}
/* Tab/section swap (class added when league.js un-hides a table) */
.table-wrap.mf-enter .league-table{animation:mfSwap .35s var(--mf-ease)}
@keyframes mfSwap{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.tab{transition:transform .15s ease,background .15s ease,color .15s ease}
.tab:active{transform:scale(.96)}
@media (prefers-reduced-motion:reduce){
  html.motion-in .mf-reveal{opacity:1!important;transform:none!important;transition:none!important}
  .toast,.notice,[role="status"],.grand-cup.inview,.my-stat-hot.inview strong,
  .league-table tbody tr.you,.mf-tick,.table-wrap.mf-enter .league-table{animation:none!important}
  .league-table tbody tr td::after{display:none}
}