*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:Arial,Helvetica,sans-serif;background:#030303;color:#fff;overflow:hidden}
.splash{position:relative;min-height:100vh;display:grid;place-items:center;text-align:center;padding:24px}
.bg{position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.30),rgba(0,0,0,.76)),url("pcm-league-splash-bg.png") center center/cover no-repeat;transform:scale(1.04);animation:slowZoom 5s ease forwards}
.shade{position:absolute;inset:0;background:radial-gradient(circle at center,rgba(216,168,76,.10),transparent 34%),radial-gradient(circle at bottom,rgba(0,70,160,.07),transparent 36%),linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.26),rgba(0,0,0,.82))}
.content{position:relative;z-index:2;width:min(100%,1050px);animation:fadeIn .9s ease both}
.logo{width:min(420px,78vw);margin:0 auto 22px;filter:drop-shadow(0 0 22px rgba(216,168,76,.45)) drop-shadow(0 0 18px rgba(0,80,180,.14));animation:floatLogo 4s ease-in-out infinite}
.eyebrow{color:#d8a84c;text-transform:uppercase;letter-spacing:.18em;font-weight:900;font-size:.9rem;margin-bottom:10px}
h1{font-size:clamp(3.2rem,8vw,7.4rem);line-height:.95;text-transform:uppercase;letter-spacing:.06em;color:#ffe39a;text-shadow:0 0 22px rgba(216,168,76,.35),0 10px 30px rgba(0,0,0,.75)}
.tagline{max-width:900px;margin:22px auto 28px;color:#d6dde8;font-size:clamp(1rem,2vw,1.35rem);line-height:1.75}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 auto 34px}
.tiles div{padding:18px 16px;border-radius:18px;background:rgba(0,0,0,.58);border:1px solid rgba(216,168,76,.28);box-shadow:0 18px 45px rgba(0,0,0,.38);backdrop-filter:blur(7px)}
.tiles strong{display:block;color:#ffe39a;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.tiles span{display:block;color:#bfc9d8;line-height:1.5;font-size:.95rem}
.loading{width:min(520px,90vw);margin:0 auto}
.loading span{display:block;color:#c9d3e0;text-transform:uppercase;letter-spacing:.14em;font-size:.85rem;margin-bottom:12px}
.bar{height:16px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.10);border:1px solid rgba(216,168,76,.38)}
.bar i{display:block;height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,#9c6a16,#ffe39a,#d8a84c);box-shadow:0 0 22px rgba(216,168,76,.6);animation:load 5s linear forwards}
.skip{display:inline-block;margin-top:20px;color:#ffe39a;font-weight:800;text-decoration:none}
@keyframes load{to{width:100%}}
@keyframes slowZoom{to{transform:scale(1)}}
@keyframes fadeIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes floatLogo{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(max-width:820px){body{overflow:auto}.tiles{grid-template-columns:1fr}.logo{width:min(330px,82vw)}}