:root{--sea: #0b4a68;--sea2: #127f92;--glass: #3fc4bc;--sand: #f4dba8;--sand2: #e3bd82;--cream: #fffaf0;--coral: #ff6a4d;--coral2: #c8432c;--sun: #ffd35c;--ink: #123a4a;--display: "Marker Felt", "Chalkboard SE", "Chalkboard", "Segoe Print", "Comic Sans MS", cursive;--ui: "Trebuchet MS", "Gill Sans", "Gill Sans MT", "Segoe UI", system-ui, sans-serif}html,body{background:var(--sea);color:var(--cream);font-family:var(--ui)}.stage{background:var(--sand)}.hud{position:absolute;left:0;right:0;top:0;z-index:3;display:flex;align-items:flex-start;justify-content:space-between;padding:calc(10px + var(--safe-t)) calc(12px + var(--safe-r)) 0 calc(12px + var(--safe-l));pointer-events:none}.tbtn{pointer-events:auto;width:44px;height:44px;display:grid;place-items:center;border-radius:16px;background:#3fc4bc52;border:2px solid rgba(255,250,240,.85);color:var(--cream);text-decoration:none;box-shadow:0 3px #06283a59;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);transition:transform .15s ease,background .2s ease}.tbtn:active{transform:translateY(2px) scale(.94);box-shadow:0 1px #06283a59}.tbtn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.mute .spk{fill:currentColor;stroke:none}.mute .off,.mute[aria-pressed=true] .wav{display:none}.mute[aria-pressed=true] .off{display:inline}.mute[aria-pressed=true]{background:#123a4a66}.tally{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:0}.score{font-family:var(--display);font-size:44px;line-height:1;color:var(--cream);font-variant-numeric:tabular-nums;-webkit-text-stroke:1.5px rgba(11,74,104,.6);text-shadow:0 3px 0 rgba(6,40,58,.45);transition:transform .25s cubic-bezier(.2,1.6,.4,1)}.score.pop{transform:scale(1.25) rotate(-3deg)}.pips{display:flex;gap:6px;align-items:flex-end;padding:4px 8px;border-radius:10px;background:#0b4a6859}.pip{position:relative;display:block;width:13px;height:16px;border:2px solid var(--cream);border-top-width:0;border-radius:1px 1px 3px 3px;overflow:hidden;transition:transform .3s ease}.pip.keep{width:20px;height:20px}.pip:before{content:"";position:absolute;left:-2px;right:-2px;top:0;height:4px;z-index:1;background:linear-gradient(90deg,var(--cream) 0 25%,transparent 25% 42%,var(--cream) 42% 58%,transparent 58% 75%,var(--cream) 75%)}.pip b{position:absolute;left:0;right:0;bottom:0;height:calc(var(--hp, 1) * 100%);background:var(--sand2);transition:height .35s ease,background .3s}.pip.low b{background:var(--coral);animation:throb .8s ease-in-out infinite}.pip.down{transform:rotate(-80deg) translate(-3px);opacity:.7}.pip.down:after{content:"";position:absolute;left:50%;top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:var(--coral);transform:rotate(45deg);z-index:2}@keyframes throb{50%{opacity:.45}}.title,.card,.paused{position:absolute;z-index:2;pointer-events:none;text-align:center}.title{inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:calc(60px + var(--safe-t)) 24px calc(80px + var(--safe-b));background:radial-gradient(ellipse 85% 42% at 50% 44%,#0b4a6899,#0b4a681f 72%,#0b4a6800)}.title.fade{animation:fadeOut .45s ease forwards}@keyframes fadeOut{to{opacity:0;transform:scale(1.04)}}.badge svg{width:104px;height:104px;overflow:visible;filter:drop-shadow(0 4px 0 rgba(6,40,58,.35))}.badge .rim{fill:var(--cream)}.badge .beach{fill:var(--sand)}.badge .sea{fill:var(--sea2)}.badge .swell{fill:none;stroke:#04223873;stroke-width:4;stroke-linecap:round}.badge .foam{fill:none;stroke:var(--cream);stroke-width:3;stroke-linecap:round;animation:lap 2.6s ease-in-out infinite}.badge .wall{fill:var(--sand2)}.badge .castle{fill:var(--sand);stroke:var(--sand2);stroke-width:1.5;stroke-linejoin:round}.badge .pole{stroke:#8a6a48;stroke-width:1.6}.badge .flag{fill:var(--coral)}@keyframes lap{50%{transform:translateY(5px)}}.title h1{margin:2px 0 0;font-family:var(--display);font-weight:700;font-size:clamp(64px,22vw,92px);line-height:1;color:var(--cream);letter-spacing:.02em;transform:rotate(-4deg);-webkit-text-stroke:2px rgba(11,74,104,.55);text-shadow:0 5px 0 rgba(6,40,58,.5),0 0 30px rgba(255,211,92,.35)}.sub{margin:10px 0 0;font-size:18px;font-weight:700;color:var(--cream);letter-spacing:.02em;text-shadow:0 2px 0 rgba(6,40,58,.55)}.cta{margin-top:18px;display:inline-block;padding:9px 20px;border-radius:99px;font-size:15px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);background:var(--sun);box-shadow:0 4px #c79a2a;animation:bob 1.6s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-4px)}}.best{margin-top:12px;font-size:15px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--cream);text-shadow:0 2px 0 rgba(6,40,58,.55)}.card{left:50%;top:46%;width:min(290px,calc(100% - 48px));transform:translate(-50%,-40%) rotate(-6deg);opacity:0;padding:34px 22px 22px;border-radius:14px;color:var(--ink);background:linear-gradient(90deg,var(--coral) 0 20%,var(--cream) 20% 40%,var(--glass) 40% 60%,var(--cream) 60% 80%,var(--sun) 80%) top / 100% 12px no-repeat,radial-gradient(120% 80% at 12% 0%,#fffffae6,#fffffa00 60%),repeating-linear-gradient(8deg,rgba(120,90,60,.035) 0 1px,transparent 1px 3px),repeating-linear-gradient(-82deg,rgba(120,90,60,.025) 0 1px,transparent 1px 4px),linear-gradient(160deg,#fffaf0,#f6ead2);box-shadow:0 1px 1px #462c1440,0 8px 14px #462c1438,0 26px 48px #06283a59,inset 0 0 0 1px #a078462e;transition:opacity .35s ease,transform .55s cubic-bezier(.2,1.4,.4,1)}.card.show{opacity:1;transform:translate(-50%,-50%) rotate(-1.5deg)}.card:after{content:"";position:absolute;top:62px;right:16px;width:58px;height:58px;border-radius:50%;pointer-events:none;border:2px solid rgba(18,90,112,.28);transform:rotate(-14deg);background:radial-gradient(circle,transparent 0 17px,rgba(18,90,112,.22) 17px 18.5px,transparent 18.5px),repeating-linear-gradient(0deg,transparent 0 9px,rgba(18,90,112,.2) 9px 10.5px,transparent 10.5px 15px) 0 18px / 100% 24px no-repeat}.eyebrow{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sea2)}.big{font-family:var(--display);font-size:84px;line-height:1;margin-top:8px;color:var(--sea)}.label{font-size:16px;font-weight:700;color:#123a4abf}.cause{margin:8px auto 0;max-width:230px;font-size:14px;font-style:italic;color:#123a4ab3;line-height:1.3}.cause:empty{display:none}.card.show .big{animation:land .5s cubic-bezier(.2,1.6,.4,1) .3s both}@keyframes land{0%{transform:scale(.6) rotate(-8deg);opacity:0}}.newbest{display:inline-block;margin-top:12px;padding:5px 14px;border-radius:99px;font-family:var(--display);font-size:18px;color:var(--cream);background:var(--coral);box-shadow:0 3px 0 var(--coral2);transform:rotate(3deg);animation:wiggle 1.2s ease-in-out infinite}@keyframes wiggle{50%{transform:rotate(-3deg) scale(1.06)}}.row{display:flex;justify-content:space-between;align-items:baseline;margin:16px 6px 0;padding-top:12px;border-top:2px dashed rgba(18,58,74,.25);font-size:15px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--sea2)}.row b{font-family:var(--display);font-size:28px;letter-spacing:0;color:var(--ink);font-weight:400}.card .cta{margin-top:18px}.paused{inset:0;display:grid;place-items:center;background:#0b4a6873}@media(max-height:640px){.badge svg{width:84px;height:84px}.title h1{font-size:64px}}@media(prefers-reduced-motion:reduce){.cta,.badge .foam,.newbest,.pip.low b,.card.show .big{animation:none}.score{transition:none}}