:root{--bg-color: #1f1f1f;--panel-color: rgba(15, 15, 20, .4);--snippet-bg: #222230;--white: #ffffff;--gray-light: #f0f0f4;--gray-medium: #d2d2df;--gray-medium-dark: #b4b4ca;--gray-dark: #9797b5;--purple: #7a90e0;--error: #f74373;--warning: #ff9a5c;--pressure-below-0: #796ebd;--pressure-between-0-10: #bb66a6;--pressure-between-10-20: #d56f9b;--pressure-between-20-30: #f0788c;--pressure-between-30-40: #f48d87;--pressure-between-40-50: #f79f82;--pressure-between-50-60: #f9b27d;--pressure-above-60: #e2d57e;--lillac: #3c5ddb}body{margin:0;padding:0;font-family:"Source Sans 3",sans-serif}h1{font-size:20px;font-weight:700;line-height:25px}h3{font-size:14px;font-weight:700;line-height:18px;margin:0}h2{color:var(--white);font-size:18px;font-weight:700}h4{color:var(--gray-medium);font-size:14px;line-height:17.6px;font-weight:400;margin:0}#container{position:relative;width:100vw;height:100%;background-color:var(--bg-color);display:flex;flex-direction:row;justify-content:space-between}.row{display:flex}.column{display:flex;flex-direction:column}.properties{justify-content:space-between}#logo-button-container{max-height:2rem;align-items:center;justify-content:space-between}#q-logo{width:32px;height:32px}#inp-upload{padding:0}#button{width:Hug (156px);height:Hug (32px);top:16px;left:108px;padding:7px 20px;border-radius:8px;border:1px;gap:8px;font-size:14px;font-weight:700;line-height:18px;text-align:center;background-color:var(--lillac)}#button:hover{background-color:var(--purple);cursor:pointer}input[type=file]{display:none}#hydrant-properties{display:none;gap:2px}#current-model-name{color:var(--gray-light);font-size:1.3rem;font-weight:700;margin:1rem 0 -.2rem}#simulation-time{font-size:.9rem;color:var(--gray-medium-dark)}#peak-demand-time{color:var(--gray-light)}#hydrant-panel{margin:16px 0 0;background-color:var(--snippet-bg);padding:1rem;border-radius:.5rem;gap:2rem}#map-error-container{display:inline;flex-grow:1}#map{position:absolute;top:0;left:0;bottom:0;width:100%;height:100vh}.mapboxgl-ctrl-attrib{margin-top:-.3rem!important;background-color:transparent!important}.mapboxgl-ctrl-attrib a{color:var(--gray-light)!important}#error{display:none;position:relative;background-color:var(--panel-color);padding:1rem 3.5rem;max-width:50%;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:20px}#error-title{color:var(--error);font-weight:700;text-align:center}#error-msg{color:var(--gray-medium);text-align:center}#error-example{white-space:pre-wrap;font-family:monospace;font-size:14px;background-color:var(--snippet-bg);color:var(--gray-medium);padding:1rem;text-align:left;border-radius:5px}#panel{display:flex;flex-direction:column;justify-content:space-between;box-sizing:border-box;padding:1.2rem;z-index:1;width:15vw;min-width:17rem;min-height:100vh;height:100%;color:var(--gray-light);background-color:var(--panel-color);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px)}#panel-top-container{flex-direction:column;display:flex;gap:.5rem}#panel-bottom-container{display:flex;flex-direction:column-reverse;gap:.5rem;padding-top:0}#fireflow-title{margin-bottom:4px}#demand-spike{display:flex;flex-wrap:wrap;margin:.5rem 0 .1rem;font-size:.9rem}.value-units-flex-container{display:flex;flex-direction:row;gap:.1rem;margin:0 .5rem .5rem 0}#flex-1,#flex-2,#flex-3{flex:1;min-width:33%}#flex-3{flex-basis:33%}#warnings{display:none;flex-direction:column;gap:1rem}.warning-title{margin:-.5rem 0 .5rem;color:var(--warning);padding:.5rem 0 0}.warning-msg{white-space:pre-wrap;text-align:left;font-size:14px;color:var(--gray-light)}.warning-example{white-space:pre-wrap;font-size:14px;color:var(--gray-medium);padding:0;text-align:left}.value{color:var(--white)}.units{color:var(--gray-dark)}#slider{width:100%;margin:0 auto;accent-color:var(--purple);color:var(--gray-light)}#slider:hover{cursor:pointer}#slider-range-values{justify-content:space-between;font-size:10px;margin-bottom:8px}#slider-range-value{color:var(--gray-medium)}#target-pressure-wrapper{font-size:.9rem}.slider-value{width:100%}#target-pressure{font-weight:700;padding-left:112.5px;position:relative}.target-pressure-container{display:flex;flex-direction:column;justify-content:center;align-items:center}.flow-on-demand-warning{color:var(--error)}#flow-on-demand{font-weight:700}#pressure-legend-units{color:var(--gray-medium-dark);display:table;margin:0 auto;font-size:.7rem;font-weight:400}#pressure-legend{min-width:10rem}#pressure-title{margin-bottom:0}#pressure-colors{margin-top:.5rem;gap:.5rem}.square{aspect-ratio:1 / 1;flex-grow:1;border-radius:15%}#pressure-values{margin-right:7%;margin-left:7%;gap:.5rem;justify-content:space-between}.range{box-sizing:border-box;flex-grow:1;margin:.25rem 0rem 0rem;width:.6rem;text-align:center;font-size:.7rem;font-weight:700;color:var(--gray-medium)}#below-0{grid-area:1 / 1 / 2 / 2;background-color:var(--pressure-below-0)}#between-0-10{grid-area:1 / 3 / 2 / 4;background-color:var(--pressure-between-0-10)}#between-10-20{grid-area:1 / 5 / 2 / 6;background-color:var(--pressure-between-10-20)}#between-20-30{grid-area:1 / 7 / 2 / 8;background-color:var(--pressure-between-20-30)}#between-30-40{grid-area:1 / 9 / 2 / 10;background-color:var(--pressure-between-30-40)}#between-40-50{grid-area:1 / 11 / 2 / 12;background-color:var(--pressure-between-40-50)}#between-50-60{grid-area:1 / 13 / 2 / 14;background-color:var(--pressure-between-50-60)}#above-60{grid-area:1 / 15 / 2 / 16;background-color:var(--pressure-above-60)}#range-0{grid-area:2 / 2 / 3 / 3}#range-10{grid-area:2 / 4 / 3 / 5}#range-20{grid-area:2 / 6 / 3 / 7}#range-30{grid-area:2 / 8 / 3 / 9}#range-40{grid-area:2 / 10 / 3 / 11}#range-50{grid-area:2 / 12 / 3 / 13}#range-60{grid-area:2 / 14 / 3 / 15}#id-and-close{display:flex;width:100%;justify-content:space-between;align-items:center;margin-bottom:8px}#close-btn:hover{cursor:pointer}#id{margin:0}