:root{
  --cell-size: 60px;
}
body{font-family: Arial, Helvetica, sans-serif; margin:0; padding:0;}
.hidden{display:none}
header{background:#222;color:#fff;padding:10px}
main{padding:16px}
.card{border:1px solid #ddd;padding:12px;margin:8px;border-radius:6px}
.board{display:flex;flex-direction:column;gap:0;border:4px solid #444;width:calc(var(--cell-size)*8);}
.row{display:flex}
.cell{width:var(--cell-size);height:var(--cell-size);display:flex;align-items:center;justify-content:center;background:#f0d9b5;border:1px solid #b58863}
.cell:nth-child(even){background:#b58863}
.board.flipped{transform:rotate(180deg)}
.piece{width:48px;height:48px}
.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.controls button{margin-left:8px}
