/* Desktop only (wider than 720px): index.html links it with a media query, after the shared styles, so it wins and phones
   never see it. Phone changes go in mobile.css. */

/* 1rem = 17px at 1920x1080, grows with the window */
html { font-size: max(13px, min(0.885vw, 1.574vh)); }

/* the demo fills the window above the footer (55.2px), no scrolling; the road two thirds, the network the rest */
.page { max-width: 48.5rem; height: calc(100vh - 55.2px); padding: 0.75rem 1.88rem 1.9rem; gap: 0.7rem; }
.demo > .stage { flex: 0 0 calc(66.6% - 0.3rem); }

/* the arrow to the explainer: in the page's bottom padding, so the demo keeps its size */
.more { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); }

.wrap.explain { padding: 0 32px; margin-top: 40px; }