/* A shared illustration and a quieter editorial hierarchy. */
.page { padding-top:30px; padding-bottom:80px; }
.masthead { display:grid; grid-template-columns:minmax(0,1fr) 196px; align-items:center; gap:10px 50px; padding:8px 0 25px; border-bottom:1px solid var(--rule); }
h1 { font-size:clamp(85px,12.2vw,176px); }
.title-group { display:contents; }
.masthead h1 { grid-column:1; grid-row:1; }
.navigation-slot { grid-column:2; grid-row:1; }
.tagline-placeholder { grid-column:1 / -1; grid-row:2; display:block; margin:0 0 0 5px; padding-left:15px; font-size:23px; font-style:normal; }
.navigation-slot { width:196px; height:45px; align-self:center; }
.section-dropdown { width:196px; position:relative; z-index:30; }
.section-dropdown.is-docked { position:fixed; }
.section-toggle { display:flex; align-items:stretch; justify-content:space-between; width:100%; min-height:45px; padding:0; background:var(--surface); color:var(--green); border:2px solid; border-color:var(--bevel-light) var(--bevel-dark) var(--bevel-dark) var(--bevel-light); border-radius:0; font-size:21px; line-height:1.3; text-align:left; }
#current-section-label { padding:8px 15px 7px; }
.dropdown-caret { display:grid; place-items:center; width:34px; border-left:1px solid var(--rule); color:var(--coral); font-size:17px; }
.section-toggle:hover { background:var(--highlight); }
.section-toggle:active, .section-toggle[aria-expanded="true"] { border-color:var(--bevel-dark) var(--bevel-light) var(--bevel-light) var(--bevel-dark); }

.section-menu { position:absolute; top:calc(100% + 8px); right:0; width:300px; max-width:calc(100vw - 32px); max-height:var(--menu-space,calc(100dvh - 92px)); overflow:auto; background:var(--surface); border:2px solid; border-color:var(--bevel-light) var(--bevel-dark) var(--bevel-dark) var(--bevel-light); padding:10px; }
.menu-search-wrap { display:flex; align-items:center; gap:8px; padding:9px 10px; background:var(--black); border:1px solid var(--rule); color:var(--muted); }
.menu-search-wrap > span { font-size:24px; line-height:1; }
#section-search { min-width:0; width:100%; padding:2px 0; border:0; outline:0; border-radius:0; background:transparent; color:var(--text); font-size:19px; line-height:1.4; }
#section-search::placeholder { color:var(--muted); opacity:1; }
.menu-search-wrap:focus-within { outline:1px solid var(--green); outline-offset:2px; }
.section-results { padding:8px 0; }
.section-option { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; min-height:43px; padding:8px 11px; border:0; border-radius:0; background:transparent; color:var(--text); text-align:left; font-size:21px; line-height:1.35; }
.section-option[aria-selected="true"], .section-option:hover { background:var(--highlight); color:var(--green); }
.section-marker { color:var(--coral); font-size:17px; }
.menu-empty { margin:13px 10px 17px; font-size:18px; color:var(--muted); }
.menu-sharing { border-top:1px solid var(--rule); padding:8px 0 0; }
.menu-share { display:block; width:100%; min-height:43px; padding:8px 11px; background:transparent; color:var(--coral); border:0; border-radius:0; text-align:left; font-size:19px; }
.menu-share:hover, .menu-share[aria-expanded="true"] { background:var(--highlight); }
.share-tray { position:static; width:100%; max-width:none; padding:13px 3px 4px; border:0; background:transparent; }
.share-tray label { font-size:17px; margin-bottom:8px; color:var(--text); }
.share-input-row { border:1px solid var(--rule); }
.share-input-row input { font-size:15px; color:var(--text); }
.share-input-row button { font-size:17px; background:var(--surface); }
#share-status { min-height:1em; margin-top:8px; font-size:16px; }
.panels { padding:34px 0 42px; min-height:550px; }
.overview-grid { display:block; }
.overview-copy { display:grid; grid-template-columns:1.25fr 1fr; gap:0 70px; align-items:start; margin-bottom:40px; }
.overview-copy .copy-slot-lead { grid-row:span 2; padding-bottom:0; max-width:670px; }
.overview-copy .copy-slot-lead p { font-size:clamp(36px,3.6vw,52px); line-height:1.12; }
.overview-copy .copy-slot-wide { min-height:0; padding:3px 0 17px; }
.overview-copy .copy-slot-wide p { font-size:23px; line-height:1.45; }
.overview-copy .related-links { gap:25px; padding-top:0; }
.overview-copy .related-links button { font-size:19px; border-color:var(--rule); padding-bottom:3px; }
.copy-slot p { font-style:normal; color:var(--text); }
.copy-slot-lead p { color:var(--text); }
.copy-slot-small p { color:var(--muted); }
.network-pair { display:grid; grid-template-columns:1fr 1fr; gap:0; }
.team-network { min-width:0; margin:0; padding:0 32px 0 0; }
.team-network + .team-network { padding:0 0 0 32px; border-left:1px solid var(--rule); }
.team-network figcaption { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:6px 12px; font-size:23px; line-height:1.3; color:var(--text); min-height:37px; }
.channel-count { font-size:17px; color:var(--muted); white-space:nowrap; }
.network-stage { height:326px; position:relative; overflow:hidden; background:transparent; border:0; }
.network-stage canvas, .network-members { position:absolute; inset:0; width:100%; height:100%; }
.network-members { pointer-events:none; }
.member-button { position:absolute; width:44px; height:52px; margin:0; padding:0; transform:translate(-50%,-50%); border:1px solid transparent; border-radius:0; background:transparent; pointer-events:auto; }
.member-button:focus-visible { outline:1px solid var(--coral); outline-offset:3px; }
#overview > .context-pair { margin-top:26px; padding-top:24px; border-top:1px solid var(--rule); gap:50px; }
#overview > .context-pair .copy-slot { border:0; padding-left:0; min-height:65px; }
.theme-toggle { position:fixed; bottom:18px; right:20px; z-index:40; display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:40px; padding:6px 12px; border:2px solid; border-color:var(--bevel-light) var(--bevel-dark) var(--bevel-dark) var(--bevel-light); border-radius:0; background:var(--surface); color:var(--text); font-size:16px; line-height:1.4; }
.theme-toggle:hover { background:var(--highlight); }
.theme-toggle:active { border-color:var(--bevel-dark) var(--bevel-light) var(--bevel-light) var(--bevel-dark); }
.theme-symbol { position:relative; display:block; width:13px; height:13px; border:1px solid currentColor; border-radius:50%; overflow:hidden; }
.theme-symbol::before { content:''; position:absolute; left:0; top:0; width:50%; height:100%; background:currentColor; }
footer { color:var(--muted); padding-right:105px; }
@media(max-width:1000px) {
  .overview-copy { gap:0 42px; grid-template-columns:1.2fr 1fr; }
  .overview-copy .copy-slot-lead p { font-size:43px; }
  .overview-copy .copy-slot-wide p { font-size:22px; }
  .team-network { padding-right:22px; }
  .team-network + .team-network { padding-left:22px; }
  .team-network figcaption { display:block; font-size:22px; }
  .channel-count { display:block; margin-top:4px; }
  .network-stage { height:306px; }
      }
@media(max-width:780px) {
  .masthead { grid-template-columns:minmax(0,1fr) 156px; gap:20px; padding-bottom:30px; }
  h1 { font-size:14vw; }
  .navigation-slot { width:156px; }
  .section-toggle { font-size:18px; min-height:43px; }
  #current-section-label { padding:9px 10px 7px; }
  .dropdown-caret { width:28px; }
  .tagline-placeholder { font-size:22px; margin-top:15px; }
  .overview-copy { gap:18px 25px; margin-bottom:30px; }
  .overview-copy .copy-slot-lead p { font-size:37px; }
  .overview-copy .related-links { gap:16px; }
  .overview-copy .related-links button { font-size:18px; }
  .network-stage { height:280px; }
              }
@media(max-width:560px) {
  .masthead { grid-template-columns:minmax(0,1fr) 112px; gap:13px; align-items:start; padding:0 0 27px; }
  h1 { font-size:14.3vw; letter-spacing:-.063em; }
  .navigation-slot { width:112px; height:41px; margin-top:4px; align-self:start; }
  .section-toggle { min-height:39px; font-size:16px; }
  #current-section-label { padding:8px 7px 6px; }
  .dropdown-caret { width:23px; font-size:15px; }
  .tagline-placeholder { font-size:21px; margin:15px 0 0; padding-left:12px; }
  .section-menu { width:min(300px,calc(100vw - 40px)); }
  .panels { padding-top:28px; }
  .overview-copy { display:block; margin-bottom:30px; }
  .overview-copy .copy-slot-lead { padding-bottom:18px; }
  .overview-copy .copy-slot-lead p { font-size:39px; }
  .overview-copy .copy-slot-wide { padding-bottom:20px; }
  .overview-copy .copy-slot-wide p { font-size:22px; }
  .overview-copy .related-links { gap:23px; }
      .network-pair { grid-template-columns:1fr; gap:28px; }
  .team-network, .team-network + .team-network { padding:0; border:0; }
  .team-network + .team-network { padding-top:25px; border-top:1px solid var(--rule); }
  .team-network figcaption { display:flex; font-size:22px; }
  .channel-count { margin-top:0; font-size:16px; }
  .network-stage { height:285px; }
          #overview > .context-pair { gap:24px; margin-top:14px; }
  .theme-toggle { min-height:44px; bottom:14px; right:14px; }
  footer { padding-right:0; gap:25px; align-items:start; }
  .page { padding-bottom:85px; }
}
@media(max-width:350px) {
  .masthead { grid-template-columns:minmax(0,1fr) 104px; gap:9px; }
  .navigation-slot { width:104px; margin-top:0; }
  h1 { font-size:14vw; }
  .section-toggle { font-size:15px; }
  #current-section-label { padding-left:5px; }
  .network-stage { height:265px; }
  .overview-copy .copy-slot-lead p { font-size:35px; }
}
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; } }

.network-comparison { border-top:1px solid var(--rule); padding-top:25px; }
.network-insight { padding:9px 0 0; min-height:96px; }
.network-insight p { margin:0; max-width:45ch; color:var(--text); font-size:21px; line-height:1.45; }
.network-confusion { position:absolute; pointer-events:none; color:var(--error); font-size:25px; line-height:1; transform:translate(-50%,-50%); }
@media(max-width:1000px) { .network-insight { min-height:125px; } }
@media(max-width:560px) { .masthead { row-gap:14px; } .tagline-placeholder { margin-top:0; } .network-insight { min-height:0; padding-top:11px; } .network-insight p { font-size:21px; } }

.masthead .tagline-placeholder { margin-top:0; }
footer { justify-content:flex-end; }
@media(max-width:560px) { footer { justify-content:flex-start; } }