.button-hints-module__rYoaiW__root{--ink:#e3ded2;--disc:#e3ded2;--disc-ink:#0b0a09;--ring:#000;--banner:#000;--dim:#343130;--dim-ink:#7a7772;--plate:#35332f;--key:#e1ded2;--key-ink:#12100e;--bubble:#292723;--flash:#fff;--edge:#0000;--burst:#1b1a18;--focus:#1b1a18;--chip:#0000000d;--chip-line:#00000024;--chip-ink:#0000009e;--u:var(--hints-unit,min(1px, calc((100cqi - 32px) / 664)));isolation:isolate;box-sizing:border-box;width:100%;color:var(--ink);-webkit-tap-highlight-color:transparent;outline:none;align-content:center;justify-items:center;gap:20px;padding:24px 16px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;display:grid;position:relative;container-type:inline-size}@supports (color:light-dark(#fff, #000)){.button-hints-module__rYoaiW__root{--edge:light-dark(#0000,#ffffff24);--burst:light-dark(#1b1a18,#fff);--focus:light-dark(#1b1a18,#fff);--chip:light-dark(#0000000d,#ffffff12);--chip-line:light-dark(#00000024,#ffffff29);--chip-ink:light-dark(#0000009e,#ffffffb3)}}.button-hints-module__rYoaiW__root[data-color-scheme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.button-hints-module__rYoaiW__root[data-color-scheme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.button-hints-module__rYoaiW__root[data-color-scheme=system]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){.button-hints-module__rYoaiW__root[data-color-scheme=system]{--lightningcss-light: ;--lightningcss-dark:initial}}.button-hints-module__rYoaiW__root:focus-visible{box-shadow:inset 0 0 0 2px var(--focus);border-radius:12px}.button-hints-module__rYoaiW__fit{place-items:center;display:grid}.button-hints-module__rYoaiW__hud{width:calc(664 * var(--u));height:calc(270 * var(--u));font-size:calc(28 * var(--u));-webkit-user-select:none;user-select:none;line-height:1;position:relative}.button-hints-module__rYoaiW__face,.button-hints-module__rYoaiW__shoulder,.button-hints-module__rYoaiW__stick{color:inherit;font:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;margin:0;padding:0}.button-hints-module__rYoaiW__cluster{left:calc(332 * var(--u));top:calc(166 * var(--u));width:0;height:0;position:absolute}.button-hints-module__rYoaiW__clover{left:calc(-80 * var(--u));top:calc(-80 * var(--u));width:calc(160 * var(--u));height:calc(160 * var(--u));position:absolute;overflow:visible}.button-hints-module__rYoaiW__dim{fill:var(--dim)}.button-hints-module__rYoaiW__knock{transform-box:fill-box;transform-origin:50%;transition:scale .2s cubic-bezier(.4,0,.6,1);scale:0}.button-hints-module__rYoaiW__knock[data-on]{transition:scale .32s cubic-bezier(.3,1.5,.5,1);scale:1}.button-hints-module__rYoaiW__face{--x:0;--y:0;z-index:2;left:calc((var(--x) * 39 - 30) * var(--u));top:calc((var(--y) * 39 - 30) * var(--u));width:calc(60 * var(--u));height:calc(60 * var(--u));border-radius:50%;place-items:center;display:grid;position:absolute}.button-hints-module__rYoaiW__face[data-face=x]{--y:-1}.button-hints-module__rYoaiW__face[data-face=y]{--x:-1}.button-hints-module__rYoaiW__face[data-face=a]{--x:1}.button-hints-module__rYoaiW__face[data-face=b]{--y:1}.button-hints-module__rYoaiW__face:focus-visible{outline:2px solid var(--focus);outline-offset:calc(9 * var(--u))}.button-hints-module__rYoaiW__face>*{grid-area:1/1}.button-hints-module__rYoaiW__dimLetter{color:var(--dim-ink);font-size:calc(30 * var(--u));font-weight:500;transition:opacity .12s,color 90ms}.button-hints-module__rYoaiW__face[data-on] .button-hints-module__rYoaiW__dimLetter{opacity:0}.button-hints-module__rYoaiW__press{background:var(--flash);opacity:0;border-radius:50%;width:100%;height:100%;transition:opacity .22s ease-out,scale .3s cubic-bezier(.3,1.5,.5,1);scale:1}.button-hints-module__rYoaiW__face:not([data-on])[data-held] .button-hints-module__rYoaiW__press{opacity:.12;transition-duration:60ms;scale:.92}.button-hints-module__rYoaiW__face:not([data-on])[data-held] .button-hints-module__rYoaiW__dimLetter{color:var(--ink)}.button-hints-module__rYoaiW__chip{width:calc(70 * var(--u));height:calc(70 * var(--u));background:var(--ring);box-shadow:0 0 0 calc(1.5 * var(--u)) var(--edge);opacity:0;border-radius:50%;place-items:center;transition:scale .18s cubic-bezier(.4,0,.6,1),opacity .14s ease-in;display:grid;scale:.857}.button-hints-module__rYoaiW__face[data-on] .button-hints-module__rYoaiW__chip{opacity:1;transition:scale .32s cubic-bezier(.3,1.5,.5,1),opacity 90ms ease-out;scale:1}.button-hints-module__rYoaiW__face[data-on][data-held] .button-hints-module__rYoaiW__chip{transition:scale 60ms ease-out;scale:.88}.button-hints-module__rYoaiW__disc{width:calc(42 * var(--u));height:calc(42 * var(--u));background:var(--disc);color:var(--disc-ink);font-size:calc(29 * var(--u));border-radius:50%;place-items:center;font-weight:700;transition:background-color .24s,box-shadow .24s;display:grid}.button-hints-module__rYoaiW__face[data-held] .button-hints-module__rYoaiW__disc{background:var(--flash);box-shadow:0 0 calc(14 * var(--u)) #ffffffbf;transition-duration:40ms}.button-hints-module__rYoaiW__burst{width:calc(70 * var(--u));height:calc(70 * var(--u));box-sizing:border-box;border:calc(3 * var(--u)) solid var(--burst);opacity:0;pointer-events:none;border-radius:50%;animation:.46s cubic-bezier(.2,.7,.3,1) button-hints-module__rYoaiW__burst}.button-hints-module__rYoaiW__banner{z-index:1;box-sizing:border-box;white-space:nowrap;pointer-events:none;clip-path:var(--closed);align-items:center;transition:clip-path .16s cubic-bezier(.4,0,1,1);display:flex;position:absolute}.button-hints-module__rYoaiW__banner[data-on]{clip-path:inset(0);transition:clip-path .28s cubic-bezier(.2,.8,.2,1) 70ms}.button-hints-module__rYoaiW__banner[data-face=x],.button-hints-module__rYoaiW__banner[data-face=b]{--closed:inset(0 50% 0 50%);z-index:3;left:calc(-100 * var(--u));width:calc(200 * var(--u));height:calc(38 * var(--u));background:linear-gradient(90deg, transparent, var(--banner) 27.5%, var(--banner) 72.5%, transparent);justify-content:center}.button-hints-module__rYoaiW__banner[data-face=x]{--from:0 calc(10 * var(--u));top:calc(-97 * var(--u))}.button-hints-module__rYoaiW__banner[data-face=b]{--from:0 calc(-10 * var(--u));top:calc(59 * var(--u))}.button-hints-module__rYoaiW__banner[data-face=y],.button-hints-module__rYoaiW__banner[data-face=a]{top:calc(-20 * var(--u));width:calc(183 * var(--u));height:calc(40 * var(--u))}.button-hints-module__rYoaiW__banner[data-face=y]{--closed:inset(0 0 0 100%);--from:calc(14 * var(--u)) 0;left:calc(-222 * var(--u));padding-right:calc(40 * var(--u));background:linear-gradient(90deg, transparent, var(--banner) 62%);justify-content:flex-end}.button-hints-module__rYoaiW__banner[data-face=a]{--closed:inset(0 100% 0 0);--from:calc(-14 * var(--u)) 0;left:calc(39 * var(--u));padding-left:calc(40 * var(--u));background:linear-gradient(270deg, transparent, var(--banner) 62%)}.button-hints-module__rYoaiW__word,.button-hints-module__rYoaiW__shoulderWord{letter-spacing:-.01em;opacity:0;translate:var(--from,0 0);font-style:italic;font-weight:500;transition:opacity .12s,translate .16s cubic-bezier(.4,0,1,1);display:block}.button-hints-module__rYoaiW__banner[data-on] .button-hints-module__rYoaiW__word,.button-hints-module__rYoaiW__shoulder[data-on] .button-hints-module__rYoaiW__shoulderWord{opacity:1;transition:opacity .2s .15s,translate .3s cubic-bezier(.2,.9,.3,1.2) .15s;animation:.22s ease-out button-hints-module__rYoaiW__word;translate:0}.button-hints-module__rYoaiW__wordHit{display:block}.button-hints-module__rYoaiW__wordHit[data-hit]{animation:.38s cubic-bezier(.2,.8,.3,1) button-hints-module__rYoaiW__hit}.button-hints-module__rYoaiW__shoulder{z-index:1;height:calc(44 * var(--u));border-radius:calc(8 * var(--u));opacity:0;visibility:hidden;translate:var(--away) 0;align-items:center;transition:opacity .14s,translate .18s cubic-bezier(.4,0,1,1),visibility 0s .18s;display:flex;position:absolute}.button-hints-module__rYoaiW__shoulder[data-on]{opacity:1;visibility:visible;transition:opacity .18s,translate .34s cubic-bezier(.2,.9,.3,1.15),visibility;translate:0}.button-hints-module__rYoaiW__shoulder[data-side=left]{--away:calc(-16 * var(--u));--from:calc(-10 * var(--u)) 0}.button-hints-module__rYoaiW__shoulder[data-side=right]{--away:calc(16 * var(--u));--from:calc(10 * var(--u)) 0;flex-direction:row-reverse}.button-hints-module__rYoaiW__shoulder[data-button=l]{left:calc(47 * var(--u));top:0}.button-hints-module__rYoaiW__shoulder[data-button=zl]{left:calc(16 * var(--u));top:calc(64 * var(--u))}.button-hints-module__rYoaiW__shoulder[data-button=r]{right:calc(47 * var(--u));top:0}.button-hints-module__rYoaiW__shoulder[data-button=zr]{right:calc(16 * var(--u));top:calc(64 * var(--u))}.button-hints-module__rYoaiW__shoulder:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.button-hints-module__rYoaiW__cap{z-index:1;width:calc(52 * var(--u));height:calc(44 * var(--u));flex:none;position:relative;overflow:visible}.button-hints-module__rYoaiW__cap[data-wide]{width:calc(50 * var(--u))}.button-hints-module__rYoaiW__plate{fill:var(--plate);stroke:var(--plate);stroke-width:20px;stroke-linejoin:round}.button-hints-module__rYoaiW__key{fill:var(--key);stroke:var(--key);stroke-width:4px;stroke-linejoin:round;transition:fill .2s,stroke .2s}.button-hints-module__rYoaiW__keyLabel{fill:var(--key-ink);text-anchor:middle;dominant-baseline:central;font-weight:700}.button-hints-module__rYoaiW__keyMove{transition:transform .26s cubic-bezier(.3,1.5,.5,1)}.button-hints-module__rYoaiW__shoulder[data-held] .button-hints-module__rYoaiW__keyMove{transition-duration:60ms;transform:translateY(2.5px)}.button-hints-module__rYoaiW__shoulder[data-held] .button-hints-module__rYoaiW__key{fill:var(--flash);stroke:var(--flash);transition-duration:40ms}.button-hints-module__rYoaiW__shoulderBanner{box-sizing:border-box;height:calc(36 * var(--u));white-space:nowrap;align-items:center;display:flex}.button-hints-module__rYoaiW__shoulder[data-side=left] .button-hints-module__rYoaiW__shoulderBanner{margin-left:calc(-26 * var(--u));padding:0 calc(36 * var(--u)) 0 calc(30.5 * var(--u));background:linear-gradient(90deg, var(--plate), var(--plate) calc(100% - 54 * var(--u)), transparent)}.button-hints-module__rYoaiW__shoulder[data-side=right] .button-hints-module__rYoaiW__shoulderBanner{margin-right:calc(-26 * var(--u));padding:0 calc(30.5 * var(--u)) 0 calc(36 * var(--u));background:linear-gradient(270deg, var(--plate), var(--plate) calc(100% - 54 * var(--u)), transparent)}.button-hints-module__rYoaiW__combo{left:calc(56 * var(--u));top:calc(188 * var(--u));width:calc(140 * var(--u));height:calc(80 * var(--u));opacity:0;visibility:hidden;transition:opacity .14s,scale .18s cubic-bezier(.4,0,1,1),visibility 0s .18s;position:absolute;scale:.8}.button-hints-module__rYoaiW__combo[data-on]{opacity:1;visibility:visible;transition:opacity .18s,scale .34s cubic-bezier(.3,1.5,.5,1),visibility;scale:1}.button-hints-module__rYoaiW__stick{width:calc(80 * var(--u));height:calc(80 * var(--u));background:var(--bubble);border-radius:50%;place-items:center;display:grid;position:absolute;top:0;left:0}.button-hints-module__rYoaiW__stick:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.button-hints-module__rYoaiW__stickIcon{width:calc(54 * var(--u));height:calc(54 * var(--u));overflow:visible}.button-hints-module__rYoaiW__stickCap{transition:transform .3s cubic-bezier(.3,1.5,.5,1)}.button-hints-module__rYoaiW__stick[data-lean=up] .button-hints-module__rYoaiW__stickCap{transform:translateY(-3.5px)}.button-hints-module__rYoaiW__stick[data-lean=down] .button-hints-module__rYoaiW__stickCap{transform:translateY(3.5px)}.button-hints-module__rYoaiW__stick[data-lean=left] .button-hints-module__rYoaiW__stickCap{transform:translate(-3.5px)}.button-hints-module__rYoaiW__stick[data-lean=right] .button-hints-module__rYoaiW__stickCap{transform:translate(3.5px)}.button-hints-module__rYoaiW__stick[data-lean] .button-hints-module__rYoaiW__stickCap{transition-duration:90ms}.button-hints-module__rYoaiW__stickStem,.button-hints-module__rYoaiW__stickRim{fill:#b9b5aa;stroke:var(--bubble);stroke-width:2px}.button-hints-module__rYoaiW__stickTop{fill:var(--key);stroke:var(--bubble);stroke-width:2.2px}.button-hints-module__rYoaiW__stickLetter{fill:none;stroke:var(--key-ink);stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round}.button-hints-module__rYoaiW__arrow{transform-box:fill-box;transform-origin:50%;rotate:var(--turn);fill:var(--key);stroke:var(--bubble);stroke-width:2.5px;stroke-linejoin:round;paint-order:stroke;transition:filter .2s}.button-hints-module__rYoaiW__stick[data-held] .button-hints-module__rYoaiW__arrow{fill:var(--flash);filter:drop-shadow(0 0 2px #ffffffe6);transition-duration:40ms}.button-hints-module__rYoaiW__plus{left:calc(116.5 * var(--u));top:calc(35.5 * var(--u));width:calc(15 * var(--u));height:calc(15 * var(--u));background:linear-gradient(var(--key), var(--key)) center / 100% calc(2 * var(--u)) no-repeat, linear-gradient(var(--key), var(--key)) center / calc(2 * var(--u)) 100% no-repeat;position:absolute}.button-hints-module__rYoaiW__legend{color:var(--chip-ink);pointer-events:none;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin:0;font-size:12px;line-height:1;display:flex}.button-hints-module__rYoaiW__legend kbd{box-sizing:border-box;border:1px solid var(--chip-line);background:var(--chip);min-width:1.9em;font:inherit;text-align:center;border-radius:6px;padding:.4em .45em;font-weight:600;display:inline-block}.button-hints-module__rYoaiW__legendGap{width:6px}@container (max-width:479px){.button-hints-module__rYoaiW__legend{display:none}}.button-hints-module__rYoaiW__live{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:0;position:absolute;overflow:hidden}@keyframes button-hints-module__rYoaiW__burst{0%{opacity:.95;scale:.96}to{opacity:0;scale:1.5}}@keyframes button-hints-module__rYoaiW__hit{0%{color:var(--flash);text-shadow:0 0 .3em #fffc;scale:1.1}}@keyframes button-hints-module__rYoaiW__word{0%{opacity:0}}@media (prefers-reduced-motion:reduce){.button-hints-module__rYoaiW__knock,.button-hints-module__rYoaiW__knock[data-on],.button-hints-module__rYoaiW__chip,.button-hints-module__rYoaiW__face[data-on] .button-hints-module__rYoaiW__chip,.button-hints-module__rYoaiW__face[data-on][data-held] .button-hints-module__rYoaiW__chip,.button-hints-module__rYoaiW__banner,.button-hints-module__rYoaiW__banner[data-on],.button-hints-module__rYoaiW__word,.button-hints-module__rYoaiW__shoulderWord,.button-hints-module__rYoaiW__banner[data-on] .button-hints-module__rYoaiW__word,.button-hints-module__rYoaiW__shoulder[data-on] .button-hints-module__rYoaiW__shoulderWord,.button-hints-module__rYoaiW__shoulder,.button-hints-module__rYoaiW__shoulder[data-on],.button-hints-module__rYoaiW__combo,.button-hints-module__rYoaiW__combo[data-on],.button-hints-module__rYoaiW__keyMove,.button-hints-module__rYoaiW__stickCap,.button-hints-module__rYoaiW__press{transition:none}.button-hints-module__rYoaiW__face[data-on][data-held] .button-hints-module__rYoaiW__chip,.button-hints-module__rYoaiW__face:not([data-on])[data-held] .button-hints-module__rYoaiW__press{scale:1}.button-hints-module__rYoaiW__shoulder[data-held] .button-hints-module__rYoaiW__keyMove,.button-hints-module__rYoaiW__stick[data-lean] .button-hints-module__rYoaiW__stickCap{transform:none}.button-hints-module__rYoaiW__burst,.button-hints-module__rYoaiW__wordHit[data-hit],.button-hints-module__rYoaiW__banner[data-on] .button-hints-module__rYoaiW__word,.button-hints-module__rYoaiW__shoulder[data-on] .button-hints-module__rYoaiW__shoulderWord{animation:none}}