body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{background-color:#232323;--grid-size: 4;display:flex;flex-direction:row;align-items:center;justify-content:center;height:100vh;width:100vw;overflow:hidden}#root{display:flex;flex-direction:column;align-items:center;justify-content:center}@media screen and (max-width: 768px){#root{flex-direction:column}}.grid{display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;--cell-size: calc(min(100vw, calc(100vh - 140px)) / var(--grid-size))}.row{display:flex;flex-direction:row;padding:0;margin:0;align-items:stretch;justify-content:stretch}.cell{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--cell-size) * .05)}.cellbordertop{border-top:calc(var(--cell-size) * .025) solid white;padding-top:calc(var(--cell-size) * .025)}.cellborderbottom{border-bottom:calc(var(--cell-size) * .025) solid white;padding-bottom:calc(var(--cell-size) * .025)}.cellborderleft{border-left:calc(var(--cell-size) * .025) solid white;padding-left:calc(var(--cell-size) * .025)}.cellborderright{border-right:calc(var(--cell-size) * .025) solid white;padding-right:calc(var(--cell-size) * .025)}.cellbordertop.cellborderleft{border-top-left-radius:calc(var(--cell-size) * .05)}.cellborderbottom.cellborderleft{border-bottom-left-radius:calc(var(--cell-size) * .05)}.cellbordertop.cellborderright{border-top-right-radius:calc(var(--cell-size) * .05)}.cellborderbottom.cellborderright{border-bottom-right-radius:calc(var(--cell-size) * .05)}.cellinner{height:calc(var(--cell-size) * .9);width:calc(var(--cell-size) * .9);border-radius:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;font-size:calc(calc(var(--cell-size) * .4) - 4px)}.actionswrapper{width:350px;display:flex;flex-direction:column}.actions{display:flex;flex-direction:row;flex-wrap:wrap;height:36px;align-items:stretch;align-self:stretch;padding-top:8px}.actions button{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;width:100px;flex-grow:1;flex-shrink:1;flex-basis:0;background:cyan;border:none;padding:4px;margin:4px;border-radius:4px}.actions button:disabled{background:gray}