:root {
    --bg: #f0f0f0;
    --panel: #ffffff;
    --border: #000000;
    --shadow-hard: 5px 5px 0px 0px #000000;
    --primary: #bef264; /* Lime */
    --danger: #f87171;  /* Red */
    --replay: #fb923c;  /* Orange */
}
body { font-family: 'Space Mono', monospace; background-color: var(--bg); height: 100vh; overflow: hidden; color: #000; }

/* Utilities */
.neo-box { background: var(--panel); border: 3px solid var(--border); box-shadow: var(--shadow-hard); }

.neo-btn { 
    background: #fff; border: 2px solid #000; box-shadow: 3px 3px 0px 0px #000; 
    font-weight: bold; cursor: pointer; transition: transform 0.1s;
}
.neo-btn:hover { transform: translate(-2px, -2px); box-shadow: 5px 5px 0px 0px #000; }
.neo-btn:active { transform: translate(0px, 0px); box-shadow: 0px 0px 0px 0px #000; }

.bubble {
    position: absolute; border-radius: 50%; border: 2px solid black; pointer-events: none;
    display: flex; align-items: center; justify-content: center; z-index: 10; 
    font-weight: bold; animation: popFloat 4s forwards ease-out; text-align: center; line-height: 1;
}

@keyframes popFloat {
    0% { transform: scale(0) translateY(0); opacity: 0; }
    20% { transform: scale(1) translateY(-20px); opacity: 1; }
    100% { transform: scale(1) translateY(-100px); opacity: 0; }
}

.blink { animation: blinker 1.5s linear infinite; }
@keyframes blinker { 50% { opacity: 0; } }