:root{--surface:#f1f4f9;--spring-overshoot:cubic-bezier(.34, 1.56, .64, 1);--spring-elastic:cubic-bezier(.175, .885, .32, 1.275);--key-bg:var(--surface);--key-shadow-color:oklch(54% .09 266/.15);--key-shadow-hard:var(--c-muted)}.dark{--surface:oklch(22% .025 260);--key-bg:oklch(25% .025 260);--key-shadow-color:oklch(0% 0 0/.35);--key-shadow-hard:var(--c-muted)}.demo-wrap[data-astro-cid-jhzevhwr]{flex-direction:column;align-items:center;gap:1.5rem;display:flex}.card[data-astro-cid-jhzevhwr]{background:var(--surface);corner-shape:squircle;text-align:center;border-radius:1.75rem;flex-direction:column;align-items:center;gap:.5rem;padding:2.25rem 2.75rem 2rem;display:flex;box-shadow:0 1px 3px oklch(20% .02 260/.06),0 8px 24px oklch(20% .02 260/.08)}.dark .card[data-astro-cid-jhzevhwr]{box-shadow:0 1px 3px oklch(0% 0 0/.2),0 8px 24px oklch(0% 0 0/.3)}@supports not (corner-shape:squircle){.card[data-astro-cid-jhzevhwr]{border-radius:1.25rem}}.card-title[data-astro-cid-jhzevhwr]{color:var(--c-muted);font-size:1.125rem;font-weight:600}.shortcut-row[data-astro-cid-jhzevhwr]{align-items:center;gap:.625rem;margin:.5rem 0;display:flex}.shortcut-plus[data-astro-cid-jhzevhwr]{color:var(--c-muted);user-select:none;font-size:.875rem;font-weight:500}.key[data-astro-cid-jhzevhwr]{appearance:none;cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none;font-family:var(--font-sans);background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.key-face[data-astro-cid-jhzevhwr]{corner-shape:squircle;min-width:3rem;height:3rem;color:var(--c-muted);background:var(--key-bg);border:2px solid var(--c-muted);box-shadow:0 4px 0 var(--key-shadow-hard), 0 4px 8px var(--key-shadow-color);transition:transform .3s var(--spring-elastic), box-shadow .4s var(--spring-elastic), color .4s var(--spring-elastic), border-color .4s var(--spring-elastic);border-radius:.875rem;justify-content:center;align-items:center;padding:0 .875rem;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:1.125rem;font-weight:700;display:flex;transform:translateY(0)}@supports not (corner-shape:squircle){.key-face[data-astro-cid-jhzevhwr]{border-radius:.75rem}}.key[data-astro-cid-jhzevhwr]:hover .key-face[data-astro-cid-jhzevhwr],.key[data-astro-cid-jhzevhwr].cursor-hover .key-face[data-astro-cid-jhzevhwr]{box-shadow:0 6px 0 var(--key-shadow-hard), 0 6px 12px var(--key-shadow-color);transform:translateY(-2px)}.key[data-astro-cid-jhzevhwr]:active .key-face[data-astro-cid-jhzevhwr],.key[data-astro-cid-jhzevhwr].is-pressed .key-face[data-astro-cid-jhzevhwr]{box-shadow:0 1px 0 var(--key-shadow-hard), 0 1px 3px var(--key-shadow-color);transition-duration:80ms;transform:translateY(3px)}.key[data-astro-cid-jhzevhwr].mode-flat .key-face[data-astro-cid-jhzevhwr]{border:2.5px solid var(--c-accent);color:var(--c-accent);transition:background .4s var(--spring-overshoot), color .4s var(--spring-overshoot), transform .4s var(--spring-overshoot), box-shadow .4s var(--spring-overshoot), border-color .4s var(--spring-overshoot);background:oklch(55% .24 260/0);transform:scale(1);box-shadow:0 0 oklch(55% .24 260/0)}.dark .key[data-astro-cid-jhzevhwr].mode-flat .key-face[data-astro-cid-jhzevhwr]{background:oklch(72% .19 260/0);box-shadow:0 0 oklch(72% .19 260/0)}.key[data-astro-cid-jhzevhwr].mode-flat:hover .key-face[data-astro-cid-jhzevhwr],.key[data-astro-cid-jhzevhwr].mode-flat.cursor-hover .key-face[data-astro-cid-jhzevhwr]{background:var(--c-accent);color:#fff;border-color:var(--c-accent);transform:scale(1.06);box-shadow:0 4px 18px oklch(55% .24 260/.3)}.dark .key[data-astro-cid-jhzevhwr].mode-flat:hover .key-face[data-astro-cid-jhzevhwr],.dark .key[data-astro-cid-jhzevhwr].mode-flat.cursor-hover .key-face[data-astro-cid-jhzevhwr]{box-shadow:0 4px 18px oklch(72% .19 260/.25)}.key[data-astro-cid-jhzevhwr].mode-flat:active .key-face[data-astro-cid-jhzevhwr],.key[data-astro-cid-jhzevhwr].mode-flat.is-pressed .key-face[data-astro-cid-jhzevhwr]{color:#fff;background:oklch(45% .24 260);border-color:oklch(45% .24 260);transition-duration:.1s;transform:scale(.95)}.dark .key[data-astro-cid-jhzevhwr].mode-flat:active .key-face[data-astro-cid-jhzevhwr],.dark .key[data-astro-cid-jhzevhwr].mode-flat.is-pressed .key-face[data-astro-cid-jhzevhwr]{background:oklch(60% .19 260);border-color:oklch(60% .19 260)}.controls[data-astro-cid-jhzevhwr]{justify-content:center;display:flex}@media (prefers-reduced-motion:reduce){.key-face[data-astro-cid-jhzevhwr]{transition:none!important}}