:root{--ink:#102b43;--muted:#5b6d7a;--blue:#267cc5;--line:#dce5eb;--bg:#f3f7fa}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--ink);font-size:16px;line-height:1.65}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible,[role=button]:focus-visible{outline:3px solid #ef9c44;outline-offset:4px}header{max-width:1456px;padding:24px 40px 16px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{text-decoration:none;font-size:18px;font-weight:750}.brand span{font-size:12px;letter-spacing:2px;margin-left:15px;color:var(--muted)}.dateline{font-size:13px;color:var(--muted)}main{max-width:1456px;padding:0 40px;margin:auto}.intro{display:flex;justify-content:space-between;align-items:center;padding:26px 0 32px;gap:24px}.eyebrow{font-size:13px;font-weight:700;letter-spacing:1.6px;color:#658295}h1{font-size:clamp(32px,3.4vw,49px);line-height:1.2;letter-spacing:-1.4px;margin:10px 0 12px}p{margin:0;color:var(--muted)}.intro p{font-size:17px}.mobile{display:none}.price{padding-left:28px;border-left:1px solid #cbd8e2;min-width:215px}.price>span{display:block;font-size:13px;color:var(--muted)}.price strong{display:block;font-size:32px;letter-spacing:-1px;line-height:1.6}.price small{font-size:14px;font-weight:500;color:var(--muted);letter-spacing:0}.price b{font-size:14px;color:#b4531c}.explorer{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(310px,1fr);border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 12px 36px #1437510c;border:1px solid #dce5eb}.map-col{background:#0c2436;min-width:0}.map-top{display:flex;justify-content:space-between;padding:19px 23px;color:#d7e5ed;font-size:14px;border-bottom:1px solid #284052;gap:14px}.map-top span+span{font-size:12px;color:#90abba}.map-wrap{position:relative}.map-wrap svg{display:block;width:100%;height:auto}.map-note{color:#8ba4b5;font-size:12px;padding:11px 20px;border-top:1px solid #284052}.map-legend{display:flex;flex-wrap:wrap;gap:17px;padding:0 20px 17px;color:#c2d7e5;font-size:12px}.map-legend span{display:flex;align-items:center;gap:7px}.map-legend i{width:21px;height:3px;display:inline-block}.blue{background:#000066}.teal{background:#01A5D1}.pipe{border-top:3px dashed #6E7F86}.map-legend .risk{width:9px;height:9px;border-radius:100%;background:#D20A10}.story{padding:27px 27px 22px;display:flex;flex-direction:column}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:17px 0 24px}.steps button{font-size:13px;border:0;background:#edf3f7;color:#567082;border-radius:6px;padding:9px 3px;white-space:nowrap}.steps button[aria-pressed=true]{background:#163c58;color:#fff}#step-copy h2{font-size:26px;line-height:1.4;margin:0 0 13px;letter-spacing:-.6px}#step-copy p{font-size:16px;line-height:1.85}.route-summary{border-left:3px solid #2ba38e;background:#f2f8f7;padding:12px 14px;margin-top:19px;font-size:14px;color:#256856;line-height:1.9}.next{display:flex;justify-content:space-between;align-items:center;width:100%;border:1px solid #ccdce7;border-radius:7px;padding:11px 14px;font-size:14px;color:#234e6e;background:#fff;margin-top:22px}.next:hover{background:#edf5fb}.location{padding-top:20px;border-top:1px solid #e2e9ee;margin-top:24px}.location h3{font-size:18px;margin:8px 0}.location p{font-size:14px;line-height:1.8}.section{padding-top:55px}.section-heading{display:flex;align-items:flex-start;gap:16px;margin-bottom:25px}.num{font-size:14px;padding-top:5px;font-weight:700;color:#7f99ac}.section-heading h2{font-size:27px;margin:0 0 5px;letter-spacing:-.5px}.section-heading p{font-size:15px}.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden}.timeline article{padding:25px;border-right:1px solid var(--line)}.timeline article:last-child{border:0}.timeline time{font-size:13px;color:#5b7b91;font-weight:650}.timeline h3{font-size:19px;margin:14px 0 9px}.timeline p{font-size:14px;line-height:1.85}.event-key{background:#fff7ef}.event-key time{color:#ad6128}.actor-diagram{display:grid;grid-template-columns:1fr 180px 1fr;padding:28px;background:white;border:1px solid var(--line);border-radius:12px;align-items:center}.camp{max-width:370px;width:100%;margin:auto}.country-card{padding:18px 24px;border-radius:9px;border:1px solid var(--line);background:#f5f8fb}.country-card span{font-size:12px;letter-spacing:.5px;color:var(--muted)}.country-card h3{margin:3px 0 5px;font-size:22px}.country-card p{font-size:14px}.houthi{background:#fff4e9;border-color:#ebc39c}.yemen{background:#edf6fc;border-color:#bcd6e9}.support{text-align:center;padding:10px;color:#567187;font-size:14px}.conflict{text-align:center;align-self:end;padding-bottom:21px}.conflict span{font-size:14px;color:#a96732}.conflict b{display:block;font-size:38px;color:#cc8248;line-height:1.2}.conflict p{font-size:12px;margin-top:8px}.actor-note{font-size:14px;padding:16px 4px 0;max-width:1000px}.number-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.number-grid article{padding:27px 30px;border:1px solid var(--line);background:white;border-radius:12px}.number-grid h3{font-size:21px;margin:8px 0 27px}.bar-label{display:flex;justify-content:space-between;align-items:center;margin:18px 0 6px;gap:10px}.bar-label span{font-size:15px}.bar-label strong{font-size:21px}.bar-label small{font-size:12px;font-weight:500}.bar{height:12px;border-radius:3px;overflow:hidden;background:#edf2f6}.bar i{display:block;height:100%}.number-grid p{font-size:14px;margin:22px 0 18px}.caution{font-size:13px;padding:11px 13px;background:#f3f6f8;border-radius:5px;color:#4d6474}.ship-stats{display:flex;gap:35px;padding:5px 0 12px}.ship-stats strong{display:block;font-size:53px;font-weight:650;line-height:1.3;color:#264f6e}.ship-stats small{font-size:16px;color:#7d8f9c}.ship-stats span{font-size:14px;color:#5d7484}.chain{display:flex;align-items:stretch;gap:14px}.chain article{flex:1;min-width:0;padding:22px;background:#fff;border-top:3px solid #77a2bf;border-radius:0 0 8px 8px}.chain article:last-child{border-color:#e59b53;background:#fff5eb}.chain article>span{font-size:13px;color:#7994a7}.chain h3{font-size:18px;margin:11px 0 7px}.chain p{font-size:14px}.chain>b{align-self:center;color:#7994a7}.mechanism-note{font-size:13px;margin-top:16px}.watch{margin-top:24px;background:#183b54;color:white;display:flex;gap:20px;padding:22px 25px;border-radius:9px;flex-wrap:wrap;align-items:center}.watch strong{font-size:16px;margin-right:10px}.watch span{font-size:14px;border-left:1px solid #527188;padding-left:19px}.sources{margin-top:45px;border-top:1px solid #cbd9e3;border-bottom:1px solid #cbd9e3;padding:19px 0}.sources summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;font-size:15px;font-weight:600}.sources ol{padding-left:25px;color:#5c7181;font-size:14px;line-height:2}.sources a{color:#246c9d;text-underline-offset:3px}.sources[open] summary span{transform:rotate(45deg)}footer{padding:25px 0 35px;color:#688091;font-size:13px;display:flex;justify-content:space-between;gap:20px}.country{fill:#1d3b50;stroke:#38566a;stroke-width:1}.country.primary{fill:#274a60}.country-label{fill:#c9dbe7;font-size:23px;font-weight:500;letter-spacing:3px;text-anchor:middle}.sea-label{fill:#688fa8;font-size:18px;letter-spacing:4px;text-anchor:middle}.route{fill:none;stroke-width:4;stroke-linejoin:round;stroke-linecap:round;transition:opacity .3s}.route.dim{opacity:.13}.route.active{opacity:1}.route.flow{stroke-dasharray:11 8;animation:flow 9s linear infinite}.pipeline{stroke:#6E7F86;stroke-dasharray:6 7;stroke-width:3}.risk-halo{fill:#D20A1020;stroke:#D20A10;stroke-width:1.5}.spot{cursor:pointer}.spot circle.core{stroke:#102b40;stroke-width:3;fill:#d6e8f2}.spot text{fill:#eef8ff;font-size:18px;font-weight:600;paint-order:stroke;stroke:#102b40;stroke-width:5;stroke-linejoin:round}.spot:hover circle.core,.spot:focus circle.core{fill:#ffbf83;r:10}.spot.selected circle.core{fill:#ffbf83}.exit-label{font-size:17px;fill:#95cce6}.risk-text{font-size:16px;fill:#ffbd85;paint-order:stroke;stroke:#102b40;stroke-width:4}.grid-line{stroke:#214052;stroke-width:.6;stroke-dasharray:3 6}#map-error{position:absolute;top:10px;left:10px;right:10px;background:#fff1d8;padding:12px;border-radius:6px;font-size:14px}@keyframes flow{to{stroke-dashoffset:-190}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important;transition:none!important}}@media(min-width:1300px){.story{padding:30px 33px}.location{margin-top:auto;padding-top:23px}.next{margin-bottom:23px}}@media(max-width:1000px){header{padding:20px 24px 10px}main{padding:0 24px}.explorer{grid-template-columns:1.4fr 1fr}.story{padding:22px 20px}.steps{grid-template-columns:repeat(2,1fr);margin-bottom:18px}#step-copy h2{font-size:23px}.timeline article{padding:20px}.chain{gap:8px}.chain article{padding:16px}.map-top{padding:17px}.map-top span+span{display:none}.actor-diagram{grid-template-columns:1fr 125px 1fr}}@media(max-width:760px){header{padding:18px 18px 8px}.brand span{display:none}.dateline{font-size:11px;text-align:right;max-width:170px}main{padding:0 16px}.intro{padding:22px 2px 25px;align-items:flex-start}.intro p{font-size:14px;max-width:230px}.eyebrow{font-size:11px}.intro h1{font-size:32px;letter-spacing:-.8px}.mobile{display:block}.price{min-width:0;padding-left:13px;margin-top:23px}.price>span{font-size:10px;max-width:115px}.price strong{font-size:24px;white-space:nowrap}.price small{font-size:11px}.price b{font-size:12px}.explorer{display:flex;flex-direction:column;border-radius:12px}.map-top{font-size:13px;padding:14px 17px}.map-wrap svg{min-height:280px}.map-note{font-size:10px}.map-legend{font-size:10px;gap:13px;padding:0 14px 13px}.story{padding:24px}.steps{grid-template-columns:repeat(4,1fr)}.location{margin-top:19px;padding-top:17px}.section{padding-top:36px}.section-heading{gap:11px;margin-bottom:18px}.section-heading h2{font-size:23px}.section-heading p{font-size:14px}.timeline{grid-template-columns:1fr 1fr}.timeline article{padding:20px}.timeline article:nth-child(2){border-right:0}.timeline article:nth-child(-n+2){border-bottom:1px solid var(--line)}.timeline h3{font-size:17px}.timeline p{font-size:13px}.actor-diagram{padding:16px 12px;grid-template-columns:1fr 57px 1fr}.country-card{padding:13px 12px}.country-card span{font-size:10px}.country-card h3{font-size:18px}.country-card p{font-size:12px}.conflict{padding-bottom:38px}.conflict span{font-size:11px}.conflict p{display:none}.conflict b{font-size:29px}.actor-note{font-size:13px}.number-grid{grid-template-columns:1fr;gap:16px}.number-grid article{padding:23px}.number-grid h3{font-size:20px}.chain{display:grid;grid-template-columns:1fr 1fr;gap:14px}.chain>b{display:none}.chain article{padding:19px}.chain h3{font-size:16px}.watch{gap:12px;padding:20px}.watch strong{width:100%}.watch span{font-size:13px;padding-left:11px}.sources{margin-top:30px}footer{font-size:11px;display:block}footer span{display:block;margin-top:6px}}

/* Palette extracted from the supplied CITICS & CLSA 2026 presentation. */
:root{--ink:#000066;--muted:#6E7F86;--blue:#356BAC;--line:#D9E2F7;--bg:#fff}
header{border-bottom:3px solid #000066}.brand{color:#000066}.eyebrow,.num{color:#356BAC}.price{border-color:#D9E2F7}.price b{color:#D20A10}.intro h1,.section-heading h2{color:#000066}
.explorer{border-color:#D9E2F7;box-shadow:0 10px 28px #00006608}.map-col{background:#D9E2F7}.map-top{background:#000066;color:white;border-color:#356BAC}.map-top span+span{color:#D9E2F7}.map-note{color:#526887;border-color:#A8C3E4}.map-legend{color:#263851}.map-legend .pipe{border-color:#6E7F86}
.country{fill:#fff;stroke:#A8C3E4}.country.primary{fill:#edf2fb}.country-label{fill:#000066}.sea-label{fill:#52759c}.grid-line{stroke:#A8C3E4}.spot circle.core{fill:#356BAC;stroke:white}.spot text{fill:#000066;stroke:#edf2fb}.spot:hover circle.core,.spot:focus circle.core,.spot.selected circle.core{fill:#D20A10}.risk-halo{fill:#D20A101a;stroke:#D20A10}.risk-text{fill:#D20A10;stroke:#fff}.exit-label{fill:#000066}
.steps button{background:#edf2fb;color:#356BAC}.steps button[aria-pressed=true]{background:#000066}.route-summary{background:#edf2fb;border-color:#356BAC;color:#000066}.next{color:#000066;border-color:#A8C3E4}.next:hover{background:#D9E2F7}.location{border-color:#D9E2F7}
.timeline time{color:#356BAC}.event-key{background:#fdf3f3}.event-key time{color:#D20A10}.country-card{background:#f5f7fb}.houthi{background:#fdf3f3;border-color:#ebbdc0}.yemen{background:#edf2fb;border-color:#A8C3E4}.support{color:#356BAC}.conflict span,.conflict b{color:#D20A10}.bar{background:#D9E2F7}.ship-stats strong{color:#000066}.ship-stats span{color:#6E7F86}.caution{background:#edf2fb;color:#526887}
.chain article{background:#f5f7fb;border-color:#356BAC}.chain article:last-child{background:#fdf3f3;border-color:#D20A10}.chain article>span,.chain>b{color:#356BAC}.watch{background:#000066}.watch span{border-color:#356BAC}.sources{border-color:#D9E2F7}.sources a{color:#356BAC}footer{color:#6E7F86}footer strong{color:#000066;font-size:15px;font-weight:600}
button:focus-visible,a:focus-visible,summary:focus-visible,[role=button]:focus-visible{outline-color:#D20A10}

/* Lighter geographic surface; brand navy reserved for labels and primary routes. */
.map-col{background:#f1f7fb}.map-top{background:#fff;color:#000066;border-color:#e3ebf1}.map-top span+span{color:#758599}.country{fill:#fff;stroke:#cbd9e4;stroke-width:.9}.country.primary{fill:#fff}.country-label{fill:#526276;font-size:21px;letter-spacing:2px}.sea-label{fill:#94afc1;font-size:17px;letter-spacing:3px}.grid-line{stroke:#dbe7ef;opacity:.4;stroke-dasharray:none;stroke-width:.5}.map-note{color:#7d8c99;border-color:#e3ebf1}.map-legend{color:#637386}.spot text{fill:#263851;stroke:#fff;stroke-width:6;font-size:17px}.spot circle.core{fill:#356BAC;stroke:#fff}.route{stroke-width:3.2}.pipeline{stroke-width:2.5}.route.dim{opacity:.07}.risk-halo{fill:#D20A1009;stroke:#D20A10;stroke-width:1;stroke-dasharray:3 4}.exit-label{fill:#356BAC;font-size:16px}.map-legend i{height:2px}.map-legend .risk{width:7px;height:7px}.map-legend .pipe{border-top-width:2px}