@font-face{font-family:Uni;src:url('assets/UniNeueRegular.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:Uni;src:url('assets/UniNeueHeavy.ttf') format('truetype');font-weight:800;font-display:swap}
:root{--blue:#193c6c;--red:#e30613;--water:#56c5f3;--white:#f5f8fc;--muted:#a8bfd6;--line:#ffffff27;font-family:Uni,Arial,sans-serif;color:var(--white);background:#08192e}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:transparent;border-radius:4px;min-height:42px;padding:8px 12px;font-size:16px}button:hover{background:#ffffff12;border-color:#9edbff88}button:focus-visible,a:focus-visible,canvas:focus-visible,[tabindex]:focus-visible{outline:3px solid #8ae0ff;outline-offset:4px}a{color:#9adeff;text-underline-offset:4px}.widget{background:radial-gradient(ellipse at 80% 45%,#1b4772,transparent 65%),linear-gradient(145deg,#08172a,#0d2748);max-width:1700px;min-height:640px;margin:0 auto;overflow:hidden}.bar{display:flex;align-items:center;gap:26px;padding:24px 4%;height:104px}.brand{background:#fff;border-radius:2px;display:flex;width:155px;height:55px;padding:8px 15px}.brand img{width:100%;height:100%;object-fit:contain}.series{font-size:13px;letter-spacing:2px;color:#b4c9de}.toolbar{display:flex;gap:16px;margin-left:auto;align-items:center}.languages{display:flex;gap:3px}.languages button{border:0;color:#9eb7ce;min-width:44px}.languages button[aria-pressed=true]{background:#193c6c;color:#fff;border-bottom:3px solid #e30613}.toolbar>button{font-size:14px;border-color:transparent}.main{display:grid;grid-template-columns:43% 57%;padding:0 0 0 5%;min-height:620px}.copy{align-self:center;padding:25px 0 25px;z-index:2;min-width:0}.eyebrow{text-transform:uppercase;font-weight:800;color:#90bade;letter-spacing:2px;font-size:13px;margin:0 0 20px;display:flex;gap:12px;align-items:center}.eyebrow:before{content:'';width:25px;height:3px;background:var(--red);flex:none}h1{font-size:clamp(40px,4.8vw,70px);line-height:1.03;letter-spacing:-1.5px;margin:0 0 22px;font-weight:800}h1 em{display:block;font-style:normal;color:var(--water)}.lead{font-size:clamp(20px,1.8vw,27px);line-height:1.3;color:#d6e4f0;margin:0 0 22px;max-width:560px}.waterways{display:grid;grid-template-columns:1fr 1fr;gap:7px 22px;margin:20px 0 20px}.waterways button{text-align:left;font-size:18px;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:12px 0;display:flex;gap:10px;align-items:baseline;color:#a8bfd6}.waterways small{font-size:12px;color:#759fbe}.waterways button[aria-selected=true]{color:white;border-color:#e30613}.waterways button[aria-selected=true] small{color:#f25761}.waterways button:hover{background:none;color:white}#detail{min-height:148px}#description{font-size:19px;line-height:1.4;color:#e0ebf5;margin:0 0 14px}.measure{margin:0;border-left:3px solid var(--water);padding-left:13px;color:#bbd5e8;line-height:1.4}.measure span{display:block;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#7cabc9;margin-bottom:3px}.measure strong{font-size:17px;font-weight:400}.fact{border-top:1px solid var(--line);display:flex;gap:18px;margin-top:22px;padding-top:20px;align-items:flex-start}.fact>strong{font-size:56px;color:#69cdf4;letter-spacing:-2px;line-height:1.1;white-space:nowrap}.fact p{font-size:17px;line-height:1.4;color:#adc6dc;margin:0 0 6px}.fact a{font-size:13px;color:#93b2cc}.visual{position:relative;min-width:0;min-height:620px;margin-left:-30px;overflow:hidden}#model{width:100%;height:100%;position:absolute;inset:0;cursor:grab;touch-action:pan-y}#model:active{cursor:grabbing}.dragHint{position:absolute;right:7%;top:10px;color:#8aafcf;font-size:13px;pointer-events:none}.label{position:absolute;transform:translate(-50%,-50%);color:#c7efff;background:#092442ed;border:1px solid #68bcdf;padding:8px 10px;font-size:13px;max-width:75%;text-align:center;pointer-events:none;border-radius:3px}.label[hidden]{display:none}.modelMeta{position:absolute;left:10%;right:7%;bottom:16px;display:flex;gap:12px;align-items:center;justify-content:space-between;color:#8cacc7;font-size:11px}.modelMeta>span{max-width:180px;text-transform:uppercase;letter-spacing:1px}.modelControls{display:flex;gap:2px;align-items:center}.modelControls button{padding:5px 8px;font-size:13px;border-color:transparent;color:#a1c0d8}.modelControls button:first-child,.modelControls button:nth-child(2){font-size:23px}footer{display:flex;justify-content:space-between;gap:20px;padding:18px 4%;border-top:1px solid #ffffff0d;font-size:13px;color:#85a3bf}footer a{color:#a5bfd3}.notice{padding:12px 5%;font-size:14px;color:#ffd1d1}.zero3d #model{display:none}#fallback{position:absolute;left:12%;right:10%;top:40%;font-size:24px;color:#c8e5f7}#fallback[hidden]{display:none}
@media(min-width:1600px){.main{min-height:740px}.visual{min-height:740px}.copy{padding-right:22px}#description{font-size:22px}.measure strong{font-size:20px}.waterways button{font-size:21px}.lead{font-size:28px}}
@media(max-width:1100px){.series{display:none}.main{grid-template-columns:45% 55%;padding-left:4%}.bar{padding:20px 4%;height:90px}.brand{width:140px;height:49px}.main,.visual{min-height:640px}h1{font-size:49px}.waterways{gap:8px 12px}.waterways button{font-size:16px;gap:7px}#description{font-size:18px}.fact>strong{font-size:46px}.fact p{font-size:16px}.modelMeta{left:8%;right:4%;flex-wrap:wrap}.modelMeta>span{max-width:none}.visual{margin-left:-20px}}
@media(max-width:760px){.widget{min-height:0}.bar{height:82px;padding:17px 6%;gap:10px}.brand{width:128px;height:45px}.toolbar{gap:5px}.toolbar button{font-size:14px}.languages button{min-width:39px;padding:8px}.main{display:flex;flex-direction:column;padding:0}.copy{padding:23px 6% 0;width:100%}.eyebrow{font-size:12px;letter-spacing:1.5px}h1{font-size:clamp(42px,8vw,60px);max-width:600px}.lead{font-size:22px}.waterways{gap:4px 20px;margin:20px 0}.waterways button{font-size:18px}.visual{min-height:430px;height:430px;margin:5px 0 0}.modelMeta{bottom:14px;left:6%;right:6%;flex-wrap:nowrap}.modelMeta>span{max-width:160px}.dragHint{top:8px;right:6%}#detail{min-height:145px}.fact{margin-top:18px;padding-top:18px}.fact>strong{font-size:51px}.fact p{font-size:17px}.fact a{font-size:13px}footer{padding:17px 6%;font-size:12px;align-items:center}footer>span{max-width:55%}.label{font-size:12px}.modelControls button{font-size:12px}.modelControls button:first-child,.modelControls button:nth-child(2){font-size:21px}}
@media(max-width:400px){.toolbar{gap:0}.bar{padding-left:5%;padding-right:5%}.brand{width:110px;height:40px}.waterways{column-gap:12px}.waterways button{font-size:16px}.fact p{font-size:16px}.visual{min-height:370px;height:370px}.modelMeta>span{font-size:10px;max-width:120px}.modelControls button{padding:5px}.copy{padding-left:5%;padding-right:5%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}}
.label.red{color:#ffd7dc;border-color:#f47482;background:#381b30ed}

/* Display the supplied HL wordmark in its original proportions. */
.brand{background:transparent;padding:0;border-radius:0;align-items:center;flex-shrink:0}.brand img{display:block;height:auto;max-height:100%;aspect-ratio:256.1/86.1;object-fit:contain}
select{font:inherit;color:var(--white);background:#122e50;border:1px solid #5f80a2;border-radius:4px;padding:10px;min-height:42px;max-width:200px;font-size:16px}select:focus-visible,input:focus-visible{outline:3px solid #8ae0ff;outline-offset:3px}
.status{border-left:3px solid var(--water);padding-left:14px;color:#cbe7f6;font-size:18px;line-height:1.45}.status.danger{border-color:#e30613;color:#ffc6cc}.control{margin:25px 0}.control label,.controlEnds{display:flex;justify-content:space-between;gap:15px;font-size:16px;color:#adc6dc}.control label{margin-bottom:12px}.control input{width:100%;accent-color:#56c5f3;cursor:ew-resize}.controlEnds{font-size:14px;margin-top:8px}.primary{background:#e30613;border-color:#e30613}.action{margin:10px 0 8px}.requirements{border:0;margin:18px 0;padding:0}.requirements label{display:flex;align-items:flex-start;gap:12px;padding:9px 0;font-size:18px;border-bottom:1px solid var(--line);cursor:pointer}.requirements input{width:20px;height:20px;accent-color:#e30613;flex:none;margin:2px 0}.small{font-size:16px;color:#a8bfd6;line-height:1.5}.optionRow{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0}.optionRow [aria-pressed=true]{border-color:#e30613;background:#193c6c}details{margin:22px 0;font-size:17px;color:#bbd3e7;line-height:1.5}summary{cursor:pointer;color:#85d4f6}.sourceFigure{width:100%;height:auto;background:#fff;margin-top:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}body:not([data-page=waterways]) h1{font-size:clamp(38px,4vw,62px)}body:not([data-page=waterways]) .lead{font-size:23px}.presentation .bar{height:52px;padding-top:3px;padding-bottom:3px}.presentation .brand,.presentation .series,.presentation footer{display:none}.presentation .widget{min-height:100dvh}.presentation .main{min-height:calc(100dvh - 52px)}.presentation .visual{min-height:calc(100dvh - 52px)}
@media(max-width:760px){select{max-width:150px;font-size:15px}.toolbar{gap:2px}.toolbar>button{padding:8px}.requirements label{font-size:17px}body:not([data-page=waterways]) h1{font-size:clamp(36px,8vw,52px)}.presentation .visual{min-height:400px}.presentation .main{min-height:0}}
@media(min-width:761px){.presentation .widget{height:100dvh;min-height:0;display:flex;flex-direction:column}.presentation .bar{height:42px;flex:none}.presentation .toolbar>button{display:none}.presentation .main{flex:1;min-height:0;height:calc(100dvh - 42px)}.presentation .copy{align-self:start;max-height:100%;overflow-y:auto;scrollbar-width:thin;padding-top:8px;padding-bottom:14px;padding-right:15px}.presentation .visual{height:100%;min-height:0}.presentation .eyebrow{margin-bottom:14px}.presentation h1,.presentation:not([data-page=waterways]) h1{font-size:clamp(34px,3.8vw,56px);margin-bottom:14px}.presentation:not([data-page=waterways]) .lead{font-size:21px;margin-bottom:12px}.presentation .status{font-size:17px}.presentation .requirements label{font-size:17px;padding:6px 0}.presentation .control{margin:18px 0}.presentation .small{font-size:15px}.presentation details{margin:14px 0}.presentation .modelMeta{bottom:12px}}
@media(max-width:400px){.languages select{max-width:130px}}

/* Visible mouse guidance shared by all four model views. */
.dragHint{top:12px;right:6%;left:auto;max-width:88%;display:flex;align-items:center;gap:12px;padding:12px 16px;color:#f5f8fc;background:#102f50f2;border:1px solid #56c5f3;border-left:4px solid #56c5f3;border-radius:8px;box-shadow:0 4px 16px #0004;font-size:16px;font-weight:700;line-height:1.4;z-index:3;pointer-events:none}
.dragHint::before{content:"↔";font-size:30px;font-weight:400;line-height:1;color:#78d8ff;flex:none}
@media(max-width:760px){.dragHint{top:8px;right:6%;font-size:14px;padding:10px 12px;gap:10px}.dragHint::before{font-size:26px}}

/* Page 02: direct guidance above the four interactive choices. */
.selectionHint{display:flex;align-items:center;gap:12px;margin:18px 0 8px;padding:12px 14px;border:1px solid #56c5f380;border-left:4px solid var(--water);border-radius:6px;background:#193c6c99;color:#f5f8fc;font-size:17px;font-weight:700;line-height:1.4}
.selectionHint::before{content:"↓";flex:none;font-size:28px;color:#78d8ff;line-height:1}
.selectionHint+.waterways{margin-top:8px}
@media(max-width:760px){.selectionHint{font-size:16px;margin-left:0;margin-right:0}}
