#snow-container {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            z-index: 1;
            overflow: hidden;
        }

        .snowflake {
            position: absolute;
            top: -10px;
            width: 8px;
            height: 8px;
            animation: snowfall linear infinite;
            pointer-events: none;
        }

            /* Create actual snowflake shape using CSS */
            .snowflake::before,
            .snowflake::after {
                content: '';
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                background: rgba(150, 180, 220, 0.85);
                box-shadow: 0 0 3px rgba(150, 180, 220, 0.6);
            }

            /* Main horizontal and vertical arms */
            .snowflake::before {
                width: 100%;
                height: 2px;
                box-shadow: 0 0 2px rgba(150, 180, 220, 0.8);
            }

            .snowflake::after {
                width: 2px;
                height: 100%;
                box-shadow: 0 0 2px rgba(150, 180, 220, 0.8);
            }

        /* Additional snowflake arms using pseudo-elements on parent */
        .snowflake {
            background: linear-gradient(45deg, transparent 30%, rgba(150, 180, 220, 0.85) 30%, rgba(150, 180, 220, 0.85) 35%, transparent 35%), linear-gradient(-45deg, transparent 30%, rgba(150, 180, 220, 0.85) 30%, rgba(150, 180, 220, 0.85) 35%, transparent 35%), linear-gradient(135deg, transparent 30%, rgba(150, 180, 220, 0.85) 30%, rgba(150, 180, 220, 0.85) 35%, transparent 35%), linear-gradient(-135deg, transparent 30%, rgba(150, 180, 220, 0.85) 30%, rgba(150, 180, 220, 0.85) 35%, transparent 35%);
            background-size: 100% 100%;
            background-position: center;
            background-repeat: no-repeat;
        }

        /* Use Unicode snowflake with elegant styling */
        .snowflake-text {
            position: absolute;
            top: -10px;
            color: rgba(100, 150, 200, 0.85);
            font-size: 1.2em;
            font-family: Arial, sans-serif;
            text-shadow: 0 0 4px rgba(100, 150, 200, 0.6), 0 0 8px rgba(100, 150, 200, 0.4), 1px 1px 2px rgba(0, 0, 0, 0.15);
            animation: snowfall linear infinite;
            pointer-events: none;
            line-height: 1;
            font-weight: normal;
        }

        @keyframes snowfall {
            0% {
                transform: translateY(0) translateX(0) rotate(0deg);
                opacity: 0.9;
            }

            100% {
                transform: translateY(100vh) translateX(var(--drift)) rotate(360deg);
                opacity: 0.2;
            }
        }

        .ambient-light {
            position: absolute;
            width: 1px;
            height: 1px;
            background: rgba(255, 255, 255, 0.3);
            border-radius: 50%;
            animation: gentleGlow 4s ease-in-out infinite;
            pointer-events: none;
            box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
        }

        @keyframes gentleGlow {
            0%, 100% {
                opacity: 0.2;
                transform: scale(1);
            }

            50% {
                opacity: 0.4;
                transform: scale(1.5);
            }
        }

/* Teacher login — error toasts (match student Auth; overrides themed toastr pink) */
#toast-container > .toast.toast-error {
    background-color: #dc2626 !important;
    background-image: none !important;
    border: 1px solid #b91c1c;
    color: #fff !important;
}

#toast-container > .toast.toast-error .toast-title,
#toast-container > .toast.toast-error .toast-message {
    color: #fff !important;
}

#toast-container > .toast.toast-error .toast-close-button {
    color: #fff;
    text-shadow: none;
    opacity: 0.92;
}

#toast-container > .toast.toast-error .toast-close-button:hover,
#toast-container > .toast.toast-error .toast-close-button:focus {
    color: #fecaca;
    opacity: 1;
}

#toast-container > .toast.toast-error:before {
    color: #fecaca;
}

#toast-container > .toast.toast-error .toast-progress {
    background-color: #fecaca;
    opacity: 0.55;
}