@keyframes fv-spin {
    to { transform: rotate(360deg); }
}

@keyframes fv-fade-out {
    to { opacity: 0; visibility: hidden; }
}

@keyframes fv-fade-in {
    to { opacity: 1; }
}

#fv-splash {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    font-family: sans-serif;
    text-align: center;
}

#fv-splash-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid #e0e0e0;
    border-top-color: #005776;
    border-radius: 50%;
    animation: fv-spin 0.8s linear infinite;
    margin: 0 auto 16px;
}

#fv-splash-loading {
    animation: fv-fade-out 0.3s 5s forwards;
}

#fv-splash-error {
    position: absolute;
    opacity: 0;
    animation: fv-fade-in 0.3s 5s forwards;
}

/* JS loaded — cancel the error timeout, keep spinner running */
#fv-splash.fv-js-loaded #fv-splash-loading {
    animation: none;
}

#fv-splash.fv-js-loaded #fv-splash-error {
    animation: none;
}

#fv-splash-error h2 {
    margin: 0 0 8px;
}

#fv-splash-error p {
    color: #666;
    margin: 0;
}