/* Self-hosted Inter (design export 2026-08-29) — pending item #5 closed */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 200; font-display: swap; src: url('fonts/9f64f990.woff2') format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 200; font-display: swap; src: url('fonts/94a7f652.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 200; font-display: swap; src: url('fonts/23ea4292.woff2') format('woff2'); unicode-range: U+1F00-1FFF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 200; font-display: swap; src: url('fonts/24ea5d6b.woff2') format('woff2'); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 200; font-display: swap; src: url('fonts/1f6626d8.woff2') format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 200; font-display: swap; src: url('fonts/45884d7c.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 200; font-display: swap; src: url('fonts/538f8e47.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/9f64f990.woff2') format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/94a7f652.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/23ea4292.woff2') format('woff2'); unicode-range: U+1F00-1FFF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/24ea5d6b.woff2') format('woff2'); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/1f6626d8.woff2') format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/45884d7c.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/538f8e47.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/9f64f990.woff2') format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/94a7f652.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/23ea4292.woff2') format('woff2'); unicode-range: U+1F00-1FFF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/24ea5d6b.woff2') format('woff2'); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/1f6626d8.woff2') format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/45884d7c.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/538f8e47.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/*! Pagetrends — THE stylesheet. One file, one request, sitewide.
 *
 * The stat band on /mcp/ and /design/ claims "1 stylesheet · purpose-built for
 * the design in front of you. Nothing unused." Until 2026-08-25 we shipped FOUR
 * (galaxy, interior, design, mcp) and sent the MCP sheet to the design page for
 * six hover rules. A claim stated in the present tense on the page you are
 * reading has to be true of that page. Concatenated here at build time.
 *
 * Colour is NOT in this file. Tokens resolve per page through the §8 ladder and
 * print inline in <head>, which costs zero additional requests.
 */

/* ---- ptx-galaxy.css ---- */
html, body { margin: 0; padding: 0; background: #06231A; }
    /* sticky header needs its containing block to span the full document, not 100vh */
    html, body, #dc-root, .sc-host { height: auto !important; min-height: 100vh !important; }
    body { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif; color: #FAF5E9; -webkit-font-smoothing: antialiased; }
    a { color: #009B4D; }
    a:hover { color: #FAF5E9; }
    /* planet-label links: clickable islands in a pointer-events:none overlay — hover brightens, never moves */
    a.pl-link { pointer-events: auto; cursor: pointer; text-decoration: none; }
    a.pl-link:hover { filter: brightness(1.45) !important; }
    a.pl-link:hover span:last-child { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
    /* footer system cards: scanner hover (pointer-driven only, never autonomous); at rest completely still */
    a.fs-hub { pointer-events: auto; cursor: pointer; text-decoration: none; }
    a.fs-hub:hover { filter: brightness(1.45) !important; text-decoration: underline !important; text-underline-offset: 3px !important; text-decoration-thickness: 1px !important; }
    a.fs-plabel { pointer-events: none; cursor: pointer; text-decoration: none; }
    a.fs-plabel:hover { filter: brightness(1.5) !important; text-decoration: underline !important; text-underline-offset: 2px !important; text-decoration-thickness: 1px !important; }
    .fs-panel { border: 1px solid rgba(250,245,233,0.14); transition: border-color 0.25s ease; }
    .fs-panel:hover { border-color: rgba(250,245,233,0.30) !important; }
    .fs-mlist { display: none; }
    /* MOBILE FOOTER — this media query is the ONLY branch mechanism; no JS layout gating anywhere */
    @media (max-width: 768px) {
      [data-fs-chart] { display: none !important; }
      .fs-desc { display: none !important; }
      a.fs-hub { font-size: 18px !important; }
      .fs-mlist { display: flex; flex-direction: column; margin-top: 7px; padding: 0; }
      .fs-mrow { display: flex; align-items: center; gap: 10px; margin: 0; padding: 0; }
      .fs-mdot { width: 6px; height: 6px; border-radius: 50%; background: #9DB3A5; opacity: 0.85; flex: none; }
      .fs-mtri { width: 11px; height: 10px; flex: none; }
      a.fs-mlab { font-size: 16px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; font-variant: all-small-caps; color: #9DB3A5; opacity: 0.92; line-height: 1; padding: 10px 0; flex: 1; white-space: nowrap; pointer-events: auto; text-decoration: none; cursor: pointer; }
    }
    /* footer modules: one row of five at desktop, wrap/stack below (layout only a media query can express) */
    @media (min-width: 1160px) { .foot-modules { grid-template-columns: repeat(5, 1fr) !important; } }
    ::selection { background: rgba(255, 204, 0, 0.3); color: #FAF5E9; }
    @keyframes dc-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    [data-search]::placeholder { color: #9DB3A5; }
    @media (max-width: 859px) { [data-dt] { display: none !important; } }
    @media (min-width: 860px) { [data-mb] { display: none !important; } }
    @media (max-width: 1179px) { [data-mega-grid] { grid-template-columns: 1fr !important; } }
    @media (prefers-reduced-motion: reduce) { [data-ticker] { animation: none !important; } }

/* generated from style-hover/style-focus attributes */
/* !important required: base styles are inline attributes, which outrank class :hover rules (doctrine §4.4) */
.ptxh-a:hover { background: #FFD633 !important; color: #04150D !important; }
.ptxh-a2:hover { background: #FAF5E9 !important; color: #04150D !important; }
.ptxh-a3:hover { color: #FFCC00 !important; }
.ptxh-social:hover { color: #FFCC00 !important; border-color: #FFCC00 !important; }
.ptxh-a4:hover { background: #FFD633 !important; }
/* v1.28.0 (tenant note, the Captain's ask): the mega menu's cards and bar had no hover in the cut. A wash of the design's green on a card; the design's ink on the bar. */
.ptxh-megacard:hover { background: rgba(0,155,77,0.08) !important; border-color: rgba(0,155,77,0.35) !important; }
.ptxh-shopall:hover { background: #04150D !important; color: #FAF5E9 !important; }
.ptxh-a5:hover { color: #FAF5E9 !important; }
.ptxh-a6:hover { border-color: #DDD5C2 !important; background: #FFFFFF !important; }
.ptxh-a7:hover { background: #009B4D !important; transform: translateY(-1px) !important; }
.ptxh-a8:hover { background: rgba(250,245,233,0.06) !important; }
.ptxh-phone:hover { color: #FFE38A !important; }
.ptxf-a:focus { border-color: #FFCC00 !important; }

/* ---- ptx-interior.css ---- */
.ptx-interior { position: relative; z-index: 1; max-width: 860px; margin: 0 auto; padding: clamp(40px, 7vh, 80px) clamp(24px, 5vw, 60px) clamp(64px, 9vh, 110px); color: #C9D8CD; font-size: 17px; font-weight: 300; line-height: 1.65; }
.ptx-interior h1, .ptx-interior h2, .ptx-interior h3, .ptx-interior h4 { color: #FAF5E9; font-weight: 400; letter-spacing: -0.02em; line-height: 1.15; text-wrap: balance; margin: 1.4em 0 0.5em; }
.ptx-interior h1 { font-size: clamp(38px, 5vw, 64px); margin-top: 0; }
.ptx-interior h2 { font-size: clamp(28px, 3.6vw, 42px); }
.ptx-interior h3 { font-size: clamp(22px, 2.6vw, 28px); }
.ptx-interior p { margin: 0 0 1.2em; }
.ptx-interior a { color: #6FCF97; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.ptx-interior a:hover { color: #FAF5E9; }
.ptx-interior ul, .ptx-interior ol { padding-left: 1.3em; margin: 0 0 1.2em; }
.ptx-interior li { margin: 0.35em 0; }
.ptx-interior img { max-width: 100%; height: auto; border-radius: 10px; }
.ptx-interior blockquote { margin: 1.4em 0; padding: 4px 0 4px 20px; border-left: 3px solid #FFCC00; color: #FAF5E9; font-weight: 200; }
.ptx-interior hr { border: 0; border-top: 1px solid rgba(250,245,233,0.14); margin: 2em 0; }
.ptx-interior code, .ptx-interior pre { background: #04150D; border-radius: 6px; color: #FFE38A; }
.ptx-interior code { padding: 2px 7px; font-size: 0.9em; }
.ptx-interior pre { padding: 16px 20px; overflow-x: auto; }
.ptx-interior table { width: 100%; border-collapse: collapse; margin: 0 0 1.4em; }
.ptx-interior th, .ptx-interior td { text-align: left; padding: 10px 12px; border-bottom: 1px solid rgba(250,245,233,0.12); }
.ptx-interior th { color: #FAF5E9; font-size: 0.85em; text-transform: uppercase; letter-spacing: 0.08em; }
.ptx-interior input[type="text"], .ptx-interior input[type="email"], .ptx-interior input[type="tel"], .ptx-interior input[type="url"], .ptx-interior input[type="number"], .ptx-interior textarea, .ptx-interior select { width: 100%; box-sizing: border-box; background: #0A2C20; border: 1px solid rgba(250,245,233,0.16); border-radius: 10px; padding: 12px 16px; color: #FAF5E9; font-family: inherit; font-size: 15px; outline: none; }
.ptx-interior input:focus, .ptx-interior textarea:focus, .ptx-interior select:focus { border-color: #FFCC00; }
.ptx-interior button, .ptx-interior input[type="submit"] { display: inline-block; background: #FFCC00; color: #04150D; border: 0; cursor: pointer; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.025em; padding: 14px 26px; border-radius: 24px; font-family: inherit; }
.ptx-interior button:hover, .ptx-interior input[type="submit"]:hover { background: #FFD633; }
.ptx-interior label { display: block; color: #FAF5E9; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; margin: 1em 0 0.4em; }
.ptx-interior .ptx-meta { color: #9DB3A5; font-size: 13px; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 1.6em; }

/* ---- ptx-design.css ---- */
/* §6.5 REPEATER BOUNDS made real. The source used repeat(auto-fit, minmax(280px,1fr)),
 * which fits as many columns as the viewport allows — 3 in the design tool's preview
 * pane, 4+ on a wide monitor. The design INTENT was three across. auto-fit expresses
 * 'as many as fit', not intent, so the bound is declared explicitly here. */
.ptxd-cards3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
@media (max-width: 1040px) { .ptxd-cards3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 660px)  { .ptxd-cards3 { grid-template-columns: 1fr !important; } }

/* ---- ptx-mcp.css ---- */
/* Figure semantics: the four consoles are canvas, therefore invisible to crawlers,
 * AI answer engines and screen readers. The caption is real text; the data list is
 * available to assistive tech and indexers without disturbing the visual design. */
.ptxm-fig { margin: 0; }
.ptxm-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (prefers-reduced-motion: reduce) { .ptxm-fig canvas { opacity: 0.92; } }

/* ---- mcp page ---- */
/* ---- design page ---- */
/* ---- organic page ---- */
/* ---- shell responsive ---- */
/* The footer's module grid is auto-fit and collapses on its own, but its flex
 * rows use `justify-content: space-between`, which keeps items side by side and
 * squeezes them to one word per line on a phone. Inline styles outrank class
 * rules, so every declaration here needs !important.
 * Global, because the shell is global — not per page. */
@media (max-width: 700px) {
  .foot-modules { grid-template-columns: 1fr !important; }
  .foot-row, .foot-legal {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 18px !important;
  }
  .foot-col { min-width: 0 !important; width: 100% !important; }
}

/* ---- front page mobile ---- */
/* READABILITY OUTRANKS THE ANIMATION. A page that cannot be read has already
 * failed, however good the WebGL is. */

@media (max-width: 760px) {

  /* v1.13.10: mobile hero scrim REMOVED by Captain's ruling (2026-08-29) — the
   rounded ::before vignette WAS the 'overlay line'; legibility now rides the
   mbHeroHaze / mbHeroGalaxyLift dials instead of a fixed sheet. */

  /* 2. ORBIT LABELS OFF. DOM overlays positioned per frame from the dive math,
   *    so at 360px they land on the headline — "INTERACTIVE PROTOTYPES" printed
   *    straight across the h1. Decorative reinforcement of the nav taxonomy and
   *    unreadable at this size, so nothing is lost by hiding them. */
  #ptx-labels { display: none !important; }
}

/* ===== v1.13.2 — the design's mobile/tablet/touch layer (2026-08-29). 
   20 rules absent from the transpile: chip-armed states, touch targets,
   syslist reveal + tablet wrap band, hero height, pinned type scale.
   Ported VERBATIM from Pagetrends_Galaxy_Foundation_v11; contexts preserved. ===== */
a.pl-link.pl-armed { background: rgba(4,21,13,0.94); border: 1px solid rgba(255,204,0,0.9); border-radius: 999px; padding: 10px 15px; z-index: 6; box-shadow: 0 10px 30px rgba(0,0,0,0.55); }
a.pl-link.pl-armed span:last-child { color: #FFE38A !important; font-size: 14px !important; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a.pl-link.pl-armed span:first-child { background: #FFCC00 !important; opacity: 1 !important; }
a.sl-hub { font-size: 13.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #FFE38A; text-decoration: none; }
a.sl-lab { font-size: 13px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; font-variant: all-small-caps; color: #C9D8CD; text-decoration: none; line-height: 1.2; }
a.sl-hub:active, a.sl-lab:active { color: #FAF5E9; }
.sl-thr { display: none; }
.sl-rail::-webkit-scrollbar { display: none; }
@media (hover: none), (pointer: coarse) {
  a.pl-link::before { content: ""; position: absolute; inset: -14px -12px; }
}
@media (hover: hover) and (pointer: fine) {
  a.sl-hub:hover, a.sl-lab:hover { filter: brightness(1.35); border-color: rgba(255,204,0,0.75) !important; }
  .sl-rail { cursor: grab; }
  .sl-rail.sl-drag { cursor: grabbing; }
  .sl-thr { display: flex; }
  .sl-thr:hover { border-color: rgba(255,204,0,0.8) !important; color: #FAF5E9 !important; }
}
@media (max-width: 859px) {
  [data-syslist] { display: block !important; }
  [data-hero-anchor] { height: clamp(500px, 66vh, 700px) !important; }
  [data-pin] h2 { font-size: 34px !important; }
  [data-pin] p { font-size: 15px !important; }
}
@media (min-width: 640px) and (max-width: 859px) {
  .sl-rail { flex-wrap: wrap !important; overflow: visible !important; padding: 2px 2px 6px !important; -webkit-mask-image: none !important; mask-image: none !important; }
  [data-syslist] { width: calc(100vw - 2 * clamp(24px, 5vw, 60px)) !important; }
}

/* ===== v1.13.11 — mobile interior-hero spacing (Captain's ruling 2026-08-29):
   the interior heroes carried desktop padding (clamp 170px/26vh/300px) onto
   phones, leaving ~200px of empty galaxy between breadcrumb and kicker.
   Content now sits under the header at the desktop-matched distance.
   Selector = the heroes' own inline geometry (all three s01 partials share it);
   the backdrop's fixed box shrinks in step so the galaxy hugs the content. ===== */
@media (max-width: 859px) {
  .ptx-front [style*="min-height: min(84vh, 940px)"],
  [style*="min-height: min(84vh, 940px)"] {
    min-height: min(64vh, 560px) !important;
    padding-top: 112px !important;
    padding-bottom: 56px !important;
  }
  /* v1.14.4 — MOBILE BREADCRUMB RAIL (Captain's eyeball: awkward wrap, pressed
     into the corner). One line, swipeable, hidden scrollbar, right-edge fade
     hinting at overflow — the site's own .sl-rail idiom applied to the trail.
     Scoped to the breadcrumb nav itself, so every interior page — shared-hero,
     legacy /mcp/ pre-cutover, and all future pages — inherits it. */
  nav[aria-label="Breadcrumb"] {
    top: 40px !important;
    left: 0 !important; right: 0 !important;
    padding: 0 24px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -webkit-mask-image: linear-gradient(to right, #000 0, #000 86%, transparent 100%);
    mask-image: linear-gradient(to right, #000 0, #000 86%, transparent 100%);
  }
  nav[aria-label="Breadcrumb"]::-webkit-scrollbar { display: none; }
  nav[aria-label="Breadcrumb"] a, nav[aria-label="Breadcrumb"] span { white-space: nowrap !important; }
  /* v1.44.0 — D58 (Captain's eyeball, 2026-09-05, satellites at 335px): the rail
     above was written for a trail that sat position:absolute, where its width
     could push nothing. The shared hero cuts the trail IN FLOW inside a flex
     column that sizes to its content, so a three-crumb trail that cannot wrap
     widened the column past the phone and the h1 wrapped against that width and
     was clipped. Hubs (two crumbs) fit; satellites (three) did not. The trail is
     now 100% of its column and the column may shrink to the section; the rail
     keeps its swipe and its fade. In flow, its padding aligns to the headline. */
  [data-ptx-tone="hero"] nav[aria-label="Breadcrumb"] { position: static !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; padding: 0 !important; }
  [data-ptx-tone="hero"] nav[aria-label="Breadcrumb"] > * { flex: 0 0 auto; }
  [data-ptx-tone="hero"] [style*="max-width: 660px"] { width: 100% !important; min-width: 0 !important; }
  /* v1.44.0 — D58b (same eyeball): the 112px padding-top above was ROOM FOR THE
     ABSOLUTE TRAIL at top:40px. With the trail in flow it is empty space above
     the crumbs, on top of the trail's own min-height below them — twice the
     desktop distance. Interior heroes get the design's own value back (the
     desktop clamp); the front page's galaxy hero is a different pattern and
     keeps its geometry. */
  [data-ptx-tone="hero"] [style*="min-height: min(84vh, 940px)"] { padding-top: clamp(40px, 6.5vh, 78px) !important; }
  canvas[data-ptx-scope="contained"] { height: min(64vh, 560px) !important; }
  /* v1.44.1 — MOBILE DRAWER ACCORDION (Captain's eyeball, 2026-09-05): the
     two-column grid centred labels of very different lengths, so the triangles
     floated at different heights and no two rows lined up. One item per row,
     icon on a fixed column, label left-aligned, a 44px tap target; the group
     headers a notch smaller so the drawer reads as a list, not a stack of
     headlines; a hairline closes an open group. The builder (ptx-header.js)
     is untouched — these override its inline styles by class. */
  #ptx-drawer .ptx-accbody { display: none; grid-template-columns: 1fr !important; gap: 0 !important; padding: 0 0 10px !important; }
  #ptx-drawer .ptx-accbody[style*="display: grid"] { display: grid !important; }
  #ptx-drawer .ptxh-mobcard { min-height: 44px; padding: 8px 6px 8px 4px !important; gap: 12px !important; align-items: center !important; border-radius: 6px; }
  #ptx-drawer .ptxh-mobcard svg { flex: 0 0 18px; width: 18px; height: 18px; }
  #ptx-drawer .ptxh-mobcard span { font-size: 14.5px !important; line-height: 1.3; color: #E8E2D4 !important; }
  #ptx-drawer .ptxh-mobcard:active { background: rgba(250,245,233,0.06); }
  #ptx-drawer .ptx-accbtn { padding: 13px 2px !important; }
  #ptx-drawer .ptx-accbtn > a, #ptx-drawer .ptx-accbtn > span:first-child { font-size: 13.5px !important; letter-spacing: 0.08em !important; }
  #ptx-drawer .ptx-accsym { font-size: 18px !important; }
}

/* ===== v1.13.13 — mobile ticker spans the browser (Captain, 2026-08-29):
   the topbar grid is 1fr/auto/1fr; on phones the left link hides, the ticker
   falls into track 1, and the EMPTY third 1fr track still eats half the row —
   the marquee swept a ~90px slot. Two tracks on mobile; the 560px viewport
   cap lifts; the marquee sweeps edge to edge past the icons. ===== */
@media (max-width: 859px) {
  [style*="grid-template-columns: 1fr auto 1fr"] {
    grid-template-columns: 1fr auto !important;
    padding: 0 14px !important;
    gap: 12px !important;
  }
  [style*="max-width: 560px"][style*="overflow: hidden"] {
    max-width: none !important;
    width: 100% !important;
  }
}

/* ===== SHARED HERO UNIT (2026-08-29-B): hover rules for the canonical satellite
   hero (sections/shared-s01-hero-galaxy.php). Page-agnostic; replaces the
   per-page ptx?-h1..h4 hero rules for every stack page that consumes it. ===== */
/* ===== FDE PAGE CSS (generated by ptx-transform, v1.14.2) — section-css from the
   design's <style> block (canvas aspect-ratios incl. the 679px phone recomposition,
   pt-pulse) + page hover rules + the responsive grid ladder. The v1140 deploy shipped
   NONE of this: figures painted onto zero-height canvases and the stat band kept four
   columns on phones. Three-diff rule now enforced for content pages. ===== */
/* SECTION-CSS ported from the design's <style> block (three-diff rule). */
@keyframes pt-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(255,204,0,0.45); } 50% { box-shadow: 0 0 0 11px rgba(255,204,0,0); } } @media (prefers-reduced-motion: reduce) { [data-pulse] { animation: none !important; } } /* scene canvases: wide composition on desktop; on phones the container grows taller and the scene RECOMPOSES (panels stack, elements full-size) instead of shrinking to half scale */ [data-fig="pilot"] { aspect-ratio: 920 / 348; } [data-fig="agents"] { aspect-ratio: 920 / 312; } [data-fig="radius"] { aspect-ratio: 560 / 460; } [data-fig="loop"] { aspect-ratio: 560 / 300; } @media (max-width: 679px) { [data-fig="pilot"] { aspect-ratio: 460 / 700; } [data-fig="agents"] { aspect-ratio: 460 / 500; } [data-fig="radius"] { aspect-ratio: 460 / 470; } [data-fig="loop"] { aspect-ratio: 460 / 560; } }
/* SECTION-CSS ported from the design's <style> block (three-diff rule). */
/* scene canvases recompose on phones: elements stay full-size, the frame grows taller */ [data-fig="argue"] { aspect-ratio: 920 / 348; }
[data-fig="perim"] { aspect-ratio: 920 / 340; }
[data-fig="report"] { aspect-ratio: 920 / 320; }
@media (max-width: 679px) { [data-fig="argue"] { aspect-ratio: 460 / 640; } [data-fig="perim"] { aspect-ratio: 460 / 560; } [data-fig="report"] { aspect-ratio: 460 / 560; } }
/*! SHARED PAGE RULES — generated by merge-page-css.py from 5 page(s). Content-addressed (§6.6): one body, one name, site-wide. Ordered BROADEST->NARROWEST: the cascade is semantic. DO NOT HAND-EDIT — re-run the merge. */
.ptx-cols2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.ptx-cols3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.ptx-cols4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.ptx-cols5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
.ptx-h-9a9ec6:hover { color: var(--ptx-ivory, #FAF5E9) !important; }
.ptx-h-5ff394:hover { background: var(--ptx-ivory, #FAF5E9) !important; color: var(--ptx-ink, #04150D) !important; }
.ptx-h-d62c71:hover { background: var(--ptx-gold-lift, #FFD633) !important; color: var(--ptx-ink, #04150D) !important; }
@media (max-width:1180px) { .ptx-cols5 { grid-template-columns: repeat(3, minmax(0,1fr)) !important; } }
@media (max-width:900px) { .ptx-cols3 { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width:900px) { .ptx-cols4 { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width:900px) { .ptx-cols5 { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width:700px) { .ptx-cols2 { grid-template-columns: 1fr !important; } }
@media (max-width:700px) { .ptx-cols3 { grid-template-columns: 1fr !important; } }
@media (max-width:700px) { .ptx-cols4 { grid-template-columns: 1fr !important; } }
@media (max-width:700px) { .ptx-cols5 { grid-template-columns: 1fr !important; } }

/* v1.48.0 — TONE-SCOPED MUTED INK. One token cannot serve both grounds, and this
   is arithmetic rather than taste. --ptx-sage-dim is #6B7A6F, used 21 times in
   generated partials: 20 inside data-ptx-tone="inverse" stat bands on ivory
   (#FAF5E9) and once on the dark base. Measured at 13px against a 4.5:1 floor:

     #6B7A6F on #FAF5E9 (inverse) = 4.16:1   FAILS  <- Lighthouse, /fde/, 2026-09-07
     #6B7A6F on #04150D (base)    = 4.15:1   FAILS  <- not yet reported, same token

   To pass on ivory the value must be DARKER than L=0.164; to pass on ink it must
   be LIGHTER than L=0.202. No single value satisfies both, so the token has to
   be tone-aware. #5F6E63 on ivory measures 4.95:1.

   WHY A CSS RULE AND NOT AN EDIT TO THE PARTIALS: all 20 uses are in generated
   sections/ files and DOCTRINE-12 forbids hand-editing them. They already read
   var(--ptx-sage-dim, ...), so redefining the variable on the tone container
   cascades to every descendant. One rule, twenty sites, zero generated files.

   THE BASE-TONE USE IS NOT FIXED HERE. contact-s02-body-prose.php still carries
   #6B7A6F on the dark ground at 4.15:1. Raising the ROOT token is the other half
   and it changes a colour on pages nobody has measured, so it is filed, not
   guessed. See QUEUE.md. */
[data-ptx-tone="inverse"] { --ptx-sage-dim: #5F6E63; }


/* v1.50.0 — THE MENU'S CARDS AS CLASSES, AND THE HUBS' "IN THIS SECTION" LIST.
   Hand-written block, not generated: re-running merge-page-css.py does not own it (D23).
   The dropdown's markup (templates/shell-header.php) used to carry one inline style block
   per element, 48 cards x 6 panels on every page. Each block's declarations moved here
   VERBATIM (built by machine from one table), so an element's style is unchanged:
     - scoped under #ptx-navband / #ptx-mega, these rules outrank `a` and `a:hover`, exactly
       as inline style did; the only rules that beat them are the existing !important ones
       (.ptxh-megacard:hover, .ptxh-shopall:hover, [data-mega-grid] on narrow screens),
       which beat inline style too.
     - the card, icon, name, description and header-row rules are SHARED with
       nav.ptxn-sec, the list the page templates print on each hub before </main>.
   The panel and underline keep `display: none` here; ptx-header.js still opens and closes
   them by setting style.display, which outranks a class as it always outranked nothing. */
#ptx-navband .ptxn-link { position: relative; display: flex; align-items: center; gap: 7px; padding: 15px 10px; font-size: 12.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #C9D8CD; cursor: pointer; text-decoration: none; }
#ptx-navband .ptxn-ul { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: #FFCC00; display: none; }
#ptx-mega .ptxn-img, .ptxn-sec .ptxn-img { width:22px;height:22px;object-fit:contain;display:block; }
#ptx-mega .ptxn-card, .ptxn-sec .ptxn-card { display: flex; gap: 12px; align-items: flex-start; padding: 10px; border-radius: 10px; border: 1px solid transparent; text-decoration: none; }
#ptx-mega .ptxn-icon, .ptxn-sec .ptxn-icon { width: 46px; height: 46px; flex: none; border-radius: 8px; border: 1px solid #E0D8C5; background: repeating-linear-gradient(135deg, #EFE8D8 0 6px, #E7DFCE 6px 12px); display: flex; align-items: center; justify-content: center; }
#ptx-mega .ptxn-text, .ptxn-sec .ptxn-text { display: flex; flex-direction: column; gap: 3px; }
#ptx-mega .ptxn-name, .ptxn-sec .ptxn-name { font-size: 15px; font-weight: 600; color: #04150D; }
#ptx-mega .ptxn-desc, .ptxn-sec .ptxn-desc { font-size: 13px; color: #5F6E63; line-height: 1.45; }
#ptx-mega .ptxn-panel { position: absolute; left: 0; right: 0; top: 100%; background: #FAF5E9; border-top: 3px solid #FFCC00; box-shadow: 0 34px 64px rgba(0,0,0,0.4); display: none; }
#ptx-mega .ptxn-deco1 { position: absolute; left: 12px; bottom: 6px; pointer-events: none; }
#ptx-mega .ptxn-deco2 { position: absolute; right: 12px; top: 8px; pointer-events: none; }
#ptx-mega .ptxn-grid { max-width: 1440px; margin: 0 auto; padding: 30px 32px 34px; display: grid; grid-template-columns: minmax(0,1fr) 310px; gap: 30px; }
#ptx-mega .ptxn-head, .ptxn-sec .ptxn-head { display: flex; align-items: center; gap: 14px; }
#ptx-mega .ptxn-label, .ptxn-sec .ptxn-label { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.18em; color: #00743A; white-space: nowrap; margin: 0; }   /* margin: the hub list's label is an h2; on the dropdown's span it is the UA value already */
#ptx-mega .ptxn-rule, .ptxn-sec .ptxn-rule { flex: 1; height: 1px; background: #E3DCCB; }
#ptx-mega .ptxn-note, .ptxn-sec .ptxn-note { font-size: 12px; color: #5F6E63; white-space: nowrap; }
#ptx-mega .ptxn-cards, .ptxn-sec .ptxn-cards { margin-top: 16px; display: grid; grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); gap: 8px 18px; }
#ptx-mega .ptxn-all { display: block; margin-top: 22px; padding: 13px; text-align: center; border-radius: 8px; background: #00743A; color: #FAF5E9; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.12em; text-decoration: none; transition: background 0.15s, transform 0.15s; }
#ptx-mega .ptxn-aside { background: #04150D; border-radius: 10px; display: flex; flex-direction: column; overflow: hidden; }
#ptx-mega .ptxn-aside-art { width: 100%; min-height: 110px; flex: 1; }
#ptx-mega .ptxn-aside-body { padding: 4px 20px 20px; display: flex; flex-direction: column; gap: 8px; }
#ptx-mega .ptxn-kicker { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.18em; color: #FFCC00; }
#ptx-mega .ptxn-title { font-size: 19px; font-weight: 600; color: #FAF5E9; line-height: 1.2; }
#ptx-mega .ptxn-blurb { font-size: 13.5px; color: #9DB3A5; line-height: 1.55; }
#ptx-mega .ptxn-cta { margin-top: 6px; font-size: 12.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; color: #FFCC00; text-decoration: none; }
/* v1.50.2 CONTRAST (PageSpeed, /mcp/ mobile, 2026-09-11): on the ivory ground the label, note and
   description colours measured 3.33, 2.70 and 4.16:1 against a 4.5:1 floor for 12-13px text, and lower
   still on the card hover tint (#E6EEDD). Now #00743A (5.42, hover 4.96) and #5F6E63 (4.95, hover 4.53),
   both already in this palette. Shared with the dropdown, which had the same failures unseen by the audit
   only because its panels are closed when it runs. */
/* the hub list's own container: the dropdown panel's ground (ivory, gold rule), full width */
.ptxn-sec { background: #FAF5E9; border-top: 3px solid #FFCC00; }
.ptxn-sec-in { max-width: 1440px; margin: 0 auto; padding: 44px 32px 52px; box-sizing: border-box; }
@media (max-width: 768px) { .ptxn-sec-in { padding: 32px 20px 40px; } }
/* v1.50.1 — PHONES: the list's heading row (label, rule, note) never wraps, copied from the dropdown where it
   always fits. Measured with this site's Inter at 12px: the rows need 273-446 px, so every hub overflowed below
   313-486 px of viewport (MCP at 410, Company at 486). At 600 px and under the label and note each take their own
   line and the rule steps aside. Scoped to .ptxn-sec: the dropdown (desktop only) is untouched. */
@media (max-width: 600px) {
  .ptxn-sec .ptxn-head { flex-wrap: wrap; row-gap: 6px; }
  .ptxn-sec .ptxn-rule { display: none; }
  .ptxn-sec .ptxn-label { white-space: normal; }
  .ptxn-sec .ptxn-note { flex-basis: 100%; white-space: normal; }
}
