:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}*{margin:0;padding:0;box-sizing:border-box}.app{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;justify-content:center;align-items:center;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.container{background:#fff;border-radius:20px;padding:40px;max-width:700px;width:100%;box-shadow:0 20px 60px #0000004d}h1{font-size:2.5rem;color:#333;text-align:center;margin-bottom:10px}.subtitle{text-align:center;color:#666;margin-bottom:30px;font-size:1.1rem}.form{margin-bottom:30px}.input-group{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}.zip-input-wrapper{display:flex;flex-direction:column;gap:5px;flex:1;min-width:200px}.zip-label{font-size:.85rem;color:#666;font-weight:500;white-space:nowrap}.zip-input{padding:15px 20px;font-size:1rem;border:2px solid #e0e0e0;border-radius:10px;outline:none;transition:border-color .3s;width:100%}.zip-input:focus{border-color:#667eea}.zip-input:disabled{background-color:#f5f5f5;cursor:not-allowed}.temp-input-wrapper{display:flex;flex-direction:column;gap:5px;flex:0 0 140px}.temp-label{font-size:.85rem;color:#666;font-weight:500;white-space:nowrap}.temp-input{padding:15px 20px;font-size:1rem;border:2px solid #e0e0e0;border-radius:10px;outline:none;transition:border-color .3s;width:100%}.temp-input:focus{border-color:#667eea}.temp-input:disabled{background-color:#f5f5f5;cursor:not-allowed}.submit-btn{padding:15px 30px;font-size:1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:10px;cursor:pointer;transition:transform .2s,box-shadow .2s;white-space:nowrap}.submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 15px #667eea66}.submit-btn:disabled{opacity:.6;cursor:not-allowed}.error-message{background-color:#fee;color:#c33;padding:15px 20px;border-radius:10px;margin-bottom:20px;border-left:4px solid #c33}.result-card{border-radius:15px;padding:25px;margin-top:20px;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.result-card.success{background:linear-gradient(135deg,#ffeaa7,#fdcb6e);border:2px solid #f39c12}.result-card.no-sun{background:linear-gradient(135deg,#dfe6e9,#b2bec3);border:2px solid #636e72}.result-header{display:flex;align-items:center;gap:15px;margin-bottom:20px}.result-header h2{font-size:1.5rem;color:#333;margin:0}.sun-icon,.cloud-icon{font-size:2rem}.result-content{display:flex;flex-direction:column;gap:12px}.result-item{font-size:1.1rem;color:#333;padding:8px 0;border-bottom:1px solid rgba(0,0,0,.1)}.result-item:last-child{border-bottom:none}.result-item strong{color:#555;margin-right:8px}.weather-with-icon{display:flex;align-items:center;gap:10px}.weather-emoji{font-size:2rem;line-height:1}.no-sun-message{font-size:1.1rem;color:#555;margin-bottom:15px;font-style:italic}.forecast-section{margin-top:25px;padding-top:25px;border-top:2px solid rgba(0,0,0,.1)}.forecast-title{font-size:1.3rem;color:#333;margin-bottom:15px;text-align:center}.forecast-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:12px;margin-top:15px}.forecast-day{background:#fff9;border-radius:10px;padding:12px;text-align:center;transition:transform .2s;display:flex;flex-direction:column;align-items:center}.forecast-day:hover{transform:translateY(-2px);background:#fffc}.forecast-day-name{font-weight:600;color:#555;font-size:.9rem;margin-bottom:8px}.forecast-emoji{font-size:2rem;line-height:1;margin-bottom:8px}.forecast-temps{font-size:1.1rem;margin-bottom:6px}.forecast-high{font-weight:600;color:#333}.forecast-low{color:#666;font-size:.9rem}.forecast-condition{font-size:.85rem;color:#666;text-transform:capitalize;line-height:1.2}@media(max-width:600px){.container{padding:25px}h1{font-size:2rem}.input-group{flex-direction:column}.submit-btn{width:100%}.forecast-grid{grid-template-columns:repeat(2,1fr)}.forecast-day{padding:10px}}