:root {--board-edge:#64748b;--block-line:#2563eb;}
:root[data-theme=dark] {--board-edge:#94a3b8;--block-line:#93c5fd;}
@media(prefers-color-scheme:dark) {:root:not([data-theme=light]) {--board-edge:#94a3b8;--block-line:#93c5fd;}}
#board {grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:2px solid var(--board-edge);border-radius:8px;overflow:hidden;background:var(--bg);}
.cell {font-size:1.75rem;font-weight:650;border-radius:0;border:1px solid var(--board-edge);min-width:44px;min-height:44px;}
.cell.block {background:var(--selected);}
.cell.edge-top {border-top:3px solid var(--block-line);} .cell.edge-bottom {border-bottom:3px solid var(--block-line);} .cell.edge-left {border-left:3px solid var(--block-line);} .cell.edge-right {border-right:3px solid var(--block-line);}
.cell:disabled {opacity:1;}
.rotation-actions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;max-width:430px;margin:0 auto 8px;}
.rotation-actions button {min-height:48px;padding:6px 2px;font-size:.9rem;}
.play-actions {grid-template-columns:repeat(3,minmax(0,1fr));}
@media(max-width:360px) {main {width:calc(100% - 16px);} .cell {font-size:1.5rem;}}