* {
    box-sizing: border-box;
}

#snow-day-predictor-root {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@keyframes sdp-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.sdp-snowflake-spin {
    animation: sdp-spin 8s linear infinite;
}

@keyframes gradient-shift {
    0%, 100% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
}

.sdp-app input:focus {
    border-color: #4B8DFF !important;
    box-shadow: 0 0 0 3px rgba(75, 141, 255, 0.15) !important;
}

.sdp-app input::placeholder {
    color: #96A5C4;
}

.sdp-vote-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

#sdp-reset-btn:hover {
    opacity: 0.7;
}

#sdp-change-vote-btn:hover {
    background-color: #F8FAFD !important;
}

@media (max-width: 640px) {
    .sdp-app h1 span span {
        font-size: 24px !important;
    }
    
    .sdp-app h1 svg {
        width: 28px !important;
        height: 28px !important;
    }
    
    .sdp-app main > div > div:first-child p {
        font-size: 15px !important;
    }
}