html,body{height:100%;margin:0;font-family:Arial,Helvetica,sans-serif;background:#87CEEB}
#ui{position:absolute;top:8px;left:8px;z-index:10}
#ui button{padding:6px 10px;margin-right:6px}
#about-btn{width:28px;height:28px;border-radius:50%;font-weight:bold}
#hud{position:absolute;top:8px;right:8px;background:rgba(255,255,255,0.8);padding:6px;border-radius:4px}
.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:rgba(0,0,0,0.45);z-index:20}
.overlay h1{color:white;margin-bottom:18px}
.overlay button{padding:12px 18px;font-size:18px}
#settings{position:absolute;left:8px;top:48px;background:rgba(255,255,255,0.95);padding:8px;border-radius:6px}

canvas{display:block}

/* about modal tweaks */
.overlay > div a { color: #0366d6; }