html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; background: #070b12; color: #f2f5f8; font-family: system-ui, sans-serif; }
canvas { display: block; width: 100%; height: 100%; }
#hud { position: fixed; left: 0; right: 0; top: 0; display: flex; gap: 24px; justify-content: center; padding: 12px; font-size: 20px; font-weight: 600; text-shadow: 0 2px 6px #000; pointer-events: none; }
#message { color: #ffd166; }
#overlay { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(10, 24, 40, 0.55); backdrop-filter: blur(3px); }
#overlay .panel { background: rgba(12, 28, 48, 0.92); border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 16px; padding: 32px 40px; max-width: 560px; text-align: center; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45); }
#overlay h1 { margin: 0 0 12px; font-size: 40px; letter-spacing: 1px; }
#overlay p { line-height: 1.5; }
#overlay .controls { font-size: 14px; opacity: 0.85; }
#start { margin-top: 16px; font-size: 20px; font-weight: 700; padding: 12px 34px; border: none; border-radius: 999px; background: #ffd166; color: #26221a; cursor: pointer; }
#start:hover { background: #ffe08a; }