.minesweeper-board{display:grid;gap:1px;box-sizing:border-box;inline-size:min(100%,29rem);aspect-ratio:1 / 1;margin-inline:auto;overflow:hidden;padding:var(--space-2);background:#dbe3f0}.minesweeper-board[data-difficulty=medium]{inline-size:min(100%,43rem)}.minesweeper-board[data-difficulty=hard]{inline-size:min(100%,78rem);aspect-ratio:30 / 16}.minesweeper-cell{position:relative;display:grid;place-items:center;min-inline-size:0;min-block-size:0;padding:0;border:0;border-radius:0;background:#eaf0fa;color:var(--color-ink);font-size:1rem;font-weight:800;line-height:1;cursor:pointer;box-shadow:inset 0 1px #fff}.minesweeper-cell:hover:not(.is-open){background:#dce7f8}.minesweeper-cell.is-open{background:#fff;box-shadow:none}.minesweeper-cell.is-mine{background:#ffe1df;color:#7b2020}.minesweeper-cell.is-cursor,.minesweeper-cell:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px}.minesweeper-number-1{color:#2459c8}.minesweeper-number-2{color:#28713d}.minesweeper-number-3{color:#b12d32}.minesweeper-number-4{color:#473f91}.minesweeper-number-5{color:#7d3344}.minesweeper-number-6{color:#167274}.minesweeper-number-7{color:#28313c}.minesweeper-number-8{color:#52606e}.minesweeper-flag{position:relative;inline-size:.8rem;block-size:1rem;border-inline-start:2px solid #273241}.minesweeper-flag:after{content:"";position:absolute;inset-block-start:0;inset-inline-start:0;inline-size:.62rem;block-size:.48rem;background:#c83c45;clip-path:polygon(0 0,100% 20%,0 100%)}.minesweeper-controls{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap;margin:var(--space-4) 0}@media(max-width:30rem){.minesweeper-board[data-difficulty=hard]{inline-size:max-content;min-inline-size:60rem;max-inline-size:none;margin-inline:0;overflow:auto}.minesweeper-controls>*{flex:1 1 auto}}