*{box-sizing:border-box}body{margin:0;font:16px/1.45 Tahoma,Arial,sans-serif;color:#20394b;background:#eaf0f5}header{height:76px;padding:15px 25px;background:#112c3f;color:white;display:flex;align-items:center;justify-content:space-between}header b{letter-spacing:.18em;font-size:21px}header span{display:block;color:#b6cedf;font-size:14px}.units{font-size:14px;color:#c3dae7}main{display:flex;height:calc(100dvh - 76px)}aside{width:310px;flex-shrink:0;background:#fff;padding:22px;overflow:auto;border-right:1px solid #ccd9e2}h1{font-size:19px;margin:0 0 20px}h2{font-size:14px;text-transform:uppercase;letter-spacing:.09em;margin:24px 0 10px;color:#5c7485}label{display:block;font-size:14px;margin:14px 0}output{float:right;font-weight:600}input[type=range]{width:100%;accent-color:#177d98;margin-top:12px}.layer{display:flex;gap:10px;align-items:center;margin:8px 0;padding:8px;background:#f2f6f9;border-radius:6px}.layer input{accent-color:#177d98}.swatch{width:12px;height:30px;border-radius:3px}.layer small{display:block;font-size:12px;color:#637b8b}button{font:14px Tahoma,Arial,sans-serif;padding:9px 12px;border:1px solid #bbccd8;border-radius:6px;background:#fff;color:#193d54;cursor:pointer}button:hover{background:#e2f0f5}button:disabled{opacity:.4}button.active,#draw.active{background:#157b98;color:#fff}.buttons{display:flex;gap:6px}#draw{width:100%;background:#173e56;color:#fff}p{font-size:14px}.note{color:#617789;font-size:13px}#detail{margin-top:18px;font-size:14px;padding:12px;background:#edf4f7;border-left:3px solid #43aabd}.workspace{position:relative;flex:1;min-width:0;background:radial-gradient(ellipse at 50% 30%,#fcfdff,#d9e5ed)}#scene{display:block;width:100%;height:100%;touch-action:none}#status{position:absolute;top:18px;left:20px;border:1px solid #c8d7e1;background:#fffffff0;border-radius:6px;padding:8px 13px;font-size:14px;pointer-events:none}#axes{position:absolute;bottom:18px;left:20px;font-size:13px;color:#4b6575;pointer-events:none}#profile{position:absolute;bottom:0;left:0;right:0;height:40%;min-height:260px;background:#fffffff5;border-top:1px solid #a8c3d5;padding:14px}.profilehead{display:flex;justify-content:space-between;font-size:14px}#plot{width:100%;height:calc(100% - 44px)}@media(max-width:700px){header{height:90px;padding:12px}.units{max-width:130px}main{height:calc(100dvh - 90px)}aside{width:220px;padding:12px}header b{font-size:17px}header span{font-size:12px}}
#colorMode{width:100%;padding:10px;border:1px solid #bbccd8;border-radius:6px;background:#fff;color:#20394b;font:14px Tahoma,Arial,sans-serif}#units .layer{padding:4px 8px;margin:4px 0}#units .swatch{height:24px}
#units .layer{align-items:flex-start;padding:8px}#units .layer input{margin-top:5px;flex-shrink:0}#units .swatch{min-width:14px;flex-shrink:0;margin-top:3px}#units .layer b{font-size:14px;font-weight:500;line-height:1.4}#units .layer small{margin-top:4px}
#sectionLabels{position:absolute;inset:0;pointer-events:none}#sectionLabels span{position:absolute;transform:translate(-50%,-130%);font-weight:700;font-size:15px;background:#fffffff0;padding:2px 6px;border:1px solid #7c95a8;border-radius:4px;color:#18394e}
#branding{position:absolute;bottom:16px;right:18px;background:#fffffff2;border:1px solid #d0dce5;border-radius:6px;display:flex;align-items:center;gap:18px;padding:10px 14px;pointer-events:none}#branding img{max-width:120px;max-height:40px;object-fit:contain}#axes{bottom:85px}#profile{z-index:3}#sectionLabels{z-index:1}#branding{z-index:2}@media(max-width:900px){#branding{gap:10px}#branding img{max-width:85px;max-height:32px}}
#exportDialog{width:min(1000px,95vw);max-height:92dvh;border:1px solid #a5bdcc;border-radius:8px;padding:18px;background:#fff;color:#20394b}#exportDialog::backdrop{background:#112c3f99}#exportPreview{display:block;width:100%;margin-top:18px;border:1px solid #d0dce5}
.buttons{flex-wrap:wrap}


#exportPreview[hidden]{display:none!important}

main{display:grid;grid-template-columns:310px minmax(0,1fr) 280px}.workspace{min-height:0}aside.right-controls{width:auto;border-right:0;border-left:1px solid #ccd9e2}.right-controls>h2:first-child{margin-top:0}@media(max-width:1100px){main{grid-template-columns:240px minmax(0,1fr) 240px}aside{width:auto;padding:16px}}@media(max-width:850px){main{grid-template-columns:220px minmax(0,1fr);grid-template-rows:1fr 1fr}main>aside:first-child{grid-column:1;grid-row:1}.workspace{grid-column:2;grid-row:1 / 3}aside.right-controls{grid-column:1;grid-row:2;border-left:0;border-right:1px solid #ccd9e2;border-top:1px solid #ccd9e2}}@media(max-width:520px){main{grid-template-columns:170px minmax(0,1fr)}aside{padding:10px}}

header b,h1,h2,.profilehead b,#sectionLabels span{font-family:Verdana,Arial,sans-serif;font-weight:700}

#branding{gap:40px;background:transparent;border:0;padding:0}#branding img{background:#fffffff2;padding:0;border-radius:0}#branding img[src*="envision-water"]{max-width:180px;max-height:60px}@media(max-width:900px){#branding{gap:24px}#branding img[src*="envision-water"]{max-width:127.5px;max-height:48px}}

.disclaimer{margin-top:24px;padding:12px;border:1px solid #ccd9e2;border-radius:6px;background:#f2f6f9;font-size:14px;line-height:1.45;color:#526b7c}.disclaimer b{font-family:Verdana,Arial,sans-serif;font-weight:700;color:#20394b}

#branding img{max-width:180px;max-height:60px}#branding img[src*="envision-water"]{max-width:270px;max-height:90px}header .units{max-width:60%;text-align:right}@media(max-width:900px){#branding img{max-width:127.5px;max-height:48px}#branding img[src*="envision-water"]{max-width:191.25px;max-height:72px}}@media(max-width:700px){header .units{max-width:48%;font-size:12px}#branding{gap:18px}#branding img{max-width:90px}#branding img[src*="envision-water"]{max-width:135px}}

#exportSection{background:#173e56;color:#fff}