*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(to right,#1e1e2f,#12121c);min-height:100vh;margin:0;padding:0}form{display:flex;flex-direction:column;align-items:center;gap:12px;background:#fff;padding:32px 24px;border-radius:16px;box-shadow:0 8px 32px #66a6ff26;max-width:400px;margin:20px auto 0}input[type=text]{padding:10px 16px;font-size:1.1rem;border-radius:8px;border:1px solid #66a6ff;outline:none;transition:border;width:100%;box-sizing:border-box}input[type=text]:focus{border:2px solid #3a8dde}button{padding:10px 24px;font-size:1rem;border:none;border-radius:30px;background:linear-gradient(to right,#00c6ff,#0072ff);color:#fff;font-weight:700;cursor:pointer;box-shadow:0 4px 16px #66a6ff1f;transition:background .3s,transform .2s,box-shadow .2s}button:hover{background:linear-gradient(to right,#0072ff,#00c6ff);transform:translateY(-2px) scale(1.04);box-shadow:0 8px 24px #66a6ff38}.weather-info{background:#fff;margin:24px auto 0;padding:24px 20px;border-radius:14px;box-shadow:0 4px 16px #66a6ff1a;max-width:400px;text-align:center;font-weight:500}.weather-info h2{color:#3a8dde;margin-bottom:12px;font-size:1.3rem}.weather-info p{font-size:1.1rem;margin:8px 0;color:#333}ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;align-items:center}ul li{background:#f2f8fc;border-radius:8px;margin-bottom:8px;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;font-size:1rem;box-shadow:0 2px 8px #66a6ff0f;gap:20px;min-width:500px}ul li button{font-size:.95rem;padding:6px 12px;margin-left:8px;border-radius:20px;background:#3a8dde;color:#fff;border:none;box-shadow:none;transition:background .2s}ul li button:hover{background:#66a6ff}@media (max-width: 700px){form,.weather-info{max-width:98vw;padding:16px 8px;border-radius:10px}ul li{min-width:90vw;font-size:.98rem;padding:8px;gap:10px}}@media (max-width: 500px){form,.weather-info{max-width:99vw;padding:10px 2px;border-radius:7px}ul li{min-width:0;width:100vw;font-size:.95rem;padding:6px 4px;gap:6px}input[type=text]{font-size:1rem;padding:8px 6px}button{font-size:.95rem;padding:8px 14px}.weather-info h2{font-size:1.1rem;margin-bottom:8px}.weather-info p{font-size:1rem;margin:6px 0}}