:root{
    --bg:#222;
    --panel:#222a;                 /* semi for glassy panels */
    --panel-solid:#232323;         /* solid panels */
    --text:#fff;
    --muted:#ccc;
    --border:rgba(255,255,255,.15);
    --shadow:0 2px 8px #000;
    --radius:16px;
    --radius-sm:12px;
    --accent:#87CEEB;
    --mono: "Courier New", ui-monospace, Menlo, Consolas, monospace;
    --sans: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  }

*{box-sizing:border-box}
html,body{min-height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
}

.container{
    width:100%;
    max-width:1200px;
    margin-left:auto;
    margin-right:auto;
    padding-left:16px;
    padding-right:16px;
  }

.main-content{
    display:flex;
    flex-direction:column;
    align-items:center;
    margin-top:32px;
  }

canvas{
    image-rendering:pixelated;
    border:2px solid white;
  }