/* WhichPup v1.34: stable matchup controls, tactile voting and round transitions */
@media (min-width:901px){
  .battle-home .hero .shell{width:min(1280px,calc(100% - 36px))}
  .battle-home .hero-grid{grid-template-columns:minmax(360px,.90fr) minmax(590px,1.10fr);gap:48px}
}
.battle-home .home-battle{padding:22px;border-radius:36px}
.battle-home .battle-toolbar{margin-bottom:16px}
.battle-home .battle-tools{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.battle-home .battle-tools button{width:42px;height:42px;min-width:42px;min-height:42px;border-radius:13px;box-shadow:0 2px 0 rgba(23,37,31,.06);display:grid;place-items:center;flex:0 0 42px}
.battle-home .battle-tools button:active{transform:translateY(1px);box-shadow:0 1px 0 rgba(23,37,31,.05)}
.battle-home .battle-mode-icon{width:19px;height:19px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.battle-home .battle-close{font-size:23px;font-weight:500;line-height:1;padding:0 0 2px}
.battle-home .battle-close[hidden]{display:none!important}
.battle-home .home-matchup{grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr)}
.battle-home .home-battle .versus{width:48px;height:48px;font-size:11px;box-shadow:0 0 0 6px #fff;transition:transform .22s ease,background .22s ease}
.battle-home .home-battle .vote-card{position:relative;overflow:hidden;border:1px solid var(--line);box-shadow:0 5px 0 #ddd6c9,0 12px 30px rgba(25,33,27,.07);transform:translateY(0) scale(1);transition:transform .16s cubic-bezier(.2,.8,.2,1),box-shadow .16s ease,border-color .16s ease,background .16s ease;will-change:transform,opacity}
@media(hover:hover) and (pointer:fine){.battle-home .home-battle .vote-card:hover{transform:translateY(-2px);box-shadow:0 7px 0 #ddd6c9,0 16px 34px rgba(25,33,27,.11)}}
.battle-home .home-battle .vote-card:active,.battle-home .home-battle .vote-card.is-pressed{transform:translateY(4px) scale(.988);box-shadow:0 1px 0 #d3ccbe,0 6px 14px rgba(25,33,27,.08)}
.battle-home .home-battle .vote-card.is-selected{border-color:#8aaa94;box-shadow:0 3px 0 #9eb9a6,0 12px 30px rgba(38,92,61,.12)}
.battle-home .home-battle .vote-card.is-selected .pick-chip{background:var(--ink);color:#fff;box-shadow:0 1px 0 #0b1a14;transform:translateY(2px)}
.battle-home .home-battle .pick-chip{font-style:normal;display:inline-flex;align-items:center;justify-content:center;min-width:58px;border:1px solid #d8e4da;box-shadow:0 3px 0 #c9d9cc;transition:transform .14s ease,box-shadow .14s ease,background .14s ease,color .14s ease}
.battle-home .home-battle .vote-photo{aspect-ratio:1/1;min-height:0;background:#f0ebe2}
.battle-home .home-battle .vote-photo img{object-position:center 40%}
.battle-home .home-battle .vote-info{padding:15px 16px 17px}
.battle-home .home-battle .vote-info strong{font-size:21px}
.battle-home .home-battle .vote-info span{font-size:12px}
.battle-home .home-battle.is-expanded{position:fixed!important;z-index:200!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;width:min(86vw,1240px)!important;max-width:calc(100vw - 28px)!important;max-height:92vh!important;height:auto!important;overflow:auto!important;padding:26px!important;border-radius:30px!important;box-shadow:0 0 0 100vmax rgba(12,23,18,.62),0 30px 120px rgba(9,17,13,.34)!important}
.battle-home .home-battle.is-fullwindow{position:fixed!important;z-index:210!important;inset:0!important;left:0!important;top:0!important;right:0!important;bottom:0!important;transform:none!important;width:100vw!important;height:100vh!important;height:100dvh!important;max-width:none!important;max-height:none!important;border:0!important;border-radius:0!important;padding:clamp(18px,3vw,42px)!important;overflow:auto!important;background:var(--cream)!important;box-shadow:none!important}
.battle-home .home-battle.is-expanded .home-matchup{grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr)}
.battle-home .home-battle.is-expanded .versus{width:60px;height:60px;font-size:12px}
.battle-home .home-battle.is-expanded .vote-info{padding:18px 20px 20px}
.battle-home .home-battle.is-expanded .vote-info strong{font-size:27px}
.battle-home .home-battle.is-fullwindow .battle-toolbar{position:sticky;top:0;z-index:4;background:var(--cream);padding:8px 0 12px}
.battle-home .home-battle.is-fullwindow .home-matchup{max-width:1440px;grid-template-columns:minmax(0,1fr) 94px minmax(0,1fr)}
.battle-home .home-battle.is-fullwindow .versus{width:68px;height:68px;font-size:13px}
.battle-home .home-battle.is-fullwindow .vote-info strong{font-size:31px}
.battle-home .home-vote-result{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.battle-home .home-vote-counter{margin-top:16px;font-size:12px}
.battle-home .home-vote-counter strong{display:inline-block;transform-origin:center}
.battle-home .home-vote-counter.is-bumping strong{animation:wpCounterBump .34s cubic-bezier(.2,.9,.3,1.35)}
.battle-home .home-matchup.is-transitioning .versus{animation:wpVsPulse .34s ease}
.battle-home .home-matchup.is-transitioning .vote-card[data-side="a"].is-loser{animation:wpExitLeft .34s cubic-bezier(.4,0,.2,1) forwards}
.battle-home .home-matchup.is-transitioning .vote-card[data-side="b"].is-loser{animation:wpExitRight .34s cubic-bezier(.4,0,.2,1) forwards}
.battle-home .home-matchup.is-transitioning .vote-card.is-winner{animation:wpWinner .34s cubic-bezier(.2,.8,.2,1) forwards}
.battle-home .home-matchup.is-entering .vote-card[data-side="a"]{animation:wpEnterLeft .34s cubic-bezier(.16,.8,.3,1)}
.battle-home .home-matchup.is-entering .vote-card[data-side="b"]{animation:wpEnterRight .34s cubic-bezier(.16,.8,.3,1)}
.battle-home .home-matchup.is-entering .versus{animation:wpVsEnter .3s cubic-bezier(.2,.9,.3,1.2)}
@keyframes wpWinner{0%{transform:translateY(0) scale(1)}45%{transform:translateY(4px) scale(.99)}100%{transform:translateX(var(--winner-shift,0)) scale(1.018)}}
@keyframes wpExitLeft{to{transform:translateX(-42px) scale(.97);opacity:0}}
@keyframes wpExitRight{to{transform:translateX(42px) scale(.97);opacity:0}}
@keyframes wpEnterLeft{from{transform:translateX(-34px) scale(.98);opacity:0}to{transform:none;opacity:1}}
@keyframes wpEnterRight{from{transform:translateX(34px) scale(.98);opacity:0}to{transform:none;opacity:1}}
@keyframes wpVsPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.13)}}
@keyframes wpVsEnter{from{transform:scale(.72);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes wpCounterBump{0%{transform:scale(1)}45%{transform:scale(1.24)}100%{transform:scale(1)}}
@media(max-width:900px){
  .battle-home .hero-grid{grid-template-columns:1fr;gap:34px}
  .battle-home .home-battle{max-width:720px;width:100%;margin-inline:auto}
  .battle-home .home-battle.is-expanded{width:calc(100vw - 20px)!important;max-height:calc(100vh - 20px)!important;padding:18px!important}
}
@media(max-width:640px){
  .battle-home .home-battle{padding:13px;border-radius:25px}
  .battle-home .battle-tools button{width:38px;height:38px;border-radius:11px}
  .battle-home .home-matchup{grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr)}
  .battle-home .home-battle .versus{width:36px;height:36px;font-size:9px;box-shadow:0 0 0 4px #fff}
  .battle-home .home-battle .vote-info{padding:10px 10px 12px;gap:7px}
  .battle-home .home-battle .vote-info strong{font-size:17px}
  .battle-home .home-battle .vote-info span{font-size:10px}
  .battle-home .home-battle .pick-chip{display:inline-flex;min-width:44px;padding:6px 8px;font-size:9px;box-shadow:0 2px 0 #c9d9cc}
  .battle-home .home-battle.is-expanded{width:calc(100vw - 10px)!important;max-width:none!important;max-height:calc(100vh - 10px)!important;padding:12px!important;border-radius:18px!important}
  .battle-home .home-battle.is-expanded .home-matchup,.battle-home .home-battle.is-fullwindow .home-matchup{grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr)}
  .battle-home .home-battle.is-expanded .versus,.battle-home .home-battle.is-fullwindow .versus{width:38px;height:38px;font-size:9px}
  .battle-home .home-battle.is-expanded .vote-info,.battle-home .home-battle.is-fullwindow .vote-info{padding:10px}
  .battle-home .home-battle.is-expanded .vote-info strong,.battle-home .home-battle.is-fullwindow .vote-info strong{font-size:18px}
}
@media(prefers-reduced-motion:reduce){
  .battle-home .home-battle .vote-card,.battle-home .home-battle .versus,.battle-home .home-vote-counter strong{animation:none!important;transition:none!important}
}