*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}.app{min-height:100vh;display:grid;background:#f0bde9}body{font-family:Arial,sans-serif;margin:0;padding:0;display:flex;justify-content:center;align-items:center;min-height:100vh;background:linear-gradient(120deg,#1e3c72,#2a5298);color:#fff}.weather{padding:20px;border-radius:10px;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 20px #0000004d;display:flex;flex-direction:column;align-items:center;text-align:center;width:400px;width:90%}.search-bar{display:flex;align-items:center;gap:12px;margin-bottom:30px;width:100%}.search-bar input{height:50px;width:100%;border:none;outline:none;border-radius:25px;padding:0 20px;color:#333;font-size:16px;background:#f0f4f9;box-shadow:inset 0 2px 4px #0000001a;transition:box-shadow .3s ease}.search-bar input:focus{box-shadow:inset 0 4px 6px #0003}.search-bar .search{height:50px;width:50px;border-radius:50%;background:#4caf50;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:transform .3s ease}.search-bar .search:hover{background:#0ff;transform:scale(1.1)}.sun{height:120px;width:120px;margin:20px 0;transition:transform .3s ease}.sun:hover{transform:rotate(10deg) scale(1.05)}.temp{font-size:60px;font-weight:700;line-height:1;margin:10px 0}.location{font-size:28px;color:#fff;font-weight:300;margin-bottom:20px}.weather-data{width:100%;margin-top:20px;display:flex;justify-content:space-between;gap:20px;color:#f5f5f5}.weather-data .col{flex:1;display:flex;flex-direction:column;align-items:center;background:#ffffff1a;border-radius:10px;padding:15px;box-shadow:0 4px 10px #0000001a;transition:transform .3s ease}.weather-data .col:hover{transform:scale(1.05);background:#fff3}.weather-data .col img{margin-bottom:10px}.weather-data .col p{font-size:20px;font-weight:700;margin:0}.weather-data .col span{font-size:14px;font-weight:300;color:#f5f5f5}