:root {
    --neon-green: #22c55e;
    --neon-purple: #a855f7;
    --glass: rgba(13, 17, 23, 0.9);
}
body, html {
    margin: 0; padding: 0; height: 100%;
    background: #010409; overflow: hidden;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", sans-serif;
    user-select: none;
    -webkit-user-select: none;
}
#bgCanvas { position: absolute; z-index: 1; top: 0; left: 0; transition: background 0.5s; }
#main-layout { position: relative; z-index: 10; display: flex; flex-direction: column; height: 100vh; pointer-events: none; }
#main-layout * { pointer-events: auto; }
#top-bar { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; }
#money-glow { font-size: 3.5rem; font-weight: 900; color: white; text-shadow: 0 0 25px var(--neon-green); }
#game-zone { flex: 1.5; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; }
#gameCanvas { width: 100%; height: 400px; cursor: pointer; }

/* NEU: BOOST STYLES */
#ad-boost-btn {
    background: linear-gradient(45deg, #fbbf24, #f59e0b);
    color: white; border: none; padding: 10px 20px;
    border-radius: 15px; font-weight: 900; cursor: pointer;
    animation: pulse-gold 2s infinite; margin-top: 10px;
    transition: 0.3s;
}
@keyframes pulse-gold {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.7); }
    70% { transform: scale(1.05); box-shadow: 0 0 20px 10px rgba(251, 191, 36, 0); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(251, 191, 36, 0); }
}
#boost-timer-bar { display: none; width: 180px; height: 8px; background: rgba(255,255,255,0.1); border-radius: 4px; margin-top: 10px; overflow: hidden; }
#boost-progress { width: 100%; height: 100%; background: #fbbf24; transition: width 0.1s linear; }

#combo-tag { 
    background: rgba(34, 197, 94, 0.15); border: 2px solid var(--neon-green);
    padding: 8px 20px; border-radius: 25px; color: var(--neon-green); 
    font-weight: 900; font-size: 1.4rem; margin-bottom: 10px;
    text-shadow: 0 0 10px var(--neon-green);
}
#fever-overlay { display: none; position: absolute; top: 0; font-weight: 900; color: #fbbf24; text-shadow: 0 0 20px #fbbf24; font-size: 1.2rem; }
.shake { animation: shakeEffect 0.3s ease-in-out; }
@keyframes shakeEffect { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
#ui-zone { flex: 2; padding: 20px 40px 40px 40px; display: flex; justify-content: center; align-items: flex-start; }
.glass-panel { width: 100%; max-width: 1100px; background: var(--glass); backdrop-filter: blur(40px); border-radius: 35px; padding: 25px; border: 1px solid rgba(255,255,255,0.1); }
.fancy-volume-container { background: rgba(255, 255, 255, 0.03); border-radius: 20px; padding: 15px 25px; margin-bottom: 10px; border: 1px solid rgba(255, 255, 255, 0.05); }
.volume-label { display: flex; justify-content: space-between; color: white; font-size: 0.7rem; font-weight: 800; letter-spacing: 2px; margin-bottom: 10px; opacity: 0.6; }
.slider-wrapper { display: flex; align-items: center; gap: 15px; }
#volume-slider { -webkit-appearance: none; width: 100%; height: 6px; background: rgba(255, 255, 255, 0.1); border-radius: 10px; outline: none; cursor: pointer; }
#volume-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; background: white; border-radius: 50%; border: 2px solid var(--neon-green); }
.ui-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; color: white; }
.upgrade-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.card { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 18px; padding: 15px; cursor: pointer; color: white; }
.card .price { color: var(--neon-green); font-weight: 800; }
.float-text { position: absolute; color: var(--neon-green); font-weight: 900; animation: appleFloat 1s forwards; pointer-events: none; }
@keyframes appleFloat { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(-80px); opacity: 0; } }