@font-face{font-family:NogasDisplay;src:url('/assets/display.otf') format('opentype');font-display:swap;font-weight:900}
:root{--blue:#198cf7;--lime:#b7ff37;--ink:#141611;--cream:#f5f3e9;--line:2px solid var(--ink)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;color:var(--ink);background:var(--blue);font-family:Arial,Helvetica,sans-serif;font-size:16px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--cream);outline-offset:5px}img{display:block;max-width:100%;height:auto}button{touch-action:manipulation}h1,h2,p{margin:0}h1,h2,.brand,.ticker,.sticker{font-family:NogasDisplay,'Arial Black',Arial,sans-serif;font-weight:900}button:disabled{cursor:wait}.skip{position:absolute;top:-70px;left:10px;z-index:100;padding:12px;background:var(--cream)}.skip:focus{top:8px}
.nav{height:98px;margin:0 4.5%;border-bottom:var(--line);display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:inline-flex;align-items:center;gap:10px;font-size:32px;letter-spacing:-1.7px}.brand img{width:30px;height:40px;object-fit:contain}.brand span{font:12px Arial;align-self:flex-start;margin-top:6px;letter-spacing:0}.nav nav{display:flex;gap:30px;font-size:14px;font-weight:700}.nav nav a:hover{color:var(--cream)}.nav-end{display:flex;align-items:center;gap:18px}.launch-label{display:flex;align-items:center;gap:8px;border:var(--line);border-radius:30px;padding:12px 19px;font-size:12px;font-weight:700;background:var(--cream)}.launch-label b{font-size:17px;letter-spacing:-.6px}
.hero{position:relative;min-height:690px;padding:64px 5% 80px;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:2vw;overflow:hidden}.hero-copy{z-index:2}.eyebrow{display:flex;align-items:center;gap:13px;font-size:12px;font-weight:800;letter-spacing:1.2px}.tiny-tag{display:inline-block;background:var(--ink);color:var(--cream);padding:7px 10px;font-size:12px;font-weight:800;letter-spacing:1.2px;transform:rotate(-3deg)}h1{font-size:clamp(66px,8.8vw,144px);line-height:.9;letter-spacing:-.045em;margin:28px 0 26px}h1 span{color:var(--cream)}.intro{font-size:17px;line-height:1.6;font-weight:500}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 22px}.button{min-height:54px;border:var(--line);border-radius:7px;display:inline-flex;align-items:center;justify-content:space-between;gap:26px;padding:14px 20px;font-size:13px;font-weight:800;letter-spacing:.4px;transition:transform .18s,box-shadow .18s;box-shadow:4px 4px 0 var(--ink)}.button-lime{background:var(--lime)}.button-outline{background:transparent}.button-dark{background:var(--ink);color:var(--cream);box-shadow:4px 4px 0 var(--blue)}.button-symbol{font-size:25px;line-height:16px}.gas-readout{display:flex;align-items:center;gap:7px;font-family:monospace;font-size:12px}.gas-track{width:55px;height:12px;border:1.5px solid var(--ink);display:block;margin-right:4px;padding:2px}.gas-track i{display:block;background:var(--ink);width:3px;height:100%}.gas-aside{opacity:.7;margin-left:5px}
.hero-stage{height:500px;position:relative;display:grid;place-items:center;perspective:1000px}.orbit-ring{position:absolute;width:90%;max-width:480px;aspect-ratio:1;border:1px solid rgba(16,36,49,.22);border-radius:50%;transform:rotate(-20deg)}.orbit-ring:after{content:'';position:absolute;inset:25px;border:1px dashed rgba(16,36,49,.16);border-radius:50%}.main-frog{border:0;background:transparent;padding:0;width:78%;height:440px;z-index:2;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.22,.8,.2,1);animation:bob 5s ease-in-out infinite}.main-frog img{height:100%;width:100%;object-fit:contain;filter:drop-shadow(9px 12px 0 rgba(0,0,0,.12));user-select:none;pointer-events:none}.main-frog.pumping{animation:try-inflate .65s ease-in-out 2}.frog-shadow{position:absolute;width:52%;height:22px;bottom:13px;background:rgba(0,0,0,.16);border-radius:50%;filter:blur(3px)}.sticker{position:absolute;top:11px;right:0;z-index:4;background:var(--cream);border:var(--line);font-size:27px;line-height:1;letter-spacing:-1px;padding:18px 15px;transform:rotate(11deg);box-shadow:4px 4px 0 var(--ink)}.sticker b{font:800 12px Arial;letter-spacing:.1px}.side-note{position:absolute;bottom:-12px;left:48%;font-family:monospace;font-size:13px;transform:rotate(-6deg);white-space:nowrap}.satellite{position:absolute;z-index:3;border:0;padding:0;background:transparent;transition:filter .2s;animation:floaty 6s ease-in-out infinite}.satellite img{width:100%;height:100%;object-fit:contain;pointer-events:none}.satellite-one{width:85px;height:110px;left:-15px;bottom:50px;rotate:-20deg}.satellite-two{width:80px;height:108px;right:-7%;bottom:105px;rotate:16deg;animation-delay:-2s}.satellite-three{width:49px;height:65px;left:5%;top:-8px;rotate:17deg;animation-delay:-4s}.hero-bottom{position:absolute;bottom:22px;left:5%;right:5%;display:flex;justify-content:space-between;gap:20px;font-size:11px;font-weight:800;letter-spacing:1px}.hero-bottom a span{margin-left:20px;font-size:18px}.ticker{border-top:var(--line);border-bottom:var(--line);background:var(--lime);overflow:hidden;transform:rotate(-1.2deg);margin:-5px -2% 0;width:104%;position:relative;z-index:5;padding:17px 0}.ticker-track{display:flex;align-items:center;width:max-content;gap:45px;font-size:31px;line-height:1;letter-spacing:-.7px;animation:marquee 32s linear infinite}.ticker-frog{width:32px;height:42px;object-fit:contain;flex:0 0 auto}
.loop-section{display:grid;grid-template-columns:.75fr 1.25fr;gap:6%;padding:98px 6% 90px;background:var(--ink);color:var(--cream);align-items:center}.loop-copy .eyebrow{color:var(--lime);margin-bottom:30px}.loop-copy h2{font-size:clamp(44px,5.2vw,74px);line-height:.95;letter-spacing:-2px}.loop-copy h2 span{color:var(--lime)}.loop-copy p{font-size:17px;line-height:1.7;margin:24px 0 32px;color:#c5c7bd}.loop-caption{font-family:monospace;font-size:12px;letter-spacing:1px}.video-shell{position:relative;border:2px solid var(--cream);border-radius:12px;overflow:hidden;aspect-ratio:16/11;background:var(--blue);color:var(--ink);box-shadow:9px 9px 0 var(--lime)}.video-shell video{height:100%;width:100%;object-fit:cover;display:block;pointer-events:none}.video-top{position:absolute;left:20px;right:20px;top:20px;display:flex;justify-content:space-between;gap:10px;font:800 11px monospace;letter-spacing:.3px;pointer-events:none}.video-top span:last-child{border:1px solid var(--ink);padding:4px 8px;margin-top:-4px;border-radius:30px}.video-bottom{position:absolute;bottom:20px;left:20px;right:75px;font:700 10px monospace;line-height:1.4;pointer-events:none}
.pond-section{padding:75px 6% 28px;background:var(--cream);overflow:hidden}.pond-heading{display:flex;justify-content:space-between;align-items:end;gap:30px}.pond-heading .eyebrow{margin-bottom:24px}.pond-heading h2{font-size:clamp(38px,5.4vw,76px);line-height:.97;letter-spacing:-2px}.pond-heading h2 span{color:var(--blue)}.pond-instructions p{line-height:1.6;margin-bottom:22px;font-size:16px}.pond{position:relative;height:355px;margin-top:42px;border-bottom:2px solid var(--ink);background-image:radial-gradient(var(--blue) .7px,transparent .7px);background-size:18px 18px;background-position:0 140px;isolation:isolate}.pond-frog{position:absolute;bottom:var(--bottom);left:var(--left);width:var(--size);height:calc(var(--size) * 1.33);border:0;background:transparent;padding:0;z-index:var(--z);transform:rotate(var(--tilt));filter:drop-shadow(3px 5px 0 rgba(0,0,0,.12));transition:filter .2s}.pond-frog img{width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}.pond-frog:hover{filter:drop-shadow(3px 7px 0 rgba(25,140,247,.35))}.speech{position:absolute;background:var(--cream);border:2px solid var(--ink);border-radius:8px;padding:7px 10px;left:50%;bottom:95%;transform:translateX(-50%) rotate(calc(var(--tilt,0deg) * -1));white-space:nowrap;font:700 12px monospace;z-index:15;color:var(--ink);box-shadow:2px 2px var(--ink);pointer-events:none}.pond-footer{display:flex;justify-content:space-between;gap:20px;font:12px monospace;margin-top:18px}.pond-footer span:last-child{font-size:10px;max-width:55%;text-align:right}.coming-soon{text-align:center;background:var(--lime);padding:65px 20px;border-top:var(--line);border-bottom:var(--line)}.coming-soon .tiny-tag{transform:rotate(-2deg)}.coming-soon h2{margin:24px 0 12px;font-size:clamp(32px,5vw,68px);line-height:1;letter-spacing:-2px}.coming-soon h2 span{font-family:Arial,Helvetica,sans-serif;letter-spacing:-3px}.coming-soon p{font-size:16px}footer{display:flex;justify-content:space-between;align-items:center;gap:25px;margin:0;padding:32px 5%}footer>span{font-size:10px;font-weight:800;letter-spacing:1px}.back-top{font-size:11px;font-weight:800}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);padding:14px 22px;border:2px solid var(--ink);background:var(--cream);color:var(--ink);box-shadow:5px 5px 0 var(--ink);font:700 14px monospace;border-radius:8px;z-index:30;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:90%;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-13px) rotate(2deg)}}@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-15px)}}@keyframes try-inflate{0%,100%{transform:scale(1)}25%{transform:scale(.98,1.02) rotate(-2deg)}50%{transform:scale(1.035,.98) rotate(2deg)}75%{transform:scale(1.01) rotate(-1deg)}}@keyframes hop{0%,100%{translate:0 0}40%{translate:0 -65px;rotate:15deg}65%{translate:0 -25px;rotate:-8deg}}@keyframes marquee{to{transform:translateX(-50%)}}
@media(min-width:1500px){.nav,.hero,.loop-section,.pond-section,footer{padding-left:max(5%,calc((100vw - 1400px)/2));padding-right:max(5%,calc((100vw - 1400px)/2))}.nav{margin:0}.hero{min-height:760px}.hero-stage{height:540px}.main-frog{height:495px}}
@media(max-width:1000px){.nav{gap:15px;height:85px}.nav nav{gap:20px}.nav-end{gap:10px}.launch-label{padding:10px;font-size:10px}.launch-label b{font-size:14px}.hero{min-height:610px;padding-top:42px;gap:0}.hero-stage{height:420px}.main-frog{height:360px}.sticker{font-size:23px;padding:13px}.satellite-two{right:-6%;width:65px}.satellite-one{left:-12px;width:65px}.intro{font-size:15px}.button{font-size:12px;padding:13px;gap:16px}.hero-bottom{font-size:10px}.loop-section{gap:5%;padding:80px 5%}.video-top{font-size:9px}.pond-heading h2{font-size:49px}.pond-instructions{max-width:300px}.pond{height:320px}.pond-footer{font-size:11px}}
@media(max-width:700px){.nav{height:76px;margin:0 5%;gap:10px}.brand{font-size:26px;gap:6px}.brand img{width:23px;height:31px}.brand span{font-size:9px}.nav nav{display:none}.nav-end{gap:8px}.launch-label{gap:5px;padding:9px 10px;font-size:9px}.launch-label b{font-size:13px}.hero{display:flex;flex-direction:column;padding:34px 6% 62px;min-height:auto;overflow:hidden}.hero-copy{width:100%}.eyebrow{font-size:10px;gap:10px;letter-spacing:.8px}.tiny-tag{font-size:10px}h1{font-size:clamp(62px,15.2vw,105px);line-height:.91;letter-spacing:-3px;margin:23px 0 19px}.intro{font-size:15px;line-height:1.5}.hero-actions{margin:24px 0 20px;gap:10px}.button{font-size:11px;min-height:49px;padding:12px 15px;gap:20px}.gas-readout{font-size:11px}.gas-aside{font-size:10px}.hero-stage{width:100%;height:375px;margin-top:25px}.main-frog{height:335px;width:80%}.sticker{right:3%;top:6px;font-size:23px}.sticker b{font-size:10px}.orbit-ring{width:86%}.frog-shadow{bottom:8px}.satellite-one{left:0;bottom:35px;width:60px;height:90px}.satellite-two{right:-3%;bottom:70px;width:55px;height:82px}.satellite-three{left:7%;top:0;width:38px;height:53px}.side-note{font-size:11px;bottom:-12px;left:40%}.hero-bottom{left:6%;right:6%;bottom:17px;font-size:8px;align-items:center}.hero-bottom>span{max-width:45%;line-height:1.5}.hero-bottom a{font-size:9px}.hero-bottom a span{margin-left:7px}.ticker{padding:13px 0}.ticker-track{font-size:23px;gap:28px}.ticker-frog{width:24px;height:34px}.loop-section{display:flex;flex-direction:column;align-items:stretch;gap:35px;padding:56px 6% 65px}.loop-copy .eyebrow{margin-bottom:20px}.loop-copy h2{font-size:53px}.loop-copy p{font-size:15px;margin:20px 0}.loop-caption{font-size:10px}.video-shell{box-shadow:6px 6px 0 var(--lime)}.video-top{left:12px;right:12px;top:15px;font-size:8px}.video-top span:last-child{padding:4px 5px}.video-bottom{left:12px;bottom:16px;right:58px;font-size:8px}.pond-section{padding:49px 6% 24px}.pond-heading{display:block}.pond-heading h2{font-size:46px;letter-spacing:-1.5px}.pond-heading .eyebrow{margin-bottom:22px}.pond-instructions{max-width:none;margin-top:24px;display:flex;justify-content:space-between;align-items:center;gap:15px}.pond-instructions p{font-size:12px;margin:0}.pond-instructions .button{font-size:10px;max-width:160px;line-height:1.4;gap:9px;padding:12px}.pond{height:330px;margin-top:28px}.pond-frog{left:var(--mobile-left);width:var(--mobile-size);height:calc(var(--mobile-size) * 1.33);bottom:var(--mobile-bottom)}.pond-footer{gap:10px;font-size:10px}.pond-footer span:last-child{font-size:8px;line-height:1.4}.coming-soon{padding:45px 15px}.coming-soon h2{font-size:34px;letter-spacing:-1px}.coming-soon h2 span{letter-spacing:-1.5px}.coming-soon p{font-size:14px}footer{padding:25px 6%;flex-wrap:wrap;gap:20px}footer>span{order:3;width:100%;font-size:8px;border-top:1px solid var(--ink);padding-top:16px}.back-top{font-size:10px}.toast{font-size:12px;padding:12px 16px}.speech{font-size:10px;padding:5px 7px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{overflow-x:clip}.intro,.pond-instructions p,.loop-copy p{font-size:1rem}.nav nav{font-size:.875rem}

/* Direct touch and pointer interaction with the existing mascot artwork. */
.hero-pose{display:block;width:100%;height:100%;transform-style:preserve-3d;transform:translate3d(var(--look-x,0px),var(--look-y,0px),0) rotateX(var(--look-tilt,0deg)) rotateZ(var(--look-rotate,0deg));transition:transform .25s ease-out}
.hero-pose.sideways{transform:translate3d(var(--look-x,0px),var(--look-y,0px),0) rotateX(var(--look-tilt,0deg)) rotateY(88deg) rotateZ(var(--look-rotate,0deg));transition:transform .55s ease-out}
.main-frog{position:relative;touch-action:pan-y;cursor:pointer;-webkit-user-select:none;user-select:none;animation:none}
.main-frog img,.frog-sprite{transform-origin:50% 93%}
.draggable-frog{translate:var(--drag-x,0px) var(--drag-y,0px);touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.satellite.draggable-frog{animation:none}
.frog-sprite{position:relative;display:block;width:100%;height:100%;pointer-events:none;transform:translateY(var(--jump-lift,0px)) rotate(var(--body-lean,0deg));animation:weight-shift 5.8s ease-in-out infinite;animation-delay:var(--idle-delay,0s)}
.frog-sprite img{transition:opacity .12s ease;opacity:1}
.motion-canvas{position:absolute;left:50%;bottom:0;max-width:none;height:auto;transform:translateX(-50%);opacity:0;transition:opacity .12s ease;pointer-events:none;filter:drop-shadow(3px 4px 0 rgba(0,0,0,.12))}
.is-posing .frog-sprite img{opacity:0}
.is-posing .motion-canvas{opacity:1}
.is-holding .frog-sprite,.is-reacting .frog-sprite,.is-dragging .frog-sprite{animation:none}
.living-frog{isolation:isolate;-webkit-touch-callout:none}
.living-frog.is-reacting,.living-frog.is-holding{z-index:11}
.living-frog:focus-visible{outline:2px dashed var(--ink);outline-offset:5px;border-radius:14px}
.frog-charge{position:absolute;bottom:1%;left:20%;width:60%;height:5px;border-radius:5px;background:var(--ink);opacity:0;transform:scaleX(var(--charge,0));transform-origin:center;transition:opacity .15s;pointer-events:none}
.is-holding .frog-charge{opacity:.65}
.draggable-frog.is-dragging{z-index:12;cursor:grabbing;filter:drop-shadow(7px 15px 0 rgba(0,0,0,.18))}
.draggable-frog:focus-visible{outline:2px dashed var(--ink);outline-offset:3px;border-radius:16px}
.satellite-three{min-width:44px;min-height:58px}
.touch-ripple{position:absolute;width:28px;height:12px;border:1.5px solid var(--ink);border-radius:50%;pointer-events:none;z-index:1;animation:touch-ripple .7s ease-out forwards}
.touch-ripple.ripple-wide{width:46px;height:17px;border-color:var(--blue)}
.main-frog .speech{bottom:85%;max-width:90%;font-size:13px}
.hero-stage .side-note{left:50%;transform:translateX(-50%) rotate(-4deg);width:max-content;max-width:100%;text-align:center;font-size:12px}
@keyframes weight-shift{0%,100%{translate:0 0;scale:1 1}35%{translate:1px -2px;scale:1.009 .992}70%{translate:-1px 0;scale:.994 1.006}}
@keyframes touch-ripple{from{transform:translate(-50%,-50%) scale(.6);opacity:.5}to{transform:translate(-50%,-50%) scale(3);opacity:0}}
@media(max-width:700px){.hero-stage .side-note{font-size:11px}.main-frog .speech{font-size:11px}}

.pond{height:405px;margin-top:50px}
.pond-instructions{max-width:330px}
.pond-instructions p{font-size:15px;line-height:1.55}
.pond-footer{align-items:center;min-height:44px;flex-wrap:wrap}
.reset-pond{padding:8px 10px;min-height:44px;border:1px solid var(--ink);border-radius:5px;background:transparent;font:700 10px monospace;letter-spacing:.5px}
.reset-pond[hidden]{display:none}
.reset-pond:focus-visible{outline-color:var(--ink)}
@media(max-width:1000px) and (min-width:701px){.pond-frog{width:calc(var(--size) * .82);height:calc(var(--size) * 1.09)}}
@media(max-width:700px){.pond{height:445px;margin-top:36px}.pond-instructions{max-width:none;align-items:flex-start}.pond-instructions p{font-size:12px;line-height:1.65}.pond-footer span:last-child{max-width:100%}.pond-frog{width:var(--mobile-size);height:calc(var(--mobile-size) * 1.33)}.speech{white-space:normal;min-width:80px;max-width:122px;text-align:center;line-height:1.35}.pond-instructions .button{min-width:130px;max-width:145px}}
@media(max-width:370px){.pond-frog{width:calc(var(--mobile-size) * .9);height:calc(var(--mobile-size) * 1.197)}.pond-instructions{gap:10px}.pond-instructions .button{min-width:115px;padding:10px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.frog-sprite{animation-duration:12s}.hero-pose{transition-duration:.1s}.touch-ripple{animation-duration:.3s}}

.social-links{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:24px}
.social-link{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:11px 15px;border:var(--line);border-radius:6px;background:var(--cream);color:var(--ink);box-shadow:3px 3px 0 var(--ink);font-size:11px;font-weight:800;letter-spacing:.5px;line-height:1.2;transition:transform .18s,box-shadow .18s}
.social-link svg{width:18px;height:18px;fill:currentColor;flex:none}
.social-link:focus-visible{outline-color:var(--ink)}
.coming-soon .social-links{justify-content:center}
.coming-soon .social-link{color:var(--cream)}
@media(max-width:700px){.social-links{gap:10px;margin-top:20px}.social-link{font-size:10px;padding:10px 12px}.coming-soon .social-links{gap:12px}}

/* Pond wildlife and the short, non-blocking feeding burst. */
.pond-life-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:20;pointer-events:none}
.feeding-frenzy{position:fixed;inset:0;width:100vw;height:100dvh;z-index:45;pointer-events:none;contain:strict}
.mouth-anchor{position:absolute;width:0;height:0;pointer-events:none;visibility:hidden}
.living-frog.is-hunting{z-index:11}
.is-hunting .frog-sprite{animation:none}
.pond-actions{display:flex;flex-direction:column;align-items:stretch;gap:12px}
.pond-actions .button{justify-content:center;min-height:48px}
.release-flies{position:relative;overflow:hidden;isolation:isolate;min-width:185px}
.release-flies img{width:24px;height:24px;object-fit:contain;flex:none}
.release-flies.is-feeding{cursor:default}
.release-flies.is-feeding::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:3px;background:var(--ink);transform-origin:left;animation:feeding-countdown 5.2s linear forwards}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@keyframes feeding-countdown{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media(max-width:700px){.pond-actions{gap:10px;flex:0 0 150px}.pond-instructions .pond-actions .button{min-width:150px;max-width:150px;font-size:11px;gap:8px;padding:11px 10px}.pond-instructions p{font-size:13px;line-height:1.6}.release-flies img{width:22px;height:22px}}
@media(max-width:370px){.pond-actions{flex-basis:138px}.pond-instructions .pond-actions .button{min-width:138px;max-width:138px}}

/* Effort is interactive. The gas gauge always stays empty. */
.hero-stage{isolation:isolate}
.hero-stage .orbit-ring,.hero-stage .sticker,.hero-stage .frog-shadow,.hero-stage .side-note{pointer-events:none}
.hero-stage .pond-life-canvas{z-index:20}
.inflate-feedback{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;row-gap:8px;max-width:405px;margin:-3px 0 18px;font:700 14px/1.4 monospace;min-height:54px;align-content:center}
.effort-readout{white-space:nowrap;font-size:12px;align-self:center}.effort-readout b{display:inline-block;min-width:4ch;text-align:right}
.effort-track{display:block;grid-column:1/-1;height:5px;background:rgba(20,22,17,.18);overflow:hidden;border-radius:3px}
.effort-track i{display:block;width:100%;height:100%;background:var(--ink);transform:scaleX(var(--effort,0));transform-origin:left}
.inflate-feedback.is-active .effort-track i{background:var(--lime)}
#inflate{touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;min-width:188px}

#inflate .button-symbol{transform:rotate(calc(var(--pump-pulse,0) * 45deg));transition:transform .08s}
.is-inflating .main-frog .frog-sprite{animation:none}
.is-inflating .hero-pose{transform:translateX(var(--inflate-jitter,0px)) rotateY(var(--inflate-turn,0deg));transition:none}
.is-inflating .sticker{transform:rotate(calc(11deg - var(--inflate-effort,0) * 8deg));transition:transform .08s}
.inflate-failed .sticker{background:var(--lime)}
.gas-failed b{animation:gas-refuses .22s ease-in-out 2}
@keyframes gas-refuses{25%{translate:-2px 0}75%{translate:2px 0}}
@media(max-width:700px){.inflate-feedback{max-width:none;column-gap:8px}#inflate{min-width:166px}}
@media(max-width:370px){#inflate{min-width:150px}.hero-actions{gap:9px}.hero-actions .button{gap:12px;padding:12px}}
@media(prefers-reduced-motion:reduce){.gas-failed b{animation:none}}

/* Raised button caps: lit face, solid colored edge and a short mechanical press. */
:is(.button,.social-link,.reset-pond,.back-top){
  --button-face:var(--cream);--button-edge:#bbb6a4;
  --button-light:rgba(255,255,255,.7);--button-shade:rgba(20,22,17,.16);
  --button-depth:7px;--button-offset:0px;
  border:2px solid var(--ink);border-radius:9px;
  background:linear-gradient(170deg,rgba(255,255,255,.25) 0%,rgba(255,255,255,0) 45%,rgba(0,0,0,.09) 100%),var(--button-face);
  box-shadow:inset 0 2px 0 var(--button-light),inset 0 -3px 0 var(--button-shade),
    inset 1px 0 0 rgba(255,255,255,.2),inset -1px 0 0 rgba(0,0,0,.1),
    0 var(--button-depth) 0 var(--button-edge),
    0 calc(var(--button-depth) + 1px) 0 1px var(--ink),
    0 calc(var(--button-depth) + 7px) 12px -5px rgba(20,22,17,.35);
  transform:translateY(var(--button-offset));
  transition:transform .14s cubic-bezier(.2,.8,.25,1),box-shadow .14s cubic-bezier(.2,.8,.25,1),background-color .14s;
  -webkit-tap-highlight-color:transparent;
}
.button-lime{--button-face:var(--lime);--button-edge:#74a919}
.button-outline{--button-face:var(--blue);--button-edge:#0c60b0;--button-light:rgba(192,228,255,.5)}
.button-dark,.coming-soon .social-link{--button-face:#252a21;--button-edge:#090c07;--button-light:rgba(255,255,255,.2);--button-shade:rgba(0,0,0,.4);color:var(--cream);text-shadow:0 -1px 0 #000}
.coming-soon .social-link{--button-edge:#0965af}
.reset-pond{--button-depth:5px;font-size:11px}
.reset-pond:hover{--button-face:var(--lime)}
.back-top{--button-face:var(--blue);--button-edge:#0c60b0;--button-depth:5px;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px}
.social-links{row-gap:20px}
.pond-actions{gap:20px}
@media(hover:hover) and (pointer:fine){
  :is(.button,.social-link,.reset-pond,.back-top):not(:disabled):hover{--button-offset:-2px;--button-depth:9px}
  :is(.reset-pond,.back-top):hover{--button-depth:7px}
}
:is(.button,.social-link,.reset-pond,.back-top):not(:disabled):active,
#inflate[aria-busy="true"],.release-flies.is-feeding{
  --button-offset:5px;--button-depth:2px;
  transition-duration:.06s;
}
:is(.reset-pond,.back-top):not(:disabled):active{--button-offset:4px;--button-depth:1px}
.button:disabled:not(.is-feeding){--button-offset:3px;--button-depth:4px;cursor:default}
:is(.button,.social-link,.reset-pond,.back-top):focus-visible{outline:3px dashed var(--ink);outline-offset:11px}
@media(prefers-reduced-motion:reduce){:is(.button,.social-link,.reset-pond,.back-top){transition:none}}

/* Shallow letter relief keeps the hero crisp at both phone and desktop sizes. */
.nav .brand{
  text-shadow:0 -.5px 0 rgba(255,255,255,.16),
    .025em .03em 0 #124667,.05em .06em .035em rgba(7,49,82,.25);
}
.nav .brand>span{text-shadow:none}
#hero-title{
  text-shadow:0 -.006em 0 rgba(255,255,255,.18),
    .01em .014em 0 #123e55,.021em .028em 0 #103950,
    .027em .045em .035em rgba(6,47,77,.25);
}
#hero-title>span{
  text-shadow:0 -.006em 0 rgba(255,255,255,.55),
    .01em .014em 0 #dedfce,.021em .028em 0 #bdc5b7,
    .027em .045em .035em rgba(6,47,77,.23);
}
.hero-copy .eyebrow>span:not(.tiny-tag){
  text-shadow:0 -.4px 0 rgba(255,255,255,.18),.5px .8px .5px rgba(6,47,77,.23);
}
.hero-copy .tiny-tag{text-shadow:0 -.4px 0 rgba(255,255,255,.28),.5px .8px 0 #89947e}
.hero-copy .intro{text-shadow:0 -.35px 0 rgba(255,255,255,.16),0 .7px .6px rgba(6,47,77,.15)}
