:root{--blue:#2a6fc9;--blue-dark:#1b3f73;--blue-soft:#e3f1fc;--sky:#bfe2f7;--yellow:#f6b81a;--orange:#f5a332;--green:#43a047;--bg:#f6f9fd;--white:#fff;--font:"Nunito", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;--touch-min:48px;--shadow:0 6px 18px #1b3f7329}*,:before,:after{box-sizing:border-box}html,body{margin:0}body{font-family:var(--font);color:var(--blue-dark);background:var(--bg);font-size:1.25rem;font-weight:700;line-height:1.5}.stage{background:linear-gradient(180deg, #fff 0%, var(--bg) 60%, #eaf4fc 100%);width:100%;height:100dvh;position:relative;overflow:hidden}.waves{pointer-events:none;width:100%;height:90px;position:absolute;left:0}.waves--top{top:0}.waves--bottom{bottom:0}.canvas-holder{position:absolute;inset:0}.canvas-holder canvas{touch-action:manipulation;width:100%;height:100%;display:block}.topbar{z-index:2;padding:12px 16px;padding-top:max(12px, env(safe-area-inset-top));justify-content:space-between;align-items:center;gap:12px;display:flex;position:absolute;top:0;left:0;right:0}.brand{align-items:center;gap:8px;display:flex}.brand__logo{width:48px;height:44px}.brand__name{text-transform:uppercase;color:var(--blue-dark);font-size:1.05rem;font-weight:900;line-height:1.05}.btn-skip{min-height:56px;min-width:var(--touch-min);border:3px solid var(--blue);background:var(--white);color:var(--blue);font:inherit;box-shadow:var(--shadow);cursor:pointer;border-radius:999px;align-items:center;gap:8px;padding:0 22px;font-size:1.25rem;font-weight:800;transition:transform .15s,opacity .3s;display:inline-flex}.btn-skip svg{width:26px;height:26px}.btn-skip:active{transform:scale(.95)}.btn-skip:focus-visible{outline:4px solid var(--yellow);outline-offset:3px}.btn-skip[hidden]{display:none}.stage-bottom{z-index:2;padding:0 16px max(24px, env(safe-area-inset-bottom));text-align:center;pointer-events:none;display:grid;position:absolute;bottom:0;left:0;right:0}.hero-copy,.game-panel{pointer-events:auto;grid-area:1/1;align-self:end;transition:opacity .3s,visibility .3s}.game-panel,.stage[data-mode=intro] .hero-copy,.stage[data-mode=game] .hero-copy{visibility:hidden;opacity:0}.stage[data-mode=game] .game-panel{visibility:visible;opacity:1}.game-panel{grid-template-columns:auto auto;justify-content:center;align-items:center;gap:12px 20px;display:grid}.game-picture{background:var(--white);width:112px;height:112px;box-shadow:var(--shadow);border-radius:50%;place-items:center;display:grid}.game-picture__emoji{font-size:64px;line-height:1}.game-listen.is-inviting{animation:1.1s ease-in-out infinite invite}@keyframes invite{50%{transform:scale(1.12);box-shadow:0 0 0 10px #2a6fc940}}.game-progress{grid-column:1/-1;justify-content:center;gap:10px;margin:0;padding:0;list-style:none;display:flex}.game-progress li{background:var(--sky);border-radius:50%;width:14px;height:14px;transition:background .3s,transform .3s}.game-progress li.is-current{background:var(--blue);transform:scale(1.25)}.game-progress li.is-done{background:var(--green)}.hand-hint{z-index:3;pointer-events:none;position:absolute;top:0;left:0}.hand-hint[hidden]{display:none}.hand-hint span{filter:drop-shadow(0 4px 6px #1b3f734d);font-size:56px;line-height:1;animation:.9s ease-in-out infinite tap;display:block;transform:translate(-50%,4px)}@keyframes tap{50%{transform:translate(-50%,18px)scale(.92)}}.hero-copy__title{max-width:14em;margin:0 auto;font-size:1.85rem;font-weight:900;line-height:1.15}.hl{color:var(--blue)}.hero-copy__sub{max-width:22em;margin:8px auto 16px;font-size:1.1rem;font-weight:700}.hero-copy__actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;display:flex}.btn--play{flex:1;max-width:300px;min-height:72px;font-size:1.45rem;font-weight:900}.btn--play svg{width:30px;height:30px}.btn--secondary{border:3px solid var(--blue);background:var(--white);max-width:384px;min-height:52px;color:var(--blue);flex-basis:100%}.btn{min-height:56px;font:inherit;cursor:pointer;border-radius:999px;justify-content:center;align-items:center;gap:10px;padding:0 28px;font-size:1.2rem;font-weight:800;text-decoration:none;transition:transform .15s;display:inline-flex}.btn svg{flex:none;width:26px;height:26px}.btn:active{transform:scale(.96)}.btn:focus-visible,.btn-speak:focus-visible{outline:4px solid var(--yellow);outline-offset:3px}.btn--primary{background:var(--blue);color:var(--white);border:0;box-shadow:0 6px 16px #2a6fc959}.btn-speak{background:var(--blue);width:52px;height:52px;color:var(--white);cursor:pointer;border:0;border-radius:14px;flex:none;place-items:center;transition:transform .15s;display:inline-grid}.btn-speak svg{width:28px;height:28px}.btn-speak:active{transform:scale(.92)}.btn-speak.is-speaking{animation:.8s ease-in-out infinite alternate pulse}.btn-speak[hidden]{display:none}.btn-speak--lg{border-radius:20px;width:72px;height:72px}.btn-speak--lg svg{width:38px;height:38px}@keyframes pulse{to{transform:scale(1.1);box-shadow:0 0 0 8px #f6b81a73}}.section{padding:56px 0}.section--tint{background:var(--blue-soft)}.container{max-width:640px;margin:0 auto;padding:0 16px}.container--wide{max-width:1040px}.section__title{margin:0 0 24px;font-size:2rem;font-weight:900;line-height:1.15}.section__title .light{color:var(--blue);font-size:1.25rem;font-weight:800;display:block}.section__title--inverse{color:var(--white)}.card{background:var(--white);box-shadow:var(--shadow);border-radius:20px;align-items:flex-start;gap:14px;padding:18px 16px;display:flex}.card__body{flex:1;min-width:0}.card__body h3,.card__body h4{margin:0 0 4px;font-size:1.25rem;font-weight:900;line-height:1.25}.card__body p{margin:0;font-size:1.1rem;font-weight:600}.card__body p+p{margin-top:10px}.card__kicker{color:var(--blue);font-size:.95rem;font-weight:800;display:block}.card--intro .card__body p{font-size:1.2rem}.code{background:var(--blue-soft);letter-spacing:.08em;border-radius:6px;padding:0 6px}.card--grid{grid-template-columns:auto 1fr auto;align-items:center;column-gap:14px;display:grid}.card--no-icon{grid-template-columns:1fr auto}.card__head{margin:0}.card__head h4{margin:0;font-size:1.25rem;font-weight:900;line-height:1.25}.card__text{grid-column:1/-1;margin:12px 0 0;font-size:1.1rem;font-weight:600}.card--intro .card__head,.card--intro .card__text{font-size:1.2rem;font-weight:600}.icon-circle{width:56px;height:56px;color:var(--white);border-radius:50%;flex:none;place-items:center;display:inline-grid}.icon-circle svg{width:28px;height:28px}.icon-circle--lg{width:72px;height:72px}.icon-circle--lg svg{width:36px;height:36px}.icon-circle--blue{background:var(--blue)}.icon-circle--orange{background:var(--orange);color:var(--blue-dark)}.icon-circle--yellow{background:var(--yellow);color:var(--blue-dark)}.icon-circle--green{background:var(--green)}.icon-circle--sky{background:var(--sky);color:var(--blue-dark)}.chips{gap:10px;margin:20px 0 0;padding:0;list-style:none;display:grid}.chip{background:var(--blue-soft);border-radius:999px;align-items:center;gap:12px;min-height:56px;padding:8px 18px;font-size:1.1rem;font-weight:800;display:flex}.chip svg{width:26px;height:26px;color:var(--blue);flex:none}.tracks{gap:36px;display:grid}.track__title{align-items:center;gap:10px;margin:0 0 14px;font-size:1.5rem;font-weight:900;display:flex}.track__title svg{width:30px;height:30px;color:var(--blue)}.steps{gap:14px;margin:0;padding:0;list-style:none;display:grid}.grid-3,.grid-2{gap:16px;display:grid}.card--stack{text-align:center;flex-direction:column;align-items:center;padding:24px 18px}.card--stack .card__body{flex:none}.feature{align-items:flex-start;gap:14px;display:flex}.feature h3{margin:4px 0 2px;font-size:1.2rem;font-weight:900}.feature p{margin:0;font-size:1.1rem;font-weight:600}.note{border:3px dashed var(--sky);background:var(--white);border-radius:20px;margin-top:28px;padding:18px 16px}.note h3{margin:0;font-size:1.2rem;font-weight:900}.section--download{background:var(--blue-dark);color:var(--white);text-align:center}.badge{background:var(--yellow);color:var(--blue-dark);border-radius:999px;align-items:center;gap:8px;margin-bottom:14px;padding:6px 16px;font-size:1rem;font-weight:900;display:inline-flex}.badge__dot{background:var(--blue-dark);border-radius:50%;width:10px;height:10px;animation:1.4s ease-in-out infinite blink}@keyframes blink{50%{opacity:.25}}.lead{margin:0 0 28px;font-size:1.2rem;font-weight:600}.download-row{justify-content:center;align-items:center;gap:12px;margin-bottom:16px;display:flex}.btn--download{white-space:nowrap;max-width:340px;min-height:80px;color:var(--white);background:#2e7d32;flex:1;gap:8px;padding:0 18px;font-size:1.4rem;font-weight:900;box-shadow:0 8px 22px #0000004d}.btn--download svg{width:34px;height:34px}.section--download .btn-speak{background:var(--white);color:var(--blue)}.btn__label{flex-direction:column;align-items:flex-start;line-height:1.1;display:flex}.btn__label small{opacity:.95;font-size:.95rem;font-weight:700}.install{text-align:left;background:#ffffff1a;border-radius:20px;margin-top:28px;padding:18px 16px}.install__head{justify-content:space-between;align-items:center;gap:12px;display:flex}.install__head h3{margin:0;font-size:1.35rem;font-weight:900}.install__steps{margin:12px 0 0;padding-left:1.4em;font-size:1.1rem;font-weight:600}.install__steps li+li{margin-top:8px}.install__note{opacity:.9;margin:14px 0 0;font-size:1rem;font-weight:600}.small{opacity:.9;margin:18px 0 0;font-size:1rem;font-weight:700}.tech{color:var(--blue);align-items:center;gap:8px;display:flex}.tech svg{flex:none;width:24px;height:24px}.team__title{margin:28px 0 12px;font-size:1.35rem;font-weight:900}.team{flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;display:flex}.team li{background:var(--blue-soft);border-radius:20px;padding:8px 18px;font-weight:800}.footer{padding:32px 16px max(32px, env(safe-area-inset-bottom));background:var(--sky);text-align:center;font-size:1rem}.footer p{margin:2px 0}.footer__logo{width:56px;height:50px}@media (width<=480px) and (height<=860px){.hero-copy__sub{display:none}.hero-copy__title{margin-bottom:14px}}@media (width>=720px){.hero-copy__title{font-size:2.6rem}.chips{grid-template-columns:1fr 1fr}.grid-2{grid-template-columns:1fr 1fr;gap:28px 32px}.section{padding:80px 0}.section__title{font-size:2.6rem}}@media (width>=960px){.tracks{grid-template-columns:1fr 1fr;gap:32px}.grid-3{grid-template-columns:repeat(3,1fr)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
