/* hanviet.css - bảng gợi ý chữ Nho + nút Bật/Tắt */
.hv-pop {
  position: fixed;
  z-index: 50;
  max-width: min(380px, calc(100vw - 8px));
  padding: 6px;
  background: var(--card);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 8px 28px #0003;
}
.hv-pop[hidden] {
  display: none;
}
.hv-grid {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  max-height: 150px;
  overflow-y: auto;
}
.hv-it {
  position: relative;
  min-width: 44px;
  padding: 2px 8px 2px 14px;
  text-align: center;
  font:
    26px/1.35 "Noto Serif CJK TC",
    "Noto Serif TC",
    "PMingLiU",
    "MingLiU",
    "SimSun",
    "Songti TC",
    serif;
  border: 1px solid var(--line);
  border-radius: 6px;
  cursor: pointer;
  user-select: none;
}
.hv-it.ph {
  font-size: 22px;
  border-style: dashed;
}
.hv-it sub {
  position: absolute;
  left: 3px;
  top: 3px;
  font: 600 10px/1 system-ui, sans-serif;
  color: var(--mut);
}
.hv-it:hover,
.hv-it.on {
  background: var(--acc);
  border-color: var(--acc);
  color: #fff;
}
.hv-it:hover sub,
.hv-it.on sub {
  color: #fff;
}
.hv-help {
  margin-top: 5px;
  font: 11px/1.3 system-ui, sans-serif;
  color: var(--mut);
}
.hv-chip {
  position: fixed;
  left: 10px;
  bottom: calc(10px + env(safe-area-inset-bottom));
  z-index: 40;
  padding: 5px 10px;
  font: 600 12px/1.2 system-ui, sans-serif;
  color: var(--mut);
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 999px;
  cursor: pointer;
}
.hv-chip.on {
  color: var(--acc);
  border-color: var(--acc);
}
.hv-chip[hidden] {
  display: none;
}
@media print {
  .hv-pop,
  .hv-chip {
    display: none !important;
  }
}