.shortcuts-illustration{--_key-width:64px;--_key-height:34px;--_gap:8px;gap:var(--_gap);padding:0 28px;display:flex;-webkit-mask-image:linear-gradient(90deg,#0000,#000 30% 70%,#0000);mask-image:linear-gradient(90deg,#0000,#000 30% 70%,#0000)}.shortcuts-illustration-slot{width:var(--_key-width);corner-shape:superellipse(2);background:color-mix(in srgb, var(--color-text-1) 2.5%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--color-text-1) 4%, transparent);border-radius:12px;padding:4px;display:grid}.shortcuts-illustration-window{height:var(--_key-height);corner-shape:superellipse(1.5);border-radius:9px;display:grid;position:relative;overflow:hidden}.shortcuts-illustration-key{height:var(--_key-height);white-space:nowrap;color:var(--color-text-2);border-radius:inherit;corner-shape:inherit;background:color-mix(in srgb, var(--color-text-3) 8%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--color-text-3) 16%, transparent), inset 0 -2px 0 color-mix(in srgb, var(--color-text-3) 16%, transparent);grid-area:1/1;place-items:center;font-family:inherit;font-size:13px;font-weight:600;transition:opacity .4s;display:grid}.shortcuts-illustration-slot:nth-child(2) .shortcuts-illustration-key{color:var(--color-text-1);background:color-mix(in srgb, var(--color-text-3) 13%, transparent)}.shortcuts-illustration-key[data-roll=in]{animation:.55s cubic-bezier(.3,.7,.2,1) both shortcuts-illustration-in}.shortcuts-illustration-key[data-roll=out]{animation:.55s cubic-bezier(.3,.7,.2,1) both shortcuts-illustration-out}@keyframes shortcuts-illustration-in{0%{opacity:0;filter:blur(2px);translate:0 70%}}@keyframes shortcuts-illustration-out{to{opacity:0;filter:blur(2px);translate:0 -70%}}.shortcuts-illustration[data-state=lost] .shortcuts-illustration-key{opacity:.4}@media (prefers-reduced-motion:reduce){.shortcuts-illustration-key[data-roll]{animation:none}.shortcuts-illustration-key[data-roll=out]{display:none}}