/* Shared finishing layer for the ready pages (load last). Purely visual. */
::selection{background:#0757c9;color:#fff}
html{scroll-padding-top:84px}
h1,h2,h3,h4{text-wrap:balance}
p,li{text-wrap:pretty}
a,button,summary{-webkit-tap-highlight-color:transparent}
:focus-visible{outline-offset:3px}
/* fine film grain over the whole page: removes the flat, "screen" look on big gradients */
body::after{content:"";position:fixed;inset:0;z-index:300;pointer-events:none;opacity:.4;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E")}
.go,.next{transition:transform .3s,box-shadow .3s,filter .3s,gap .3s}
.finale .go{box-shadow:0 14px 34px rgba(0,0,0,.3)}
.stat,.players li,.hist li,.grp{transition:transform .3s,box-shadow .3s}
@media(hover:hover){.stat:hover,.players li:hover{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* moving tint over the whole page: multiply keeps whites white and just breathes a little colour across them */
body::before{content:"";position:fixed;inset:-20%;z-index:299;pointer-events:none;mix-blend-mode:multiply;will-change:transform;background:radial-gradient(34% 34% at 25% 30%,rgba(7,87,201,.11),transparent 70%),radial-gradient(30% 30% at 78% 62%,rgba(214,34,74,.07),transparent 70%),radial-gradient(26% 26% at 50% 90%,rgba(7,87,201,.07),transparent 70%);animation:pgDrift 24s ease-in-out infinite alternate}
@keyframes pgDrift{from{transform:translate3d(-5%,-4%,0) scale(1)}to{transform:translate3d(6%,5%,0) scale(1.12)}}
@media (prefers-reduced-motion:reduce){body::before{animation:none}}