/* 内置软键盘样式（从远程课堂移植，配色改用本系统的主题变量）
 *
 * 为什么要自带键盘：手机输入法有联想词、还能粘贴，等于给学生开了查答案的通道。
 * 网页无法强制系统输入法布局，所以填空题用这套键盘 + readonly 输入框，
 * 系统输入法不会弹出，粘贴内容也只保留允许的字符。
 */
:root {
  --kbd-brand: var(--primary, #2E86DE);
  --kbd-brand-soft: rgba(46, 134, 222, .14);
}

.fill-blank .input.kbd-active {
  border-color: var(--kbd-brand);
  box-shadow: 0 0 0 3px var(--kbd-brand-soft);
}
.kbd-panel {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 96;
  background: #e9ecf1; border-top: 1px solid #c9d0da;
  padding: 8px 6px calc(8px + env(safe-area-inset-bottom));
  transform: translateY(100%); transition: transform .18s ease;
  box-shadow: 0 -6px 24px rgba(16, 24, 40, .12);
  -webkit-user-select: none; user-select: none; touch-action: manipulation;
}
.kbd-panel.on { transform: none; }
.kbd-body { max-width: 640px; margin: 0 auto; }
.kbd-row { display: flex; gap: 5px; justify-content: center; margin-bottom: 5px; }
.kbd-key {
  flex: 1 1 0; min-width: 0; height: 46px; border: 0; border-radius: 7px; padding: 0;
  background: #fff; color: #1f2733; font-size: 21px; font-weight: 600; line-height: 1;
  box-shadow: 0 1px 0 #aab2bf; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.kbd-key:active { background: #cfd6e0; }
.kbd-fn { flex: 1.4 1 0; background: #c3cad5; font-size: 15px; }
.kbd-space { flex: 3 1 0; font-size: 15px; }
.kbd-foot { max-width: 640px; margin: 2px auto 0; text-align: right; }
.kbd-done {
  border: 0; background: transparent; color: var(--kbd-brand);
  font-size: 15px; font-weight: 700; padding: 6px 14px; cursor: pointer;
}
@media (max-height: 560px) { .kbd-key { height: 38px; font-size: 18px; } }
.kbd-row.kbd-quick .kbd-key { background: #dfe3ea; font-size: 22px; font-weight: 700; }
.kbd-row.kbd-sym { gap: 4px; }
.kbd-row.kbd-sym .kbd-key { font-size: 23px; font-weight: 700; }
.kbd-key.kbd-on { background: var(--kbd-brand); color: #fff; }
.kbd-fn[data-k="⇧"] { flex: 1.8 1 0; font-size: 15px; }
.kbd-key[disabled], .kbd-key.kbd-off {
  background: #dcdfe5; color: #a3aab5; cursor: default; box-shadow: none;
}
