/* Brand layer (owner 2026-11-07: "make sure all the pages resemble each other … enhance and upgrade everything"): every page except
   the homepage loads this AFTER its own stylesheets, with body.br. It carries the homepage's language — black stage #0A0A0F, General
   Sans 700 at tight tracking, electric violet #6A3BFF pill buttons, SAMPLE chips, dark cards with a violet hairline, and the chrome
   chain (media/chain-rail.webp, rendered from the homepage scene by scripts/render-paypp-chain.mjs) as a rail across page heroes.
   Components: .br-rail (a chain across the page), .br-hang (a card hung from a rail by a black clip), .br-kicker, .br-num. */
@font-face { font-family: "General Sans"; src: url(/revenue/assets/fonts/GeneralSans-Variable.49d3fbd2f1.woff2) format("woff2"); font-weight: 200 700; font-style: normal; font-display: swap; }
html:has(> body.br) { background: #0A0A0F; }
body.br { --br-bg: #0A0A0F; --br-panel: #121019; --br-ink: #FFFFFF; --br-grey: #ADA9BE; --br-violet: #7C5CFF; --br-electric: #6A3BFF; --br-line: rgba(124,92,255,.32);
  --br-font: "General Sans", "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; background: var(--br-bg); }
.br main, .br.sys main, .br.sys main > section { background-color: var(--br-bg); }
.br.sys main > section:nth-of-type(even) { --band: #0F0D16; background-color: #0F0D16; }
.br h1, .br h2, .br h3 { font-family: var(--br-font); }
.br main h1 { font-weight: 700; letter-spacing: -0.045em; }
.br main h2 { font-weight: 700; letter-spacing: -0.04em; }
/* buttons: the homepage's pills */
html body.br .btn { min-height: 48px; padding: 0 24px; border-radius: 999px; font: 600 15px/1 var(--br-font); }
html body.br .btn:not(.btn-primary) { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.28); }
html body.br .btn:not(.btn-primary):hover { border-color: #fff; background: rgba(255,255,255,.06); }
html body.br .btn-primary { background: var(--br-electric); color: #fff; border: 0; box-shadow: 0 10px 30px -10px rgba(106,59,255,.8); }
html body.br .btn-primary:hover { background: #7C55FF; }
html body.br .sys-pill { background: #14121C; -webkit-backdrop-filter: none; backdrop-filter: none; }
/* SAMPLE chips everywhere look the same */
.br .sample-badge, .br .pp-sample, .br .sr-sample { display: inline-block; padding: 3px 7px; border-radius: 5px; font: 700 12px/1.2 var(--br-font); letter-spacing: .08em; color: #E6DEFF; background: rgba(124,92,255,.22); border: 1px solid rgba(155,123,255,.55); }
/* the chain */
.br .br-rail { position: relative; display: block; height: clamp(26px, 3.2vw, 46px); margin-inline: calc(50% - 50vw); width: 100vw; background: url(/revenue/assets/media/chain-rail.67e0b6531f.webp) center / auto 100% repeat-x; pointer-events: none; filter: drop-shadow(0 10px 18px rgba(0,0,0,.6)); }
.br .br-rail.is-broken { -webkit-mask: linear-gradient(90deg, #000 0 46%, transparent 46% 54%, #000 54%); mask: linear-gradient(90deg, #000 0 46%, transparent 46% 54%, #000 54%); }
/* a card hung from a rail: a black clip with a chrome edge at its top centre */
.br .br-hang { position: relative; margin-top: 30px; }
.br .br-hang::before { content: ""; position: absolute; left: 50%; top: -24px; width: 76px; height: 32px; margin-left: -38px; border-radius: 4px; background: linear-gradient(180deg, #2a2933, #0d0c12); box-shadow: inset 0 2px 0 #cfcbe0, 0 6px 12px -4px rgba(0,0,0,.7); z-index: 2; }
.br .br-kicker { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 16px; font: 700 13px/1 var(--br-font); letter-spacing: .12em; text-transform: uppercase; color: #B9A3FF; }
.br .br-kicker::before { content: ""; width: 18px; height: 2px; background: currentColor; }
.br .br-num { font-family: var(--br-font); font-weight: 700; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) { .br * { transition: none !important; } }
/* phones: Ask Main is a compact round button (the wide pill sat over card labels as they scrolled past) */
@media (max-width: 640px) {
  html body.br a.mr-assist { width: 52px; height: 52px; min-height: 52px; padding: 0; gap: 0; justify-content: center; }
  html body.br a.mr-assist .mr-assist-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}