$key-base-height: 24px;

.KeyboardKey {
  display: inline-block;
  height: $key-base-height;
  margin: 0 var(--p-space-05) var(--p-space-05);
  padding: 0 var(--p-space-1);
  background-color: var(--p-surface);
  box-shadow: 0 0 0 1px var(--p-border-subdued),
    0 var(--p-space-05) 0 0 var(--p-surface),
    0 var(--p-space-05) 0 1px var(--p-border-subdued);
  border-radius: var(--p-border-radius-1);
  font-family: var(--p-font-family-sans);
  font-size: var(--p-font-size-1);
  font-weight: var(--p-font-weight-medium);
  line-height: $key-base-height;
  color: var(--p-text-subdued);
  text-align: center;
  min-width: $key-base-height;
  user-select: none;
}