/* Full-screen team reveal: the viewport belongs to team titles and names. */
.team-splash{position:fixed;inset:0;z-index:70;display:grid;isolation:isolate;color:#f5f7ff;background:#0b1429;pointer-events:auto}
.team-splash *{box-sizing:border-box}
.team-splash-panel{position:relative;width:100%;height:100dvh;min-height:0;display:flex;flex-direction:column;padding:clamp(12px,1vw,20px);border:4px solid #7486ab;background:linear-gradient(125deg,#242b46,#101a31 52%,#26364d);box-shadow:inset 0 3px #c6d9ff48,inset 0 -5px #03091c;overflow:hidden;animation:team-panel-enter .4s ease-out both}
.team-splash-panel:before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 5px,#00000008 5px 6px);z-index:3}
.team-splash-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;flex:none;margin:0 0 12px;padding:0 4px 8px;border-bottom:2px solid #a7b7d055}
.team-splash .team-splash-heading h2{font:800 clamp(48px,6.9vw,128px)/1 'Pixelify Sans',ui-monospace,monospace!important;letter-spacing:0!important;color:#ffe7a4;margin:0!important;text-align:left;text-shadow:3px 5px #060b1d;white-space:nowrap}
.team-splash-clock{display:grid;place-items:center;min-width:1.25em;font:800 clamp(56px,6.6vw,116px)/1 'Pixelify Sans',ui-monospace,monospace;color:#ffe7a4;background:#08142a;border:3px solid #a4b8d6;padding:0 12px 5px;box-shadow:0 4px #050918}
.team-splash-clock b{font:inherit}
.team-splash-teams{min-height:0;flex:1;display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.2vw,24px)}
.team-splash-side{--crest:#ff987f;min-width:0;min-height:0;display:flex;flex-direction:column;padding:clamp(10px,1vw,18px);border:3px solid var(--crest);background:linear-gradient(145deg,#642d43,#271d35 85%);box-shadow:inset 0 3px #ffffff2b,0 4px #02091d;overflow:hidden;animation:team-side-enter .45s ease-out both}
.team-splash-side--blue{--crest:#80d9ff;background:linear-gradient(215deg,#285779,#162541 85%);animation-delay:.08s}
.team-splash-side.is-your-team{border-color:#ffe9a0;box-shadow:inset 0 0 40px color-mix(in srgb,var(--crest),transparent 82%),inset 0 3px #fff8,0 0 20px color-mix(in srgb,var(--crest),transparent 65%)}
.team-splash-side>header{display:flex;align-items:center;justify-content:center;gap:12px;flex:none;min-width:0;margin-bottom:8px}
.team-splash-side>header>div:last-child{min-width:0}
.team-splash .team-splash-label{display:block;margin-bottom:4px;font:700 clamp(26px,2.4vw,40px)/1 'Pixelify Sans',ui-monospace,monospace;letter-spacing:.5px;color:#fff0b7}
.team-splash .team-splash-side h3{font:800 clamp(42px,4.5vw,82px)/1 'Pixelify Sans',ui-monospace,monospace!important;letter-spacing:0!important;text-shadow:3px 4px #050c20;margin:0!important;color:var(--crest);white-space:nowrap}
.team-crest{width:clamp(76px,7vw,120px);height:clamp(76px,7vw,120px);position:relative;flex:none;isolation:isolate;display:grid;place-items:center}
.team-crest img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 5px 0 #040918) drop-shadow(0 0 14px color-mix(in srgb,var(--crest),transparent 45%));animation:team-crest-float 2.8s ease-in-out infinite}
.team-crest-rays{position:absolute;inset:-10%;z-index:-1;border-radius:50%;background:repeating-conic-gradient(from 0deg,transparent 0deg 23deg,color-mix(in srgb,var(--crest),transparent 83%) 23deg 30deg);mask-image:radial-gradient(circle,#000 10%,transparent 68%);animation:team-rays-spin 22s linear infinite}
.team-crest-spark{position:absolute;width:7px;height:7px;background:#fff1a9;box-shadow:7px 0 #fff1a955,-7px 0 #fff1a955,0 7px #fff1a955,0 -7px #fff1a955;animation:team-sparkle 1.5s steps(4) infinite}.spark-one{left:4%;top:32%}.spark-two{right:5%;bottom:22%;animation-delay:.8s}
.team-splash-roster{--roster-gap:4px;--roster-column-gap:10px;--roster-columns:1;--roster-rows:var(--team-count);min-height:0;flex:1;display:grid;grid-template-columns:repeat(var(--roster-columns),minmax(0,1fr));grid-template-rows:repeat(var(--roster-rows),minmax(0,1fr));gap:var(--roster-gap) var(--roster-column-gap);container-type:size;overflow:hidden}
.team-splash-roster>div{--name-space:22px;display:flex;align-items:center;gap:8px;min-width:0;min-height:0;padding:0 8px;border-left:3px solid var(--crest);background:#020a216b;animation:team-name-enter .28s ease-out var(--arrival) both}
.team-splash-roster>div>span{display:block;min-width:0;font-family:'Pixelify Sans',ui-monospace,monospace;font-size:36px;font-size:min(clamp(48px,4.8vw,92px),calc((100cqh - (var(--roster-rows) - 1)*var(--roster-gap))/var(--roster-rows)*.82),calc(((100cqw - (var(--roster-columns) - 1)*var(--roster-column-gap))/var(--roster-columns) - var(--name-space))/var(--name-width)));font-weight:800;line-height:1;letter-spacing:0;white-space:nowrap;color:#fff1eb}
.team-splash-side--blue .team-splash-roster>div>span{color:#e5f7ff}
.team-splash-roster>div.is-you{--name-space:88px;border:2px solid #ffe496;background:#fff0ba24}
.team-splash-roster>div>b{margin-left:auto;flex:none;padding:2px 4px;color:#15243b;background:#ffe5a0;font:800 clamp(22px,1.6vw,30px)/1 'Pixelify Sans',ui-monospace,monospace;border-radius:2px}
@media(min-width:1100px){.team-splash-roster{--roster-columns:2;--roster-rows:var(--team-half-count)}.team-splash-roster>div.is-you{--name-space:22px}.team-splash-roster>div.is-you>b{display:none}}
@media(max-width:900px){
.team-splash-panel{padding:10px}
.team-splash-heading{gap:10px;margin-bottom:10px;padding-bottom:8px}
.team-splash .team-splash-heading h2{font-size:clamp(38px,6.8vw,61px)!important}
.team-splash-clock{font-size:clamp(44px,7vw,62px);padding:0 8px 3px}
.team-splash-teams{gap:12px}
.team-splash-side{padding:10px}
.team-splash-side>header{flex-direction:column;gap:4px;text-align:center;margin-bottom:10px}
.team-crest{width:76px;height:76px}
.team-splash .team-splash-label{font-size:28px;margin-bottom:3px}
.team-splash .team-splash-side h3{font-size:clamp(34px,5.4vw,46px)!important}
.team-splash-roster>div{padding-inline:6px}
}
@media(max-width:600px){
.team-splash-panel{padding:8px;border-width:2px}
.team-splash-heading{gap:8px;margin-bottom:8px}
.team-splash .team-splash-heading h2{font-size:clamp(24px,6.7vw,40px)!important}
.team-splash-clock{font-size:38px;padding:0 5px 2px;border-width:2px}
.team-splash-teams{gap:8px}
.team-splash-side{padding:6px;border-width:2px}
.team-crest{width:58px;height:58px}
.team-splash .team-splash-label{font-size:22px}
.team-splash .team-splash-side h3{font-size:clamp(23px,5.5vw,33px)!important}
.team-splash-roster>div{--name-space:14px;padding-inline:4px;border-left-width:2px}
.team-splash-roster>div.is-you{--name-space:56px}
.team-splash-roster>div>b{font-size:18px;padding:2px}
}
@keyframes team-panel-enter{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
@keyframes team-side-enter{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
@keyframes team-name-enter{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
@keyframes team-crest-float{50%{transform:translateY(-5px)}}
@keyframes team-rays-spin{to{transform:rotate(360deg)}}
@keyframes team-sparkle{0%,100%{opacity:.2;transform:scale(.65)}50%{opacity:1;transform:scale(1.1)}}
@media(prefers-reduced-motion:reduce){.team-splash *,.team-splash *:before{animation:none!important}}