*{box-sizing:border-box}:root{--columns: 9;--tile-size: 3rem;--tile-gap: calc(100vw / var(--columns) / 6);--bg-colour: #fff;--text-colour: #000;--tile-bg-colour: #fff}@media (prefers-color-scheme: dark){:root{--bg-colour: #000;--text-colour: #fff;--tile-bg-colour: #000}.tile{background-color:var(--tile-bg-colour);color:var(--tile-color)}.tile.selected{background-color:var(--tile-color);color:var(--tile-bg-colour)}.tile.highlighted{box-shadow:0 0 .4rem .4rem gold}.tile.selectable:hover{box-shadow:0 0 0 .1rem var(--tile-color)}.tile.unselectable{filter:blur(.075rem) grayscale(.7)}}body{background-color:var(--bg-colour);color:var(--text-colour);font-family:Lucida Sans,Lucida Sans Regular,Lucida Grande,Lucida Sans Unicode,Geneva,Verdana,sans-serif;font-size:16px;margin:0}button{background-color:var(--bg-colour);border:.1rem solid var(--text-colour);border-radius:.5rem;color:var(--text-colour);cursor:pointer;font-size:1.2rem;font-weight:700;padding:.5rem .7rem}#screen{align-items:center;display:flex;flex-direction:column;height:100vh;justify-content:space-between;justify-items:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;padding:1rem 0}header{display:flex;flex-direction:column;gap:1rem;justify-content:center;margin-bottom:2rem}header h1{font-size:2rem;font-weight:700;text-align:center}header #info{display:flex;gap:1rem;justify-content:space-around;line-height:1.8rem;opacity:.7;text-align:center;width:100vw}#board{display:grid;gap:var(--tile-gap);padding:calc(var(--tile-gap) / 2);width:100vw}#controls{display:flex;justify-content:center;gap:1rem;margin-top:3rem;opacity:.7}.cell{aspect-ratio:1;position:relative;width:100%}.tile{align-items:center;background-color:var(--tile-bg-colour);border:.15rem solid var(--tile-color);color:var(--tile-color);cursor:not-allowed;display:flex;font-size:1rem;font-weight:700;grid-area:1 / 1 / 1 / 1;height:100%;justify-content:center;padding-top:.2rem;position:absolute;width:100%}.tile.unselectable{filter:blur(.075rem) grayscale(.7)}.tile.selectable{cursor:pointer}.tile.selectable:hover{box-shadow:0 0 0 .1rem var(--tile-color)}.tile.highlighted{box-shadow:0 0 .4rem .4rem gold}.tile.selected{background-color:var(--tile-color);color:var(--tile-bg-colour)}#game-over{height:60%}#game-over h2{margin-bottom:3rem}