/* Custom Horror Atmosphere Styles */

/* Safe Area Padding */
.safe-area-pad {
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* Atmospheric Vignette */
#vignette-fx {
  background: radial-gradient(circle at center, transparent 35%, rgba(0, 0, 0, 0.7) 75%, rgba(0, 0, 0, 0.98) 100%);
}

/* Audio Wave Visualizer Bars */
@keyframes soundBar1 {
  0%, 100% { height: 4px; }
  50% { height: 12px; }
}
@keyframes soundBar2 {
  0%, 100% { height: 12px; }
  50% { height: 5px; }
}
@keyframes soundBar3 {
  0%, 100% { height: 7px; }
  50% { height: 14px; }
}

.animate-sound-bar-1 { animation: soundBar1 0.75s ease-in-out infinite; }
.animate-sound-bar-2 { animation: soundBar2 0.6s ease-in-out infinite; }
.animate-sound-bar-3 { animation: soundBar3 0.9s ease-in-out infinite; }

/* Film Grain Simulation */
#noise-overlay {
  background-image: radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 0);
  background-size: 4px 4px;
}

/* Screen Jumpscare Shake */
@keyframes violentShake {
  0% { transform: translate(0, 0) scale(1); }
  10% { transform: translate(-15px, 12px) scale(1.1) rotate(-2deg); }
  20% { transform: translate(14px, -15px) scale(1.15) rotate(2deg); }
  30% { transform: translate(-20px, -10px) scale(1.2) rotate(-1deg); }
  40% { transform: translate(18px, 16px) scale(1.1) rotate(3deg); }
  50% { transform: translate(-12px, 8px) scale(1.25) rotate(-3deg); }
  60% { transform: translate(16px, -12px) scale(1.15) rotate(2deg); }
  70% { transform: translate(-18px, -14px) scale(1.2) rotate(-2deg); }
  80% { transform: translate(12px, 14px) scale(1.1) rotate(1deg); }
  90% { transform: translate(-10px, 6px) scale(1.05); }
  100% { transform: translate(0, 0) scale(1); }
}

.animate-shake {
  animation: violentShake 0.45s cubic-bezier(0.36, 0.07, 0.19, 0.97) infinite;
}

/* Note Paper Appearance */
#note-modal > div {
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.95), 0 0 100px rgba(139, 69, 19, 0.3);
}

/* Reticle pulsing when hovering over interactive objects */
.reticle-hover {
  transform: scale(2.2) !important;
  background-color: #f59e0b !important;
  box-shadow: 0 0 14px #f59e0b !important;
}

/* Handheld Flashlight HUD Glow & Pulse */
#flashlight-hud-card {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.8), inset 0 0 15px rgba(217, 119, 6, 0.1);
}

.battery-low-pulsing {
  animation: lowBatteryFlash 0.8s ease-in-out infinite alternate;
}

@keyframes lowBatteryFlash {
  0% { box-shadow: 0 0 5px rgba(239, 68, 68, 0.4); border-color: rgba(239, 68, 68, 0.6); }
  100% { box-shadow: 0 0 25px rgba(239, 68, 68, 0.9); border-color: rgba(239, 68, 68, 1); }
}

/* Custom Scrollbars */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #0d0d0f;
}
::-webkit-scrollbar-thumb {
  background: #2b2b30;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #d97706;
}