/* ── px-doc.css — THE DOCUMENT ESTATE ────────────────────────────────────────
   Loaded LAST on every page that carries the public shell.

   These pages (security, custody, faq, privacy, the SEO set) were written before
   the current visual system and each carries its own inline <style> block: a
   magenta palette (#FF2E9F), a Bebas display face, a graph-paper body wash and
   12px-rounded translucent boxes. Read next to the rest of the estate they look
   like a different company's site — which is exactly what the logo-removal test
   is for.

   This sheet does NOT redesign them and does not touch a word of their copy.
   It re-expresses the four things that carry brand — palette, type, ground and
   the shape of a box — in the estate's vocabulary, and lets each page keep its
   own layout. Element rules are scoped under `body` so they outrank the inline
   sheets by specificity rather than by load order.

   Legal copy (custody, terms, risk, privacy) is presentation-only here: the
   words, their order and their emphasis are untouched. */

/* 1. PALETTE. The legacy variables are kept as names and repointed at the real
      tokens, so every page-local rule that referenced them lands in-system. */
:root {
  --bg: var(--nx-void, #08090b);
  --surface: var(--nx-carbon, #0d0f12);
  --surface2: var(--nx-carbon-2, #121519);
  --border: rgba(255,255,255,.065);
  --purple: var(--nx-tungsten, #e8a33d);
  --purple-bright: var(--nx-tungsten, #e8a33d);
  --text: var(--nx-bone-hi, #f2efe9);
  --muted: var(--nx-ash, #6f7681);
  --green: var(--nx-healthy, #4ea87a);
  --red: var(--nx-danger, #d8503f);
  --amber: var(--nx-anomaly, #d98a3a);
  --pink: var(--nx-tungsten, #e8a33d);
}

/* 2. GROUND. No graph paper. The canvas is the stage; a printed grid behind the
      words is decoration standing in for structure. */
body::before { display: none !important; }
body { background: var(--nx-void); color: var(--nx-bone); font-family: var(--nx-sans); }

/* 3. TYPE. One display face across the estate. Bebas is a poster face and reads
      as a different product the moment it sits beside the app. */
body h1, body h2, body h3, body h4 {
  font-family: var(--nx-sans); font-stretch: condensed;
  color: var(--nx-bone-hi); letter-spacing: -.015em; text-transform: none;
}
body h1 { font-weight: 300; font-size: clamp(34px, 4vw, 52px); line-height: 1.06; }
body h2 { font-weight: 500; font-size: 22px; line-height: 1.2; letter-spacing: -.008em; }
body h3 { font-weight: 500; font-size: 16px; }
body p, body li { color: var(--nx-ash-2); }
body strong { color: var(--nx-bone-hi); font-weight: 500; }
body a { color: var(--nx-tungsten); }
body .meta, body .sub, body .tag {
  font-family: var(--nx-mono); letter-spacing: .12em; text-transform: uppercase;
  color: var(--nx-ash);
}

/* 4. CELLS, NOT PILLS. Group with a cell and a hairline; a rounded translucent
      panel with a coloured glow is the house style of every AI-built page on the
      internet, which is the one thing this estate cannot look like. */
body .green-box, body .info-box, body .red-box, body .callout, body .cta-box,
body .card, body .badge-card, body .warn, body .tip, body .disclaimer,
body .faq-item, body .doc-section, body .mode-card, body .flow-step {
  border-radius: 0 !important;
  background: rgba(255,255,255,.014) !important;
  border: 1px solid rgba(255,255,255,.065) !important;
  box-shadow: none !important;
}
/* Severity survives greyscale as a left edge, not as a fill. */
body .green-box { border-left: 2px solid var(--nx-healthy) !important; }
body .red-box, body .danger, body .warn { border-left: 2px solid var(--nx-danger) !important; }
body .info-box, body .callout, body .tip { border-left: 2px solid var(--px-observed, #4aa3c7) !important; }
/* The edge carries the severity. A whole paragraph set in green reads as a status value, and in this
   system a colour IS a value — green means HEALTHY, not "this passage is reassuring". */
body .green-box p, body .info-box p, body .callout p, body .red-box p { color: var(--nx-ash-2) !important; }
body .green-box strong, body .red-box strong, body .info-box strong { color: var(--nx-bone-hi) !important; }

/* 5. ONE HEADER. px-public.js injects the real one; a page that also draws its
      own ends up with two navigation bars stacked, which reads as a page served
      inside someone else's frame. */
body > nav, body > .nav, body > .nav-top, body > .top { display: none !important; }

/* 6. Icon glyphs inherited from the retired palette. Colour is meaning in this
      system — a decorative magenta icon claims a severity it does not have. */
body .badge-icon svg, body .badge-icon, body .faq-arrow { color: var(--nx-ash) !important; }
body .badge-icon svg { stroke: currentColor; }

/* 7. The consent notice. It is a system message, not a promotion: a cell at the foot of the page in
      the same grammar as everything else, with no magenta and no floating rounded card. */
body .px-cookie, body #px-cookie, body .cookie-banner, body #px-cookie-bar {
  border-radius: 0 !important; background: var(--nx-carbon) !important;
  border: 1px solid rgba(255,255,255,.09) !important; box-shadow: none !important;
}
body [class*="cookie"] b, body [class*="cookie"] strong { color: var(--nx-bone-hi) !important; }

/* 8. Hardcoded violet/magenta accents left in page-local rules. Ultraviolet is INFERRED in this
      system and cyan is OBSERVED; a decorative violet label claims a provenance it does not have. */
body .pink, body .purple, body [class*="mode-2"] { color: var(--nx-tungsten) !important; }

/* ── CUSTODY MODES — A COLOUR IS A VALUE ──────────────────────────────────────
   PRESENTATION ONLY. Not one word of the disclosure changes, and the custody
   policy it describes is untouched.

   custody.html marked MODE 1 (managed / custodial) with the emerald tag and
   MODE 2 (self-custody) with the pink/violet one. Both readings are wrong in
   this system and one of them is misleading:

     · emerald means HEALTHY — it is a state reading, and a custody mode is not
       a state. Worse, the emerald sat on the CUSTODIAL mode while the copy
       recommends the self-custody one, so the colour endorsed the opposite of
       what the words say.
     · ultraviolet means INFERRED. Self-custody is not inferred; it is a
       factual, user-owned arrangement stated in a legal disclosure.

   Both mode tags therefore read as plain BONE. Neither mode is ranked by hue;
   the distinction is carried by the left edge of the block and by the
   counsel-approved words, which already say which one is recommended. */
body .tag.pink, body .tag.green {
  background: rgba(255,255,255,.05) !important;
  color: var(--nx-bone-hi, #f2efe9) !important;
  border-radius: 0 !important;
}
/* The blocks keep a distinction that survives greyscale: a factual mode the
   user owns is marked as OBSERVED at its edge, the custodial one as neutral. */
body .card:has(> .tag.pink) { border-left: 2px solid var(--px-observed, #4aa3c7) !important; }
body .card:has(> .tag.green) { border-left: 2px solid rgba(255,255,255,.18) !important; }