:root {
  --ty-keyboard-bg: #f6f6f6;
  --ty-keyboard-border: #d8d8d8;
  --ty-keyboard-border-bottom: #ccc;
  --ty-keyboard-color: #333;
  --ty-keyboard-shadow: inset 0 -1px 0 #ccc;
  --ty-keyboard-font-family: var(--ty-font-family-monospace);
  --ty-keyboard-padding: 4px 8px;
  --ty-keyboard-radius: 4px;
  --ty-keyboard-font-size: 11px;
}

[data-tiny-theme='dark'] {
  --ty-keyboard-bg: #2a2a2a;
  --ty-keyboard-border: #424242;
  --ty-keyboard-border-bottom: #363636;
  --ty-keyboard-color: rgba(255, 255, 255, 0.85);
  --ty-keyboard-shadow: inset 0 -1px 0 #363636;
  --ty-keyboard-font-family: var(--ty-font-family-monospace);
  --ty-keyboard-padding: 4px 8px;
  --ty-keyboard-radius: 4px;
  --ty-keyboard-font-size: 11px;
}

@media (prefers-color-scheme: dark) {
  [data-tiny-theme='system'] {
  --ty-keyboard-bg: #2a2a2a;
  --ty-keyboard-border: #424242;
  --ty-keyboard-border-bottom: #363636;
  --ty-keyboard-color: rgba(255, 255, 255, 0.85);
  --ty-keyboard-shadow: inset 0 -1px 0 #363636;
  --ty-keyboard-font-family: var(--ty-font-family-monospace);
  --ty-keyboard-padding: 4px 8px;
  --ty-keyboard-radius: 4px;
  --ty-keyboard-font-size: 11px;
}
}