:root{--h1: black;--text-color: black;--background-color: aliceblue;--translucent: #f2f2f2;--warmer: #b74f4f;--cooler: #4964dd;--header: #757575;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:16px;font-weight:300;box-sizing:border-box}:root.night{--h1: white;--background-color: #4d4d4d;--translucent: #D3D3D3}*{margin:0;padding:0}body{color:var(--text-color);padding:60px}#wrapper{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#add8e6;overflow:scroll;display:flex;justify-content:center;background-size:cover}h1{font-size:2rem;margin-bottom:2rem;color:var(--h1)}.warmer,.cooler{font-weight:500}.warmer{color:var(--warmer)}.cooler{color:var(--cooler)}#content{padding:40px;min-width:400px}#hourbyhour,.card{background-color:var(--translucent);padding:20px;border-radius:12px;color:var(--text-color)}#card-wrapper,#hourbyhour{box-sizing:border-box;width:100%;max-width:600px;margin:20px 0}.sticky{position:sticky;left:0}#buffer{display:block;height:10rem}.row{display:flex;flex-flow:row nowrap}.space-between{justify-content:space-between}#card-wrapper{display:flex;flex-flow:row wrap;gap:20px}.card{flex:1 2 200px}.card-head{font-size:1rem;font-weight:500;font-variant:all-petite-caps;color:var(--header);margin-bottom:1rem;position:sticky}.card>p{margin:10px 0}#panel{display:flex;flex-flow:row nowrap;justify-content:space-between;font-weight:500}button[type=button],button[type=submit]{font-size:inherit;border:none;border-radius:5px;background-color:var(--translucent);box-shadow:0 0 10px 2px #000;padding:0 10px;height:2rem}label{font-size:inherit;height:100%;color:var(--h1)}input{width:200px;padding:.2rem;margin:0 .5rem;font-size:inherit}#hourbyhour{overflow-x:hidden;flex:1 1 100%}.toggle-buttons{display:flex;flex-flow:row nowrap;height:1.5rem}.toggle-hour-field{padding:0 .25rem;border:none}.toggle-hour-field:disabled{color:#000;background-color:#d3d3d3}.table-overlay{overflow:scroll;overscroll-behavior:contain}table{border-spacing:0;text-align:center;margin-bottom:1rem;overscroll-behavior:contain}tr{max-width:600px}td{font-weight:600}th{padding:8px;font-weight:300;text-align:center;background-color:var(--translucent)}div#units{display:flex;align-items:start;position:sticky;top:5%;right:10%}#unit-toggle-button{display:inline-block;text-transform:capitalize;border-radius:10px;height:2rem}#temp-range{display:flex;flex-flow:row nowrap;align-items:center;gap:10px;justify-content:space-between}#temp-gradient{display:inline-block;width:10rem;height:1rem}#max-temp,#min-temp{font-weight:500}#max-temp{color:var(--warmer)}#min-temp{margin-left:auto;color:var(--cooler)}