:root{
    --scale: 3; /* Fenster-Skalierung (ändere für größere Darstellung) */
  }
  html,body{
    height:100%;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#0b0b0b;
    color:#fff;
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial;
  }
  .container{
    text-align:center;
  }
  canvas{
    image-rendering: pixelated; /* für scharfe Vergrößerung */
    width: calc(320px * var(--scale));
    height: calc(200px * var(--scale));
    border: 6px solid #111;
    display:block;
    margin: 10px auto;
    background: #000;
  }
  .hud{
    display:flex;
    gap:12px;
    justify-content:center;
    align-items:center;
    font-size:14px;
    margin-top:6px;
  }
  button{
    background:#111;
    color:#fff;
    border:1px solid #333;
    padding:6px 10px;
    border-radius:6px;
    cursor:pointer;
  }
  .muted{opacity:0.7;font-size:13px}
  .palette-swatch {
    display:inline-block;
    width:14px;height:14px;border:1px solid #222;margin-right:6px;vertical-align:middle;
  }
  .controls{margin-top:8px;font-size:13px}
  .info{max-width:540px;margin:8px auto 0;color:#d8d8d8;font-size:13px;line-height:1.3}
  a { color:#9ad; text-decoration:none }