/* All overrides require a real phone-sized touch layout, not narrow desktop. */
html.hm-phone {height:100%;overflow:hidden;overscroll-behavior:none}
.hm-phone body {position:fixed;top:var(--phone-top,0px);left:var(--phone-left,0px);width:var(--phone-w,100vw);height:var(--phone-h,100dvh);min-height:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);display:flex;flex-direction:column;overflow:hidden}
.hm-phone .mast {width:100%;max-width:none;min-height:48px;flex:0 0 48px;padding:2px 10px;gap:8px}
.hm-phone .brand {font-size:12px;letter-spacing:2px}
.hm-phone .edition {display:none}
.hm-phone button {min-height:44px;font-size:14px;touch-action:manipulation}
.hm-phone button:hover:not(:disabled),.hm-phone button:active:not(:disabled) {transform:none}
.hm-phone main {width:100%;max-width:none;flex:1;min-height:0;margin:0;padding:4px 8px 8px;overflow:auto;overscroll-behavior:contain}
.hm-phone .hero {display:block;padding:7px 2px 14px}
.hm-phone .hero h1 {font-size:39px;letter-spacing:-1px;margin:8px 0}
.hm-phone .hero .eyebrow {font-size:9px;letter-spacing:1px}
.hm-phone .intro {font-size:15px;line-height:1.3;margin:8px 0}
.hm-phone .hero-board {display:none}
.hm-phone .panel {padding:14px}
.hm-phone .panel h2 {font-size:25px;line-height:1.2}
.hm-phone .config {grid-template-columns:1fr 1fr;gap:12px}
.hm-phone input,.hm-phone select {font-size:16px}
.hm-phone .config label:first-child {grid-column:1/-1}
.hm-phone .settings {gap:12px;margin-top:14px;padding-top:12px}
.hm-phone .settings select {min-height:44px}
.hm-phone .actions {gap:7px;margin-top:12px}
.hm-phone .stats {gap:4px;margin-top:12px}
.hm-phone .stat {padding:8px 2px}
.hm-phone .stat span {font-size:9px;letter-spacing:0}
.hm-phone .footer-note {margin:14px 0}
.hm-phone .handoff,.hm-phone .paused {margin:5px auto;max-width:none}
.hm-phone .handoff .symbol {font-size:32px}
.hm-phone .handoff p {font-size:14px;line-height:1.4}
.hm-phone .handoff h2 {overflow-wrap:anywhere}
.hm-phone .lobby-list li {font-size:13px;gap:8px;overflow-wrap:anywhere}
.hm-phone .lobby-list button {min-height:44px;font-size:12px}
.hm-phone.phone-playing main {display:flex;flex-direction:column;gap:5px;overflow:hidden}
.hm-phone .game-head {flex:0 0 auto;margin:0;padding:0 2px;min-height:34px}
.hm-phone .game-head h2 {font-size:19px;line-height:1.15;margin:3px 0 0;overflow-wrap:anywhere}
.hm-phone .game-head .eyebrow {font-size:10px;letter-spacing:.5px}
.hm-phone .connection {margin:0;font-size:11px;line-height:1.2;flex:0 0 auto;max-height:28px;overflow:auto}
.hm-phone.phone-playing main>.frame {flex:1;min-height:0;padding:4px;display:flex;overflow:hidden}
.hm-phone .game-board {width:100%;min-height:0;padding:8px;display:flex;flex-direction:column;gap:6px;overflow:hidden}
.hm-phone .status-row {flex:0 0 auto;align-items:center;padding-bottom:5px;font-size:11px;letter-spacing:0;gap:8px}
.hm-phone .status-row>span:first-child {max-width:42%;line-height:1.2}
.hm-phone .status-row b {font-size:18px;margin-left:3px}
.hm-phone .status-row .tiny {font-size:10px}
.hm-phone .status-row .long-label {display:none}
.hm-phone .puzzle-area,.hm-phone .puzzle-area.long-puzzle {flex:1;min-height:0;display:flex;flex-direction:column;gap:4px;justify-content:center;overflow:auto;overscroll-behavior:contain}
.hm-phone .drawing,.hm-phone .long-puzzle .drawing {position:static;width:100%;height:auto;max-height:145px;min-height:35px;flex:1;opacity:1;margin:0;pointer-events:none}
.hm-phone .puzzle,.hm-phone .long-puzzle .puzzle {width:100%;gap:7px 12px;padding:3px 0;flex:0 0 auto;min-height:0}
.hm-phone .word {gap:2px;overflow:visible;max-width:100%}
.hm-phone .letter,.hm-phone .letter.long {width:var(--letter-width,20px);height:32px;font-size:var(--letter-font,23px);line-height:1.3}
.hm-phone .letter.punct {width:var(--letter-width,15px)}
.hm-phone .hint {flex:0 0 auto;margin:0;min-height:0;font-size:13px;line-height:1.3;max-height:52px;overflow:auto;overscroll-behavior:contain}
.hm-phone .keyboard {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;flex:0 0 auto;width:100%;max-width:none;margin:0}
.hm-phone .key {width:100%;min-width:0;min-height:44px;height:46px;font-size:21px;line-height:1;padding:4px 1px;border-bottom-width:3px}
.hm-phone .key small {font-size:10px;min-height:11px}
.hm-phone .key:disabled {transform:none}
.hm-phone .game-actions {flex:0 0 auto;justify-content:stretch;display:flex;gap:5px;margin:0}
.hm-phone .game-actions button {flex:1;padding:6px 5px;font-size:12px;line-height:1.2}
.hm-phone dialog {padding:14px;width:calc(100% - 16px);max-width:660px;max-height:calc(var(--phone-h,100dvh) - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain}
.hm-phone dialog h2 {font-size:24px;line-height:1.2}
.hm-phone dialog p {font-size:14px;line-height:1.5}
.hm-phone .dialog-head {position:sticky;top:-14px;background:#25382e;padding:6px 0;z-index:2;gap:9px;align-items:center}
.hm-phone .dialog-head h2 {margin:0}
.hm-phone #solveForm .actions {position:sticky;bottom:0;background:#25382e;padding:6px 0;flex-wrap:nowrap}
.hm-phone #solveForm .actions button {flex:1;padding:8px;font-size:14px}
.hm-phone #phoneTools {display:flex;gap:8px;margin-top:14px}
.hm-phone #phoneTools button {flex:1}
.hm-phone #phoneDetails .used {margin:12px 0;line-height:1.6;font-size:12px}
.hm-phone #phoneDetails .panel {padding:10px;margin-top:10px}
.hm-phone #phoneDetails .scores {margin:8px 0;gap:6px}
.hm-phone .phoneGames {display:block;margin-top:14px;padding:12px 0;border-top:1px solid var(--line);font:14px system-ui}
.hm-phone #toast {bottom:auto;top:52px;padding:6px 10px;max-height:64px;overflow:auto;font-size:12px;max-width:94%;z-index:10}
.hm-phone.phone-ended .keyboard {display:none}
.hm-phone.phone-ended .game-board {overflow:auto}
.hm-phone.phone-ended .result {flex:0 0 auto;margin:0;padding:10px}
.hm-phone.phone-ended .result h2 {font-size:24px;line-height:1.2}
.hm-phone.phone-ended .result p {font-size:14px;line-height:1.4;overflow-wrap:anywhere}
.hm-phone.phone-landscape .mast {flex-basis:46px;min-height:46px}
.hm-phone.phone-landscape .game-head {min-height:25px;display:block}
.hm-phone.phone-landscape .game-head>div {display:flex;justify-content:space-between;align-items:center;gap:8px}
.hm-phone.phone-landscape .game-head h2 {font-size:17px;margin:0}
.hm-phone.phone-landscape .game-head .eyebrow {font-size:10px}
.hm-phone.phone-landscape main {padding:2px 7px 4px;gap:3px}
.hm-phone.phone-landscape .game-board {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);grid-template-rows:auto minmax(0,1fr) auto;gap:4px 12px;padding:5px 7px}
.hm-phone.phone-landscape .status-row {grid-column:1;grid-row:1;font-size:10px;gap:6px;min-width:0}
.hm-phone.phone-landscape .status-row b {font-size:16px}
.hm-phone.phone-landscape .puzzle-area {grid-column:1;grid-row:2;min-height:0}
.hm-phone.phone-landscape .drawing,.hm-phone.phone-landscape .long-puzzle .drawing {min-height:20px;max-height:80px}
.hm-phone.phone-landscape .puzzle {gap:4px 8px;padding:1px 0}
.hm-phone.phone-landscape .letter {height:27px}
.hm-phone.phone-landscape .hint {grid-column:1;grid-row:3;font-size:12px;max-height:32px}
.hm-phone.phone-landscape .keyboard {grid-column:2;grid-row:1/4;grid-template-columns:repeat(9,minmax(0,1fr));align-content:center;gap:5px}
.hm-phone.phone-landscape .key {height:46px;min-height:44px;font-size:20px}
.hm-phone.phone-landscape .game-actions {justify-content:center}
.hm-phone.phone-landscape .game-actions button {flex:0 1 220px;font-size:13px}
.hm-phone.phone-landscape.phone-ended .game-board {display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto minmax(0,1fr) auto}
.hm-phone.phone-landscape.phone-ended .result {grid-column:2;grid-row:1/4;align-self:center}
@media(max-height:350px){
 .hm-phone.phone-landscape .mast {flex-basis:44px;min-height:44px}
 .hm-phone.phone-landscape .game-head {min-height:20px}
 .hm-phone.phone-landscape .key {height:44px;padding:2px 1px}
 .hm-phone.phone-landscape .keyboard {gap:4px}
 .hm-phone.phone-landscape .status-row {padding-bottom:2px;font-size:9px}
 .hm-phone.phone-landscape .game-board {gap:3px 10px;padding:4px 6px}
}