.hy-butterfly{position:relative;isolation:isolate;width:100%;height:100%;min-height:100%;overflow:hidden;background:#050609;color:#f4f0e8;font-family:inherit;--bf-green:#8fd24d;--bf-gold:#ffc83d}
.hy-butterfly *{box-sizing:border-box}.hy-butterfly button{font:inherit;cursor:pointer}.hy-butterfly [hidden]{display:none!important}.hy-butterfly button:focus-visible,.hy-butterfly .bf-flight:focus-visible{outline:2px solid #ffc83d;outline-offset:6px}
.hy-butterfly .bf-video,.hy-butterfly .bf-shade,.hy-butterfly .bf-trail{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.hy-butterfly .bf-video{object-fit:cover;opacity:.8}.hy-butterfly .bf-shade{background:linear-gradient(180deg,#050609c7 0%,#05060918 35%,#05060940 64%,#050609e0 100%)}.hy-butterfly .bf-trail{z-index:4}
.hy-butterfly .bf-heading{position:absolute;top:clamp(80px,12vh,130px);left:10%;right:10%;text-align:center;pointer-events:none;z-index:5}.hy-butterfly .bf-kicker{font:9px/1.5 Arial,sans-serif;letter-spacing:.35em;color:#a7a89e;margin:0 0 9px;direction:ltr}.hy-butterfly h3{font-size:clamp(20px,2.6vw,38px);font-weight:500;line-height:1.6;margin:0 0 8px;text-shadow:0 2px 18px #000}.hy-butterfly .bf-intro{max-width:690px;margin:auto;font-size:clamp(11px,1.12vw,15px);line-height:1.9;color:#d6d0c4;text-wrap:balance}
.hy-butterfly .bf-flight{position:absolute;inset:0;z-index:3;touch-action:none;outline-offset:-7px!important}.hy-butterfly .bf-flight:focus:not(:focus-visible){outline:none}.hy-butterfly .bf-words{position:absolute;left:8%;right:8%;top:44%;min-height:72px;display:flex;flex-wrap:wrap;gap:12px 22px;justify-content:center;align-items:center;text-align:center;max-width:1100px;margin:auto}.hy-butterfly .bf-word{position:relative;display:inline-flex;justify-content:center;align-items:center;padding:6px 10px;background:transparent;border:0;border-bottom:1px solid #d6d0c422;border-radius:4px;color:#b1b6a8;opacity:1;font-size:clamp(23px,3.3vw,52px);font-weight:500;line-height:1.8;transition:color .7s,border-color .7s,text-shadow .7s;white-space:normal;text-wrap:balance;text-shadow:0 2px 20px #000,0 0 calc(22px * var(--bf-charge,0)) #8fd24d88;filter:brightness(calc(.8 + var(--bf-charge,0)*.2))}.hy-butterfly .bf-word:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:1px;background:var(--bf-green);box-shadow:0 0 16px #8fd24d88;transform:scaleX(var(--bf-charge,0));transition:transform .05s;transform-origin:center}.hy-butterfly .bf-word.is-lit{color:#b7ef79;border-color:#8fd24d66;text-shadow:0 0 25px #8fd24d77,0 0 70px #8fd24d33,0 2px 16px #000}.hy-butterfly.bf-is-letters .bf-words{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,5vw,72px);max-width:900px}.hy-butterfly.bf-is-letters .bf-word{font-size:clamp(48px,9vw,140px);min-width:0;padding-inline:clamp(2px,1vw,10px);line-height:1.35;color:#d6d0c4}.hy-butterfly.bf-is-letters .bf-word.is-lit{color:#b7ff2a;text-shadow:0 0 30px #8fd24d88,0 0 95px #8fd24d44}
.hy-butterfly .bf-fly{position:absolute;top:0;left:0;width:83px;height:68px;pointer-events:none;will-change:transform;filter:drop-shadow(0 0 10px #8fd24d88) drop-shadow(0 0 26px #ffc83d55)}.hy-butterfly .bf-fly svg{width:100%;height:100%;overflow:visible}.hy-butterfly .bf-wing{fill:url(#bf-wing-g);fill-opacity:.72;stroke:#e9f7c8;stroke-width:.65;transform-origin:50px 40px;animation:bf-flutter .72s ease-in-out infinite alternate}.hy-butterfly .bf-wing-right{animation-delay:-.06s}.hy-butterfly .bf-body{fill:none;stroke:#e8f7c8;stroke-width:1.5;stroke-linecap:round}
.hy-butterfly .bf-bottom{position:absolute;z-index:6;left:8%;right:8%;bottom:max(23px,env(safe-area-inset-bottom,0px));text-align:center;pointer-events:none}.hy-butterfly .bf-status{font-size:clamp(12px,1.3vw,17px);line-height:1.85;max-width:780px;margin:0 auto 14px;color:#f4f0e8;text-wrap:balance;text-shadow:0 2px 16px #000}.hy-butterfly .bf-next{pointer-events:auto;color:#0a0a0c;border:1px solid #f4f0e8;background:#f4f0e8;border-radius:99px;padding:11px 26px;font-size:13px;line-height:1.6;margin:0 0 16px;box-shadow:0 8px 35px #0004}.hy-butterfly .bf-instructions p{margin:3px 0;color:#c4c4b7;font-size:11px;line-height:1.8;text-wrap:balance}.hy-butterfly .bf-instructions .bf-accessible{font-size:10px;color:#989a8c}.hy-butterfly .bf-skip,.hy-butterfly .bf-replay{position:absolute;z-index:7;bottom:24px;background:#0a0a0c66;color:#b7b8aa;border:1px solid #f4f0e825;border-radius:99px;padding:7px 12px;font-size:10px;line-height:1.5}.hy-butterfly .bf-skip{left:22px}.hy-butterfly .bf-replay{right:22px}.hy-butterfly .bf-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes bf-flutter{from{transform:scaleX(.34) rotate(-2deg)}to{transform:scaleX(1) rotate(2deg)}}
@media(max-width:650px){.hy-butterfly .bf-heading{left:8%;right:8%;top:94px}.hy-butterfly h3{font-size:22px}.hy-butterfly .bf-intro{font-size:11px}.hy-butterfly .bf-words{top:40%;gap:10px 12px;left:6%;right:6%}.hy-butterfly .bf-word{font-size:25px;line-height:1.9;padding:5px 7px}.hy-butterfly.bf-is-letters .bf-words{top:42%;gap:clamp(10px,3vw,20px)}.hy-butterfly.bf-is-letters .bf-word{font-size:clamp(44px,13vw,74px);min-width:0;padding-inline:4px}.hy-butterfly .bf-bottom{left:9%;right:9%;bottom:75px}.hy-butterfly .bf-status{font-size:13px;margin-bottom:11px}.hy-butterfly .bf-next{font-size:12px;padding:9px 20px;margin-bottom:12px}.hy-butterfly .bf-instructions p{font-size:10px}.hy-butterfly .bf-instructions .bf-accessible{font-size:9px}.hy-butterfly .bf-skip,.hy-butterfly .bf-replay{bottom:22px;font-size:9px}.hy-butterfly .bf-skip{left:14px}.hy-butterfly .bf-replay{right:14px}.hy-butterfly .bf-fly{width:70px;height:58px}}
@media(max-width:350px){.hy-butterfly .bf-heading{top:83px}.hy-butterfly h3{font-size:20px}.hy-butterfly .bf-words{top:41%;gap:6px}.hy-butterfly .bf-word{font-size:22px}.hy-butterfly.bf-is-letters .bf-words{gap:10px}.hy-butterfly.bf-is-letters .bf-word{font-size:clamp(42px,14vw,50px)}.hy-butterfly .bf-bottom{bottom:68px}.hy-butterfly .bf-status{font-size:12px}.hy-butterfly .bf-instructions .bf-accessible{display:none}}
@media(orientation:landscape) and (max-height:520px){.hy-butterfly .bf-heading{top:58px;left:15%;right:15%}.hy-butterfly .bf-kicker{display:none}.hy-butterfly h3{font-size:19px;margin:0}.hy-butterfly .bf-intro{font-size:10px;line-height:1.5;max-width:650px}.hy-butterfly .bf-words{top:39%;gap:8px 17px}.hy-butterfly .bf-word{font-size:26px;line-height:1.5;padding:1px 6px}.hy-butterfly.bf-is-letters .bf-words{top:37%;gap:clamp(12px,5vw,60px)}.hy-butterfly.bf-is-letters .bf-word{font-size:65px;line-height:1.2}.hy-butterfly .bf-bottom{bottom:18px;left:22%;right:22%}.hy-butterfly .bf-status{font-size:11px;margin-bottom:7px;line-height:1.6}.hy-butterfly .bf-next{font-size:10px;padding:6px 16px;margin-bottom:6px}.hy-butterfly .bf-instructions p{font-size:9px;line-height:1.5}.hy-butterfly .bf-instructions .bf-accessible{display:none}.hy-butterfly .bf-skip,.hy-butterfly .bf-replay{bottom:17px;font-size:9px}.hy-butterfly .bf-fly{width:65px;height:54px}}
@media(prefers-reduced-motion:reduce){.hy-butterfly .bf-wing{animation:none}.hy-butterfly .bf-word{transition:none}.hy-butterfly .bf-video{opacity:.5}}

.hy-butterfly.bf-is-reading .bf-fly{width:42px;height:35px;opacity:.75}
