html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #dce8f2;
  font-family: Arial, Helvetica, sans-serif;
}
#game {
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 50% 35%, #f0f8ff 0%, #dce8f2 54%, #c9d8e4 100%);
}
canvas {
  display: block;
  outline: none;
  image-rendering: auto;
  transform: translateZ(0);
  filter: contrast(1.04) saturate(1.04);
  backface-visibility: hidden;
}


.shape-home-bar{height:46px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 20px;background:#1c414b;color:#eaf5f5;font:600 12px Segoe UI,sans-serif}.shape-home-bar a{display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none;font-weight:800}.shape-home-bar img{width:29px;height:29px;background:white;border-radius:7px;padding:3px}.shape-home-bar i{font-style:normal;color:#8db5b9;margin:0 9px}.shape-home-bar span{margin-right:auto;color:#b9d3d5}#game{height:calc(100dvh - 46px)}#game:fullscreen{height:100vh}.shape-home-bar a:focus-visible{outline:3px solid #efc350;outline-offset:4px}@media(max-width:620px){.shape-home-bar span{display:none}}

.shape-mode-tools{display:flex;gap:6px}.shape-mode-tools button{border:1px solid #749197;border-radius:7px;padding:5px 11px;background:transparent;color:#fff;font:600 12px Segoe UI,sans-serif;cursor:pointer}.shape-mode-tools button:hover{background:#3f6570}.shape-home-bar{gap:14px}