.keycap-keyboard_root__YJRWg{--board:oklch(97% 0 0);--board-edge:oklch(0% 0 0/.07);--cap-top:oklch(100% 0 0);--cap-bottom:oklch(96.5% 0 0);--cap-edge:oklch(0% 0 0/.09);--face-top:oklch(96.8% 0 0);--face-bottom:oklch(99.6% 0 0);--housing:oklch(84% 0 0);--legend:oklch(40% 0 0);--legend-soft:oklch(56% 0 0);--shade:oklch(0% 0 0/.1);--glow:color-mix(in oklab,var(--accent) 30%,transparent);--tint:color-mix(in oklab,var(--accent) 12%,transparent);display:grid;width:100%;max-width:760px;gap:20px;margin-inline:auto;container-type:inline-size;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}:root[data-theme=dark] .keycap-keyboard_root__YJRWg{--board:oklch(17.5% 0 0);--board-edge:oklch(100% 0 0/.07);--cap-top:oklch(29% 0 0);--cap-bottom:oklch(25.5% 0 0);--cap-edge:oklch(100% 0 0/.07);--face-top:oklch(26.5% 0 0);--face-bottom:oklch(29.5% 0 0);--housing:oklch(11% 0 0);--legend:oklch(86% 0 0);--legend-soft:oklch(66% 0 0);--shade:oklch(0% 0 0/.4);--glow:color-mix(in oklab,var(--accent) 34%,transparent);--tint:color-mix(in oklab,var(--accent) 14%,transparent)}.keycap-keyboard_output__Htx8B{display:flex;height:calc(1.3em * 2 + 4px);flex-direction:column-reverse;overflow-y:auto;color:var(--foreground);font-family:var(--font-display);font-size:clamp(1.25rem,4.4cqw,2rem);letter-spacing:var(--tracking-display);line-height:1.3;scrollbar-width:none;cursor:text}.keycap-keyboard_output__Htx8B::-webkit-scrollbar{display:none}.keycap-keyboard_text__ZjgvN{margin:0;padding-inline:8px;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere}.keycap-keyboard_char__qtTVn{animation:keycap-keyboard_arrive__tVCqA .14s var(--ease-standard) both}.keycap-keyboard_placeholder__r9HaB{color:var(--text-muted)}.keycap-keyboard_caret__azozV{display:inline-block;width:2px;height:1.08em;margin:0 1px 0 2px;border-radius:1px;background:var(--accent);vertical-align:-.16em;animation:keycap-keyboard_blink__TqGqd 1.06s steps(1) infinite}.keycap-keyboard_output__Htx8B[data-typing] .keycap-keyboard_caret__azozV{animation:none}@keyframes keycap-keyboard_arrive__tVCqA{0%{opacity:0;filter:blur(2px)}}@keyframes keycap-keyboard_blink__TqGqd{50%{opacity:0}}.keycap-keyboard_plate__xCZM9{--pad:clamp(6px,2.2cqw,16px);--u:min(54px,calc((100cqw - var(--pad) * 2 - 2px) / (var(--units) + (var(--units) - 1) * .14)));--gap:calc(var(--u) * .14);--travel:clamp(2px,calc(var(--u) * .085),4.5px);--r:calc(var(--u) * .2);box-sizing:border-box;display:grid;justify-self:center;justify-content:center;gap:var(--gap);padding:var(--pad);border:1px solid var(--board-edge);border-radius:calc(var(--r) + var(--pad));background:var(--board);box-shadow:var(--shadow-resting)}.keycap-keyboard_row__l5ZW8{display:flex;justify-content:center;gap:var(--gap)}.keycap-keyboard_plate__xCZM9[data-morphing]{overflow:hidden}.keycap-keyboard_key__jMmN5{position:relative;width:calc(var(--u) * var(--w) + var(--gap) * (var(--w) - 1));height:calc(var(--u) + var(--travel));flex:none;padding:0;border:0;background:none;cursor:pointer;touch-action:manipulation}.keycap-keyboard_glow__YaWRY{position:absolute;inset:calc(var(--u) * -.22);border-radius:calc(var(--r) * 2);background:radial-gradient(closest-side,var(--glow),transparent);opacity:0;transition:opacity .7s var(--ease-standard);pointer-events:none}.keycap-keyboard_housing__l1TkF{position:absolute;inset:var(--travel) 0 0;border-radius:var(--r);background:var(--housing);box-shadow:0 1px 2px var(--shade),0 calc(var(--travel) * .8) calc(var(--travel) * 2) var(--shade)}.keycap-keyboard_cap__jBwNd{position:absolute;inset:0 0 var(--travel);border-radius:var(--r);background:linear-gradient(to bottom,var(--cap-top),var(--cap-bottom));box-shadow:inset 0 0 0 1px var(--cap-edge),inset 0 calc(var(--u) * -.07) 0 var(--shade);transition:transform .2s cubic-bezier(.25,1.55,.5,1);will-change:transform}.keycap-keyboard_cap__jBwNd:after{position:absolute;inset:0;border-radius:inherit;background:var(--tint);content:"";opacity:0;transition:opacity .6s var(--ease-standard)}.keycap-keyboard_face__yoqka{position:absolute;z-index:1;inset:calc(var(--u) * .05) calc(var(--u) * .09) calc(var(--u) * .15);display:grid;place-items:center;border-radius:calc(var(--r) * .78);background:linear-gradient(to bottom,var(--face-top),var(--face-bottom));box-shadow:inset 0 1px 1.5px var(--shade),inset 0 -1px 0 oklch(100% 0 0/.5)}:root[data-theme=dark] .keycap-keyboard_face__yoqka{box-shadow:inset 0 1px 1.5px oklch(0 0 0/.35),inset 0 -1px 0 oklch(100% 0 0/.05)}.keycap-keyboard_legend__GG_D8{display:grid;place-items:center;color:var(--legend);font-family:var(--font-body);font-size:clamp(9px,calc(var(--u) * .3),16px);font-weight:400;line-height:1;transition:color .4s var(--ease-standard)}.keycap-keyboard_legend__GG_D8 svg{width:clamp(10px,calc(var(--u) * .3),16px);height:auto}.keycap-keyboard_key__jMmN5[data-corner] .keycap-keyboard_face__yoqka{place-items:end start;padding:calc(var(--u) * .1) calc(var(--u) * .13)}.keycap-keyboard_key__jMmN5[data-corner] .keycap-keyboard_legend__GG_D8{color:var(--legend-soft);font-size:clamp(7px,calc(var(--u) * .21),12px)}.keycap-keyboard_key__jMmN5[data-pressed] .keycap-keyboard_cap__jBwNd{transform:translate3d(0,calc(var(--travel) * .92),0);transition:transform 35ms cubic-bezier(.2,.8,.2,1)}.keycap-keyboard_key__jMmN5[data-latched] .keycap-keyboard_cap__jBwNd:after,.keycap-keyboard_key__jMmN5[data-pressed] .keycap-keyboard_cap__jBwNd:after{opacity:1;transition-duration:40ms}.keycap-keyboard_key__jMmN5[data-pressed] .keycap-keyboard_glow__YaWRY{opacity:1;transition:opacity 40ms linear}.keycap-keyboard_key__jMmN5[data-latched] .keycap-keyboard_legend__GG_D8,.keycap-keyboard_key__jMmN5[data-pressed] .keycap-keyboard_legend__GG_D8{color:var(--foreground);transition-duration:40ms}.keycap-keyboard_key__jMmN5[data-latched] .keycap-keyboard_cap__jBwNd{transform:translate3d(0,calc(var(--travel) * .5),0)}@media (hover:hover) and (pointer:fine){.keycap-keyboard_key__jMmN5:hover .keycap-keyboard_legend__GG_D8{color:var(--foreground)}}.keycap-keyboard_key__jMmN5[data-accent]{--cap-top:color-mix(in oklab,var(--accent) 86%,oklch(100% 0 0));--cap-bottom:var(--accent);--face-top:color-mix(in oklab,var(--accent) 92%,oklch(0% 0 0));--face-bottom:color-mix(in oklab,var(--accent) 88%,oklch(100% 0 0));--tint:oklch(100% 0 0/.08)}.keycap-keyboard_root__YJRWg .keycap-keyboard_key__jMmN5[data-accent] .keycap-keyboard_legend__GG_D8{color:var(--accent-foreground)}@media (prefers-reduced-motion:reduce){.keycap-keyboard_cap__jBwNd,.keycap-keyboard_key__jMmN5[data-latched] .keycap-keyboard_cap__jBwNd,.keycap-keyboard_key__jMmN5[data-pressed] .keycap-keyboard_cap__jBwNd{transform:none;transition:none}.keycap-keyboard_caret__azozV,.keycap-keyboard_char__qtTVn{animation:none}.keycap-keyboard_glow__YaWRY{transition-duration:.2s}}.keycap-keyboard_demo__VKWgZ{display:grid;width:100%;justify-items:center;gap:16px}.keycap-keyboard_segment__ENKc3{position:relative;display:inline-grid;grid-auto-columns:1fr;grid-auto-flow:column;gap:2px;padding:2px;border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--surface-muted)}.keycap-keyboard_segment__ENKc3:before{position:absolute;top:2px;bottom:2px;left:2px;width:calc(50% - 3px);border-radius:var(--radius-pill);background:var(--surface-raised);box-shadow:var(--shadow-resting),0 0 0 1px var(--border);content:"";transform:translate3d(calc(var(--index, 0) * (100% + 2px)),0,0);transition:transform var(--duration-spring) var(--ease-spring)}.keycap-keyboard_option__NylUW{position:relative;height:30px;padding:0 14px;border:0;border-radius:var(--radius-pill);background:none;color:var(--text-muted);font:inherit;font-size:var(--text-sm);letter-spacing:var(--tracking-body);cursor:pointer;transition:color var(--duration-fast) var(--ease-standard)}.keycap-keyboard_option__NylUW[aria-pressed=true]{color:var(--foreground)}@media (hover:hover) and (pointer:fine){.keycap-keyboard_option__NylUW:hover{color:var(--foreground)}}@media (prefers-reduced-motion:reduce){.keycap-keyboard_segment__ENKc3:before{transition:none}}