/* Version 5.1 — show the complete five-row US keyboard on first load.
   Desktop layout sizes depend on viewport height, with no keyboard clipping. */
@media (min-width: 741px) {
  .app {max-width: none; padding: clamp(5px, 0.9vh, 10px) 12px;}
  .topbar {margin-bottom: 4px; gap: 6px;}
  .topbar h1 {font-size: 17px; margin-bottom: 1px;}
  .topbar h1 span {font-size: 12px;}
  .topbar p {font-size: 11px;}
  .actions {gap: 5px;}
  .actions button {padding: 5px 8px; font-size: 12px;}
  .editor-label {margin: 1px 0 3px; font-size: 12px;}
  .merged-toolbar {margin: 2px 0 3px; font-size: 12px; gap: 6px;}
  .merged-editor {
    min-height: 105px;
    height: clamp(116px, 18dvh, 175px);
    padding: 9px 12px;
    line-height: 2.15;
    overflow: auto;
  }
  .sound-guide {margin: 5px 0; padding: 5px 9px;}
  .v4-panel {margin: 5px 0; padding: 7px;}
  .v4-heading {margin-bottom: 5px; gap: 4px;}
  .v4-hint {font-size: 11px;}
  .v4-layout {gap: 3px;}
  .v4-row {gap: 3px;}
  .v4-key {
    height: clamp(48px, 6.1dvh, 55px);
    min-height: 0;
    padding: 1px 2px;
    gap: 0;
  }
  .v4-key .latin {font-size: clamp(9px, 1.15vh, 11px);line-height: 1;}
  .v4-key .sound {font-size: clamp(15px, 2.3vh, 23px);line-height: 1.02;}
  .v4-key .uy, .v4-key.dual .uy {font-size: clamp(12px, 1.7vh, 17px);line-height: 1.05;}
  .copy-help {font-size: 11px; line-height: 1.3; padding: 5px 8px;}
  .note {font-size: 11px;}
}
/* Extra-short desktop windows: keep all rows visible and reduce the editor first. */
@media (min-width: 741px) and (max-height: 680px) {
  .merged-editor {min-height: 85px; height: 15dvh; padding: 5px 10px;}
  .v4-key {height: clamp(32px, 5.5dvh, 40px);}
  .v4-heading {margin-bottom: 2px;}
  .topbar p, .merged-toolbar span {display: none;}
  .v4-panel {padding: 5px;}
  .v4-layout {gap: 2px;}
}