/* CSS styles */
body { margin: 0; overflow: hidden; background: #0a0a0a; color: #0f0; font-family: 'Courier New', Courier, monospace; user-select: none; }
#gameCanvas { display: block; width: 100vw; height: 100vh; }
.crt::before {
    content: " ";
    display: block;
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
    z-index: 2;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
}
#ui-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 3; }
.hud { padding: 20px; font-size: 20px; text-shadow: 0 0 5px #0f0; display: flex; justify-content: space-between; flex-wrap: wrap; }
.hud div { margin-bottom: 10px; }
#game-over { display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(0, 20, 0, 0.95); padding: 40px; border: 2px solid #0f0; box-shadow: 0 0 20px #0f0; text-align: center; pointer-events: auto; z-index: 10; min-width: 300px; }
input, button { background: #000; color: #0f0; border: 1px solid #0f0; padding: 10px; font-family: inherit; font-size: 18px; outline: none; margin-top: 10px; width: 100%; box-sizing: border-box; }
button { cursor: pointer; text-transform: uppercase; font-weight: bold; transition: all 0.2s; }
button:hover { background: #0f0; color: #000; box-shadow: 0 0 10px #0f0; }
#leaderboard { margin-top: 20px; text-align: left; }
.lb-entry { display: flex; justify-content: space-between; margin-bottom: 5px; border-bottom: 1px dotted rgba(0,255,0,0.3); }
h1 { margin-top: 0; font-size: 3em; }