/* Leaguewide load screen (broadcast open, take B).
   Stripes sweep, the logo builds (white block slides in, red slash drops, yellow glint),
   the wordmark wipes in over a blue/red/yellow underline, and the red slash nudges until the page is ready. */
.lw-loader { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; background: #0E1430; overflow: hidden;
  font-family: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif; transition: opacity .35s ease, visibility .35s; }
.lw-loader.done { opacity: 0; visibility: hidden; pointer-events: none; }

.lw-loader .lw-stripes { position: absolute; inset: -20% -40%; display: grid; grid-template-columns: repeat(3, 1fr); transform: skewX(-18deg); }
.lw-loader .lw-stripes i { opacity: 0; transform: translateX(260%); }
.lw-loader .lw-stripes i:nth-child(1) { background: #1D3D8F; }
.lw-loader .lw-stripes i:nth-child(2) { background: #D62828; }
.lw-loader .lw-stripes i:nth-child(3) { background: #F7C948; }

.lw-loader .lw-lock { position: relative; z-index: 2; display: grid; justify-items: center; gap: 16px; width: min(82vw, 420px); }
.lw-loader .lw-row { display: flex; align-items: center; gap: clamp(10px, 2.6vw, 16px); }
.lw-loader .lw-mk { position: relative; flex: none; width: clamp(54px, 14vw, 84px); aspect-ratio: 3 / 2; }
.lw-loader .lw-mk .blk { position: absolute; inset: 0; background: #fff; clip-path: polygon(0 0, 100% 0, 82% 100%, 0 100%); }
.lw-loader .lw-mk .gl { position: absolute; inset: 0; clip-path: polygon(0 0, 100% 0, 82% 100%, 0 100%);
  background: linear-gradient(105deg, transparent 30%, rgba(247,201,72,.9) 45%, transparent 60%); background-size: 300% 100%; background-position: 120% 0; }
.lw-loader .lw-mk .sl { position: absolute; right: -2%; top: 0; bottom: 0; width: 35%; background: #D62828; clip-path: polygon(46% 0, 100% 0, 54% 100%, 0 100%); }
.lw-loader .lw-wm { color: #fff; font-weight: 900; font-variation-settings: 'wdth' 104; font-size: clamp(27px, 7.4vw, 44px); line-height: 1; letter-spacing: -.01em; white-space: nowrap; }
.lw-loader .lw-ul { width: 100%; height: 5px; background: linear-gradient(90deg, #1D3D8F 0 33%, #D62828 33% 66%, #F7C948 66%); clip-path: polygon(0 0, 100% 0, 98.5% 100%, 1.5% 100%); transform-origin: left; }
.lw-loader .lw-sub { position: absolute; left: 16px; right: 16px; bottom: calc(12% + env(safe-area-inset-bottom, 0px)); display: flex; justify-content: center; gap: 8px; align-items: center;
  color: #fff; font-size: 13px; font-weight: 650; opacity: .9; text-align: center; }
.lw-loader .lw-sub i { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #D62828; }

.lw-loader .lw-stripes i { animation: lw-sweep .7s cubic-bezier(.7,0,.3,1) both; }
.lw-loader .lw-stripes i:nth-child(2) { animation-delay: .08s; }
.lw-loader .lw-stripes i:nth-child(3) { animation-delay: .16s; }
.lw-loader .lw-mk .blk { animation: lw-blk .5s .7s cubic-bezier(.2,.9,.2,1) both; }
.lw-loader .lw-mk .sl { animation: lw-drop .45s 1s cubic-bezier(.3,1.5,.4,1) both, lw-nudge 1.6s 2.2s ease-in-out infinite; }
.lw-loader .lw-mk .gl { animation: lw-glint .8s 1.5s ease-in-out both; }
.lw-loader .lw-wm { animation: lw-wipe .55s 1.15s cubic-bezier(.2,.9,.2,1) both; }
.lw-loader .lw-ul { animation: lw-grow .5s 1.4s cubic-bezier(.2,.9,.2,1) both; }
.lw-loader .lw-sub { animation: lw-fade .4s 1.6s ease both; }
.lw-loader .lw-sub i { animation: lw-blink 1.2s 1.8s infinite; }

@keyframes lw-sweep { 0% { transform: translateX(-160%); opacity: 1; } 55% { transform: translateX(0); opacity: 1; } 99% { opacity: 1; } 100% { transform: translateX(260%); opacity: 0; } }
@keyframes lw-blk { from { transform: translateX(-130%) skewX(-14deg); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes lw-drop { from { transform: translateY(-190%); } to { transform: none; } }
@keyframes lw-nudge { 0%, 100% { transform: none; } 50% { transform: translateX(12%); } }
@keyframes lw-glint { from { background-position: 120% 0; } to { background-position: -40% 0; } }
@keyframes lw-wipe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes lw-grow { from { transform: scaleX(0); } to { transform: none; } }
@keyframes lw-fade { from { opacity: 0; transform: translateY(6px); } to { opacity: .9; transform: none; } }
@keyframes lw-blink { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  .lw-loader *, .lw-loader *::before, .lw-loader *::after { animation: none !important; }
  .lw-loader .lw-stripes { display: none; }
}
