.keyboard-hero-module__qkzdFW__hero{--key-shell:#3a4044;--keycap-top:#fffffc;--keycap-bottom:#f0f3f5;--keycap-pressed-top:#f8fafa;--keycap-pressed-bottom:#e5e9eb;--keycap-edge:#c3c8cb;--keycap-edge-highlight:#fffffff2;--keycap-pressed-edge:#adb4b9bf;--keycap-pressed-edge-highlight:#fff9;--key-highlight:#ffffffd1;--key-grain:#2f34380d;--key-legend:#393e42;--keycap-gradient-direction:0deg;--key-size:clamp(3rem, 14vw, 6rem);--key-radius:clamp(.3125rem, 1.4583vw, .625rem);--keycap-radius:clamp(.25rem, 1.1667vw, .5rem);--key-gap:clamp(.375rem, 1.75vw, .75rem);--keycap-inset:clamp(.09375rem, .4375vw, .1875rem);--keycap-pressed-inset:clamp(.125rem, .5833vw, .25rem);--key-reflection-size:clamp(.03125rem, .1458vw, .0625rem);isolation:isolate;background:var(--background);place-items:center;width:100%;min-height:100svh;display:grid;position:relative;overflow:hidden}.dark .keyboard-hero-module__qkzdFW__hero{--key-shell:#000;--keycap-top:#26272b;--keycap-bottom:#191a1e;--keycap-pressed-top:#232428;--keycap-pressed-bottom:#131418;--keycap-edge:#515053;--keycap-edge-highlight:#67666b;--keycap-pressed-edge:#51505366;--keycap-pressed-edge-highlight:#67666b66;--key-highlight:#ffffff0d;--key-grain:#ffffff08;--key-legend:#dedfe3;--keycap-gradient-direction:180deg}@supports (color:lab(0% 0 0)){.dark .keyboard-hero-module__qkzdFW__hero{--key-grain:lab(100% 0 0/.03)}}.keyboard-hero-module__qkzdFW__keyboard{align-items:center;gap:var(--key-gap);flex-direction:column;width:100%;padding:2rem 1.25rem;display:flex}.keyboard-hero-module__qkzdFW__row{gap:var(--key-gap);grid-auto-flow:column;display:grid}.keyboard-hero-module__qkzdFW__key{width:var(--key-size);aspect-ratio:48/47;cursor:pointer;touch-action:manipulation;border-radius:var(--key-radius);background:var(--key-shell);color:var(--key-legend);-webkit-tap-highlight-color:transparent;border:0;outline:none;transition:transform .1s ease-out;position:relative;transform:scale(1)}.keyboard-hero-module__qkzdFW__keycap{inset:var(--keycap-inset);border-radius:var(--keycap-radius);background:linear-gradient(var(--keycap-gradient-direction), var(--keycap-top) 0%, var(--keycap-bottom) 100%);box-shadow:inset 0 calc(var(--key-reflection-size) * -1) 0 var(--keycap-edge), inset 0 var(--key-reflection-size) 0 var(--keycap-edge-highlight);place-items:center;transition:inset .2s cubic-bezier(.44,0,.56,1),background .2s cubic-bezier(.44,0,.56,1),box-shadow .2s cubic-bezier(.44,0,.56,1);display:grid;position:absolute;overflow:hidden}.keyboard-hero-module__qkzdFW__keycap:before{border-radius:var(--keycap-radius) var(--keycap-radius) 0 0;background:radial-gradient(58% 87% at 50% 0%, var(--key-highlight) 0%, transparent 100%);content:"";height:48%;transition:opacity .1s cubic-bezier(.44,0,.56,1);position:absolute;inset:0 0 auto}.keyboard-hero-module__qkzdFW__keycap:after{background-image:repeating-radial-gradient(circle at 30% 20%, var(--key-grain) 0 .04rem, transparent .05rem .16rem);content:"";opacity:.22;pointer-events:none;position:absolute;inset:0}.keyboard-hero-module__qkzdFW__legend{z-index:1;font-family:var(--font-pretendard);text-transform:uppercase;-webkit-user-select:none;user-select:none;font-size:clamp(1rem,4.6667vw,2rem);font-weight:400;line-height:1;transition:opacity .1s cubic-bezier(.44,0,.56,1),transform .1s cubic-bezier(.44,0,.56,1);position:relative;transform:scale(1)}.keyboard-hero-module__qkzdFW__key[data-pressed=true] .keyboard-hero-module__qkzdFW__keycap{inset:var(--keycap-pressed-inset);background:linear-gradient(var(--keycap-gradient-direction), var(--keycap-pressed-top) 0%, var(--keycap-pressed-bottom) 100%);box-shadow:inset 0 calc(var(--key-reflection-size) * -1) 0 var(--keycap-pressed-edge), inset 0 var(--key-reflection-size) 0 var(--keycap-pressed-edge-highlight);transition-duration:.1s}.keyboard-hero-module__qkzdFW__key[data-pressed=true] .keyboard-hero-module__qkzdFW__keycap:before{opacity:0}.dark .keyboard-hero-module__qkzdFW__key[data-pressed=true] .keyboard-hero-module__qkzdFW__legend{opacity:.7;transform:scale(.94)}.keyboard-hero-module__qkzdFW__scrollCue{width:3.5rem;height:3.5rem;color:color-mix(in oklab, var(--muted-foreground) 55%, var(--background));place-items:center;display:grid;position:absolute;bottom:clamp(1.5rem,4svh,3rem);left:50%;transform:translate(-50%)}.keyboard-hero-module__qkzdFW__scrollCue svg{width:2rem;height:2rem}@media (prefers-reduced-motion:reduce){.keyboard-hero-module__qkzdFW__key,.keyboard-hero-module__qkzdFW__keycap,.keyboard-hero-module__qkzdFW__legend{transition:none}}
