:root{--blue:#08bde8;--blue-dark:#047da7;--navy:#063653;--ice:#effbff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}a{color:inherit}img,video{max-width:100%}button,input,textarea{font:inherit}[hidden]{display:none!important}.static-toast{position:fixed;z-index:180;left:50%;bottom:88px;padding:10px 18px;color:#fff;border-radius:999px;background:#063653;box-shadow:0 10px 28px rgba(0,40,60,.28);font:800 11px/1.2 "Trebuchet MS",sans-serif;transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:.2s}.static-toast.is-visible{transform:translate(-50%,0);opacity:1}

.winnerBoard header,
.railWinners header { position: relative; overflow: hidden; isolation: isolate; }
.winnerBoard header::after,
.railWinners header::after { content: ""; width: 22%; position: absolute; z-index: -1; inset-block: -70%; left: -28%; pointer-events: none; transform: rotate(18deg); background: linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent); animation: winnerHeaderSweep 4.2s ease-in-out infinite; }
.winnerLiveStatus { display: inline-flex; align-items: center; gap: 5px; animation: winnerStatusGlow 1.8s ease-in-out infinite; }
.winnerLiveStatus::before { content: ""; width: 6px; height: 6px; flex: 0 0 auto; border-radius: 50%; background: #35f3ab; box-shadow: 0 0 0 3px rgba(53,243,171,.18); animation: winnerStatusDot 1.8s ease-out infinite; }
.winnerRow.winnerEntering,
.railWinnerRow.winnerEntering { position: relative; z-index: 1; background: linear-gradient(90deg,rgba(19,201,232,.03),rgba(19,201,232,.2),rgba(19,201,232,.03)); animation: winnerFeedIn .72s cubic-bezier(.2,.76,.25,1) both; }
.winnerRow.winnerEntering b,
.railWinnerRow.winnerEntering b { animation: winnerValuePop .72s ease both; }
.winnerRow.winnerEntering em,
.railWinnerRow.winnerEntering em { animation: winnerValuePop .72s .07s ease both; }
@keyframes winnerHeaderSweep { 0%,38% { left: -28%; opacity: 0; } 48% { opacity: .8; } 72%,100% { left: 118%; opacity: 0; } }
@keyframes winnerStatusGlow { 0%,100% { filter: brightness(1); } 50% { filter: brightness(1.28); text-shadow: 0 0 9px rgba(255,255,255,.45); } }
@keyframes winnerStatusDot { 0% { box-shadow: 0 0 0 0 rgba(53,243,171,.48); } 100% { box-shadow: 0 0 0 7px rgba(53,243,171,0); } }
@keyframes winnerFeedIn { 0% { opacity: 0; transform: translateY(-11px) scale(.985); } 46% { opacity: 1; transform: translateY(0) scale(1.006); } 100% { opacity: 1; transform: translateY(0) scale(1); background-color: transparent; } }
@keyframes winnerValuePop { 0% { transform: scale(.88); filter: brightness(1); } 52% { transform: scale(1.12); filter: brightness(1.24); } 100% { transform: scale(1); filter: brightness(1); } }
@media (prefers-reduced-motion: reduce) { .winnerBoard header::after,.railWinners header::after,.winnerLiveStatus,.winnerLiveStatus::before,.winnerRow.winnerEntering,.railWinnerRow.winnerEntering,.winnerRow.winnerEntering b,.railWinnerRow.winnerEntering b,.winnerRow.winnerEntering em,.railWinnerRow.winnerEntering em { animation: none !important; } }

.rightPanel,
.rightRail { position: relative; overflow: visible !important; }
.rightBonusFloat { width: clamp(76px,6.1vw,98px); position: absolute; z-index: 12; top: 220px; right: 4px; display: block; overflow: hidden; border: 2px solid rgba(74,224,249,.85); border-radius: 13px; background: #063b68; box-shadow: 0 13px 28px rgba(0,34,58,.35),0 0 18px rgba(19,201,232,.3); transform-origin: center; animation: rightBonusFloat 3.6s ease-in-out infinite; }
.rightBonusFloat::after { content: ""; width: 28%; position: absolute; inset-block: -35%; left: -45%; pointer-events: none; transform: rotate(17deg); background: linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent); animation: rightBonusSweep 3.8s ease-in-out infinite; }
.rightBonusFloat img { width: 100%; aspect-ratio: 2 / 3; display: block; object-fit: cover; }
.rightBonusFloat:hover { animation-play-state: paused; transform: translateY(-3px) scale(1.035); }
@keyframes rightBonusFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes rightBonusSweep { 0%,35% { left: -45%; opacity: 0; } 48% { opacity: .85; } 72%,100% { left: 125%; opacity: 0; } }
@media (max-width: 1180px) { .rightBonusFloat { width: 74px; top: 205px; right: 3px; } }
@media (max-width: 820px) { .rightBonusFloat { display: none; } }
@media (prefers-reduced-motion: reduce) { .rightBonusFloat,.rightBonusFloat::after { animation: none !important; } }

.imageDownloadStrip { min-height: 0 !important; height: auto !important; aspect-ratio: 4.5 / 1; position: relative; display: block !important; overflow: hidden; padding: 0 !important; border: 1px solid rgba(53,216,244,.82) !important; border-radius: 10px !important; background: #031d35 url('/assets/winbox-download-app-strip-v1.jpg') center / cover no-repeat !important; box-shadow: 0 8px 18px rgba(0,37,62,.24),0 0 13px rgba(16,189,224,.16); text-decoration: none; transition: transform .18s ease,box-shadow .18s ease; }
.imageDownloadStrip > * { display: none !important; }
.imageDownloadStrip::after { content: ""; width: 22%; position: absolute; inset-block: -80%; left: -35%; pointer-events: none; transform: rotate(16deg); background: linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent); animation: downloadStripSweep 4.4s ease-in-out infinite; }
.imageDownloadStrip:hover { transform: translateY(-2px); box-shadow: 0 11px 24px rgba(0,37,62,.3),0 0 18px rgba(16,189,224,.24); }
@keyframes downloadStripSweep { 0%,45% { left: -35%; opacity: 0; } 56% { opacity: .8; } 78%,100% { left: 120%; opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .imageDownloadStrip::after { animation: none !important; } }

/* 2026-08-30 global UX and accessibility pass */
.srOnly {
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  position: absolute !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
[hidden] { display: none !important; }
.bottomNav a { min-height: 44px; }
.bottomNav b,.bottomNav small { font-size: 11px !important; line-height: 1.15; }
.footerLinks a { min-height: 44px; font-size: 12px; }
.footerIntro,.footerMeta { font-size: 12px; }
@media (max-width: 900px) {
  .bottomNav b,.bottomNav small { font-size: 10px !important; }
  .footerLinks a { min-height: 46px; font-size: 13px; }
}