@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&display=swap');

:root {
    /* Helikon Core Variables */
    --brand-main: #d32f2f;
    --brand-accent: #10b981;
    --brand-dark: #8b0000;
    
    /* Dashboard Variables */
    --sidebar-grad: linear-gradient(180deg, #050505 0%, #1a0505 60%, #6b0000 100%);
    --sidebar-text: #e2e8f0;
    --sidebar-border: rgba(255, 255, 255, 0.1);
    --bg-main: #f1f5f9;
    --text-dark: #0f172a;
    --text-muted: #64748b;

    /* App/Survey Variables */
    --bg-body: #050505;
    --glass-bg: linear-gradient(135deg, rgba(30, 30, 30, 0.4) 0%, rgba(10, 10, 10, 0.7) 100%);
    --glass-border: rgba(255, 255, 255, 0.08);
    --glass-border-light: rgba(255, 255, 255, 0.15);
    --text-main: #f8fafc;
    --text-light: #94a3b8;
    --bg-input: rgba(0, 0, 0, 0.5);
    --border-input: rgba(255, 255, 255, 0.15);
}

* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Montserrat', sans-serif; }

/* ANIMACIONES GLOBALES */
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pulseSphere { 0% { transform: scale(1); opacity: 0.8; } 50% { transform: scale(1.05); opacity: 1; filter: drop-shadow(0 0 20px rgba(211,47,47,0.5)); } 100% { transform: scale(1); opacity: 0.8; } }
@keyframes gradientBG { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
@keyframes toastSlideIn { from { transform: translateX(120%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

/* SPLASH SCREEN HELIKON */
#splash-screen {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background-color: #050505; z-index: 999999;
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    transition: opacity 0.5s ease, visibility 0.5s;
}
.splash-logo { width: 160px; height: auto; object-fit: contain; margin-bottom: 30px; animation: pulseSphere 2s ease-in-out infinite; }

/* TOASTS GLOBALES */
#toast-container { position: fixed; top: 25px; right: 25px; z-index: 999999; display: flex; flex-direction: column; gap: 12px; }
.toast {
    background: rgba(10, 10, 10, 0.95); backdrop-filter: blur(10px); border: 1px solid rgba(211,47,47,0.4);
    padding: 12px 20px; border-radius: 12px; font-weight: 600; font-size: 13px; color: white; display: flex; align-items: center; gap: 12px; animation: toastSlideIn 0.4s forwards; box-shadow: 0 10px 25px rgba(0,0,0,0.5);
}