:root{
  --hm-bg-1:#e5edf9;
  --hm-bg-2:#f7efe4;
  --hm-text:#24314c;
  --hm-muted:#66728f;
  --hm-board:#274f45;
  --hm-board-line:#385f56;
  --hm-chalk:#eff7f0;
  --hm-chalk-soft:#d9e9dc;
  --hm-wood-2:#895a31;
  --hm-key-top:#fbf4df;
  --hm-key-bottom:#eadab0;
  --hm-key-edge:#c2ab72;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  min-height:100vh;
  color:var(--hm-text);
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  background:
    radial-gradient(circle at top left, rgba(153,211,255,.65), transparent 38%),
    radial-gradient(circle at top right, rgba(198,181,255,.45), transparent 30%),
    linear-gradient(135deg,var(--hm-bg-1),var(--hm-bg-2));
}
button,input,select{font:inherit}
button{cursor:pointer}
[hidden]{display:none!important}

.hm-shell{max-width:none;margin:0;padding:0}
.hm-shell:not(.hm-is-playing){background-color:#ac674c;background-image:linear-gradient(#d0aa8c 3px,transparent 3px),linear-gradient(90deg,#d0aa8c 3px,transparent 3px),linear-gradient(145deg,#b97758,#8e4f3e);background-size:100% 58px,124px 116px,auto;background-position:0 0,62px 0,0 0}

.hm-setup-screen,.hm-play-screen{width:100%}
.hm-setup-screen{min-height:0}
.hm-setup-card{
  max-width:1200px;
  width:100%;
  margin:0 auto;
  padding:clamp(20px,2vw,30px);
  border:clamp(8px,1.4vw,16px) solid var(--hm-wood-2);
  border-radius:20px;
  background:radial-gradient(circle at 50% 24%,rgba(255,255,255,.05),transparent 34%),repeating-linear-gradient(180deg,var(--hm-board) 0,var(--hm-board) 34px,var(--hm-board-line) 34px,var(--hm-board-line) 35px);
  box-shadow:inset 0 0 0 4px #bd8a50,0 0 0 3px #6f4527,0 12px 24px #30201655;
  color:var(--hm-chalk);
}

.hm-grade-row{display:flex;justify-content:center;margin-bottom:16px}
.hm-grade-select,
.hm-count-label select{
  min-height:52px;
  border:1px solid #cfd8ed;
  border-radius:16px;
  background:#fff;
  color:var(--hm-text);
  padding:0 16px;
  box-shadow:0 4px 16px rgba(36,49,76,.06);
}
.hm-grade-select{min-width:min(100%,260px);font-size:18px;font-weight:800}
.hm-unit-list{display:flex;flex-wrap:wrap;justify-content:center;align-content:flex-start;gap:9px;overflow:visible;padding:3px 2px 8px}
.hm-unit-card{
  flex:0 1 290px;min-width:0;
  min-height:67px;
  padding:9px 12px;
  border:1px solid #d8e0f0;
  border-radius:20px;
  background:linear-gradient(180deg,#ffffff,#f7f9ff);
  color:var(--hm-text);
  text-align:left;
  box-shadow:0 8px 22px rgba(28,42,73,.06);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.hm-unit-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(28,42,73,.12)}
.hm-unit-card strong{display:block;font-size:18px;font-weight:850;margin-bottom:6px}
.hm-unit-card span{display:block;color:var(--hm-muted);font-size:14px;line-height:1.35}
.hm-unit-card.selected{
  border-color:#27364e;
  background:linear-gradient(180deg,#eef2ff,#e6edff);
  box-shadow:inset 0 0 0 2px #27364e,0 0 0 2px #ffd45e,0 8px 18px rgba(30,42,63,.24);
}
.hm-unit-random strong::before{content:"★ ";color:#ad7a00}
.hm-setup-warning{margin:14px 0 0;color:#ffe4a8;font-weight:700}
.hm-setup-bottom{display:flex;align-items:end;justify-content:flex-start;gap:12px;margin-top:20px;flex-wrap:nowrap;min-width:0}
.hm-setup-selects{display:flex;gap:12px;flex:0 0 auto;min-width:0}
.hm-setup-selects .hm-count-label{flex:0 0 clamp(130px,17vw,175px);min-width:0}
.hm-setup-selects select{width:100%;min-width:0}
.hm-count-label{display:flex;flex-direction:column;gap:7px;color:var(--hm-chalk-soft);font-size:11px;font-weight:850;letter-spacing:.12em}
.hm-count-label select{min-width:0;font-weight:700}
.hm-start,.hm-secondary,.hm-guess-trigger{
  min-height:52px;
  border-radius:16px;
  font-weight:850;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.hm-start{
  border:1px solid #5068d9;
  padding:0 24px;
  background:linear-gradient(180deg,#5e77eb,#405acb);
  color:#fff;
  box-shadow:0 12px 28px rgba(63,89,204,.28);
}
.hm-start:hover{transform:translateY(-1px);box-shadow:0 16px 32px rgba(63,89,204,.34)}
.hm-start:disabled{opacity:.48;cursor:not-allowed;transform:none;box-shadow:none}
.hm-setup-bottom>.hm-start-comic{margin-left:auto}
.hm-start-comic{width:clamp(160px,21vw,215px);flex-shrink:0;min-height:62px;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.hm-start-comic svg{display:block;width:100%;height:62px;overflow:visible;filter:drop-shadow(3px 4px 0 #d3a952)}
.hm-start-comic:hover{transform:translate(3px,-2px);box-shadow:none}
.hm-start-comic:focus-visible{outline:3px solid #f7d45b;outline-offset:3px}

.hm-secondary{
  border:1px solid #d5dced;
  background:linear-gradient(180deg,#ffffff,#f4f6fb);
  color:var(--hm-text);
  padding:0 18px;
  box-shadow:0 8px 20px rgba(30,41,71,.07);
}
.hm-secondary:hover{transform:translateY(-1px);background:#fff}
.hm-letter{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:calc(clamp(24px,2.3vw,38px) * var(--hm-word-scale,1));
  height:calc(clamp(40px,4vw,52px) * var(--hm-word-scale,1));
  border-bottom:4px solid var(--hm-chalk);
  font-size:calc(clamp(28px,2.6vw,40px) * var(--hm-word-scale,1));
  font-weight:900;
  color:var(--hm-chalk);
  text-shadow:0 0 8px rgba(255,255,255,.08);
}
.hm-letter.revealed{color:#fff}
.hm-letter.missed,.hm-meaning{color:#ffe4a8}
.hm-word-group{display:inline-flex;flex:0 0 auto;align-items:flex-end;gap:clamp(3px,.4vw,7px);white-space:nowrap}
.hm-punctuation{font-size:26px;color:var(--hm-chalk);padding-bottom:7px}

.hm-keyboard{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:12px;
  width:100%;
}
.hm-key{
  min-width:0;
  min-height:74px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid var(--hm-key-edge);
  border-radius:16px;
  background:linear-gradient(180deg,var(--hm-key-top),var(--hm-key-bottom));
  color:#24314c;
  font-size:clamp(24px,2vw,30px);
  font-weight:900;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85), 0 5px 0 #ccb57c, 0 14px 24px rgba(81,69,31,.18);
  text-shadow:0 1px 0 rgba(255,255,255,.55);
}
.hm-key:not(:disabled):hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 7px 0 #ccb57c,0 16px 26px rgba(81,69,31,.22)}
.hm-key:disabled{cursor:default}
.hm-player-station:not(.hm-active-station) .hm-key{opacity:.48}
.hm-guess-trigger{width:100%;border:1px solid #5068d9;background:linear-gradient(180deg,#5e77eb,#405acb);color:#fff;box-shadow:0 12px 28px rgba(63,89,204,.24)}
.hm-station-two .hm-guess-trigger{border-color:#30508b;background:linear-gradient(180deg,#3d69a8,#26497c)}
.hm-guess-trigger:disabled{opacity:.48;cursor:not-allowed;transform:none;box-shadow:none}

.hm-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(19,27,50,.6);
  backdrop-filter:blur(8px);
}
.hm-modal-card{
  width:min(100%,540px);max-height:min(88dvh,820px);overflow:auto;padding:28px 26px 28px 43px;
  border:1px solid #d6cdb7;border-radius:12px;
  background:linear-gradient(90deg,transparent 33px,#e9a3a3 34px,#e9a3a3 35px,transparent 36px),repeating-linear-gradient(#fffef7 0,#fffef7 29px,#c8d9e7 30px,#fffef7 31px);
  box-shadow:4px 5px 0 #d7cbb2,0 28px 56px rgba(16,22,43,.26);
}
#pauseDialog .hm-modal-card{width:min(100%,470px)}
#pauseDialog .hm-modal-actions{justify-content:center;margin-top:14px}
.hm-resume-arrow{display:inline-grid;place-items:center;width:92px;height:64px;min-height:0;padding:0;border:0;border-radius:0;background:none;color:#324ab8;box-shadow:none;transition:transform .18s ease}
.hm-resume-arrow svg{width:88px;height:58px;overflow:visible;filter:drop-shadow(3px 4px 0 #f1bd64)}
.hm-resume-arrow:hover{transform:translateX(5px)}
.hm-resume-arrow:focus-visible{outline:3px solid #405acb;outline-offset:4px;border-radius:8px}
.hm-modal-card h2{margin:0 0 12px;font-size:28px;line-height:1.2}
.hm-modal-card p{margin:0;color:var(--hm-muted);line-height:1.65}
.hm-modal-actions{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:24px}
.hm-modal-actions .hm-start,.hm-modal-actions .hm-secondary{display:inline-grid;place-items:center;width:clamp(124px,35vw,174px);height:62px;min-height:0;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;color:#263656;transition:transform .15s ease}
#guessDialog .hm-modal-actions{flex-wrap:nowrap;justify-content:center;gap:6px}
#guessDialog .hm-modal-actions .hm-start,#guessDialog .hm-modal-actions .hm-secondary{width:clamp(104px,27vw,148px);flex:0 1 148px;height:54px}
.hm-comic-warning{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;pointer-events:none;padding:18px}
.hm-comic-warning[hidden]{display:none}
@media (min-width:768px){
 .hm-comic-warning[data-position="left"]{justify-items:start;padding-left:clamp(18px,8vw,130px)}
 .hm-comic-warning[data-position="right"]{justify-items:end;padding-right:clamp(18px,8vw,130px)}
 .hm-comic-warning[data-position="left"]>strong,.hm-comic-warning[data-position="right"]>strong{max-width:32vw;font-size:clamp(27px,3.5vw,52px)}
}
@media (max-width:767px) and (orientation:landscape){
 .hm-comic-warning[data-position="left"]{justify-items:start;padding-left:5vw}
 .hm-comic-warning[data-position="right"]{justify-items:end;padding-right:5vw}
 .hm-comic-warning[data-position="left"]>strong,.hm-comic-warning[data-position="right"]>strong{max-width:40vw;padding:12px 18px;font-size:clamp(22px,3vw,38px)}
}
.hm-comic-warning[data-position="center"]>strong{overflow-wrap:anywhere}
.hm-comic-warning:not([data-kind="vocabulary"])>strong{translate:0 -6vh}
.hm-comic-warning[data-kind="last-life"]>strong span{display:block;line-height:1.15}
.hm-comic-warning[data-kind="last-life"]>strong span+span{margin-top:8px;font-size:.42em;font-weight:700;line-height:1.25;white-space:normal}
.hm-comic-warning[data-kind="vocabulary"]{padding-top:clamp(110px,30vh,260px)}
.hm-comic-warning[data-kind="vocabulary"]>strong{min-width:min(270px,78vw);max-width:82vw;padding:16px 26px;font-size:clamp(25px,4.2vw,48px);border-width:4px;box-shadow:6px 7px 0 #263656}
.hm-comic-warning[data-kind="vocabulary"]>strong span{display:block;overflow-wrap:anywhere;line-height:1.2}
.hm-comic-warning[data-kind="vocabulary"]>strong span+span{margin-top:8px;font-size:.65em}
.hm-comic-warning>strong{display:block;max-width:90vw;padding:24px 42px;background:#ffe374;color:#263656;border:5px solid #263656;border-radius:18px 9px 20px 12px;box-shadow:8px 9px 0 #263656;font-size:clamp(32px,6vw,68px);font-weight:1000;text-align:center;transform:rotate(-5deg);animation:hm-warning-pop .35s cubic-bezier(.2,1.7,.4,1) both}
@keyframes hm-warning-pop{from{opacity:0;transform:scale(.35) rotate(12deg)}to{opacity:1;transform:scale(1) rotate(-5deg)}}
.hm-modal-actions .hm-start svg,.hm-modal-actions .hm-secondary svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(2px 4px 0 #d4c9aa)}
.hm-modal-actions .hm-start:hover,.hm-modal-actions .hm-secondary:hover{transform:translateY(-3px);box-shadow:none}
.hm-modal-actions button:focus-visible{outline:3px solid #405acb;outline-offset:3px}
#guessMessage span{display:block}

.hm-rules{margin:0;padding-left:18px;color:#51607f;display:grid;gap:10px;line-height:1.55}

.hm-guess-dialog{padding:clamp(12px,3vw,30px)}
.hm-guess-card{width:max-content;min-width:min(500px,calc(100vw - 24px));max-width:calc(100vw - 24px)}
.hm-guess-slots{display:flex;flex-wrap:wrap;gap:8px 12px;justify-content:center;align-items:flex-end;max-width:100%;min-width:0;margin-top:20px;margin-bottom:18px;padding-bottom:5px;--hm-guess-scale:1}
.hm-guess-word{display:inline-flex;align-items:flex-end;flex:0 0 auto;gap:clamp(2px,.45vw,6px);white-space:nowrap}
.hm-guess-letters{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:6px;width:100%}
.hm-guess-slot,.hm-guess-known{width:calc(54px * var(--hm-guess-scale));height:calc(58px * var(--hm-guess-scale));min-width:0;flex:0 0 auto;border-radius:calc(14px * var(--hm-guess-scale));display:grid;place-items:center;font-weight:900;font-size:calc(28px * var(--hm-guess-scale))}
.hm-guess-slot{border:1px solid #cfd7ea;background:#fff;text-align:center;color:var(--hm-text);padding:0}
.hm-guess-known{border:1px solid #d7dded;background:#eef2ff;color:#3449b5}
.hm-guess-letters button{
  min-width:0;aspect-ratio:1;height:auto;padding:0;border-radius:9px;border:1px solid var(--hm-key-edge);
  background:linear-gradient(180deg,var(--hm-key-top),var(--hm-key-bottom));box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 3px 0 #ccb57c;color:#24314c;font-weight:900;font-size:clamp(13px,2.5vw,20px);
}

.hm-guess-letters .hm-guess-delete{font-size:clamp(17px,2.8vw,23px)}
.hm-result-modal .hm-modal-card{width:min(100%,520px)}
.hm-result-modal:has(.hm-result-player:nth-child(2)) .hm-modal-card{width:min(94vw,760px)}
.hm-result-modal:has(.hm-result-player:nth-child(2)) .hm-result-players{grid-template-columns:repeat(2,minmax(0,320px));justify-content:center}
.hm-result-subtitle{margin-bottom:18px}
.hm-result-players{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.hm-result-player{padding:14px;border:1px solid #dae1ef;border-radius:20px;background:#fff}
.hm-result-player h3{margin:0 0 14px;font-size:21px}
.hm-result-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #edf1f7;color:#53617e}
.hm-result-row:last-child{border-bottom:0}

.hm-confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:200}
.hm-confetti i{position:absolute;top:-20px;left:var(--x);width:9px;height:15px;border-radius:2px;animation:hm-fall var(--duration) cubic-bezier(.25,.45,.57,1) var(--delay) both}
@keyframes hm-fall{to{transform:translate(var(--dx),110vh) rotate(800deg);opacity:0}}

.hm-designer{
  position:fixed;right:40px;bottom:max(22px,env(safe-area-inset-bottom) + 14px);z-index:50;
  color:rgba(64,90,203,.8);text-decoration:none;font-size:10px;font-weight:500;letter-spacing:.02em;opacity:.55;
  border:1px solid rgba(123,132,154,.18);background:rgba(255,255,255,.45);backdrop-filter:blur(4px);
  border-radius:999px;padding:3px 8px;transition:all .18s ease;
}
.hm-designer:hover,.hm-designer:focus-visible{color:#405acb;border-color:#90a0da;background:#fff;opacity:1}
.hm-fullscreen-exit{display:none;position:fixed;top:14px;right:16px;z-index:1001;width:48px;height:48px;align-items:center;justify-content:center;border:1px solid rgba(196,202,220,.7);border-radius:16px;background:rgba(255,255,255,.95);color:#263251;box-shadow:0 10px 28px rgba(21,33,76,.18)}
:fullscreen .games-header,.games-is-fullscreen .games-header{display:none!important}
:fullscreen .hm-fullscreen-exit:not([hidden]),.games-is-fullscreen .hm-fullscreen-exit:not([hidden]){display:flex}

/* Setup screen: denser phone controls, comfortable desktop typography. */
@media (min-width:768px){
 .hm-grade-select{font-size:20px;font-weight:850}
 .hm-count-label select{font-size:17px;font-weight:750}
}
@media (max-width:767px){
 .hm-setup-screen{display:flex}
 .hm-setup-card{width:100%;display:flex;flex-direction:column}
 .hm-grade-row{margin-bottom:10px}
 .hm-grade-select{font-size:16px;min-height:43px}
 .hm-unit-list{justify-content:center;gap:6px 8px;overflow:visible;padding:0}
 .hm-unit-card{flex:1 1 190px;display:flex;align-items:center;gap:8px;min-height:46px;padding:8px 10px;border-radius:14px}
 .hm-unit-card strong{flex:0 0 auto;font-size:15px;margin-bottom:0;line-height:1.18}
 .hm-unit-card span{flex:1 1 auto;min-width:0;font-size:11px;line-height:1.24}
 .hm-setup-bottom{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:9px}
 .hm-setup-selects{display:contents}
 .hm-count-label{min-width:0;gap:5px;font-size:10px;letter-spacing:.025em}
 .hm-count-label select{width:100%;min-width:0;min-height:42px;padding:0 7px;font-size:13px;font-weight:750;border-radius:11px}
 .hm-setup-bottom>.hm-start-comic{width:100%;min-height:42px;padding:0}
 .hm-setup-bottom>.hm-start-comic svg{height:48px}
}
/* Navigation controls: Back, Restart, Pause, Fullscreen. */
.games-header .games-header-controls #backToSetup{order:-40}
.games-header .games-header-controls #restartHeader{order:-30}
.games-header .games-header-controls #pauseGame{order:-20}
.games-header .games-header-controls #fullscreenToggleBtn{order:-10}

/* Move the setup actions down within the actual viewport, independent of screen width. */@media (max-width:767px){
  .hm-shell:not(.hm-is-playing){
    height:calc(100dvh - var(--games-header-height,51px));
    min-height:0;
    padding:0;
    display:flex;
    flex-direction:column;
  }
  .hm-shell:not(.hm-is-playing) .hm-setup-screen{display:flex;flex:1;min-height:0;height:100%}
  .hm-shell:not(.hm-is-playing) .hm-setup-card{
    display:flex;flex:1;flex-direction:column;
    height:100%;min-height:0;max-height:100%;overflow-y:auto;
    padding:10px 9px max(42px,env(safe-area-inset-bottom) + 34px);
  }
  .hm-shell:not(.hm-is-playing) .hm-setup-bottom{
    margin-top:auto;
    padding-top:4px;
    flex:0 0 auto;
  }
}
@media (min-width:768px){
  .hm-shell:not(.hm-is-playing){
    display:flex;flex-direction:column;
    height:calc(100dvh - var(--games-header-height,60px));
    min-height:0;
    padding:0;
    overflow:hidden;
  }
  .hm-shell:not(.hm-is-playing) .hm-setup-screen{display:flex;flex:1;min-height:0;height:100%}
  .hm-shell:not(.hm-is-playing) .hm-setup-card{
    display:flex;flex-direction:column;flex:1;height:100%;min-height:0;max-height:100%;
    overflow-y:auto;padding-bottom:clamp(18px,2vh,28px);
  }
  .hm-setup-bottom{margin-top:auto;padding-top:12px}
}
/* Hint letters are revealed with a prominent chalk pop, including repeated letters. */
.hm-letter.hm-hint-reveal{
  animation:hm-hint-chalk 1.65s cubic-bezier(.2,.75,.25,1) both;
}
@keyframes hm-hint-chalk{
  0%{opacity:0;transform:translateY(-28px) scale(1.9) rotate(-12deg);color:#fff1a3;text-shadow:0 0 18px #fff,0 0 45px #ffdb41;filter:brightness(2.5)}
  22%{opacity:1;transform:translateY(8px) scale(1.48) rotate(7deg);color:#ffe568;text-shadow:0 0 16px #fff,0 0 40px #ffca37;filter:brightness(2)}
  43%{transform:translateY(-9px) scale(1.28) rotate(-5deg);color:#fff5a3;text-shadow:0 0 22px #fff,0 0 45px #ffcc38;filter:brightness(1.8)}
  65%{transform:translateY(4px) scale(1.16) rotate(3deg);color:#fff7be;text-shadow:0 0 14px #fff,0 0 30px #ffda55;filter:brightness(1.5)}
  83%{transform:translateY(-2px) scale(1.06) rotate(-1deg);text-shadow:0 0 12px #ffeb83;filter:brightness(1.2)}
  100%{opacity:1;transform:translateY(0) scale(1);color:#fff;text-shadow:none;filter:none}
}

.hm-player-station .hm-keyboard .hm-hint-key:disabled{
  opacity:.34;filter:grayscale(1);background:linear-gradient(180deg,#f4f3ef,#e1e0db);
  color:#82858c;border-color:#c8c8c8;box-shadow:inset 0 1px 0 #ffffffaa,0 3px 0 #c1c1c1;
  cursor:not-allowed;transform:none;
}
.hm-player-station .hm-keyboard .hm-hint-key:disabled:hover{transform:none;box-shadow:inset 0 1px 0 #ffffffaa,0 3px 0 #c1c1c1}


.hm-shell.hm-is-playing{width:100%;max-width:none;height:calc(100dvh - var(--games-header-height,70px));padding:0;overflow:hidden}
.hm-play-screen,.hm-game,.hm-playarea{width:100%;height:100%;min-height:0;min-width:0}
.hm-game{overflow:hidden;border:0;border-radius:0;background:radial-gradient(circle at 50% 24%,rgba(255,255,255,.05),transparent 34%),repeating-linear-gradient(180deg,var(--hm-board) 0,var(--hm-board) 34px,var(--hm-board-line) 34px,var(--hm-board-line) 35px);box-shadow:inset 0 0 0 2px rgba(255,255,255,.06),inset 0 15px 45px rgba(0,0,0,.19)}
.hm-playarea{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr) minmax(0,1fr);grid-template-areas:"one center two";gap:clamp(8px,1vw,16px);padding:clamp(8px,1vw,17px)}
.hm-playarea:not(.hm-two-players){grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);grid-template-areas:"center one"}
.hm-center-stage{grid-area:center;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:clamp(5px,1vh,14px);min-width:0;min-height:0;padding:0 4px;overflow:hidden}
.hm-board-unit-title{display:flex;flex:0 0 clamp(54px,8dvh,78px);flex-direction:column;align-items:center;justify-content:center;gap:2px;width:100%;max-width:100%;font:700 clamp(16px,1.5vw,22px)/1.25 "Segoe Print","Comic Sans MS",cursive;color:var(--hm-chalk);text-align:center;white-space:nowrap;text-shadow:0 0 5px #ffffff33}
.hm-unit-number{font-size:.82em}.hm-unit-name{font-size:1.35em;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.hm-illustration{display:flex;align-items:center;justify-content:center;flex:1 1 0;height:auto;min-height:0;width:100%;overflow:hidden}
.hm-illustration svg{display:block;max-width:100%;height:100%;width:auto;max-height:100%;filter:drop-shadow(0 8px 24px #0002)}
.hm-part{fill:none;stroke:var(--hm-chalk);stroke-width:7;stroke-linecap:round;stroke-linejoin:round;opacity:0;stroke-dasharray:1;stroke-dashoffset:1;transition:none}.hm-part.visible{opacity:1;stroke-dashoffset:0;transition:stroke-dashoffset .85s cubic-bezier(.2,.7,.15,1),opacity .1s ease}.hm-part.hm-rope.visible{transition:none}
.hm-figure{fill:none;stroke:var(--hm-chalk);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}.hm-eye-slot{transition:transform .18s ease}.hm-eye-left{transform-origin:154px 76px}.hm-eye-right{transform-origin:172px 76px}.hm-illustration[data-turn="left"] .hm-eye-left{transform:translateX(-3px) scale(.88)}.hm-illustration[data-turn="left"] .hm-eye-right{transform:translateX(-3px) scale(1.12)}.hm-illustration[data-turn="right"] .hm-eye-left{transform:translateX(3px) scale(1.12)}.hm-illustration[data-turn="right"] .hm-eye-right{transform:translateX(3px) scale(.88)}.hm-eyes{fill:none;stroke:var(--hm-chalk);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:0}.hm-eyes-round,.hm-eyes-heart{fill:var(--hm-chalk);stroke:none}.hm-illustration[data-eyes="round"] .hm-eyes-round,.hm-illustration[data-eyes="line"] .hm-eyes-line,.hm-illustration[data-eyes="heart"] .hm-eyes-heart,.hm-illustration[data-eyes="x"] .hm-eyes-x{opacity:1}
.hm-mouth{transition:transform .18s ease}.hm-illustration[data-turn="left"] .hm-mouth{transform:translateX(-3px)}.hm-illustration[data-turn="right"] .hm-mouth{transform:translateX(3px)}.hm-mouth-expression{fill:none;stroke:var(--hm-chalk);stroke-width:2.7;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:opacity .16s ease}.hm-illustration:not([data-mouth]) .hm-mouth-flat,.hm-illustration[data-mouth="flat"] .hm-mouth-flat,.hm-illustration[data-mouth="smile"] .hm-mouth-smile,.hm-illustration[data-mouth="frown"] .hm-mouth-frown,.hm-illustration[data-mouth="big-smile"] .hm-mouth-big-smile,.hm-illustration[data-mouth="cry"] .hm-mouth-cry,.hm-illustration[data-mouth="dead"] .hm-mouth-dead{opacity:1}.hm-mouth-dead>path:first-child{fill:none}.hm-mouth-dead .hm-tongue{fill:#f3a5a8;stroke:#f3a5a8;stroke-width:1.8}.hm-tears{opacity:0;fill:var(--hm-chalk);stroke:none;transition:opacity .2s ease}.hm-illustration[data-mouth="cry"] .hm-tears{opacity:1;animation:hm-cry-tears .75s ease-in-out infinite alternate}@keyframes hm-cry-tears{from{transform:translateY(-2px);opacity:.55}to{transform:translateY(4px);opacity:1}}
.hm-word-area{display:flex;flex:0 1 auto;min-height:clamp(88px,15dvh,135px);flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;min-width:0;padding:0 2px;background:transparent}
.hm-word{display:flex;width:100%;flex-wrap:wrap;justify-content:center;align-items:flex-end;align-content:center;column-gap:clamp(10px,1.4vw,22px);row-gap:5px;min-height:40px;max-width:100%;flex-shrink:0}
.hm-meaning{height:clamp(32px,5dvh,52px);min-height:0;width:100%;overflow:auto;color:#ffe4a8;font-size:clamp(16px,1.5vw,25px);font-weight:800;text-align:center;overflow-wrap:anywhere;flex-shrink:1}.hm-meaning[hidden]{display:block!important;visibility:hidden}
.hm-stat-center{display:flex;flex-direction:column;align-items:center;gap:2px;flex:0 0 clamp(64px,10dvh,90px);margin-bottom:clamp(16px,3dvh,36px);color:var(--hm-chalk);font-family:"Segoe Print","Comic Sans MS",cursive}
.hm-stat-center strong{font-size:clamp(28px,3vw,47px);line-height:1.1;color:#ffb89a}.hm-board-progress{font:850 clamp(12px,1.1vw,16px)/1.2 "Segoe Print","Comic Sans MS",cursive;color:var(--hm-chalk);text-align:center}.hm-board-progress::before{content:"KELİME "}.hm-stat-center.hm-time-low strong{color:#ff8f8f}.hm-mobile-lives{display:none}
.hm-stat-player{position:absolute;z-index:2;top:clamp(12px,2vw,24px);left:clamp(12px,2vw,26px);display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;font-family:"Segoe Print","Comic Sans MS",cursive;color:var(--hm-chalk);text-shadow:0 0 3px #ffffff22}
#playerTwoStat{left:auto;right:clamp(12px,2vw,26px);align-items:flex-end;text-align:right}
.hm-playarea.hm-two-players .hm-score-label{display:none}
.hm-player-label{font-size:clamp(13px,1.3vw,19px);font-weight:850}.hm-score-label{font-size:clamp(12px,1.1vw,16px);font-weight:800}.hm-stat-player strong{font-size:clamp(27px,2.9vw,44px);line-height:1;color:#ffdf80}.hm-stat-lives{font-size:clamp(12px,1vw,15px);font-weight:750;color:var(--hm-chalk)}
.hm-player-station{min-width:0;min-height:0;grid-area:one;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:0 4px 4px;background:transparent}
.hm-station-two{grid-area:two}.hm-player-station .hm-keyboard{margin-top:auto;flex:0 0 auto;grid-template-rows:none;gap:clamp(5px,.5vw,10px)}
.hm-keyboard .hm-key-used{visibility:hidden}
.hm-player-station .hm-key{min-height:0;height:auto;aspect-ratio:1;max-height:none;border-radius:10px;font-size:clamp(16px,1.55vw,26px);box-shadow:inset 0 1px 0 #ffffffd9,0 3px 0 #ccb57c,0 8px 12px #51451f22}
.hm-player-station .hm-guess-trigger{flex:0 0 44px;min-height:44px;border-radius:12px;font-size:15px;font-weight:850}
.hm-playarea:not(.hm-two-players) .hm-center-stage{padding-inline:clamp(10px,3vw,32px)}
.hm-playarea:not(.hm-two-players) .hm-board-unit-title{align-items:flex-start;text-align:left}
.hm-playarea:not(.hm-two-players) #playerOneStat{left:auto;right:clamp(12px,2vw,26px);align-items:flex-end;text-align:right}
.hm-playarea:not(.hm-two-players) .hm-player-label{display:none}
.hm-playarea:not(.hm-two-players) .hm-keyboard{margin-top:auto}
.hm-native-letter-input,.hm-mobile-keyboard-toggle,.hm-modal-keyboard-toggle,.hm-mobile-hint-button{display:none}
.hm-keyboard .hm-hint-key{display:flex;flex-direction:row;align-items:center;justify-content:center;grid-column:span 2;aspect-ratio:auto;gap:8px;min-width:0;overflow:hidden;padding:0 8px}
.hm-keyboard .hm-hint-icon{display:block;flex:0 0 auto;width:clamp(20px,1.8vw,28px);height:clamp(20px,1.8vw,28px);max-width:none;max-height:none;stroke-width:2.2}
.hm-keyboard .hm-hint-key span{display:block;max-width:100%;font-size:clamp(11px,.9vw,15px);font-weight:900;line-height:1.1;letter-spacing:.05em;white-space:nowrap}
@media (max-width:1024px) and (min-width:768px){
 .hm-playarea{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr) minmax(0,1fr);gap:5px;padding:8px}
 .hm-player-station{padding:0 1px 4px}.hm-player-station .hm-keyboard{gap:4px}.hm-player-station .hm-key{font-size:clamp(13px,1.6vw,19px)}
 .hm-player-label{font-size:13px}.hm-board-unit-title{font-size:17px}.hm-stat-player strong{font-size:30px}
}
@media(max-width:767px){
 .hm-shell.hm-is-playing{height:calc(100dvh - var(--games-header-height,51px));padding:0}
 .hm-game{border-radius:0;border-width:0}
 .hm-playarea,.hm-playarea:not(.hm-two-players){display:flex;flex-direction:column;gap:3px;padding:5px}
 .hm-center-stage{order:0;flex:1 1 0;width:100%;padding:4px 4px 3px;gap:6px}
 .hm-board-unit-title{flex-basis:clamp(58px,9dvh,76px);font-size:clamp(17px,4.2vw,23px);gap:1px;padding:2px 4px 0;align-items:center;text-align:center}.hm-unit-number{font-size:clamp(13px,3.6vw,18px)}.hm-unit-name{font-size:clamp(18px,5.3vw,28px);line-height:1.12;max-width:100%;text-align:center}
 .hm-stat-player{top:clamp(68px,12dvh,95px);left:16px;gap:2px}.hm-playarea:not(.hm-two-players) #playerOneStat{top:clamp(68px,12dvh,95px);left:16px;right:auto;align-items:flex-start;text-align:left}
 .hm-player-label{font-size:clamp(11px,3vw,13px)}.hm-playarea:not(.hm-two-players) .hm-score-label{display:block;font-size:clamp(11px,3.2vw,14px)}
 .hm-stat-lives{font-size:clamp(11px,3vw,13px)}
 .hm-playarea:not(.hm-two-players) .hm-stat-lives{display:none}
 .hm-center-stage .hm-stat-center{position:absolute;top:clamp(68px,12dvh,95px);right:16px;align-items:flex-end;gap:4px;flex:0 0 auto;margin-bottom:0}
 .hm-stat-center strong,.hm-stat-player strong{font-size:clamp(29px,8vw,40px)}.hm-board-progress{font-size:12px}.hm-word-area .hm-mobile-lives{display:block;position:absolute;bottom:0;left:0;right:0;text-align:center;flex:0 0 auto;font:800 clamp(13px,3.6vw,16px)/1.2 "Segoe Print","Comic Sans MS",cursive;color:var(--hm-chalk);white-space:nowrap}

 .hm-illustration{flex:0 0 clamp(205px,38dvh,325px);height:clamp(205px,38dvh,325px);padding-top:2px}.hm-illustration svg{width:min(95vw,400px);max-height:100%}
 .hm-word-area{position:relative;flex:1 1 auto;min-height:min-content;padding-bottom:22px}
 .hm-word{column-gap:10px;row-gap:3px;min-height:38px}.hm-word-group{gap:3px}.hm-letter{min-width:calc(clamp(16px,5vw,26px) * var(--hm-word-scale,1));height:calc(clamp(29px,7.5vw,37px) * var(--hm-word-scale,1));font-size:calc(clamp(20px,6vw,28px) * var(--hm-word-scale,1));border-bottom-width:3px}.hm-meaning{font-size:clamp(15px,4.5vw,22px)}
 .hm-player-station{order:1;flex:0 0 auto;display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch;justify-content:space-between;gap:5px;padding:3px 0 0;width:100%}
 .hm-player-station .hm-keyboard{display:none}.hm-play-screen.hm-keys-open .hm-word-area{flex:1 1 auto;min-height:min-content}.hm-play-screen.hm-keys-open .hm-station-one .hm-keyboard{order:-1;display:grid;flex:0 0 100%;grid-template-rows:none;gap:4px;padding:5px 1px 7px;margin:0}
 .hm-play-screen.hm-keys-open .hm-station-one .hm-key{height:auto;font-size:clamp(14px,4vw,18px);border-radius:8px}
 .hm-player-station .hm-guess-trigger{flex:1 1 0;min-width:0;min-height:43px;height:43px;font-size:14px}
 .hm-mobile-hint-button,.hm-mobile-keyboard-toggle{display:flex;flex:0 0 43px;width:43px;height:43px;align-items:center;justify-content:center;padding:9px;border:1px solid #aca28099;border-radius:10px;background:#fff7e1;color:#30435b;box-shadow:0 2px 4px #17242f22}
 .hm-mobile-hint-button svg,.hm-mobile-keyboard-toggle svg{width:23px;height:23px}
 .hm-mobile-hint-button{order:0}.hm-station-one .hm-guess-trigger{order:1}.hm-mobile-keyboard-toggle{order:2}
 .hm-mobile-hint-button:disabled{opacity:.45;filter:grayscale(1);cursor:not-allowed;box-shadow:none}
 .hm-mobile-keyboard-toggle[aria-pressed="true"]{background:#dfe9ff;border-color:#6083d5;color:#2a4aa4}
 .hm-native-letter-input{display:block;position:fixed;left:2px;bottom:2px;width:2px;height:2px;opacity:.01;z-index:-1}
 .hm-guess-dialog .hm-guess-card{position:relative;padding-bottom:70px}.hm-guess-dialog .hm-guess-letters{display:none}.hm-guess-dialog.hm-modal-keys-open .hm-guess-letters{display:grid}
 .hm-guess-dialog .hm-modal-keyboard-toggle{position:absolute;right:16px;bottom:15px;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:9px;border:1px solid #cdd9ea;border-radius:11px;background:#f6f8fc;color:#364463}
 .hm-guess-dialog .hm-modal-keyboard-toggle svg{width:24px;height:24px}.hm-guess-dialog .hm-modal-keyboard-toggle[aria-pressed="true"]{background:#e3eaff;border-color:#7f99df}.hm-guess-dialog .hm-modal-actions{padding-right:50px}

}
@media(max-width:420px){.hm-board-unit-title{font-size:clamp(15px,4.2vw,19px)}.hm-unit-name{font-size:clamp(17px,5.1vw,23px)}}
@media(max-width:640px){.hm-result-modal:has(.hm-result-player:nth-child(2)) .hm-result-players{grid-template-columns:minmax(0,1fr)}}
@media(max-height:610px) and (max-width:767px){.hm-board-unit-title{font-size:clamp(14px,3.8vw,18px);flex-basis:50px}.hm-unit-name{font-size:clamp(16px,4.7vw,22px)}.hm-stat-player,.hm-center-stage .hm-stat-center{top:62px}.hm-illustration{flex:0 0 clamp(150px,33dvh,210px);height:clamp(150px,33dvh,210px);padding-top:2px}}

/* Two-player phones use the same board and side-by-side stations in landscape. */
@media (max-width:767px) and (orientation:landscape){
 .hm-play-screen.hm-two-player-layout .hm-playarea{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr) minmax(0,1fr);grid-template-areas:"one center two";gap:4px;padding:5px}
 .hm-play-screen.hm-two-player-layout .hm-center-stage{width:auto;order:initial;flex-direction:column;padding:0 2px;gap:2px}
 .hm-play-screen.hm-two-player-layout .hm-board-unit-title{padding:0;font-size:clamp(12px,2.4dvh,17px)}
 .hm-play-screen.hm-two-player-layout .hm-stat-player{top:7px;left:8px;gap:1px}
 .hm-play-screen.hm-two-player-layout #playerTwoStat{left:auto;right:8px;align-items:flex-end}
 .hm-play-screen.hm-two-player-layout .hm-player-label{font-size:11px}
 .hm-play-screen.hm-two-player-layout .hm-stat-player strong{font-size:23px}
 .hm-play-screen.hm-two-player-layout .hm-score-label{display:none}
 .hm-play-screen.hm-two-player-layout .hm-illustration{flex:0 0 clamp(60px,22dvh,115px);height:clamp(60px,22dvh,115px);padding-top:0}
 .hm-play-screen.hm-two-player-layout .hm-illustration svg{width:auto;max-height:100%}
 .hm-play-screen.hm-two-player-layout .hm-center-stage .hm-stat-center{position:static;align-items:center;gap:1px}
 .hm-play-screen.hm-two-player-layout .hm-stat-center strong{font-size:23px}
 .hm-play-screen.hm-two-player-layout .hm-word-area .hm-mobile-lives{display:block;font-size:11px}
 .hm-play-screen.hm-two-player-layout .hm-player-station{order:initial;grid-area:one;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-end;gap:5px;padding:0 1px 2px;width:auto}
 .hm-play-screen.hm-two-player-layout .hm-station-two{grid-area:two}
 .hm-play-screen.hm-two-player-layout .hm-player-station .hm-keyboard{display:grid;flex:0 0 auto;grid-template-rows:none;gap:3px;margin-top:auto}
 .hm-play-screen.hm-two-player-layout .hm-player-station .hm-key{height:auto;font-size:clamp(11px,2.7dvh,17px);border-radius:5px}
 .hm-play-screen.hm-two-player-layout .hm-player-station .hm-guess-trigger{flex:0 0 31px;min-height:31px;height:31px;font-size:11px}
 .hm-play-screen.hm-two-player-layout .hm-word{min-height:24px}
 .hm-play-screen.hm-two-player-layout .hm-letter{min-width:calc(13px * var(--hm-word-scale,1));height:calc(25px * var(--hm-word-scale,1));font-size:calc(17px * var(--hm-word-scale,1))}
 .hm-play-screen.hm-two-player-layout .hm-meaning{height:25px;font-size:13px}
 .hm-play-screen.hm-two-player-layout .hm-mobile-hint-button,.hm-play-screen.hm-two-player-layout .hm-mobile-keyboard-toggle{display:none}
}
.hm-rotate-notice{display:none}
@media (max-width:900px) and (orientation:portrait){
 .hm-play-screen.hm-two-player-layout .hm-rotate-notice{position:fixed;inset:var(--games-header-height,51px) 0 0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;background:var(--hm-board);color:var(--hm-chalk);font-size:21px;font-weight:800;text-align:center}
 .hm-play-screen.hm-two-player-layout .hm-rotate-notice svg{width:70px;height:70px}
}

/* Mobile designer credit: same spacing from the left and bottom edges. */
@media (max-width:767px){
  .hm-designer{
    left:16px;
    right:auto;
    bottom:max(16px, env(safe-area-inset-bottom) + 16px);
  }
}

.hm-grade-select{width:min(340px,100%);max-width:340px}
.hm-grade-select option{font-size:15px;padding:3px 8px}