body {
        font-family: Arial, sans-serif;
        background: linear-gradient(to right, #4facfe, #00f2fe);
        text-align: center;
        padding: 50px;
        color: white;
    }

    input {
        padding: 10px;
        width: 250px;
        border: none;
        border-radius: 5px;
        font-size: 16px;
    }

    button {
        padding: 10px 15px;
        border: none;
        background: #333;
        color: white;
        border-radius: 5px;
        cursor: pointer;
    }

    button:hover {
        background: #555;
    }

    .weather-box {
        margin-top: 20px;
        padding: 20px;
        background: rgba(0,0,0,0.3);
        border-radius: 10px;
        display: inline-block;
        min-width: 300px;
    }

    .forecast-container {
        margin-top: 20px;
        display: flex;
        gap: 10px;
        justify-content: center;
        flex-wrap: wrap;
    }

    .forecast-card {
        background: rgba(0,0,0,0.4);
        padding: 10px;
        border-radius: 10px;
        width: 140px;
    }