.wall-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.wall-heading h1{margin-bottom:0}.wordgame-open{flex:0 0 56px;width:56px;height:56px;border:1px solid #715f91;border-radius:16px;background:linear-gradient(145deg,#282331,#17151d);color:#d8c7ff;font-size:27px;font-weight:850;box-shadow:0 0 0 1px #3b3248;cursor:pointer}.wordgame-open:active{transform:scale(.96);background:#392b50}.wordgame-page{max-width:580px}.wordgame-back{margin:0 0 16px}.wordgame-title{display:flex;align-items:center;gap:12px;margin:4px 0 13px}.wordgame-title>span{font-size:30px}.wordgame-title h1{font-size:30px;margin:0}.wordgame-title .sub{margin:4px 0 0}.wordgame-intro{color:#d0cbd9;line-height:1.5}.wordgame-grid{display:grid;grid-template-columns:repeat(5,52px);grid-template-rows:repeat(6,52px);gap:7px;justify-content:center;margin:20px auto}.wordgame-cell{border:2px solid #494452;background:#17161e;border-radius:7px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:24px;text-transform:uppercase}.wordgame-cell.filled{border-color:#8873a5}.wordgame-cell.hit{background:#56845d;border-color:#56845d}.wordgame-cell.near{background:#b2903c;border-color:#b2903c}.wordgame-cell.miss{background:#494653;border-color:#494653}.wordgame-keyboard{display:flex;flex-direction:column;gap:7px;margin:18px auto 26px;max-width:470px}.wordgame-keyrow{display:flex;justify-content:center;gap:5px}.wordgame-key{flex:1;min-width:0;max-width:39px;height:48px;padding:0 2px;border:0;border-radius:6px;background:#595663;color:white;font-size:14px;font-weight:750}.wordgame-key:active{background:#8875ad}.wordgame-key.wordgame-wide{max-width:94px;font-size:12px}.wordgame-leader{margin:24px 0 18px;padding:17px;border:1px solid #564768;border-radius:16px;background:linear-gradient(145deg,#211d2a,#17161e)}.wordgame-tabs{display:flex;gap:8px}.wordgame-tab{flex:1;border:1px solid #554968;border-radius:999px;padding:9px 11px;background:#24202d;color:#ddd5eb;font-size:13px}.wordgame-tab.active{background:#b59aff;color:#161020;border-color:#b59aff;font-weight:750}.wordgame-leader h2{font-size:18px;margin:17px 0 11px}.wordgame-rank{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:11px 0;border-top:1px solid #383341;font-size:14px}.wordgame-rank span{color:#d0c3e8;text-align:right;font-size:13px}.wordgame-back-bottom{display:block;margin:24px auto 4px}@media(max-width:380px){.wordgame-grid{grid-template-columns:repeat(5,46px);grid-template-rows:repeat(6,46px);gap:6px}.wordgame-key{height:43px;font-size:12px}}
/* Compact leaderboard aligned at the upper-right of the game header. */
.wordgame-page{max-width:900px}
.wordgame-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,250px);gap:18px;align-items:start;margin:4px 0 12px}
.wordgame-intro-block{min-width:0}
.wordgame-intro-block .wordgame-title{margin-top:0}
.wordgame-intro-block .wordgame-intro{margin-bottom:0}
.wordgame-top .wordgame-leader{min-width:0;box-sizing:border-box;margin:0;padding:12px;border-radius:13px}
.wordgame-top .wordgame-tabs{gap:5px}
.wordgame-top .wordgame-tab{padding:8px 5px;font-size:12px;line-height:1.2;white-space:nowrap}
.wordgame-top .wordgame-leader h2{font-size:15px;line-height:1.25;margin:10px 0 6px}
.wordgame-top .wordgame-rank{padding:7px 0;gap:7px;font-size:13px}
.wordgame-top .wordgame-rank span{font-size:12px}
.wordgame-top .wordgame-leader .sub{font-size:12px;line-height:1.35;margin:5px 0}
@media(max-width:560px){
 .wordgame-top{grid-template-columns:minmax(0,1fr) minmax(150px,43%);gap:9px;margin-top:2px}
 .wordgame-title{gap:7px}
 .wordgame-title>span{font-size:24px}
 .wordgame-title h1{font-size:24px}
 .wordgame-intro{font-size:13px;line-height:1.4}
 .wordgame-top .wordgame-leader{padding:9px;border-radius:11px}
 .wordgame-top .wordgame-tab{padding:7px 3px;font-size:10px}
 .wordgame-top .wordgame-leader h2{font-size:13px;margin:8px 0 5px}
 .wordgame-top .wordgame-rank{padding:6px 0;gap:4px;font-size:12px}
 .wordgame-top .wordgame-rank b{font-size:12px;white-space:nowrap}
 .wordgame-top .wordgame-rank span{font-size:11px}
 .wordgame-grid{margin:12px auto 16px}
}
@media(max-width:370px){
 .wordgame-top{grid-template-columns:minmax(0,1fr) minmax(138px,44%);gap:6px}
 .wordgame-top .wordgame-leader{padding:8px}
 .wordgame-top .wordgame-tab{font-size:9px;padding-left:2px;padding-right:2px}
 .wordgame-title h1{font-size:22px}
}

/* iPhone game mode: fit the full board and keyboard above the Safari controls. */
@media(max-width:600px){
 body:has(.wordgame-page)>header{display:none}
 body:has(.wordgame-page)>footer#nav{display:none}
 body:has(.wordgame-page)>main#app{padding-bottom:0;min-height:0}
 .wordgame-page{max-width:none;padding:6px 12px 8px}
 .wordgame-back{margin:0 0 5px;padding:7px 10px}
 .wordgame-top{grid-template-columns:minmax(0,1fr) minmax(145px,42%);gap:8px;margin:0 0 5px}
 .wordgame-title{gap:6px;margin:0 0 5px}
 .wordgame-title>span{font-size:22px}
 .wordgame-title h1{font-size:22px;line-height:1.1}
 .wordgame-title .sub{font-size:11px;line-height:1.2;margin:3px 0 0}
 .wordgame-intro{font-size:12px;line-height:1.3;margin:5px 0 0}
 .wordgame-top .wordgame-leader{padding:8px;border-radius:10px}
 .wordgame-top .wordgame-tabs{gap:4px}
 .wordgame-top .wordgame-tab{font-size:11px;line-height:1.15;padding:6px 3px;white-space:normal}
 .wordgame-top .wordgame-leader h2{font-size:12px;line-height:1.2;margin:6px 0 4px}
 .wordgame-top .wordgame-rank{padding:4px 0;gap:3px;font-size:11px}
 .wordgame-top .wordgame-rank b{font-size:11px;white-space:nowrap}
 .wordgame-top .wordgame-rank span{font-size:10px;line-height:1.2}
 .wordgame-top .wordgame-leader .sub{font-size:11px;line-height:1.25;margin:3px 0}
 .wordgame-grid{grid-template-columns:repeat(5,38px);grid-template-rows:repeat(6,38px);gap:4px;margin:7px auto 9px}
 .wordgame-cell{font-size:20px;border-radius:6px}
 .wordgame-keyboard{gap:4px;margin:7px auto 8px;max-width:390px}
 .wordgame-keyrow{gap:3px}
 .wordgame-key{height:36px;font-size:13px;border-radius:5px}
 .wordgame-key.wordgame-wide{max-width:76px;height:36px;font-size:11px}
 .wordgame-back-bottom{margin:8px auto 0}
}
@media(max-width:370px){
 .wordgame-page{padding-left:8px;padding-right:8px}
 .wordgame-top{grid-template-columns:minmax(0,1fr) minmax(138px,44%);gap:6px}
 .wordgame-grid{grid-template-columns:repeat(5,35px);grid-template-rows:repeat(6,35px);gap:4px;margin:5px auto 7px}
 .wordgame-cell{font-size:19px}
 .wordgame-keyboard{gap:3px;margin:5px auto 6px}
 .wordgame-keyrow{gap:2px}
 .wordgame-key{height:33px;font-size:12px}
 .wordgame-key.wordgame-wide{height:33px}
}

/* Compact color key sits in the board's left gutter without changing tile sizing. */
.wordgame-board-row{position:relative;margin:20px auto}
.wordgame-board-row .wordgame-grid{margin:0 auto}
.wordgame-legend{position:absolute;left:0;top:50%;transform:translateY(-50%);width:calc((100% - 288px)/2 - 10px);display:flex;flex-direction:column;gap:8px;color:#d8d3df;font-size:11px;line-height:1.25}
.wordgame-legend-title{font-weight:750;font-size:11px;line-height:1.2}
.wordgame-legend-item{display:grid;grid-template-columns:10px 1fr;align-items:center;column-gap:4px;row-gap:2px}
.wordgame-legend-item>span:last-child{grid-column:1 / -1}
.wordgame-legend-item b{font-size:10px}
.wordgame-legend-swatch{width:10px;height:10px;border-radius:3px;display:block}
.wordgame-legend-swatch.hit{background:#56845d}
.wordgame-legend-swatch.near{background:#b2903c}
.wordgame-legend-swatch.miss{background:#494653}
@media(max-width:600px){
 .wordgame-board-row{margin:7px auto 9px}
 .wordgame-legend{width:calc((100% - 206px)/2 - 8px);font-size:10px;line-height:1.25;gap:7px}
 .wordgame-legend-title{font-size:10px}
 .wordgame-legend-item{grid-template-columns:9px 1fr;column-gap:3px}
 .wordgame-legend-item b{font-size:9px}
 .wordgame-legend-swatch{width:9px;height:9px;border-radius:2px}
}
@media(max-width:370px){
 .wordgame-board-row{margin:5px auto 7px}
 .wordgame-legend{width:calc((100% - 191px)/2 - 6px);font-size:9px;gap:6px}
 .wordgame-legend-title{font-size:9px}
 .wordgame-legend-item b{font-size:9px}
}