/* Money Word: board, keyboard, stats. Shared base lives in ../daily.css */
.game-layout{width:100%;max-width:1040px;margin:4px auto 0;display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start}
.play-column{min-width:0;display:flex;flex-direction:column;align-items:center}
.board-wrap{width:100%;display:flex;justify-content:center}
.board{--tile:clamp(48px,min(9vw,7vh),68px);display:grid;gap:6px;perspective:700px}
.board-row{display:grid;grid-template-columns:repeat(5,var(--tile));gap:6px}
.tile{position:relative;display:grid;place-items:center;width:var(--tile);height:var(--tile);border:2px solid #CDBF9F;border-radius:12px;background:#fff;color:var(--ink);font:800 calc(var(--tile) * .46)/1 JetBrains,ui-monospace,monospace;--tb:#fff;--tc:var(--ink)}
.tile.filled{border-color:var(--ink)}
.tile.pop{animation:pop .12s ease-out}
.tile.exact,.legend-tile.exact{--tb:var(--exact);--tc:#fff;background:var(--exact);border-color:var(--exact);color:#fff}
.tile.present,.legend-tile.present{--tb:var(--gold);--tc:var(--gold-ink);background:var(--gold);border-color:var(--gold);color:var(--gold-ink)}
.tile.absent,.legend-tile.absent{--tb:var(--absent);--tc:#fff;background:var(--absent);border-color:var(--absent);color:#fff}
.tile-mark{position:absolute;right:4px;top:2px;font:800 11px/1 Jakarta,sans-serif;opacity:.9}
/* only the row just submitted flips; restored rows are plain coloured tiles */
.tile.reveal{animation:flip .55s ease both;animation-delay:calc(var(--i) * .2s)}
.tile.reveal .tile-mark{animation:markin .55s linear both;animation-delay:calc(var(--i) * .2s)}
@keyframes flip{
  0%{transform:rotateX(0);background:#fff;border-color:#CDBF9F;color:var(--ink)}
  49%{transform:rotateX(90deg);background:#fff;border-color:#CDBF9F;color:var(--ink)}
  50%{transform:rotateX(90deg);background:var(--tb);border-color:var(--tb);color:var(--tc)}
  100%{transform:rotateX(0);background:var(--tb);border-color:var(--tb);color:var(--tc)}
}
@keyframes markin{0%,49%{opacity:0}50%,100%{opacity:.9}}
@keyframes pop{50%{transform:scale(1.08)}}
.board-row.shake{animation:shake .4s ease}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}40%{transform:translateX(7px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}
.board-row.win .tile-letter{display:inline-block;animation:bounce .5s ease both;animation-delay:calc(1.1s + var(--i) * .08s)}
@keyframes bounce{0%,100%{transform:translateY(0)}40%{transform:translateY(-12px)}70%{transform:translateY(2px)}}
.board-actions{width:100%;max-width:520px;margin-top:10px;display:flex;flex-direction:column;align-items:center;gap:8px}
.hint-inline{min-height:44px;padding:0 20px;border:1.5px solid var(--ink);border-radius:999px;background:#fff;font-weight:800;font-size:14px;box-shadow:0 2px 0 rgba(23,32,51,.9)}
.hint-inline:active{transform:translateY(2px);box-shadow:none}
.hint-inline:disabled{opacity:.6;box-shadow:none;cursor:default}
.hint-inline-text{margin:0;padding:10px 14px;border-radius:12px;background:var(--accent-wash);color:var(--ink);font-size:14px;font-weight:600;text-align:center}
.game-status{width:100%;max-width:520px;min-height:24px;margin:8px auto 0;color:#8A3B16;font-size:14px;font-weight:700;line-height:1.5;text-align:center}
.keyboard{width:100%;max-width:520px;margin:6px auto 0;display:flex;flex-direction:column;gap:6px}
.key-row{display:flex;justify-content:center;gap:5px}
.key{height:50px;min-width:0;flex:1;padding:0 2px;border:0;border-radius:9px;background:#E5DCC9;color:var(--ink);font:800 14px Jakarta,sans-serif;touch-action:manipulation;transition:background-color .2s}
.key[data-key="ENTER"],.key[data-key="BACKSPACE"]{flex:1.6;font-size:13px;background:#D6CBB3}
.key.exact{background:var(--exact);color:#fff}
.key.present{background:var(--gold);color:var(--gold-ink)}
.key.absent{background:var(--absent);color:#fff}
.key:active{transform:translateY(1px)}
.keyboard-help{margin:10px 0 0;color:var(--soft);font-size:13px}
.side-column{display:flex;flex-direction:column;gap:14px;min-width:0}
.stats-card .eyebrow{margin-bottom:10px}
.stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:0;text-align:center}
.stats-grid dd{margin:0;font:800 24px/1.1 Bricolage,Jakarta,sans-serif}
.stats-grid dt{margin-top:2px;color:var(--muted);font-size:12px;font-weight:700}
.distribution{margin-top:14px;display:grid;gap:5px}
.dist-row{display:flex;align-items:center;gap:8px;font:700 13px JetBrains,monospace;color:var(--muted)}
.dist-row>span:first-child{width:12px}
.dist-bar{display:block;padding:2px 8px;border-radius:5px;background:#D8CFBB;color:var(--ink);text-align:right;font-size:12px}
.dist-row.is-today .dist-bar{background:var(--accent);color:var(--ink)}
.legend-card .eyebrow{margin-bottom:10px}
.legend-row{display:flex;gap:12px;align-items:center;margin:10px 0}
.legend-tile{width:34px;height:34px;display:grid;place-items:center;flex:none;border:2px solid var(--line);border-radius:9px;font:800 15px Jakarta,sans-serif}
.legend-row b{display:block;font-size:14px;font-weight:800}
.legend-row small{display:block;color:var(--muted);font-size:13px}
@media(max-width:899px){
  .hint-card{display:none}
  .side-column{max-width:520px;width:100%;margin:0 auto}
}
@media(min-width:900px){
  .game-layout{grid-template-columns:minmax(0,1fr) 380px;gap:36px}
  .board-actions{display:none}
  .game-status{margin-top:12px}
}
@media(min-width:1100px){
  .game-layout{max-width:1140px;grid-template-columns:minmax(0,1fr) 420px;gap:56px}
  .page-shell{padding-top:16px}
  .key{height:56px;font-size:15px}
  .keyboard{max-width:560px}
}
@media(max-width:380px){
  .key-row{gap:3px}
  .key[data-key="ENTER"],.key[data-key="BACKSPACE"]{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  .tile.reveal,.tile.reveal .tile-mark,.board-row.shake,.board-row.win .tile-letter,.tile.pop{animation:none!important}
}