*{margin:0;padding:0;box-sizing:border-box;transition:all .5s ease}body,html{overflow:hidden}body{margin:0;display:grid;grid-template-columns:repeat(27,1fr);grid-template-rows:repeat(10,10vh);height:100vh;background-color:#000}canvas.webgl{position:fixed;top:0;left:0;width:100%;height:100%}div{display:flex;align-items:center;justify-content:center;font-size:2em;color:#fff;text-align:center;z-index:0}.text{margin:15px;border:3px solid #fff;color:#fff;font:75% Arial,sans-serif;padding:10px;background-color:#ff000080;border-radius:5px}.tic-tac-toe{font-family:Arial,sans-serif;height:85%;width:100%;display:grid;grid-template-columns:repeat(1,1fr);grid-template-rows:repeat(2,1fr);justify-content:space-between;background:#ffffff1a;border-radius:10px;box-shadow:0 4px 8px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin:0 15px}.grid{border:5px ridge #f00;border-radius:5px;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(5,1fr);gap:auto;height:85%;width:85%;margin:auto;padding:15px;transition:all 1.5s ease}.cell{height:85%;border:3px solid #0ff;border-radius:5px;display:flex;justify-content:center;align-items:center;margin:auto;color:#fff;font-size:1rem;transition:all .2s ease}.cell:hover{border:5px ridge #0f0}.label{border:5px outset rgba(255,0,0,1);font-size:auto;width:95%;color:#fff;margin:auto}.layers,.axis{background:#ffffff1a;border-radius:10px;box-shadow:0 4px 8px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:11px 3px;margin:auto}button{color:#7fffffbf;background:transparent;outline:2px solid #0ff;border:0;padding:7px 12px;cursor:pointer;margin:0 10px;font-weight:700;border-radius:7px}button:hover{color:#fff;background-color:#00ffff80;padding:15px 20px}button:active{color:#000;background-color:#00ffffbf}