@layer equip{.eq-shortcut-recorder{justify-items:start;gap:var(--eq-space-1);min-width:0;display:grid}.eq-shortcut-recorder-label{color:var(--eq-ink);font:var(--eq-weight-strong) var(--eq-text-s) / 1.3 var(--eq-font)}.eq-shortcut-recorder-hint{color:var(--eq-ink-2);font:var(--eq-weight) var(--eq-text-s) / 1.4 var(--eq-font);margin:0}.eq-shortcut-recorder-field{box-sizing:border-box;width:calc(var(--eq-h-m) * 5);max-width:100%;height:var(--eq-h-m);border:1px solid var(--eq-line-strong);border-radius:var(--eq-radius-m);background:var(--eq-raised);color:var(--eq-ink);transition:border-color var(--eq-dur) var(--eq-ease), scale var(--eq-dur) var(--eq-ease);align-items:center;display:flex}.eq-shortcut-recorder-field:has(.eq-shortcut-recorder-control:active:not(:disabled)){scale:var(--eq-press)}@media (hover:hover){.eq-shortcut-recorder-field:hover:where(:not([data-disabled])){border-color:color-mix(in srgb, var(--eq-line-strong), var(--eq-ink) 30%)}}:is(.eq-shortcut-recorder-field:has(.eq-shortcut-recorder-control:focus-visible),.eq-shortcut-recorder-field:has(.eq-shortcut-recorder-control[data-recording])){outline:2px solid var(--eq-focus);outline-offset:-1px}.eq-shortcut-recorder-control{min-width:0;padding:0 var(--eq-space-3);border-radius:calc(var(--eq-radius-m) - 1px);color:inherit;font:var(--eq-weight) var(--eq-text-m) / 1 var(--eq-font);text-align:start;cursor:pointer;transition:background-color var(--eq-dur) var(--eq-ease);background:0 0;border:0;flex:auto;align-self:stretch;align-items:center;margin:0;display:flex}.eq-shortcut-recorder-control:focus-visible{outline:none}.eq-shortcut-recorder-control[data-recording]{background:var(--eq-tint)}.eq-shortcut-recorder-keys{align-items:center;gap:var(--eq-space-1);min-width:0;display:inline-flex;overflow:hidden}.eq-shortcut-recorder-key{box-sizing:border-box;min-width:22px;height:22px;padding-inline:var(--eq-space-1);border:1px solid var(--eq-line-strong);border-radius:var(--eq-radius-s);background:var(--eq-raised);color:var(--eq-ink);font:var(--eq-weight) var(--eq-text-s) / 1 var(--eq-font-mono);font-variation-settings:var(--eq-font-mono-settings);white-space:nowrap;transition:opacity var(--eq-dur) var(--eq-ease), scale var(--eq-dur-move) var(--eq-spring);border-bottom-width:2px;flex:none;justify-content:center;align-items:center;display:inline-flex}.eq-shortcut-recorder-key:nth-child(2){transition-delay:calc(var(--eq-dur) / 3)}.eq-shortcut-recorder-key:nth-child(3){transition-delay:calc(var(--eq-dur) * 2 / 3)}.eq-shortcut-recorder-key:nth-child(n+4){transition-delay:var(--eq-dur)}@starting-style{.eq-shortcut-recorder-field:focus-within .eq-shortcut-recorder-key{opacity:0;scale:.6}}.eq-shortcut-recorder-placeholder{color:var(--eq-ink-3);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.eq-shortcut-recorder-control[data-recording] .eq-shortcut-recorder-placeholder{color:var(--eq-ink-2)}.eq-shortcut-recorder-clear{width:24px;height:24px;border-radius:var(--eq-radius-s);color:var(--eq-ink-2);cursor:pointer;transition:background-color var(--eq-dur) var(--eq-ease), color var(--eq-dur) var(--eq-ease), scale var(--eq-dur) var(--eq-ease);background:0 0;border:0;flex:none;place-items:center;margin-inline-end:var(--eq-space-1);padding:0;display:grid}.eq-shortcut-recorder-clear>svg{width:14px;height:14px}@media (hover:hover){.eq-shortcut-recorder-clear:hover:not(:disabled){background:var(--eq-tint);color:var(--eq-ink)}}.eq-shortcut-recorder-clear:active:not(:disabled){background:var(--eq-tint-strong);scale:var(--eq-press)}.eq-shortcut-recorder-field[data-disabled]{opacity:.45;cursor:not-allowed}.eq-shortcut-recorder-field[data-disabled]>*{cursor:not-allowed}.eq-shortcut-recorder-status{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}}
