.key:where(.astro-ekguhzzh){--face:#202126;--wall:#0b0c0e;--ink-line:#000;--line-w:1.5px;--shade:#0000006b;--light:#ffffff1a;--text:var(--white);--step:2px;--drop:.45px;--grow:.00588;--rx:0deg;--ry:0deg;--press:0;--spring:cubic-bezier(.34, 1.56, .64, 1);perspective:340px;font-family:var(--font-body);letter-spacing:-.01em;color:var(--text);-webkit-tap-highlight-color:transparent;user-select:none;transition:translate .5s var(--spring);border-radius:12px;outline:none;font-size:15px;font-weight:600;display:inline-block;position:relative;translate:0}.key:where(.astro-ekguhzzh)[hidden]{display:none!important}button:where(.astro-ekguhzzh).key{cursor:pointer;background:0 0;border:0;margin:0;padding:0}.key--solid:where(.astro-ekguhzzh){--face:#efefeb;--wall:#676970;--ink-line:#0b0c0e;--shade:#0000001a;--light:#ffffffb3;--text:var(--ink)}.key-block:where(.astro-ekguhzzh){border-radius:inherit;transform-style:preserve-3d;transform:translateZ(calc(var(--press) * var(--step) * -8)) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .5s var(--spring), scale .5s var(--spring), --press .5s var(--spring);display:block;position:relative;scale:1}@media (hover:hover){.key:where(.astro-ekguhzzh):hover{z-index:1}.key:where(.astro-ekguhzzh):hover .key-block:where(.astro-ekguhzzh),.key:where(.astro-ekguhzzh).is-hover .key-block:where(.astro-ekguhzzh){scale:1.08}.key:where(.astro-ekguhzzh):hover+.key:where(.astro-ekguhzzh){translate:var(--make-room,14px) 0}.key:where(.astro-ekguhzzh):hover+.key:where(.astro-ekguhzzh)+.key:where(.astro-ekguhzzh){translate:calc(var(--make-room,14px) * .5) 0}.key:where(.astro-ekguhzzh):hover+.key:where(.astro-ekguhzzh)+.key:where(.astro-ekguhzzh)~.key:where(.astro-ekguhzzh){translate:calc(var(--make-room,14px) * .25) 0}.key:where(.astro-ekguhzzh):has(+.key:hover){translate:calc(var(--make-room,14px) * -1) 0}.key:where(.astro-ekguhzzh):has(+.key+.key:hover){translate:calc(var(--make-room,14px) * -.5) 0}.key:where(.astro-ekguhzzh):has(+.key+.key~.key:hover){translate:calc(var(--make-room,14px) * -.25) 0}.key:where(.astro-ekguhzzh).is-down .key-block:where(.astro-ekguhzzh){scale:1.04}}.key-layer:where(.astro-ekguhzzh){border-radius:inherit;background:var(--wall);transform:translate3d(0, calc(var(--i) * var(--drop) * (1 - var(--press))), calc(var(--i) * var(--step) * -1 * (1 - var(--press) * .75))) scale(calc(1 + var(--i) * var(--grow) * (1 - var(--press) * .75)));pointer-events:none;position:absolute;inset:0}.key-layer:where(.astro-ekguhzzh):nth-last-of-type(2){box-shadow:0 0 0 var(--line-w) var(--ink-line), 0 14px 22px -10px #000c}.key-face:where(.astro-ekguhzzh){white-space:nowrap;border-radius:inherit;border:var(--line-w) solid var(--ink-line);background:var(--face);align-items:center;gap:10px;padding:13px 22px;display:inline-flex;position:relative;transform:translateZ(.5px)}.key--ghost:where(.astro-ekguhzzh) .key-face:where(.astro-ekguhzzh){text-shadow:0 1px 1px #0009}.key-face:where(.astro-ekguhzzh):after{content:"";z-index:-2;border-radius:inherit;pointer-events:none;background:radial-gradient(38% 55% at var(--lx) var(--ly), var(--light) 0 35%, transparent 65%), radial-gradient(125% 150% at var(--dx) var(--dy), var(--shade) 0 38%, transparent 52%);transition:--dx .5s var(--spring), --dy .5s var(--spring), --lx .5s var(--spring), --ly .5s var(--spring);position:absolute;inset:0;box-shadow:inset 0 -2px #0000002e}.key:where(.astro-ekguhzzh).is-down{--press:1}.key:where(.astro-ekguhzzh).is-down .key-block:where(.astro-ekguhzzh){transition:transform .1s ease-out,scale .1s ease-out,--press .1s ease-out}.key-arrow:where(.astro-ekguhzzh){fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:15px;height:15px;transition:transform .45s var(--spring)}.key:where(.astro-ekguhzzh):hover .key-arrow:where(.astro-ekguhzzh){transform:translate(3px)}.key--sm:where(.astro-ekguhzzh){--step:1px;--drop:.3px;--grow:.00294;border-radius:10px;font-size:14px}.key--sm:where(.astro-ekguhzzh) .key-face:where(.astro-ekguhzzh){padding:8px 15px}.key--square:where(.astro-ekguhzzh){border-radius:7px}.key--square:where(.astro-ekguhzzh) .key-face:where(.astro-ekguhzzh){justify-content:center;width:36px;height:36px;padding:0}.key--square:where(.astro-ekguhzzh) .key-face:where(.astro-ekguhzzh) svg{width:18px;height:18px}.key:where(.astro-ekguhzzh):focus-visible .key-face:where(.astro-ekguhzzh){outline:2px solid var(--white);outline-offset:3px}@media (width<=860px){.key:where(.astro-ekguhzzh){font-size:14px}.key-face:where(.astro-ekguhzzh){padding:12px 18px}}@media (prefers-reduced-motion:reduce){.key-block:where(.astro-ekguhzzh){transition:none}}
