:root {
    --bg: #020202;
    --blue-light: rgba(0, 162, 255, 0.2);
}

body { margin: 0; background: var(--bg); color: white; overflow: hidden; font-family: 'Arial', sans-serif; }

/* الملقن - Teleprompter */
#teleprompter-container {
    position: fixed; top: 10%; width: 100%; height: 150px;
    z-index: 1000; text-align: center; pointer-events: none;
    background: linear-gradient(to bottom, rgba(0,0,0,0.8), transparent);
}

#teleprompter-text {
    font-size: 24px; color: #fff; line-height: 1.6;
    padding: 20px; transition: transform 0.3s;
}

/* المطر والبرق */
.rain-layer {
    position: absolute; inset: 0; z-index: 5;
    background: url('https://www.transparenttextures.com/patterns/stardust.png');
    opacity: 0.05; animation: rain 0.2s infinite;
}

@keyframes rain { from { background-position: 0 0; } to { background-position: 10px 100px; } }

#lightning-bolt {
    position: fixed; inset: 0; background: #fff; opacity: 0; z-index: 50;
}

/* الآيردروب */
#airdrop-modal {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: rgba(240, 240, 240, 0.9); color: #000;
    width: 250px; padding: 20px; border-radius: 15px;
    display: none; text-align: center; z-index: 100;
}

/* الحمام والمرآة */
.mirror-frame {
    width: 300px; height: 500px; border: 5px solid #333;
    background: linear-gradient(to bottom, #111, #000);
    position: relative;
}

.glitch-effect { animation: shake 0.1s infinite; filter: hue-rotate(90deg); }
@keyframes shake { 0% {left:0} 50% {left:2px} 100% {left:-2px} }

.hidden { display: none; }
.active { display: flex !important; justify-content: center; align-items: center; }
.scene { width: 100vw; height: 100vh; display: none; }
