/* The narration can switch between flight and network maps. Both share the
   same two-column reading layout; otherwise the network map stacks the panels. */
.world.network-mode{display:grid;grid-template-columns:minmax(0,1fr) var(--sim-rail,332px);grid-template-rows:88px auto minmax(170px,1fr);align-items:start}
.world.network-mode::before{content:"";position:absolute;inset:0 0 0 auto;width:var(--sim-rail,332px);background:#fff;border-left:1px solid var(--sim-line,#dce4ee);pointer-events:none;z-index:0}
#app[data-demo="true"] .world.network-mode .mission-hud,
#app[data-demo="true"] .world.network-mode .signal-console{display:none!important}
.network-legend{color:#dceeff}
.network-legend .legend-roles button{color:#e9f5ff;background:#0b2235;border-color:#45637e}
.network-legend .legend-roles button.selected{color:#fff;background:#0057cc;border-color:#75b3ff}
.network-legend .legend-roles i{color:#eaf5ff;background:#08213b;border-color:#75b3ff}
.network-legend p,.network-legend small{color:#c2d5e7}
.network-legend .secondary-link{color:#e8f4ff;background:#12314a;border-color:#5c83a5}
.network-layers button{color:#e7f4ff;border-color:#43637e}
.network-layers button.selected{color:#fff;background:#0057cc;border-color:#73b0ff}
@media(max-width:1100px){
 .world.network-mode{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:500px auto}
 .world.network-mode::before{display:none}
 .world.network-mode .mission-hud{grid-column:1;grid-row:2;margin:0;padding:22px 24px}
 .world.network-mode .signal-console{grid-column:2;grid-row:2;margin:0;padding:22px 24px}
 .world.network-mode .demo-caption{grid-column:1 / -1;grid-row:2;margin:0;padding:24px}
}
@media(max-width:760px){
 .world.network-mode{grid-template-columns:minmax(0,1fr);grid-template-rows:440px auto auto}
 .world.network-mode .mission-hud{grid-column:1;grid-row:2;padding:22px 18px}
 .world.network-mode .signal-console{grid-column:1;grid-row:3;padding:20px 18px}
 .world.network-mode .demo-caption{grid-column:1;grid-row:2 / 4;padding:24px 18px}
}