:root{--font-sans:"DM Sans", system-ui, -apple-system, sans-serif;--font-heading:"Space Grotesk", "DM Sans", system-ui, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--color-heading:#b8bcc6;--color-bg:#0f1117;--color-surface:#1a1d27;--color-text:#e8e8ed;--color-text-muted:#8b8d98;--color-accent:#646cff;--color-upstream:#e45756;--color-domestic-va:#4c78a8;--color-own-direct:#f58518;--color-downstream:#72b7b2;--color-bar:#e8915a;--color-bar-dim:#e8915a2e;--viz-width:60%;--text-width:40%}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:auto;font-size:16px}body{font-family:var(--font-sans);background:var(--color-bg);color:var(--color-text);min-width:900px;line-height:1.6;overflow-x:hidden}#app{text-align:left;width:100%;max-width:none;margin:0;padding:0}#story{width:100%;display:flex;position:relative}#pair-selector{z-index:50;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f1117eb;border-bottom:1px solid #ffffff14;align-items:center;gap:.5rem;padding:.5rem 1.5rem;font-size:.82rem;display:flex;position:fixed;top:0;left:0;right:0}#pair-selector label{color:var(--color-text-muted);margin-left:.5rem;font-weight:500}#pair-selector select{background:var(--color-surface);color:var(--color-text);font-family:var(--font-sans);cursor:pointer;border:1px solid #ffffff1f;border-radius:6px;max-width:280px;padding:.35rem .6rem;font-size:.82rem}#pair-selector select:focus{border-color:var(--color-accent);outline:none}#pair-selector select option:disabled{color:var(--color-text-muted);opacity:.4}#loading-indicator{color:var(--color-accent);opacity:0;margin-left:.5rem;font-size:.78rem;transition:opacity .2s}#loading-indicator.visible{opacity:1}#scroll-steps{width:var(--text-width);z-index:2;padding:0 2rem;position:relative}.step{align-items:center;min-height:90vh;padding:2rem 0;display:flex}.step:first-child{padding-top:.5rem}.step:last-child{align-items:flex-start;padding-top:10vh;padding-bottom:30vh}.step-long{min-height:200vh}.step-content{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#1a1d27d9;border:1px solid #ffffff0f;border-radius:12px;max-width:380px;padding:1.5rem 2rem;transition:opacity .4s,transform .4s}.step.is-active .step-content{opacity:1;transform:none}.step:not(.is-active) .step-content{opacity:.55;transform:translateY(4px)}.step-content h2{font-family:var(--font-heading);letter-spacing:-.01em;color:var(--color-heading);margin-bottom:.6rem;font-size:1.2rem;font-weight:600;line-height:1.3}.step-content p{color:var(--color-text-muted);margin-bottom:.55rem;font-size:.88rem;line-height:1.55}.step-content p strong{color:var(--color-text)}.step-content em,.step-content code{font-family:var(--font-mono);font-size:.82em}.step-content ul{margin:.5rem 0;padding:0;list-style:none}.step-content ul li{color:var(--color-text-muted);margin-bottom:.4rem;padding-left:.8rem;font-size:.88rem;position:relative}.step-content ul li:before{content:"·";color:var(--color-text-muted);font-weight:700;position:absolute;left:0}.explore-link{color:var(--color-accent);font-size:.95rem;font-weight:600;text-decoration:none}.explore-link:hover{text-decoration:underline}#sticky-viz{width:var(--viz-width);z-index:1;justify-content:center;align-items:center;height:82vh;padding-top:.25rem;padding-bottom:.25rem;display:flex;position:sticky;top:0;right:0;overflow:hidden}#viz{width:100%;height:100%}.tooltip{pointer-events:none;color:var(--color-text);opacity:0;z-index:100;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0f1117f2;border:1px solid #ffffff26;border-radius:8px;max-width:240px;padding:8px 12px;font-size:.82rem;line-height:1.4;transition:opacity .15s;position:fixed}.tooltip.visible{opacity:1}.tooltip .tt-label{margin-bottom:2px;font-weight:600}.tooltip .tt-value{color:var(--color-text-muted);font-family:var(--font-mono);font-size:.78rem}.bar-rect{cursor:default}.axis text{fill:var(--color-text-muted);font-size:11px;font-family:var(--font-mono)}.axis line,.axis path{stroke:#ffffff1a}.annotation-text{fill:var(--color-text);font-family:var(--font-sans)}.sankey-link{fill:none;stroke-opacity:.3;transition:stroke-opacity .2s}.sankey-link:hover{stroke-opacity:.6}.sankey-node rect{cursor:grab;stroke:#ffffff26;stroke-width:.5px}.sankey-node.dragging rect{cursor:grabbing}.sankey-node text{fill:var(--color-text-muted);font-size:10px;font-family:var(--font-mono)}.sankey-node:hover rect{stroke:#ffffff80}.morph-layer{pointer-events:none}.tour-overlay{z-index:200;cursor:pointer;background:#0000008c;position:fixed;inset:0}.tour-spotlight{z-index:201;pointer-events:none;border-radius:10px;transition:all .3s;position:fixed;box-shadow:0 0 0 9999px #0000008c}.tour-tooltip{z-index:202;background:var(--color-surface);font-family:var(--font-sans);color:var(--color-text);border:1px solid #ffffff1f;border-radius:12px;padding:1rem 1.25rem;animation:.25s tour-fade-in;position:fixed;box-shadow:0 8px 32px #0006}@keyframes tour-fade-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.tour-tooltip-header{justify-content:space-between;align-items:center;margin-bottom:.4rem;display:flex}.tour-step-counter{color:var(--color-text-muted);font-size:.72rem;font-weight:500}.tour-skip-btn{color:var(--color-text-muted);cursor:pointer;font-size:.75rem;font-family:var(--font-sans);background:0 0;border:none;border-radius:4px;padding:2px 6px}.tour-skip-btn:hover{color:var(--color-text);background:#ffffff0f}.tour-title{margin-bottom:.35rem;font-size:1rem;font-weight:700}.tour-text{color:var(--color-text-muted);margin-bottom:.8rem;font-size:.85rem;line-height:1.5}.tour-actions{justify-content:space-between;align-items:center;display:flex}.tour-prev-btn,.tour-next-btn{font-family:var(--font-sans);cursor:pointer;border:none;border-radius:6px;padding:.35rem .9rem;font-size:.82rem;font-weight:600;transition:background .15s}.tour-prev-btn{color:var(--color-text-muted);background:#ffffff0f}.tour-prev-btn:hover{color:var(--color-text);background:#ffffff1a}.tour-next-btn{background:var(--color-accent);color:#fff}.tour-next-btn:hover{background:#5258d4}@media (max-width:1100px){:root{--viz-width:55%;--text-width:45%}}@media (max-width:900px){#story{flex-direction:column}#scroll-steps{width:100%}#sticky-viz{width:100%;height:60vh}.cover-panels{flex-direction:column}.cover-panel{height:50vh;width:100%!important}}#cover-gateway{background:var(--color-bg);z-index:10;flex-direction:column;width:100%;height:100vh;display:flex;position:relative;overflow:hidden}.cover-panels{flex:1;gap:.75rem;min-height:0;padding:.5rem 1rem .75rem;display:flex;overflow:hidden}.cover-panel{background:var(--color-surface);border:1px solid #ffffff0f;border-radius:10px;flex-direction:column;flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.panel-label{color:var(--color-text-muted);border-bottom:1px solid #ffffff0f;flex-shrink:0;align-items:center;gap:.5rem;padding:.4rem .75rem;font-size:.78rem;font-weight:600;display:flex}.panel-hint{color:#8b8d9880;font-size:.68rem;font-style:italic;font-weight:400}#scatter-viz{flex:1;width:100%}#heatmap-container{flex:1;position:relative;overflow:hidden}#heatmap-canvas{position:absolute;inset:0}#heatmap-axes{pointer-events:all;position:absolute;inset:0}#heatmap-tooltip{z-index:20;pointer-events:none;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;max-width:260px;position:absolute}#heatmap-tooltip.visible{opacity:1}#heatmap-tooltip .tt-label{margin-bottom:2px;font-size:.78rem;font-weight:600;line-height:1.35}#heatmap-tooltip .tt-value{font-family:var(--font-mono);color:var(--color-text-muted);font-size:.74rem}.scatter-dot{cursor:pointer;transition:fill-opacity .15s}.scatter-reset-zoom{font-size:.68rem;font-family:var(--font-sans);color:var(--color-text-muted);cursor:pointer;z-index:5;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1a1d27d9;border:1px solid #ffffff1f;border-radius:4px;padding:.2rem .5rem;font-weight:500;position:absolute;top:2.2rem;right:.6rem}.scatter-reset-zoom:hover{color:var(--color-text);border-color:var(--color-accent)}#storyboard-drawer{z-index:100;background:var(--color-bg);will-change:transform;flex-direction:column;transition:transform .45s cubic-bezier(.33,1,.68,1);display:flex;position:fixed;inset:0}#storyboard-drawer.drawer-closed{pointer-events:none;transform:translateY(100%)}#storyboard-drawer.drawer-open{pointer-events:auto;transform:translateY(0)}.drawer-handle{cursor:pointer;-webkit-user-select:none;user-select:none;border-bottom:1px solid #ffffff14;flex-shrink:0;justify-content:center;align-items:center;gap:.5rem;padding:.6rem;display:flex}.drawer-handle:hover{background:#ffffff08}.drawer-handle-bar{background:#fff3;border-radius:2px;width:36px;height:4px;display:inline-block}.drawer-handle-text{color:var(--color-text-muted);font-size:.78rem;font-weight:500}.drawer-body{flex:1;position:relative;overflow-y:auto}.drawer-close{color:var(--color-text-muted);cursor:pointer;font-size:1.4rem;line-height:1;font-family:var(--font-sans);background:0 0;border:none;border-radius:4px;margin-left:auto;padding:.2rem .5rem}.drawer-close:hover{color:var(--color-text);background:#ffffff0f}#storyboard-drawer .drawer-body #pair-selector{position:sticky;top:0}.toast{color:var(--color-text);font-size:.78rem;font-family:var(--font-mono);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto;cursor:pointer;opacity:0;z-index:300;white-space:nowrap;background:#1a1d27f2;border:1px solid #ffffff1f;border-radius:8px;padding:.4rem .9rem;transition:opacity .2s,transform .2s;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%)translateY(20px)}.toast.visible{opacity:1;transform:translate(-50%)translateY(0)}