body{font-family:sans-serif}main{display:flex}.controls{padding:0 20px}.grid{width:900px;height:900px;display:grid;grid-template-columns:repeat(var(--grid-size),1fr);grid-template-rows:repeat(var(--grid-size),1fr);gap:var(--gap)}.grid[data-map=solo],.grid[data-map=coop]{--grid-size: 37;--waypoint-font-size: 1em;--heat-indicator-size: 10px;--start-label: "S";--end-label: "E";--gap: 1px}.grid[data-map=race]{--grid-size: 17;--waypoint-font-size: 2em;--heat-indicator-size: 20px;--start-label: "Start";--end-label: "End";--gap: 2px}.cell{display:flex;align-items:center;justify-content:center;cursor:default}.cell.start:before{content:var(--start-label)}.cell.end:before{content:var(--end-label)}.cell.waypoint{font-size:var(--waypoint-font-size)}.cell{background:rgb(198,214,215)}.cell:nth-child(odd){background:rgb(211,204,195)}.cell.path{background-color:#d8e4e5}.cell.path:nth-child(odd){background-color:#e9e3db}.cell.stone.stone{background-color:#666;border-radius:6px}.cell.soft-blocked{background-color:#f0ecec}.heat-indicator{border-radius:100px;width:var(--heat-indicator-size);height:var(--heat-indicator-size);background-color:red;transition:opacity .2s;opacity:0}.heat-indicator[data-heat="1"]{opacity:.2}.heat-indicator[data-heat="2"]{opacity:.4}.heat-indicator[data-heat="3"]{opacity:.6}.heat-indicator[data-heat="4"]{opacity:.7}.heat-indicator[data-heat="5"]{opacity:.8}.heat-indicator[data-heat="6"]{opacity:.9}