:root:root:root:root:root:root:root:root:root:root:root:root:root :is(a, button, summary, select):focus-visible { outline: 2px solid var(--bs-ink) !important; outline-offset: 2px !important; border-radius: 2px; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-over-hero=true] .site-header :is(a, button):focus-visible, :root:root:root:root:root:root:root:root:root:root:root:root:root .network-hero-stage :is(a, button):focus-visible { outline-color: #fff !important; }
/* A link that is loading says so. */
:root:root:root:root:root:root:root:root:root:root:root:root:root a[aria-busy=true] { opacity: .55; cursor: progress; }
@media (max-width: 900px) {
  /* The phone menu's Connect leaves the site, and its arrow says so. Main's standard hides arrows on buttons; this one stays. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .mobile-navigation-actions .button-dark > span[aria-hidden="true"]:last-child { display: inline; margin-left: 4px; }
  /* The open menu's words share the page's gutter. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .mobile-navigation-content { width: 100%; padding-inline: max(var(--gutter), env(safe-area-inset-left)) max(var(--gutter), env(safe-area-inset-right)); }
}
@media (max-width: 759px) {
  /* The footer on a phone is a footer, not two thirds of a short page. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns { gap: 20px 16px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns a { min-height: 36px; padding-block: 4px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns h2 { margin-bottom: 4px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns .network-footer-social { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns .network-footer-social h2 { grid-column: 1 / -1; }
}
/* LIQUID GOLD AND THE FRAME (owner, Nov 7). The brand's material, matched to the hero's own metal, cooled for paper: thin metallic rules,
   edges and marks. Never a flat yellow fill, never on body text, never a figure: figures stay ink. Gold text uses --px-gold-ink (7.2:1 on paper, 6.5:1
   on the wash). Motion is only a sheen that crosses gold on hover, and none under prefers-reduced-motion. Both sheets carry this block: the frame's
   sheet reaches every page but the home, the kit's reaches the home and every kit page. docs/network/precision-kit.md, "Liquid Gold". */
:root:root:root:root:root:root:root:root:root:root:root:root:root {
  --px-gold-hi: #ecd49a; --px-gold: #b8944c; --px-gold-lo: #7a5a22; --px-gold-ink: #6b4d17;
  --px-gold-edge: rgb(168 133 63 / 62%);
  --px-gold-wash: #f1ece1; --px-gold-wash-2: #ebe3d1;
  --px-gold-rule: linear-gradient(90deg, #8a6a2c 0%, #b8944c 24%, #dcc083 50%, #b8944c 76%, #8a6a2c 100%);
  --px-gold-metal: linear-gradient(135deg, #6e5020 0%, #a8843f 26%, #ecd49a 48%, #b58f47 66%, #7a5a22 86%, #5e4415 100%);
  --px-gold-sheen: linear-gradient(100deg, rgb(255 249 230 / 0) 40%, rgb(255 249 230 / .92) 50%, rgb(255 249 230 / 0) 60%);
}
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
/* A gold rule: a hairline of metal. On any element: class px-gold-rule draws it under the element's box. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-gold-rule { background-image: var(--px-gold-rule); background-size: 100% 1px; background-position: 0 100%; background-repeat: no-repeat; }
/* Rules under section heads. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-block-head { border-bottom: 0; padding-bottom: 9px; background-image: var(--px-gold-rule); background-size: 100% 1px; background-position: 0 100%; background-repeat: no-repeat; }
/* The active tab, Money's, Talks' and the home's: a bar of metal where main had ink. The sheen crosses it on hover. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-tabs { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); width: 100%; margin: 0; padding: 0; border-bottom: 1px solid var(--bs-rule); }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-tabs > a { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 48px; box-sizing: border-box; padding: 10px 0 14px; margin-bottom: -1px; border-bottom: 3px solid transparent; color: var(--bs-muted); font-size: 11.5px; font-weight: 640; letter-spacing: .16em; line-height: 1.2; text-transform: uppercase; text-decoration: none; white-space: nowrap; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-tabs > a:hover, :root:root:root:root:root:root:root:root:root:root:root:root:root .px-tabs > a[aria-current="page"] { color: var(--bs-ink); text-decoration: none; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-tabs > a:focus-visible { outline: 2px solid var(--bs-ink); outline-offset: -2px; }
@media (min-width: 601px) { :root:root:root:root:root:root:root:root:root:root:root:root:root .px-tabs > a { min-height: 52px; font-size: 12px; letter-spacing: .2em; } }
@media (hover: none) { :root:root:root:root:root:root:root:root:root:root:root:root:root .px-tabs > a:not([aria-current="page"]):hover { color: var(--bs-muted); } }
:root:root:root:root:root:root:root:root:root:root:root:root:root :is(.network-money-tabs, .ni-tabs, .px-tabs) > a[aria-current="page"] { border-bottom-color: transparent; background-image: var(--px-gold-sheen), var(--px-gold-rule); background-origin: border-box; background-size: 250% 3px, 100% 3px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; }
:root:root:root:root:root:root:root:root:root:root:root:root:root :is(.network-money-tabs, .ni-tabs, .px-tabs) > a:hover { text-decoration: none; }
/* Money has two tabs, Research and Alpha (owner, Nov 7). */
:root:root:root:root:root:root:root:root:root:root:root:root:root .network-money-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* THE SWITCH (owner, Nov 7: "make the switch more beautiful; it must be magnificent"; Nov 9: "the buttons on mobile are crooked"). The two tabs
   in miniature: one track with a hairline edge, two equal segments, the current one a plain ink pill, the other quiet ink on paper. Precise, not
   lifted: the pill sits 4 px inside the track on every side (track 46 px, its inside 44, pill 36: radius 23, 22 and 18, one centre), with no gold
   edge and no drop shadow; gold is only the lock. Each segment is the whole half of the track, 44 px tall, so the thumb's target is the segment
   itself, and its words are centred on the pill's own centre. The tracking after the last letter is given back on the left, and Alpha's lock
   hangs past the word, so both words stand at the centre of their halves. The ink is one shape that moves to the segment chosen, only on a
   change and not at all under reduced motion. Real links, the kit's focus ring. Alpha carries a gold lock for a visitor not known to be a member. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch-row { display: flex; align-items: center; margin: 0; padding: 18px 0; }
/* Under the home's centred "All research" the switch stands centred too, a deliberate pair. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .ni-money-filter-groups:has(> .px-switch) { justify-content: center; margin: 16px 0 8px; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .ni-money-filter-groups > .px-switch { width: 300px; max-width: 100%; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch, :root:root:root:root:root:root:root:root:root:root:root:root:root .ni-idea-filters > nav.px-switch { position: relative; isolation: isolate; display: inline-grid; gap: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 300px; max-width: 100%; height: 46px; margin: 0; padding: 0 4px; box-sizing: border-box; border: 1px solid var(--bs-hair-2); border-radius: 999px; background: var(--bs-paper); box-shadow: none; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch::before { content: ""; position: absolute; z-index: -1; top: 4px; bottom: 4px; left: 4px; width: calc(50% - 4px); box-sizing: border-box; border: 0; border-radius: 999px; background: var(--bs-ink); box-shadow: 0 1px 1px rgb(20 19 15 / 10%); }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch:has(> .px-seg:nth-child(2)[aria-current])::before, :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch[data-to="1"]::before { transform: translateX(100%); }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch[data-to="0"]::before { transform: none; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch:not(:has(> .px-seg[aria-current])):not([data-to])::before { opacity: 0; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch > .px-seg { --px-seg-track: .14em; position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-width: 0; min-height: 44px; height: 100%; margin: 0; padding: 0 12px 0 calc(12px + var(--px-seg-track)); box-sizing: border-box; border: 0; border-radius: 999px; background: transparent; box-shadow: none; color: var(--bs-ink-2); font-family: var(--px-sans); font-size: 12px; font-weight: 620; line-height: 1; letter-spacing: var(--px-seg-track); text-transform: uppercase; text-decoration: none; white-space: nowrap; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch > a.px-seg:hover { color: var(--bs-ink); text-decoration: none; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch > .px-seg[aria-current], :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch[data-to="0"] > .px-seg:first-child, :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch[data-to="1"] > .px-seg:nth-child(2) { color: #f7f2e7; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch[data-to="0"] > .px-seg:nth-child(2), :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch[data-to="1"] > .px-seg:first-child { color: var(--bs-ink-2); }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch > .px-seg:focus-visible { outline: 2px solid var(--bs-ink) !important; outline-offset: 2px !important; border-radius: 999px; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-lock { flex: none; width: 11px; height: 11px; margin-top: -1px; fill: none; stroke: var(--px-gold); stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
/* The lock hangs: it takes no room, so the word is centred alone. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch > .px-seg > .px-lock { margin-right: -16px; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch > .px-seg[aria-current] .px-lock, :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch[data-to="1"] > .px-seg:nth-child(2) .px-lock { stroke: var(--px-gold-hi); }
@media (prefers-reduced-motion: no-preference) {
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch::before { transition: transform .26s cubic-bezier(.2, .7, .2, 1); }
}
@media (max-width: 559px) { :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch { width: 100%; } :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch-row { padding: 16px 0; } }
/* At the head of the home the page's own top space is the space above the switch, so the room above it matches the room below. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .network-home .ni-page > .px-switch-row:first-child { padding-top: 0; }
@media (forced-colors: active) { :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch::before { background: Highlight; border-color: Highlight; } :root:root:root:root:root:root:root:root:root:root:root:root:root .px-switch > .px-seg[aria-current] { color: HighlightText; } :root:root:root:root:root:root:root:root:root:root:root:root:root .px-lock { stroke: CanvasText; } }
:root:root:root:root:root:root:root:root:root:root:root:root:root :is(.network-money-tabs, .ni-tabs, .px-tabs) > a[aria-current="page"]:hover { background-position: 0 100%, 0 100%; }
/* The main button: ink, with an edge of metal. The header's Connect (on paper, not over the hero), the page's one dark action, a front's first action. */
:root:root:root:root:root:root:root:root:root:root:root:root:root :is(body:not([data-network-over-hero="true"]) .site-header :is(.header-actions .button-dark, .header-connect), .mobile-navigation-actions .button-dark, .px-btn-dark, .ni-page .ni-stage-intro--workflow > .ni-button, .ni-page .ni-question-card .ni-contribute-link, .page-intro-with-action .button-dark) {
  --px-fill: var(--bs-ink);
  border-color: transparent; background-color: var(--bs-ink);
  background-image: linear-gradient(var(--px-fill), var(--px-fill)), var(--px-gold-sheen), var(--px-gold-metal);
  background-origin: padding-box, border-box, border-box; background-clip: padding-box, border-box, border-box;
  background-size: 100% 100%, 250% 100%, 100% 100%; background-position: 0 0, 100% 0, 0 0; background-repeat: no-repeat;
}
:root:root:root:root:root:root:root:root:root:root:root:root:root :is(body:not([data-network-over-hero="true"]) .site-header :is(.header-actions .button-dark, .header-connect), .mobile-navigation-actions .button-dark, .px-btn-dark, .ni-page .ni-stage-intro--workflow > .ni-button, .ni-page .ni-question-card .ni-contribute-link, .page-intro-with-action .button-dark):hover { --px-fill: #2b2924; border-color: transparent; background-position: 0 0, 0 0, 0 0; }
@media (prefers-reduced-motion: no-preference) {
  :root:root:root:root:root:root:root:root:root:root:root:root:root :is(.network-money-tabs, .ni-tabs, .px-tabs) > a[aria-current="page"]:hover,
  :root:root:root:root:root:root:root:root:root:root:root:root:root :is(body:not([data-network-over-hero="true"]) .site-header :is(.header-actions .button-dark, .header-connect), .mobile-navigation-actions .button-dark, .px-btn-dark, .ni-page .ni-stage-intro--workflow > .ni-button, .ni-page .ni-question-card .ni-contribute-link, .page-intro-with-action .button-dark):hover { transition: background-position .9s cubic-bezier(.2, .7, .2, 1), color .2s ease; }
}
@media (forced-colors: active) {
  :root:root:root:root:root:root:root:root:root:root:root:root:root :is(body .site-header :is(.header-actions .button-dark, .header-connect), .mobile-navigation-actions .button-dark, .px-btn-dark, .ni-page .ni-stage-intro--workflow > .ni-button, .ni-page .ni-question-card .ni-contribute-link, .page-intro-with-action .button-dark) { border-color: ButtonText; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root :is(.network-money-tabs, .ni-tabs, .px-tabs) > a[aria-current="page"] { border-bottom-color: Highlight; }
}
/* Category icons, Money's and Talks': drawn in the metal (#px-gold-metal), flat gold where the page has none. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .ni-category-symbol > svg { stroke: url(#px-gold-metal) var(--px-gold-lo); }
/* The Top row column, on /map and every table's lead column: a gold wash with a gold edge, a cap of metal on its head. The figures stay ink. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-page, :root:root:root:root:root:root:root:root:root:root:root:root:root .px-section { --px-wash: var(--px-gold-wash); }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-code-head button:hover { background: var(--bs-paper-2); }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-board tbody > tr:has(.px-row-link:focus-visible) > .px-c-lead, :root:root:root:root:root:root:root:root:root:root:root:root:root .px-rows tbody > tr:has(.px-row-link:focus-visible) > .px-c-lead { background-color: var(--px-gold-wash-2); }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-toplead { box-shadow: inset 1px 0 0 var(--px-gold-edge), inset -1px 0 0 var(--px-gold-edge); background-image: var(--px-gold-rule); background-size: 100% 2px; background-position: 0 0; background-repeat: no-repeat; }
@media (min-width: 760px) and (min-height: 501px), (min-width: 1100px) {
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table tbody > tr > .px-c-lead { box-shadow: inset 1px 0 0 var(--px-gold-edge), inset -1px 0 0 var(--px-gold-edge); }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table tbody > tr:hover > .px-c-lead { background-color: var(--px-gold-wash-2); }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table thead th.px-c-lead { box-shadow: inset 0 -1px 0 var(--bs-rule), inset 1px 0 0 var(--px-gold-edge), inset -1px 0 0 var(--px-gold-edge); background-image: var(--px-gold-rule); background-size: 100% 2px; background-position: 0 0; background-repeat: no-repeat; }
}
/* The Verified seal (pxVerified, pxTag tone gold, a gold figure): Verified's mark and nothing else's. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-seal { flex: none; width: 14px; height: 14px; overflow: visible; vertical-align: -2px; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-glyph { display: inline-block; flex: none; vertical-align: -.125em; overflow: visible; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-seal-rim { fill: url(#px-gold-seal) var(--px-gold); }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-seal-ring { fill: none; stroke: rgb(255 249 230 / 60%); stroke-width: .6; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-seal-tick { fill: none; stroke: #fffaf0; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-verified { display: inline-flex; align-items: center; gap: 5px; color: var(--px-gold-ink); font-weight: 560; white-space: nowrap; }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-tag.px-tag-gold { align-items: center; color: var(--px-gold-ink); }
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-tag.px-tag-gold::before { content: none; }
/* Gold is the word Verified beside its seal; the count beside it stays ink, as every figure. */
:root:root:root:root:root:root:root:root:root:root:root:root:root .px-figs .is-gold dt { display: flex; align-items: center; gap: 5px; color: var(--px-gold-ink); }
@media (forced-colors: active) { :root:root:root:root:root:root:root:root:root:root:root:root:root .px-seal-rim { fill: CanvasText; } :root:root:root:root:root:root:root:root:root:root:root:root:root .px-seal-tick, :root:root:root:root:root:root:root:root:root:root:root:root:root .px-seal-ring { stroke: Canvas; } }
/* One headline rule (Nov 7): a section front's headline is 64 px and left, the rest 40 px and left; on a phone 40 and 30. The home's hero is not a headline here.
   Fronts: /map, Research, Alpha, Talks, Agents; a channel's own page is not one. :not(#px-front) lifts a front above the rest's list, which shares .px-head with /map and /alpha. */
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] :is(.ni-page .ni-stage-intro--workflow, .px-agents .page-intro, .px-channels .page-intro) { text-align: left; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] :is(.ni-page .ni-stage-intro--workflow, .px-agents .page-intro, .px-channels .page-intro) :is(h1, h2, p) { margin-left: 0; margin-right: 0; text-align: left; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-stage-intro--workflow { align-items: flex-start; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] :is(.ni-page .ni-stage-intro--workflow > .ni-button, .page-intro-with-action > :is(a.button, .network-agent-action)) { align-self: flex-start; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-channels .page-intro-with-action, :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-channels .page-intro-action { align-items: flex-start; text-align: left; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-channels .page-intro-action .network-actions-caption { text-align: left; }
/* Channels sits under Talks' tabs at the Talks front's distance, so moving between the two tabs nothing jumps. */
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-channels .px-tabs + .page-intro { padding-top: 30px; }
@media (max-width: 699px) { :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-channels .px-tabs + .page-intro { padding-top: 8px; } }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] :is(.px-channels .page-intro h1, .ni-page .ni-talk-channel-head h2, .ni-page .ni-detail:not(.ni-idea-intake) .ni-detail-heading h1, .conversation-page .conversation-header h1, .not-found-page h1, .tasks-page .tasks-intro h1, .guide-content h1, .join-page .join-intro h1, .conversation-collection .collection-hero .hero-main h1, .px-head h1) { font-size: 30px; line-height: 1.08; letter-spacing: -.02em; text-align: left; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] :is(.ni-page .ni-stage-intro--workflow:not(.ni-talk-channel-head) h2, .px-agents .page-intro h1, .px-map-hero .px-head h1):not(#px-front) { font-size: 40px; line-height: 1.04; letter-spacing: -.024em; text-align: left; }
@media (min-width: 760px) {
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] :is(.px-channels .page-intro h1, .ni-page .ni-talk-channel-head h2, .ni-page .ni-detail:not(.ni-idea-intake) .ni-detail-heading h1, .conversation-page .conversation-header h1, .not-found-page h1, .tasks-page .tasks-intro h1, .guide-content h1, .join-page .join-intro h1, .conversation-collection .collection-hero .hero-main h1, .px-head h1) { font-size: 40px; line-height: 1.06; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] :is(.ni-page .ni-stage-intro--workflow:not(.ni-talk-channel-head) h2, .px-agents .page-intro h1, .px-map-hero .px-head h1):not(#px-front) { font-size: 64px; line-height: 1.02; }
}
/* A headline on the left takes its block with it. Main centres a round's, an idea's and a channel's head; with only the headline moved, the title sat
   left in the middle of the page and its meta, status and actions stayed centred under it. Here they share the headline's left edge. */
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-detail:not(.ni-idea-intake) .ni-detail-heading { text-align: left; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-detail:not(.ni-idea-intake) .ni-detail-heading h1 { margin-left: 0; margin-right: 0; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-detail:not(.ni-idea-intake) .ni-detail-heading > :is(.ni-row-meta, .ni-detail-meta, .ni-detail-attention, .ni-detail-social, .ni-tags) { justify-content: flex-start; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-detail-heading > .ni-detail-primary-action { align-items: flex-start; text-align: left; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-detail-heading > .ni-detail-primary-action > p { margin-left: 0; margin-right: 0; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-detail .ni-round-meta { align-items: flex-start; margin-left: 0; text-align: left; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-detail .ni-round-status { align-items: flex-start; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-detail :is(.ni-round-byline, .ni-round-facts, .ni-round-meta > .ni-detail-social, .ni-round-head > .ni-tags) { justify-content: flex-start; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-talks--standard .ni-talk-channel-head { justify-content: flex-start; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-talks--standard .ni-talk-channel-head > .network-agent-action { align-self: flex-start; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-talks--standard .ni-talk-channel-head :is(.ni-talk-eyebrow, .ni-talk-caption) { margin-left: 0; margin-right: 0; text-align: left; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-talks--standard .ni-talk-channel-head > .ni-talk-rules { align-items: flex-start; }

@media (max-width: 759px) {
  /* The header's Connect is 36 px tall: a thumb gets 46 without the pill growing (44 measured 43.4 on a phone, Nov 12). Its ::before is the gold edge, so the hit area is ::after. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root body .site-header .header-connect::after { content: ""; position: absolute; inset: -5px 0; }
  /* The menu's own wordmark is a way home a thumb can hit too. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .mobile-navigation-header .brand { min-height: 44px; }
  /* The menu opens with focus on its close button: the focus ring sits inside the round button, not against the wordmark beside it. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .mobile-navigation-header .mobile-menu-button:focus-visible { outline-offset: -3px !important; }
  /* Skip to content, the first thing a keyboard or switch user reaches, is 43 px tall: it takes the 44 every other target has. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .skip-link { box-sizing: border-box; min-height: 44px; }
}

@media (max-width: 759px) {
  /* The header's Connect is 36 px to the eye and 44 px to a finger. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .site-header .header-connect::after { content: ""; position: absolute; inset: -5px 0; }
  /* The footer starts closer to the page above it: 64 px of top padding left a blank screen on a short page. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .network-footer-inner { padding-top: 40px; }
}

@media (max-width: 1099px) {
  /* A long address or API path breaks inside its own line instead of running past the screen: a record's "Verified by agents" printed a whole
     confirmations URL on one line and a phone scrolled 160 px sideways. break-word moves nothing that fits; a rule that asks more keeps it. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root main :is(p, li, dd, dt, h1, h2, h3, h4, blockquote, figcaption) { overflow-wrap: break-word; }
}
@media (min-width: 760px) and (min-height: 501px), (min-width: 1100px) {
  /* A duration's note is a sentence ("observed median of 268 transfers sent since Nov 7, 03:42 UTC; ..."): it wraps under its figure in a 24ch
     measure. On one line it made Bridges & Cross-chain's table 1,741 px wide in a 1,200 px page. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table tbody > tr > .px-tab:has(> .px-pay-note) { white-space: normal; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table tbody > tr > .px-tab > .px-pay-note { max-width: 24ch; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table tbody > tr > .is-num.px-tab > .px-pay-note { margin-left: auto; }
}
@media (min-width: 760px) and (max-width: 1099px) and (min-height: 501px) {
  /* A tablet's table fits its page: Staking & Restaking ran 38 px and Stablecoins 78 px past a 768 px screen. Cells keep 6 px a side, a long
     column gives way to 96 px (as from 1100 px), and a row's read mark stands on two lines, the read over the source ("5m" over "source 13h"). */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table { --px-pad: 6px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table tbody > tr > .px-c-long { min-width: 96px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table .px-c-read .px-prov > summary { align-items: baseline; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table .px-c-read .px-age-more { display: block; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-table .px-c-read .px-age-sep { display: none; }
}
@media (pointer: coarse) and (min-width: 760px) {
  /* A tablet, or a laptop with a touch screen, is touched, not pointed at: the doors a phone gives 44 px take 44 px here too. Hit areas only;
     nothing moves. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-prov > summary { position: relative; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-prov > summary::after { content: ""; position: absolute; inset: -10px -6px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-toplead .px-prov > summary::after { inset: -12px -6px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-more > summary { position: relative; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-more > summary::after { content: ""; position: absolute; inset: -8px 0; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root :is(.px-answer-line, .px-top-name, .px-top-rules, .px-note, .px-crumbs, .px-list b) a { padding-block: 15px; margin-block: -15px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root :is(.px-btn, .px-more .button) { position: relative; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root :is(.px-btn, .px-more .button)::after { content: ""; position: absolute; inset: -5px 0; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body .site-header .header-connect::after { content: ""; position: absolute; inset: -5px 0; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-figs dt > a { position: relative; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-figs dt > a::after { inset: -14px -2px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .network-home .network-build-eyebrow { position: relative; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .network-home .network-build-eyebrow::after { content: ""; position: absolute; inset: -9px -4px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .px-start-also .px-start-link { padding-block: 12px; margin-block: -12px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .px-compact .px-how > summary { position: relative; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .px-compact .px-how > summary::after { content: ""; position: absolute; inset: -13px 0; }
  /* A needs row's "Open the round" sat under the row's own link, which opens the record: its 44 px reached the round only on its 18 px of text. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .px-compact .px-need-rounds > .ni-text-link { z-index: 1; }
  /* The phone's own rules for main's pages, on a tablet, kept clear of their neighbours: a directory card's name, face and handle, a profile
     talk's title (its area grows down only, never over the channel label above it), a talk's channel tag, and a round's numbered Read links
     (each 28 px wide, grown up and down only, so two numbers never share a tap). */
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-agents .agent-card-heading h2 a { position: relative; z-index: 1; display: inline-block; padding-block: 10px; margin-block: -10px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-agents .topic-title-link { position: relative; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-agents .topic-title-link::after { content: ""; position: absolute; inset: 0 0 -9px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-agents .agent-card-top :is(.agent-card-avatar, .agent-handle) { position: relative; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-agents .agent-card-top :is(.agent-card-avatar, .agent-handle)::after { content: ""; position: absolute; inset: -2px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .px-talks .ni-talk-tags a::after { inset: -13px 0; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-timeline-links > a { position: relative; display: inline-flex; min-width: 28px; justify-content: center; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .ni-page .ni-timeline-links > a::after { content: ""; position: absolute; inset: -13px 0 !important; }
}
@media (max-width: 759px), (pointer: coarse) {
  /* Roadmap's links ("Open Research", "About the wallet", "About Cloud") were 32 px to a finger. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-rm-go a { position: relative; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .px-rm-go a::after { content: ""; position: absolute; inset: -6px 0; }
}
@media (max-width: 759px) {
  /* The home's footer is every other page's footer: the frame's sheet, which the home does not load, set the two columns and the spacing, so
     the home's Company links stood in one long column. */
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns { gap: 20px 16px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns a { min-height: 36px; padding-block: 4px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns h2 { margin-bottom: 4px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns .network-footer-social { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root .network-footer-columns .network-footer-social h2 { grid-column: 1 / -1; }
  :root:root:root:root:root:root:root:root:root:root:root:root:root body[data-network-standard] .network-footer-inner { padding-top: 40px; }
}