.ptop{position:sticky;top:0;z-index:10;background:#0D0B22;border-bottom:1px solid #34305C}
.ptop-in{max-width:1100px;margin:0 auto;height:62px;display:flex;align-items:center;gap:24px;padding:0 18px}
.ptop nav{display:flex;gap:20px}.ptop nav a{color:#fff;text-decoration:none;font-weight:600}.ptop nav a.on{color:#02AED6}
.pfoot{border-top:1px solid var(--ln);margin-top:30px}
.hero{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:28px;align-items:center;padding:18px 0}
.hero-h{font:800 clamp(46px,7vw,92px)/.92 var(--f-d);margin:0}
.hero-h .hl{background:linear-gradient(90deg,#02AED6,#11CD88 35%,#FDB21A 68%,#E8107C);-webkit-background-clip:text;background-clip:text;color:transparent}
.tile{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit;padding:18px;border-top:3px solid var(--c)}
.mcard{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:inherit;padding:14px}
.av{border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font:700 15px/1 var(--f-d);color:#0D0B22;flex:none}
.pro{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;background:#FDB21A;color:#0D0B22;font:800 12px/1 var(--f-d);letter-spacing:.1em}
.stat{background:var(--r);border-radius:12px;padding:12px}.stat b{display:block;font:800 28px/1.1 var(--f-d)}
@media (max-width:760px){.hero{grid-template-columns:minmax(0,1fr)}.ptop nav{gap:14px}.g3,.g4{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.ptop-in{gap:12px;padding:0 12px}.ptop .logo{height:14px}.ptop nav{gap:12px;font-size:14px}.ptop nav a{white-space:nowrap}#acct .btn{min-height:32px;padding:0 10px;font-size:13px}}
@media (max-width:360px){.ptop nav a[href="/tournaments"]{display:none}}
/* hero: the floodlit ground */
.ground{position:relative;aspect-ratio:5/4;border-radius:20px;overflow:hidden;background:radial-gradient(120% 90% at 50% 40%,#1b1745 0%,#0D0B22 70%)}
.ground svg{position:absolute;inset:0;width:100%;height:100%}
.beam{transform-origin:center;animation:breathe 5s ease-in-out infinite}.beam.b2{animation-delay:-1.2s}.beam.b3{animation-delay:-2.4s}.beam.b4{animation-delay:-3.6s}
@keyframes breathe{0%,100%{opacity:.55}50%{opacity:.9}}
.float{position:absolute;left:6%;right:6%;bottom:6%;box-shadow:0 18px 40px rgb(0 0 0 / .45)}
@media (prefers-reduced-motion:reduce){.beam{animation:none;opacity:.75}}
@media (max-width:560px){.ptop nav{flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}.ptop nav::-webkit-scrollbar{display:none}#acct{flex:none}#acct .btn{max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;line-height:32px}}
/* Release 2 — landing pages: each offering keeps one of the wordmark's four colours (--c) */
.land-hero{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:36px;align-items:end;padding:26px 0 8px}
.land-mark{width:44px;height:44px;border-radius:999px;background:var(--c);box-shadow:16px 0 0 -2px color-mix(in srgb,var(--c) 35%,transparent)}
.land-h{font:800 clamp(42px,6.4vw,80px)/.95 var(--f-d);margin:0;max-width:17ch}
.land-lead{font-size:19px;line-height:29px;color:var(--mu);margin:0;max-width:60ch}
.land-who{list-style:none;margin:0;padding:18px 20px;border-left:4px solid var(--c);background:var(--s);border-radius:0 14px 14px 0;display:flex;flex-direction:column;gap:10px;font-weight:600}
.land-who li::before{content:'';display:inline-block;width:8px;height:8px;border-radius:99px;background:var(--c);margin-right:10px;vertical-align:middle}
.land-what{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 40px;padding:22px 0;border-top:1px solid var(--ln);border-bottom:1px solid var(--ln)}
.land-what h2{border-top:3px solid var(--c);padding-top:10px;margin-bottom:6px;display:inline-block}
.land-tbl td.land-v{font-weight:600;white-space:nowrap}.land-tbl td:first-child{min-width:220px}
.land-end{display:flex;flex-direction:column;gap:12px;padding:26px;border-radius:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 22%,var(--s)),var(--s) 60%);border:1px solid var(--ln)}
@media (max-width:760px){.land-hero{grid-template-columns:minmax(0,1fr);align-items:start}.land-what{grid-template-columns:minmax(0,1fr)}.land-tbl td.land-v{white-space:normal}}
/* Release 2 — the home ground plays a six: bowler runs in, ball to the bat, swing, over the rope; the lights flare together */
.ground .beams .beam{animation:none;opacity:.6}
.ground .beams{animation:flare 6s ease-in-out infinite}
.ground .lamp{animation:lamp 6s ease-in-out infinite}
.ground .bowler{animation:runup 6s ease-in infinite}
.ground .bowler .arm{transform-box:fill-box;transform-origin:0% 100%;animation:bowlarm 6s ease-in-out infinite}
.ground .bat{transform-box:fill-box;transform-origin:0% 0%;animation:swing 6s ease-in-out infinite}
.ground .ball{animation:ballpath 6s linear infinite}
.ground .six{opacity:0;transform-box:fill-box;transform-origin:50% 50%;animation:sixpop 6s ease-out infinite}
@keyframes runup{0%{transform:translateY(-12px);opacity:0}6%{opacity:1}33%{transform:translateY(34px)}40%,100%{transform:translateY(38px);opacity:1}}
@keyframes bowlarm{0%,30%{transform:rotate(0)}38%{transform:rotate(-200deg)}46%,100%{transform:rotate(-200deg)}}
@keyframes ballpath{0%,36%{transform:translate(0,0);opacity:0}37%{opacity:1;transform:translate(0,0)}49%{transform:translate(4px,88px)}52%{transform:translate(4px,88px)}62%{transform:translate(70px,-60px)}74%{transform:translate(170px,-200px);opacity:1}76%,100%{transform:translate(190px,-230px);opacity:0}}
@keyframes swing{0%,46%{transform:rotate(0)}52%{transform:rotate(-150deg)}60%{transform:rotate(-170deg)}75%,100%{transform:rotate(0)}}
@keyframes flare{0%,52%{opacity:.75;filter:none}58%{opacity:1;filter:brightness(1.8)}74%{opacity:1;filter:brightness(1.3)}86%,100%{opacity:.75;filter:none}}
@keyframes lamp{0%,52%{filter:none}58%,74%{filter:drop-shadow(0 0 10px var(--lc)) brightness(1.4)}86%,100%{filter:none}}
@keyframes sixpop{0%,56%{opacity:0;transform:scale(.6)}62%{opacity:1;transform:scale(1.08)}66%,80%{opacity:1;transform:scale(1)}88%,100%{opacity:0;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.ground .beams,.ground .lamp,.ground .bowler,.ground .bowler .arm,.ground .bat,.ground .ball,.ground .six{animation:none}.ground .ball{opacity:0}.ground .bowler{transform:translateY(38px)}}

/* Release 3A: account menu */
.acct{position:relative}.acct summary{list-style:none;cursor:pointer}.acct summary::-webkit-details-marker{display:none}
.acct-menu{position:absolute;right:0;top:calc(100% + 6px);min-width:200px;background:#17142F;border:1px solid #34305C;border-radius:12px;padding:6px;z-index:30;box-shadow:0 14px 34px rgb(0 0 0 / .4);display:flex;flex-direction:column;color:#fff}
.acct-menu a,.acct-menu button{display:block;text-align:left;padding:10px 12px;border-radius:9px;color:#fff;text-decoration:none;font:600 14px var(--f-t);background:none;border:0;cursor:pointer}
.acct-menu a:hover,.acct-menu button:hover{background:#221E40}.acct-menu .mu{color:#A9A5D6}
/* Release 3A: the player's account (/me) */
.me-head{display:flex;align-items:center;gap:14px}
.me-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--ln);margin:0 -2px}.me-tabs::-webkit-scrollbar{display:none}
.me-tabs a{flex:none;padding:10px 12px;color:var(--mu);text-decoration:none;font-weight:600;border-bottom:3px solid transparent;white-space:nowrap}
.me-tabs a[aria-current]{color:var(--ink);border-bottom-color:#02AED6}
.me-stats .stat{display:flex;flex-direction:column;gap:2px}.me-stats .stat b{font-size:28px;font-variant-numeric:tabular-nums}
.me-row{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-top:1px solid var(--ln)}.me-row:first-child{border-top:0}
.me-date{display:flex;flex-direction:column;width:68px;flex:none;font-variant-numeric:tabular-nums}
.me-dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 16px;margin:0}.me-dl dt{color:var(--mu)}.me-dl dd{margin:0;overflow-wrap:anywhere}
.seg{display:inline-flex;border:1px solid var(--ln);border-radius:999px;overflow:hidden}.seg a{padding:6px 14px;text-decoration:none;color:var(--mu);font-weight:600}.seg a[aria-current]{background:#02AED6;color:#0D0B22}
/* the phone menu at the bottom of the screen */
.bnav{display:none}
@media (max-width:760px){
  .bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:20;background:#0D0B22;border-top:1px solid #34305C;padding-bottom:env(safe-area-inset-bottom,0px)}
  .bnav a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px 7px;color:#B9B6D3;text-decoration:none;font-size:12px;font-weight:600}
  .bnav a svg{width:22px;height:22px}.bnav a[aria-current]{color:#02AED6}
  body.has-bnav{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
  body.has-bnav .ptop nav{display:none}
}
.me-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media (max-width:560px){.me-stats .stat{padding:12px}.me-stats .stat b{font-size:22px}}
@media (max-width:760px){body.has-bnav .toast{bottom:calc(76px + env(safe-area-inset-bottom,0px))}}
.gold { color: #C9A24A } .dl .gold { color: #8A6A12 }
/* Release 3B: the crowd and the fielders */
.ground .crowd{animation:cheer 6s ease-out infinite}
.ground .crowd .sec{animation:wave 4.2s ease-in-out infinite}
@keyframes wave{0%,14%,100%{transform:none}7%{transform:translateY(-4px)}}
@keyframes cheer{0%,56%,80%,100%{transform:none}60%,68%{transform:translateY(-3px)}64%,72%{transform:translateY(0)}}
.ground .fielder{animation:sway 3s ease-in-out infinite alternate}
.ground .keeper{animation:crouch 6s ease-in-out infinite}
.ground .chaser{animation:chase 6s ease-in-out infinite}
@keyframes sway{to{transform:translateX(1.5px)}}
@keyframes crouch{0%,36%,60%,100%{transform:none}44%,52%{transform:translateY(3px)}}
@keyframes chase{0%,54%{transform:none}70%,80%{transform:translate(18px,-26px)}100%{transform:none}}
@media (prefers-reduced-motion:reduce){.ground .crowd,.ground .crowd .sec,.ground .fielder,.ground .keeper,.ground .chaser{animation:none}}
.who{border-top:4px solid var(--c)}.ticks{margin:0;padding-left:1.1em;color:var(--mu);line-height:24px}
/* Release 3B: "How you start" — a pitch, four creases, the ball travelling through them */
.pitchflow{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding-top:34px}
.pf-track{position:absolute;left:12%;right:12%;top:10px;height:10px;border-radius:99px;background:linear-gradient(90deg,#c9b27c,#d7c08a);opacity:.85}
.pf-ball{position:absolute;top:-3px;left:0;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ff8a7a,#C0341D 70%);box-shadow:0 0 0 2px rgb(255 255 255 / .15);animation:pfball 6s cubic-bezier(.45,.05,.55,.95) infinite}
@keyframes pfball{0%{left:0;transform:translateY(0)}12%{transform:translateY(-14px)}25%{left:33%;transform:translateY(0)}37%{transform:translateY(-14px)}50%{left:66%;transform:translateY(0)}62%{transform:translateY(-14px)}75%,100%{left:calc(100% - 16px);transform:translateY(0)}}
.pf-step{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:14px;background:var(--s);border:1px solid var(--ln);animation:pfstep 6s ease-in-out infinite;animation-delay:calc(var(--i) * 1.5s)}
@keyframes pfstep{0%,20%,100%{border-color:var(--ln)}5%,12%{border-color:#02AED6;box-shadow:0 0 0 3px rgb(2 174 214 / .18)}}
.pf-stumps{position:absolute;top:-30px;left:50%;transform:translateX(-50%);display:flex;gap:3px}.pf-stumps i{width:3px;height:16px;background:#fff;border-radius:2px;opacity:.85}
.pf-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--r);color:#02AED6}.pf-ic svg{width:22px;height:22px}
@media (max-width:760px){.pitchflow{grid-template-columns:minmax(0,1fr);padding-top:0;padding-left:34px}.pf-track{left:10px;right:auto;top:6%;bottom:6%;width:10px;height:auto;background:linear-gradient(180deg,#c9b27c,#d7c08a)}
  .pf-ball{left:-3px;animation-name:pfballv}.pf-stumps{top:50%;left:-30px;transform:translateY(-50%) rotate(90deg)}}
@keyframes pfballv{0%{top:0}25%{top:30%}50%{top:62%}75%,100%{top:calc(100% - 16px)}}
@media (prefers-reduced-motion:reduce){.pf-ball,.pf-step{animation:none}}
/* Release 3B: Pro Play — obsidian and gold */
.ppx-body{background:#0A0912}
.ppx{--g:#0A0912;--s:#14121F;--r:#1E1B2C;--ln:#3A3350;--ink:#FBF7EC;--mu:#B7AFC9;display:flex;flex-direction:column;gap:16px;max-width:640px;width:100%;margin:0 auto;color:var(--ink)}
.ppx .mu{color:var(--mu)}.ppx-gold{color:#E9C46A}.ppx-warn{color:#E9C46A}
.ppx-top{display:flex;align-items:center;justify-content:space-between}
.ppx-badge{display:inline-block;font:800 11px/1 var(--f-t);letter-spacing:.14em;padding:6px 9px;border-radius:7px;background:linear-gradient(135deg,#F3D98B,#C9A24A);color:#1A1405;align-self:flex-start}
.ppx-hero{display:flex;flex-direction:column;gap:10px;padding:10px 0;background:radial-gradient(90% 120% at 100% 0%,rgb(201 162 74 / .16),transparent 60%)}
.ppx-h{font:800 clamp(40px,8vw,58px)/.98 var(--f-d);margin:0;letter-spacing:-.01em}.ppx-h2{font:800 32px/1.05 var(--f-d);margin:0}
.ppx-card{background:linear-gradient(150deg,#1d1a2b,#121019 75%);border:1px solid #5b4a24;border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:12px}
.ppx-feats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}@media (max-width:560px){.ppx-feats{grid-template-columns:minmax(0,1fr)}}
.ppx-dot{flex:none;width:10px;height:10px;margin-top:7px;border-radius:50%;background:linear-gradient(135deg,#F3D98B,#C9A24A)}
.ppx-chips{display:flex;flex-wrap:wrap;gap:8px}.ppx-chips button{font:600 14px var(--f-t);padding:9px 14px;border-radius:999px;border:1px solid #3A3350;background:#14121F;color:#B7AFC9;cursor:pointer}
.ppx-chips button[aria-checked="true"]{border-color:#E9C46A;background:rgb(233 196 106 / .14);color:#FBF7EC}
.ppx-price{display:flex;align-items:center;gap:12px;border:1px solid #E9C46A;border-radius:18px;padding:16px 18px;background:rgb(233 196 106 / .06)}
.ppx-amt{font:800 40px/1 var(--f-d);color:#F3D98B}
.ppx-btn{background:linear-gradient(135deg,#F3D98B,#C9A24A);border-color:#C9A24A;color:#1A1405;min-height:52px;font-size:17px}
.ppx-steps{display:flex;gap:6px}.ppx-steps i{flex:1;height:4px;border-radius:4px;background:#1E1B2C}.ppx-steps i.on{background:#E9C46A}
.ppx-note{border:1px solid #5b4a24;border-radius:12px;padding:10px 12px;font-size:14px;color:#E8DFC6;background:rgb(233 196 106 / .06)}
.ppx-list{display:flex;flex-direction:column;background:#14121F;border:1px solid #3A3350;border-radius:16px;padding:4px 14px}
.ppx-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid #3A3350}.ppx-row:first-child{border-top:0}
.ppx-row input[type=checkbox]{width:22px;height:22px;accent-color:#E9C46A}
.ppx-tick{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;background:#E9C46A;color:#1A1405;font-weight:800;font-size:13px}
.ppx-hr{border:0;border-top:1px solid #3A3350;width:100%;margin:2px 0}
.ppx .inp{background:#14121F;border-color:#3A3350;color:#FBF7EC}
.ppx-teaser{display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:18px;text-decoration:none;color:#FBF7EC;border:1px solid #6F5A2A;background:radial-gradient(120% 100% at 100% 0%,#2a2340,#121019 70%)}
.ppx-teaser .sm{color:#B7AFC9}
.ppx-grp{display:flex;flex-direction:column;gap:6px;margin-bottom:6px}