:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;background:linear-gradient(to top,#87ceeb,#fdf6e3);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;min-width:320px;min-height:100vh}#root{color:#000;max-width:100vw;width:100%;text-align:center}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;margin-left:5px;font-size:1em;font-weight:500;font-family:inherit;background:linear-gradient(to bottom,gold,#ffc107);color:#000;cursor:pointer;transition:border-color .25s}button:hover{background:linear-gradient(to bottom,#ffc107,gold)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.App{width:100%;display:flex;flex-direction:column;min-height:100vh}.panel{background-color:#6464c833;color:#000;border:5px solid rgba(75,75,150,.2);border-radius:10px;box-shadow:-5px 5px 10px;padding:10px;margin:20px}.main{flex:1}.main .weather-header{font-size:1.5rem;font-weight:800}.main .current-wrapper{max-width:100vw;width:100%;margin:20px auto;display:flex;flex-direction:column;flex-wrap:wrap;justify-content:space-evenly}@media (min-width: 768px){.weather-header{font-size:2rem}.current-wrapper{flex-direction:column}}@media (min-width: 1400px){.current-wrapper{flex-direction:row}}.spinner-wrapper{position:fixed;top:20%;left:50%;transform:translate(-50%,-50%);z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border-radius:50%}.spinner-wrapper .loading-text{font-size:1.5rem;font-weight:700}.location-form{margin:0 auto;max-width:800px;display:flex;flex-direction:column;align-items:center}.location-form .geolocation-error{font-size:.9rem;color:#c00}.location-form .location-form-controls{display:flex;flex-direction:column;width:100%}.location-form .location-form-controls .location-input-wrapper{display:flex;flex:1 1 50%}.location-form .location-form-controls .location-input-wrapper .location-form-header{font-size:1rem;display:inline-block;margin:2px;max-width:80px}.location-form .location-form-controls .location-input-wrapper .location-input{font-size:1.5rem;max-width:100%;width:100%;flex:1;background-color:#fff8dc;color:#000;border:3px solid #FFC107;border-radius:5px}.location-form .location-form-controls .location-input-wrapper .location-input:focus{border:3px solid #FFD700;outline:none}.location-form .location-form-controls .location-buttons-wrapper{display:flex;flex:1 1 50%}.location-form .location-form-controls .location-buttons-wrapper button{flex:1;max-width:100%;display:flex;justify-content:center;align-items:center}@media (min-width: 768px){.location-form .location-form-controls{display:flex;flex-direction:row}.location-form .location-form-controls .location-input-wrapper{flex-direction:row;max-width:none}.location-form .location-form-controls .location-input-wrapper .location-input{max-width:300px}.location-form .location-form-controls .location-buttons-wrapper{flex:1 1 50%;max-width:100%}}.footer{display:flex;justify-content:space-between;align-items:center;width:100%;height:50px;background-color:#312e81;color:#ddd;font-size:.8rem}