:root { color-scheme:light; --pink:#ed0750; --hot:#ff385b; --purple:#2e147d; --ink:#170c43; --yellow:#ffc400; --cream:#55d8ff; --blue:#00a6df; --green:#79bd13; }
html,body{background-color:#55d8ff!important}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--cream);color:var(--ink);font-family:"Fredoka",Arial,sans-serif;overflow-x:hidden} img{display:block;max-width:100%} a{text-decoration:none;color:inherit}.section-wrap{width:min(1160px,calc(100% - 44px));margin:auto}.topbar{height:78px;padding:0 max(22px,calc((100vw - 1160px)/2));display:flex;align-items:center;justify-content:space-between;background:#fff9ef;position:relative;z-index:10;box-shadow:0 3px 0 rgba(46,20,125,.08)}.brand{font-family:"Baloo 2",sans-serif;font-size:27px;font-weight:800;letter-spacing:-1.5px;line-height:1;color:var(--yellow);text-shadow:2px 2px 0 #fff,4px 4px 0 var(--ink)}.brand span{color:var(--purple)}.topbar nav{display:flex;gap:30px;font-weight:700;font-size:15px}.topbar nav a:hover{color:var(--pink)}.mini-cta{background:var(--pink);color:#fff;padding:10px 17px;border-radius:999px;font-weight:700;font-size:14px;box-shadow:0 3px 0 var(--ink)}
.hero{display:grid;grid-template-columns:1.02fr .98fr;gap:10px;align-items:center;min-height:620px;padding:54px 0 38px}.eyebrow{font-weight:800;text-transform:uppercase;letter-spacing:1.6px;color:var(--pink);font-size:13px;margin:0 0 10px}.spark{color:var(--yellow);font-size:20px}.purple{color:var(--purple)}h1,h2,h3{font-family:"Baloo 2",sans-serif;line-height:.92;margin:0;font-weight:800}h1{font-size:clamp(58px,7vw,91px);letter-spacing:-3px}h1 em{font-style:normal;color:var(--pink);text-shadow:3px 3px 0 var(--ink)}.hero-text{font-size:19px;line-height:1.45;max-width:530px;margin:22px 0}.hero-buttons{display:flex;gap:12px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;gap:9px;padding:13px 20px;border-radius:16px;text-transform:uppercase;letter-spacing:.3px;font-size:15px;font-weight:800;border:3px solid var(--ink);box-shadow:4px 5px 0 var(--ink);transition:transform .16s,box-shadow .16s}.button:hover{transform:translate(3px,3px);box-shadow:1px 2px 0 var(--ink)}.button-yellow{background:var(--yellow)}.button-outline{background:#fff;color:var(--purple)}.play-icon{background:var(--pink);color:#fff;border-radius:50%;padding:3px 5px;font-size:10px}.button-purple{background:var(--purple);color:#fff}.game-facts{display:flex;gap:0;margin:32px 0 0}.game-facts div{padding:0 19px;border-left:2px solid #d7cfc4}.game-facts div:first-child{padding-left:0;border:0}.game-facts dt{font-size:11px;text-transform:uppercase;font-weight:800;letter-spacing:1px;color:#776d8d}.game-facts dd{font-family:"Baloo 2";font-weight:800;font-size:23px;margin:0}.hero-art{position:relative;align-self:stretch;display:flex;align-items:center;justify-content:center}.hero-art:before{content:"";position:absolute;width:90%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#ffc900 0 9%,transparent 9% 15%,#ff5a34 15% 18%,transparent 18% 27%,#ed0750 27% 29%,transparent 29%),repeating-conic-gradient(#ffe043 0 10deg,#ffb500 10deg 20deg);opacity:.9;transform:rotate(-9deg)}.hero-art img{position:relative;width:77%;filter:drop-shadow(0 14px 12px rgba(46,20,125,.22));transform:rotate(3deg)}.burst{position:absolute;z-index:2;border:3px solid var(--ink);padding:9px 12px;background:var(--yellow);font-weight:800;border-radius:42% 56% 43% 55%;box-shadow:3px 4px 0 var(--ink);transform:rotate(-10deg)}.burst-one{top:13%;left:6%}.burst-two{right:1%;bottom:20%;background:#fff;transform:rotate(9deg)}
.chant-band{background:var(--purple);color:#fff;padding:19px 0;overflow:hidden;transform:rotate(-1deg) scale(1.02);box-shadow:0 8px 0 var(--yellow)}.ticker{display:flex;justify-content:center;gap:26px;align-items:center;font-family:"Baloo 2";font-size:26px;font-weight:800;letter-spacing:1px;white-space:nowrap}.ticker i{font-style:normal;color:var(--yellow);font-size:24px}.how{padding:105px 0 92px}.section-heading{text-align:center;max-width:600px;margin:0 auto 42px}.section-heading h2,.chaos h2,.watch h2,.final-cta h2{font-size:clamp(44px,5.8vw,70px);letter-spacing:-2px}.section-heading>p:last-child{line-height:1.5;font-size:17px;margin:15px 0 0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.step{position:relative;padding:31px 27px 25px;background:#fff;border:3px solid var(--ink);border-radius:24px;box-shadow:7px 7px 0 var(--ink);text-align:center}.step:nth-child(2){background:#fff0bf;transform:translateY(12px)}.step:nth-child(3){background:#ffd9e5}.number{position:absolute;left:16px;top:13px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--purple);color:#fff;font-weight:800}.step-icon{font-size:54px;line-height:1;color:var(--pink);height:64px}.step:nth-child(2) .step-icon{color:var(--blue)}.step:nth-child(3) .step-icon{color:#ef8010}.step h3{font-size:30px}.step p{line-height:1.4;margin:10px 0 0}.rules-card{margin:80px auto 0;max-width:930px;border:4px solid var(--purple);border-radius:28px;padding:22px 34px 22px 22px;display:grid;grid-template-columns:220px 1fr;gap:38px;align-items:center;background:#e7e1fb;box-shadow:9px 9px 0 var(--yellow)}.rules-card img{width:190px;justify-self:center;border-radius:13px;box-shadow:4px 5px 0 #b6afd5}.rules-card h3{font-size:38px}.rules-card p:not(.eyebrow){font-size:17px;line-height:1.45;margin:12px 0 20px}
.animals{padding:96px 0;background:var(--pink);position:relative;overflow:hidden}.animals:before,.animals:after{content:"✦";position:absolute;color:var(--yellow);font-size:140px;opacity:.8}.animals:before{left:3%;top:22%}.animals:after{right:4%;bottom:-5%}.light{color:#fff}.light .eyebrow{color:var(--yellow)}.animal-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(6,1fr);gap:15px}.animal-card{background:#fff;border:3px solid var(--ink);border-radius:19px;padding:7px 7px 13px;box-shadow:4px 5px 0 var(--ink);transition:transform .2s}.animal-card:hover{transform:translateY(-10px) rotate(-3deg)}.animal-card:nth-child(even){transform:translateY(20px)}.animal-card:nth-child(even):hover{transform:translateY(10px) rotate(3deg)}.animal-card img{aspect-ratio: .66;object-fit:cover;object-position:top;border-radius:12px}.animal-card div{text-align:center;padding-top:8px}.animal-card strong{font-family:"Baloo 2";font-size:24px;display:block;line-height:1}.animal-card span{display:block;font-size:10px;font-weight:800;color:var(--purple);margin-top:3px}.chaos{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center;padding:115px 6%}.chaos-image{max-width:330px;justify-self:center;position:relative}.chaos-image:before{content:"";position:absolute;inset:-22px;background:var(--yellow);clip-path:polygon(50% 0,60% 28%,84% 10%,75% 36%,100% 40%,76% 55%,93% 80%,66% 70%,52% 100%,41% 71%,18% 89%,28% 61%,0 53%,27% 43%,10% 17%,39% 30%)}.chaos-image img{position:relative;border:4px solid var(--ink);border-radius:22px;box-shadow:8px 8px 0 var(--ink);transform:rotate(-5deg)}.chaos-copy p:not(.eyebrow){font-size:19px;line-height:1.45;max-width:500px}.chaos-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}.chaos-tags span{font-weight:800;background:#f4d9e1;color:var(--purple);padding:8px 12px;border-radius:99px}.chaos-tags span:nth-child(2){background:#d3effa}.chaos-tags span:nth-child(3){background:#ffe6ac}.chaos-tags span:nth-child(4){background:#dcd4ff}.watch{background:var(--purple);padding:90px 0;color:#fff}.watch .eyebrow{color:var(--yellow)}.watch-inner{display:grid;grid-template-columns:.75fr 1.25fr;gap:50px;align-items:center}.watch p:not(.eyebrow){font-size:18px;line-height:1.5}.video-frame{position:relative;border:4px solid #fff;border-radius:23px;overflow:hidden;box-shadow:9px 9px 0 var(--yellow);aspect-ratio:1.45}.video-frame img{width:100%;height:100%;object-fit:cover;object-position:center 29%;filter:brightness(.68)}.video-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:800;letter-spacing:1px;text-align:center}.video-play{border:3px solid var(--ink);background:var(--yellow);width:74px;height:74px;border-radius:50%;font-size:28px;padding-left:8px;color:var(--ink);cursor:pointer;box-shadow:4px 4px 0 var(--ink);margin-bottom:10px}.final-cta{padding:95px 8%;display:grid;grid-template-columns:260px 1fr;gap:70px;align-items:center}.final-cta img{border:4px solid var(--ink);border-radius:22px;box-shadow:8px 8px 0 var(--pink);transform:rotate(-5deg)}.final-cta h2{margin-bottom:25px}footer{background:var(--pink);color:#fff;padding:28px max(22px,calc((100vw - 1160px)/2));display:flex;align-items:center;gap:35px;justify-content:space-between;font-weight:700}footer .brand{font-size:24px}footer p{margin:0}.copyright{opacity:.75;font-size:13px}
@media(max-width:800px){.topbar nav{display:none}.hero{grid-template-columns:1fr;padding-top:45px}.hero-copy{order:2;text-align:center}.hero-text{margin-inline:auto}.hero-buttons,.game-facts{justify-content:center}.hero-art{min-height:400px;order:1}.hero-art img{width:52%;max-width:340px}.steps{grid-template-columns:1fr}.step:nth-child(2){transform:none}.rules-card{grid-template-columns:150px 1fr;gap:22px;padding:18px}.rules-card img{width:145px}.animal-grid{grid-template-columns:repeat(3,1fr);gap:17px}.animal-card:nth-child(even){transform:none}.chaos,.watch-inner,.final-cta{grid-template-columns:1fr;gap:40px}.chaos{padding:85px 6%}.chaos-copy{text-align:center}.chaos-tags{justify-content:center}.watch{text-align:center}.final-cta{text-align:center;justify-items:center}.final-cta img{width:215px;grid-row:2}.ticker{justify-content:flex-start;padding-left:28px}.burst-one{left:20%}.burst-two{right:16%}footer{flex-wrap:wrap;gap:13px;justify-content:center;text-align:center}}
@media(max-width:470px){.topbar{height:67px}.topbar .brand{font-size:22px}.mini-cta{padding:8px 11px}.section-wrap{width:min(100% - 28px,1160px)}.hero{min-height:0}.hero-art{min-height:300px}.hero-art img{width:67%}h1{font-size:55px}.game-facts div{padding:0 10px}.game-facts dd{font-size:18px}.rules-card{grid-template-columns:1fr;text-align:center}.rules-card img{width:125px}.animal-grid{grid-template-columns:repeat(2,1fr)}.animal-card strong{font-size:21px}.chaos{padding:70px 5%}.final-cta{padding:70px 0}.video-frame{aspect-ratio:1.05}}

/* Keep the headline copy above the decorative hero artwork. */
.hero-copy{position:relative;z-index:3}
.hero-art{z-index:1}

.animal-card{cursor:pointer}
.animal-card:focus-visible{outline:4px solid var(--yellow);outline-offset:5px}
.animal-card.is-playing{animation:animal-pop .58s ease}
.sound-message{position:fixed;left:50%;bottom:20px;transform:translate(-50%,150%);z-index:20;background:var(--yellow);border:3px solid var(--ink);border-radius:999px;padding:9px 16px;box-shadow:3px 4px 0 var(--ink);font-weight:800;white-space:nowrap;transition:transform .2s}
.sound-message:not(:empty){transform:translate(-50%,0);animation:sound-toast 2s ease forwards}
@keyframes animal-pop{50%{transform:translateY(-14px) rotate(-4deg) scale(1.08)}}
@keyframes sound-toast{0%,80%{transform:translate(-50%,0)}100%{transform:translate(-50%,150%)}}

.trailer{background:radial-gradient(circle at center,#ff8e29 0 10%,#f82261 32%,#321272 72%);isolation:isolate}
.trailer-stage{position:absolute;inset:0;overflow:hidden;display:grid;place-items:center;padding:20px}
.trailer-kicker,.trailer-word{position:absolute;z-index:2;margin:0;text-align:center;font-family:"Baloo 2",sans-serif;font-weight:800;line-height:.9;text-shadow:3px 3px 0 var(--ink)}
.trailer-kicker{top:9%;font-size:clamp(16px,2.3vw,25px);color:var(--yellow);letter-spacing:1px}.trailer-word{bottom:8%;font-size:clamp(23px,3.8vw,46px);color:#fff;max-width:90%}
.trailer-animals{position:absolute;inset:13% 6% 14%;display:flex;align-items:center;justify-content:center}.trailer-animals img{position:absolute;width:31%;border:3px solid #fff;border-radius:15px;box-shadow:4px 5px 0 var(--ink);opacity:0;transform:scale(.3) rotate(-12deg)}
.trailer-animals img.is-on{opacity:1;animation:trailer-pop 1.55s cubic-bezier(.2,.85,.35,1) forwards}.trailer .video-play{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%)}.trailer.is-playing .video-play{opacity:0;pointer-events:none}
@keyframes trailer-pop{0%{opacity:0;transform:scale(.2) rotate(-15deg)}20%{opacity:1;transform:scale(1.18) rotate(5deg)}55%{opacity:1;transform:scale(1) rotate(-2deg)}100%{opacity:0;transform:scale(.4) rotate(12deg)}}

/* Prevent mobile browsers from replaying visual effects while rotating. */
.is-rotating .animal-card,.is-rotating .animal-card img,.is-rotating .trailer-animals img,.is-rotating .sound-message{animation:none!important;transition:none!important}