.wg{--gap:6px;--chrome:440px;--key-h:52px;--tile:min(58px,calc((min(100vw,520px) - 32px - (var(--len) - 1)*var(--gap))/var(--len)),max(30px,calc((100dvh - var(--chrome))/6 - var(--gap))));flex-direction:column;align-items:center;gap:14px;display:flex}.wg-board{gap:var(--gap);display:grid}.wg-board.loading{visibility:hidden}.wg-row{grid-template-columns:repeat(var(--len),var(--tile));gap:var(--gap);display:grid}.wg-tile{width:var(--tile);height:var(--tile);border:2px solid var(--line);background:var(--surface);font-family:var(--f-word);font-size:calc(var(--tile)*.52);text-transform:uppercase;-webkit-user-select:none;user-select:none;border-radius:4px;place-items:center;line-height:1;display:grid}.wg-tile.typed{border-color:var(--ink);animation:.1s ease-out wg-pop}.wg-tile.hit,.wg-tile.near,.wg-tile.miss{color:var(--surface);animation:.45s ease-out backwards wg-flip}.wg-tile.hit{background:var(--good);border-color:var(--good)}.wg-tile.near{background:var(--sun);border-color:var(--sun)}.wg-tile.miss{background:var(--muted);border-color:var(--muted)}.wg-row.shake{animation:.35s wg-shake}.wg-clues{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;min-height:28px;display:flex}.wg-next{font-size:13px}.wg-msg{text-align:center}.wg-done{text-align:center;flex-direction:column;align-items:center;gap:10px;display:flex}.wg-done b{font-family:var(--f-word);font-size:20px;font-weight:400}.wg-answer{color:var(--accent)}.wg-keys{flex-direction:column;align-items:center;gap:7px;width:100%;max-width:520px;display:flex}.wg-krow{justify-content:center;gap:5px;width:100%;display:flex}.wg-key{min-width:0;max-width:44px;height:var(--key-h);background:var(--sunk);color:var(--ink);font-family:var(--f-body);cursor:pointer;touch-action:manipulation;border:0;border-radius:5px;flex:1 1 0;padding:0;font-size:15px;font-weight:700}.wg-key.wide{flex:1.6 1 0;max-width:70px;font-size:12.5px}.wg-key:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.wg-key.hit{background:var(--good);color:var(--surface)}.wg-key.near{background:var(--sun);color:var(--surface)}.wg-key.miss{background:var(--line);color:var(--muted)}.wg-back{margin-top:6px}.wg-dist{gap:4px;width:100%;display:grid}.wg-bar{font-family:var(--f-mono);grid-template-columns:14px 1fr;align-items:center;gap:8px;font-size:12px;display:grid}.wg-bar i{background:var(--sunk);color:var(--ink);text-align:right;border-radius:3px;min-width:22px;padding:2px 6px;font-style:normal}.wg-bar i.on{background:var(--good);color:var(--surface)}.wg-legal{text-align:center;max-width:640px;margin:14px auto 0;font-size:12px}@keyframes wg-pop{50%{transform:scale(1.08)}}@keyframes wg-flip{0%{transform:rotateX(90deg)}to{transform:rotateX(0)}}@keyframes wg-shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@media (prefers-reduced-motion:reduce){.wg-tile,.wg-row.shake{animation:none!important}}@media (max-height:720px){.wg{--key-h:44px;--chrome:400px;gap:10px}.wg-keys{gap:5px}}@media (max-width:340px){.wg{--gap:4px;--key-h:40px;--tile:min(58px,calc((100vw - 32px - (var(--len) - 1)*var(--gap))/var(--len)),max(28px,calc((100dvh - 500px)/6 - var(--gap))));gap:8px}.wg-clues{min-height:20px}.wg-keys{width:100vw;max-width:none;margin-inline:calc(50% - 50vw);padding-inline:3px}.wg-krow{gap:2px}.wg-key{font-size:13px}.wg-key.wide{font-size:11px}}@media (orientation:landscape) and (max-height:520px){.wg{--key-h:40px;--tile:min(48px,calc((100dvh - 96px)/6 - var(--gap)));flex-flow:wrap;justify-content:center;align-items:center;gap:8px 20px}.wg-keys{flex:340px;order:1;gap:5px;width:auto;max-width:460px}.wg-done{flex:260px;order:1}.wg-clues,.wg-msg{flex-basis:100%;order:2}}