.orbital-flow{--of-cyan:#42c9d6;--flow-selected:#f0353f;--of-ink:#e3edf4;--of-muted:#91a5b5;position:relative;margin:clamp(70px,10vw,150px) auto;color:var(--of-ink);isolation:isolate}
.orbital-flow *{box-sizing:border-box}
.of-heading{max-width:840px;margin-bottom:32px}
.of-eyebrow{color:#66c9d4;font-size:12px;letter-spacing:.18em;text-transform:uppercase;margin:0 0 14px}
.of-heading h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(34px,5vw,64px);line-height:1.08;letter-spacing:-.035em;margin:0 0 20px}
.of-heading h2 em{color:#dbc89e;font-weight:400}
.of-heading p:last-child{font-size:clamp(15px,1.6vw,18px);line-height:1.7;color:#a5b5c2;max-width:730px;margin:0}
.of-lab{position:relative;padding:clamp(15px,2.5vw,30px);border:1px solid #315260;border-radius:25px;background:radial-gradient(ellipse at 90% 35%,#132b3e80,transparent 55%),radial-gradient(ellipse at 15% 5%,#17323150,transparent 46%),#080c12;box-shadow:0 30px 90px #0007,inset 0 1px #8ddef51f,0 0 0 6px #0a1318}
.of-lab::after{content:'';position:absolute;pointer-events:none;inset:8px;border:1px solid #84e3ec0b;border-radius:19px}
.of-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid #9cc5d219}
.of-brand{display:flex;align-items:center;gap:15px;min-width:0}
.of-brand b{font-size:31px;color:#49c9db;line-height:1;letter-spacing:-.07em}
.of-brand span{font-size:11px;letter-spacing:.17em;color:#b9aa83;line-height:1.6}
.of-controls{display:flex;flex-wrap:wrap;gap:7px}
.orbital-flow button{font:inherit;cursor:pointer}
.of-controls button,.of-orbit-actions button,.of-reset{border:1px solid #4c69777a;color:#bed0dc;background:#13202ac9;border-radius:999px;font-size:12px;line-height:1.3;padding:10px 14px;transition:background .18s,border-color .18s,color .18s}
.of-controls button:hover,.of-orbit-actions button:hover,.of-reset:hover{background:#203544;border-color:#66c5d5;color:#fff}
.of-controls button[aria-pressed=true]{border-color:#79cbd4;color:#e1fcff;background:#15313a}
.orbital-flow button:disabled{opacity:.5;cursor:default}
.orbital-flow :focus-visible{outline:2px solid #a3eaf2;outline-offset:4px}
.of-exhibit{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(10px,2.3vw,36px);align-items:center;padding-top:28px}
.of-flow-panel,.of-orbit-panel{min-width:0}
.of-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 17px}
.of-metrics div{border-bottom:1px solid #9ebdcc24;padding:0 2px 10px}
.of-metrics dt{font-size:10px;letter-spacing:.13em;color:#90a6b8;text-transform:uppercase;margin-bottom:7px}
.of-metrics dd{margin:0;font-size:clamp(19px,2.4vw,28px);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.of-metrics div:nth-child(2) dd{color:#76d6e0}
.of-river-frame{display:grid;grid-template-columns:minmax(0,1fr) minmax(112px,.46fr);gap:10px;min-height:340px;position:relative;border-radius:17px}
.of-river-svg{width:100%;height:100%;min-height:340px;display:block;overflow:visible;filter:drop-shadow(0 14px 12px #0006)}
.of-river-bed,.of-streams,.of-loss,.of-glints,.of-river-guides{transform-box:view-box;transform-origin:50% 50%;transition:transform .8s cubic-bezier(.2,.7,.2,1),opacity .6s}
.of-streams path[data-pole]{cursor:pointer}
.of-river-names{opacity:0;transition:opacity .5s;pointer-events:none}
.of-cards{display:grid;grid-template-rows:repeat(5,1fr);gap:7px;padding:23px 0 14px}
.of-card{display:grid;grid-template-columns:1fr auto;align-content:center;text-align:left;gap:3px 5px;min-width:0;border:1px solid #6381963d;background:linear-gradient(120deg,#17202be8,#0d121ae8);border-radius:11px;color:#d7e4ed;padding:8px 10px;box-shadow:0 5px 16px #0004;position:relative}
.of-card strong{font-size:clamp(11px,1.25vw,15px);font-weight:700;color:var(--pole);letter-spacing:-.02em}
.of-card [data-flow-value]{font-size:clamp(13px,1.5vw,18px);font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.of-card small{grid-column:1/-1;font-size:10px;color:#a5b3bf;font-variant-numeric:tabular-nums;white-space:nowrap}
.of-card[aria-pressed=true]{border-color:var(--pole);background:linear-gradient(120deg,color-mix(in srgb,var(--pole) 15%,#10151c),#111a23);box-shadow:0 0 0 2px color-mix(in srgb,var(--pole) 12%,transparent),0 5px 22px #0007}
.of-card:hover{border-color:var(--pole)}
.of-depth{display:grid;grid-template-columns:1fr auto;align-items:center;gap:11px 16px;margin-top:19px;padding:16px 2px 2px;border-top:1px solid #b0c6d524}
.of-depth label{font-size:12px;color:#a6b9c7;letter-spacing:.04em}
.of-depth label b{color:var(--pole);margin-right:7px}
.of-depth output{font-size:17px;color:#e1ebf2;font-variant-numeric:tabular-nums}
.of-depth input{grid-column:1/-1;width:100%;margin:0;accent-color:var(--pole);cursor:pointer;height:20px}
.of-orbit-shell{position:relative;perspective:900px}
.of-orbit-svg{display:block;width:100%;aspect-ratio:1;overflow:visible;touch-action:none;cursor:crosshair;isolation:isolate}
.of-orbit-bed,.of-orbit-grid{transform-origin:300px 300px;transition:transform .8s cubic-bezier(.2,.7,.2,1),opacity .5s}
.of-orbit-grid{pointer-events:none}
.of-pole{cursor:grab;outline:none}
.of-pole:active,.is-dragging-pole .of-orbit-svg{cursor:grabbing}
.of-pole-grip{opacity:.45;transition:opacity .2s;pointer-events:none}
.of-pole:hover .of-pole-grip,.of-pole[data-selected=true] .of-pole-grip{opacity:1}
.of-pole-selected{opacity:0;transition:opacity .2s}
.of-pole[data-selected=true] .of-pole-selected,.of-pole:focus-visible .of-pole-selected{opacity:1}
.of-pole:focus-visible .of-pole-selected{stroke-width:3}
.orbital-flow .of-pole:focus-visible{outline:none}
.of-drag-hint{font-size:11px;color:#a6c1d1;line-height:1.6;text-align:center;margin:0 6px 6px}
.of-pole-position{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;margin:0 15px 19px;padding-bottom:15px;border-bottom:1px solid #89bbce24}
.of-pole-position label{grid-column:1/-1;display:flex;align-items:baseline;gap:5px;color:#a5b8c7;font-size:11px;line-height:1.5}
.of-pole-position label b{color:var(--flow-selected);font-weight:600}
.of-pole-position output{margin-left:auto;color:#d9e9f4;font-variant-numeric:tabular-nums;min-width:44px;text-align:right}
.of-pole-position input{width:100%;margin:0;accent-color:var(--flow-selected);height:20px;align-self:center;cursor:pointer}
.of-pole-position button{border:1px solid #4c69777a;background:#13202ac9;color:#bed0dc;border-radius:999px;font-size:10px;padding:7px 10px;min-height:34px;white-space:nowrap}
.of-pole-name{font:600 11px 'Segoe UI',sans-serif;letter-spacing:.07em;pointer-events:none}
.of-point{cursor:grab;outline:none}
.of-point:active{cursor:grabbing}
.of-point:focus-visible>circle:nth-child(2){stroke:#fff;stroke-width:3;stroke-opacity:1}
.of-layer-captions{opacity:0;pointer-events:none;transition:opacity .5s}
.of-orbit-caption{display:flex;justify-content:space-between;gap:10px;color:#708b9f;font-size:10px;letter-spacing:.11em;text-transform:uppercase;margin:0 15px 13px}
.of-orbit-caption b{color:#a3bfce;font-variant-numeric:tabular-nums;font-weight:500}
.of-orbit-inputs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 15px}
.of-orbit-inputs label{display:grid;grid-template-columns:1fr auto;gap:9px;font-size:11px;color:#a5b8c7}
.of-orbit-inputs output{color:#d9e9f4;font-variant-numeric:tabular-nums}
.of-orbit-inputs input{grid-column:1/-1;width:100%;margin:0;accent-color:#69d6e4;height:17px;cursor:pointer}
.of-orbit-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin-top:20px}
.of-orbit-actions button{font-size:11px;padding:9px 12px}
.of-reading{margin-top:25px;padding:22px 0 3px;border-top:1px solid #89bbce24;display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1fr) auto;align-items:center;gap:24px}
.of-reading-title{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px}
.of-reading-title strong{font-size:16px;color:var(--flow-selected)}
.of-reading-title output{font-size:27px;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.of-reading-title span{display:block;width:100%;color:#a6bac9;font-size:12px;line-height:1.5}
.of-reading-detail p{margin:0;font-size:12px;line-height:1.7;color:#d1dfe9}
.of-reading-detail p+p{color:#8fa6b8;font-size:11px;margin-top:3px}
.of-reset{border-color:#526675;font-size:12px;white-space:nowrap}
.of-explainer{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:26px}
.of-explainer p{color:#91a5b4;font-size:12px;line-height:1.7;margin:0}
.of-explainer b{display:block;color:#d1e0ea;font-weight:600;font-size:13px;margin-bottom:4px}
.of-footnote{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;color:#738b9d;font-size:11px;line-height:1.65;margin-top:22px}
.of-footnote p{max-width:790px;margin:0}
.of-footnote a{color:#8ac9d6;text-decoration:underline;text-underline-offset:4px;white-space:nowrap}
.of-status{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap}
.orbital-flow[data-flow-ready=error] .of-status{position:static!important;width:auto!important;height:auto!important;overflow:visible!important;clip-path:none;white-space:normal;color:#efc28e;margin-top:20px}
.orbital-flow.is-exploded .of-river-bed{transform:translate(0,15px) scale(.98);opacity:.74}
.orbital-flow.is-exploded .of-streams,.orbital-flow.is-exploded .of-glints{transform:translate(0,-8px)}
.orbital-flow.is-exploded .of-loss{transform:translate(0,3px)}
.orbital-flow.is-exploded .of-river-names,.orbital-flow.is-exploded .of-layer-captions{opacity:1}
.orbital-flow.is-exploded .of-orbit-bed{transform:translate(-10px,16px) scale(.96)}
.orbital-flow.is-exploded .of-orbit-grid{transform:translate(-5px,8px) scale(.98)}
.orbital-flow.is-neutral .of-glints{opacity:0}
@media(max-width:1000px){.of-exhibit{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:10px}.of-brand span{max-width:180px;letter-spacing:.1em}.of-river-frame{grid-template-columns:minmax(0,1fr) 118px;gap:6px;min-height:300px}.of-river-svg{min-height:300px}.of-card{padding:6px}.of-card strong{font-size:11px}.of-card [data-flow-value]{font-size:13px}.of-card small{font-size:9px}.of-reading{grid-template-columns:1fr 1fr}.of-reset{grid-column:1/-1;justify-self:start}}
@media(max-width:760px){.of-exhibit{grid-template-columns:1fr;gap:25px}.of-flow-panel{max-width:610px;width:100%;margin:auto}.of-river-frame{grid-template-columns:minmax(0,1fr) minmax(125px,.46fr);min-height:330px;gap:8px}.of-river-svg{min-height:330px}.of-card{padding:8px 10px}.of-card strong{font-size:13px}.of-card [data-flow-value]{font-size:16px}.of-card small{font-size:11px}.of-orbit-panel{max-width:540px;width:100%;margin:auto}.of-orbit-caption,.of-orbit-inputs{margin-left:6px;margin-right:6px}.of-explainer{gap:14px}.of-controls{width:100%}.of-toolbar{gap:18px}.of-brand span{max-width:none}.of-lab{border-radius:20px;padding:18px}.of-heading{margin-bottom:24px}}
@media(max-width:440px){.of-lab{padding:13px 11px}.of-river-frame{grid-template-columns:minmax(0,1fr) 113px;min-height:290px;gap:5px}.of-river-svg{min-height:290px}.of-card{padding:5px 6px;border-radius:8px;gap:4px}.of-card strong{font-size:10px}.of-card [data-flow-value]{font-size:13px}.of-card small{font-size:9px}.of-cards{gap:6px;padding-top:20px;padding-bottom:11px}.of-reading{grid-template-columns:1fr;gap:14px}.of-reading-title{gap:8px}.of-reading-detail p{font-size:11px}.of-reset{grid-column:auto}.of-explainer{grid-template-columns:1fr;gap:15px}.of-explainer b{display:inline;margin-right:6px}.of-controls button{font-size:11px;padding:9px 11px}.of-brand b{font-size:28px}.of-brand span{font-size:9px}.of-orbit-actions button{font-size:10px}.of-heading h2{font-size:33px}.of-depth{margin-top:15px}.of-metrics dd{font-size:23px}.of-metrics dt{font-size:9px}}
@media(prefers-reduced-motion:reduce){.orbital-flow *{transition:none!important;scroll-behavior:auto!important}}

.of-controls button{min-width:142px;min-height:42px}.of-streams path[data-pole]{transition:opacity .2s}.of-reading-detail{min-height:65px}.of-reading-title{min-height:84px}@media(max-width:760px){.of-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.of-controls button{min-width:0;font-size:10px;padding-inline:5px}.of-reading-title{min-height:95px}}
