/* ── px-utility.css — THE CUSTOMER'S MONEY CONTROLS, IN THE CURRENT PRODUCT ───
   Loaded LAST on every transactional customer page.

   These pages own real capability — funding, withdrawal, the automation panel,
   the inbox, reclaim, Telegram linking — and their BACKEND behaviour is correct
   and must not be touched. What was wrong is that a customer pressing "Withdraw"
   left the product they had been using and arrived somewhere from a previous era:
   Bebas headings, 12–20px rounded cards, emoji standing in for status, and a
   second navigation bar.

   px-shell.js already gives them the canonical navigation and the way home. This
   finishes the job on the page itself, and it does it by re-expressing the same
   structure in the estate's vocabulary rather than by tinting the old one:

     · one display voice, at the estate's weights
     · cells with hairlines — no rounded translucent panels, no glow, no lift
     · one action grammar, where a destructive action is the only loud one
     · emoji removed from anything that carries a STATE, because a glyph that
       renders differently on every machine cannot be a status
     · inputs that look like the instrument's inputs

   No layout is moved. No copy is rewritten. No amount, fee, address or limit is
   touched. This is presentation. */

/* ── GROUND ─────────────────────────────────────────────────────────────────── */
body { background: var(--nx-void, #08090b) !important; color: var(--nx-bone, #d6d2c9);
  font-family: var(--nx-sans), 'DM Sans', system-ui, sans-serif; }
body::before, body::after { content: none !important; }

/* ── TYPE ───────────────────────────────────────────────────────────────────── */
body h1, body h2, body h3, body h4 {
  font-family: var(--nx-sans), 'DM Sans', sans-serif !important;
  font-stretch: condensed; letter-spacing: -.015em; text-transform: none;
  color: var(--nx-bone-hi, #f2efe9);
}
body h1 { font-weight: 300; font-size: clamp(30px, 3.6vw, 44px); line-height: 1.06; }
body h2 { font-weight: 500; font-size: 20px; }
body h3 { font-weight: 500; font-size: 15px; }
body p, body li, body label, body .note, body .sub, body .hint { color: var(--nx-ash-2, #a7adb6); }
body strong, body b { color: var(--nx-bone-hi, #f2efe9); font-weight: 500; }
body .mono, body code, body pre { font-family: var(--nx-mono), 'JetBrains Mono', monospace; }

/* ── CELLS, NOT CARDS ───────────────────────────────────────────────────────── */
body .card, body .panel, body .box, body .tile, body .section, body .metric,
body .stat, body .well, body .surface, body .modal, body .sheet, body .row-card {
  border-radius: 0 !important;
  background: rgba(255,255,255,.014) !important;
  border: 1px solid rgba(255,255,255,.065) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
body .card:hover, body .panel:hover, body .metric:hover { transform: none !important; }

/* ── ONE ACTION GRAMMAR ─────────────────────────────────────────────────────── */
body button, body .btn, body a.btn, body input[type="submit"] {
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: var(--nx-bone-hi, #f2efe9) !important;
  font-family: var(--nx-sans), 'DM Sans', sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: .01em !important;
  box-shadow: none !important;
  text-transform: none !important;
  transition: border-color .15s, color .15s;
}
body button:hover, body .btn:hover { border-color: var(--nx-tungsten, #e8a33d) !important;
  color: var(--nx-tungsten, #e8a33d) !important; }
body button:focus-visible, body .btn:focus-visible {
  outline: 1px solid var(--nx-tungsten, #e8a33d) !important; outline-offset: 2px; }
/* The consequential action is the ONLY loud one. */
body .btn-primary, body .primary, body button.primary, body .cta {
  border-color: var(--nx-tungsten, #e8a33d) !important; color: var(--nx-tungsten, #e8a33d) !important; }
body .danger, body .btn-danger, body button.danger {
  border-color: rgba(216,80,63,.5) !important; color: var(--nx-danger, #d8503f) !important; }
body button:disabled, body .btn:disabled { opacity: .38 !important; border-color: rgba(255,255,255,.08) !important; }

/* ── INPUTS look like the instrument's inputs ───────────────────────────────── */
body input, body textarea, body select {
  border-radius: 0 !important;
  background: rgba(255,255,255,.02) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  color: var(--nx-bone-hi, #f2efe9) !important;
  font-family: var(--nx-sans), 'DM Sans', sans-serif;
}
body input:focus, body textarea:focus, body select:focus {
  border-color: var(--nx-tungsten, #e8a33d) !important; outline: none !important; }

/* ── COLOUR IS A VALUE ──────────────────────────────────────────────────────── */
body .green, body .success, body .ok      { color: var(--nx-healthy, #4ea87a) !important; }
body .red, body .error, body .fail        { color: var(--nx-danger, #d8503f) !important; }
body .amber, body .warn, body .warning    { color: var(--nx-anomaly, #d98a3a) !important; }
body .muted, body .dim                    { color: var(--nx-ash, #6f7681) !important; }
/* Gradient text is a decoration pretending to be emphasis. */
body [style*="background-clip:text"], body [style*="-webkit-background-clip:text"] {
  -webkit-text-fill-color: currentColor !important; background: none !important;
  color: var(--nx-bone-hi, #f2efe9) !important;
}

/* ── NO SECOND NAVIGATION ───────────────────────────────────────────────────── */
/* px-shell.js is the navigation. A page-level bar is the retired one. */
body > nav, body > .topnav, body > .top-nav, body > .navbar, body > header.topnav,
body [data-px-retired-nav] { display: none !important; }