/* 屏幕键盘基础样式（QWERTYKeyboard，keyboard.js 配套）
   DOM：.qk > .qk-row(--digits/--qwerty/--home/--bottom/--space) > button.qk-key(--func/--space)
   状态：.is-pressed / .is-target / .is-correct / .is-wrong；容器 .qk-disabled
   深色/护眼覆盖在 style.css 的 qk42 块（带 html.theme-* 前缀，特异性更高）。 */
.qk {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px;
  background: var(--surface, #FFFFFF);
  border: 1px solid var(--border, #E2E8F0);
  border-radius: 14px;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}
.qk-row {
  display: flex;
  gap: 5px;
  justify-content: center;
}
.qk-key {
  flex: 1 1 0;
  min-width: 0;
  height: 46px;
  padding: 0 2px;
  border: 1px solid var(--border, #CBD5E1);
  border-bottom-width: 3px;
  border-radius: 9px;
  background: #FFFFFF;
  color: var(--ink, #1F2937);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background .08s ease, transform .05s ease;
}
.qk-key--func {
  background: #EEF3E6;
  color: #4A6741;
  font-size: 12.5px;
}
.qk-key--space {
  letter-spacing: 1px;
}
.qk-key.is-pressed {
  background: #E3EDD3;
  transform: translateY(2px);
  border-bottom-width: 1px;
}
.qk-key.is-target {
  background: #729B4A;
  border-color: #729B4A;
  color: #FFFFFF;
  box-shadow: 0 0 0 3px rgba(114, 155, 74, .35);
}
.qk-key.is-correct {
  background: #4C9A52 !important;
  border-color: #4C9A52 !important;
  color: #FFFFFF !important;
}
.qk-key.is-wrong {
  background: #D9534F !important;
  border-color: #D9534F !important;
  color: #FFFFFF !important;
}
.qk.qk-disabled .qk-key {
  opacity: .45;
  pointer-events: none;
}
@media (max-width: 480px) {
  .qk { padding: 7px; gap: 5px; }
  .qk-row { gap: 4px; }
  .qk-key { height: 42px; font-size: 13.5px; border-radius: 7px; }
  .qk-key--func { font-size: 11px; }
}