/* Emerald liquid, clipped inside the CTA; no filters or full-screen repaint. */
.liquid-cta {
  --magnet-x: 0px; --magnet-y: 0px; --light-x: 35%; --light-y: 20%;
  position: relative; isolation: isolate; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: space-between;
  min-width: 246px; min-height: 70px; padding: 12px 14px 12px 28px; gap: 35px;
  border: 1px solid #b7f5a65c; border-radius: 999px;
  color: #edf8e9; background: #09130de8;
  box-shadow: inset 0 1px 0 #e4ffdf24, 0 8px 40px #0004, 0 0 25px #60d88a0d;
  transform: translate3d(var(--magnet-x), var(--magnet-y), 0);
  transition: transform .45s cubic-bezier(.2,.8,.2,1), border-color .4s, box-shadow .4s, color .4s;
  -webkit-tap-highlight-color: transparent;
}
.liquid-surface { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; pointer-events: none; z-index: -1; }
.liquid-wave {
  position: absolute; width: 360px; height: 360px; left: -70px; top: 40px;
  border-radius: 43% 47% 39% 44%;
  background: linear-gradient(140deg,#bcf7a9e6 5%,#60c27dcc 55%,#154c37);
  box-shadow: 0 -3px 10px #beffca33;
  animation: liquid-turn 9s linear infinite paused;
  transition: top 1s cubic-bezier(.16,1,.3,1);
}
.liquid-wave-back { left: 35px; top: 43px; opacity: .35; border-radius: 42% 39% 48% 43%; background: #8df7b5; animation-direction: reverse; animation-duration: 12s; }
.liquid-shine { position: absolute; inset: 0; background: radial-gradient(ellipse at var(--light-x) var(--light-y),#f0ffe528,transparent 58%),linear-gradient(115deg,transparent 12%,#dcffcf18 45%,transparent 65%); }
.liquid-ripple { position: absolute; left: var(--touch-x,50%); top: var(--touch-y,50%); width: 10px; height: 10px; border-radius: 50%; background: #e1ffd8; opacity: 0; transform: translate(-50%,-50%) scale(0); }
.cta-label { position: relative; display: block; height: 18px; overflow: hidden; font-size: 12px; line-height: 18px; font-weight: 500; letter-spacing: .02em; }
.cta-label>span { display: block; transition: transform .55s cubic-bezier(.2,.8,.2,1); }
.cta-label>span+span { color: #071b12; }
.cta-orbit { display: grid; place-items: center; width: 43px; height: 43px; flex-shrink: 0; border: 1px solid #d3ffcb45; border-radius: 50%; color: #c5f9b4; background: #08190e40; overflow: hidden; transition: background .4s,color .4s,border-color .4s; }
.liquid-cta .arrow-icon { width: 20px; height: 20px; transition: transform .55s cubic-bezier(.2,.8,.2,1); }
.chapter.active .liquid-wave { animation-play-state: running; }
.liquid-cta:focus-visible { outline: 2px solid #d0ffc1; outline-offset: 6px; border-color: #c2fbae; }
.liquid-cta:focus-visible .liquid-wave,.liquid-cta.is-pressing .liquid-wave { top: -115px; }
.liquid-cta:focus-visible .cta-label>span,.liquid-cta.is-pressing .cta-label>span { transform: translateY(-18px); }
.liquid-cta:focus-visible .cta-orbit,.liquid-cta.is-pressing .cta-orbit { color: #102b1a; background: #e8ffcf88; border-color: #183f2630; }
.liquid-cta.is-pressing .liquid-ripple { animation: liquid-ripple .65s ease-out; }
@media(hover:hover) and (pointer:fine) {
  .liquid-cta:hover { background: #09130de8; border-color: #bcf7a9; box-shadow: inset 0 1px 0 #fff5,0 12px 45px #0005,0 0 35px #71dc8d22; }
  .liquid-cta:hover .liquid-wave { top: -115px; }
  .liquid-cta:hover .cta-label>span { transform: translateY(-18px); }
  .liquid-cta:hover .cta-orbit { color: #102b1a; background: #e8ffcf88; border-color: #183f2630; }
  .liquid-cta:hover .arrow-icon { transform: translate(2px,-2px); }
}
@keyframes liquid-turn { to { transform: rotate(360deg); } }
@keyframes liquid-ripple { 0% { opacity: .5; transform: translate(-50%,-50%) scale(0); } 100% { opacity: 0; transform: translate(-50%,-50%) scale(50); } }
@media(max-width:720px) { .liquid-cta { min-width: 232px; min-height: 66px; padding-left: 26px; gap: 30px; } .cta-label { font-size: 11px; } .cta-orbit { width: 39px; height: 39px; } }
body.static .liquid-cta .liquid-wave { animation-play-state: paused; }
@media(prefers-reduced-motion:reduce) { .liquid-cta { transform: none; } .liquid-cta * { animation: none!important; transition: none!important; } .liquid-wave { top: 54px!important; } .liquid-cta .cta-label>span { transform: none!important; } }
/* Keep the resting wave below the label; a thin glint travels over the glass. */
.liquid-wave{top:62px;border-radius:47% 48% 46% 49%}.liquid-wave-back{top:65px}
.liquid-shine::after{content:'';position:absolute;inset:-100% -60%;background:linear-gradient(110deg,transparent 42%,#e9ffdf1c 49%,transparent 56%);transform:translateX(-40%);animation:liquid-glint 5s ease-in-out infinite paused}
.chapter.active .liquid-shine::after{animation-play-state:running}
@keyframes liquid-glint{0%,15%{transform:translateX(-40%)}65%,100%{transform:translateX(40%)}}
body.static .liquid-shine::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.liquid-shine::after{animation:none!important}}