/* AsicProfit in the 8791 design (owner 4 Nov 2026: the Back Market-style look picked from the preview on port 8791,
   then "Build into templates"). Loaded after app.css on every page: the white header with pill search, menus and the
   category strip (lib/header8.js), soft grey page, white rounded cards with a soft shadow, navy #13243a buttons, the
   navy hero, Figtree text, green for money. The headline is Figtree too, and the 8791 lime and peach are gone: the hero figures
   are the logo green #00C472 and card fills use the site's own green and navy tints (owner 4 Nov: the serif "f" and numbers
   were ugly, the lime and the pastel peach/salmon are "nowhere in our color scheme"). The design was tuned in
   design/8791 (theme.css over the live site, before/after shots in docs/previews/8791-*); this is that file as the site's own.
   Fonts are self-hosted (the site's CSP allows fonts from itself only); IBM Plex covers the scripts Figtree has no letters for. */
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("/static/fonts/figtree-latin.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: "Figtree"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("/static/fonts/figtree-latin-ext.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --font: "Figtree", "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --bm-display: var(--font);
  --bm-ink: #111613;
  --bm-green: #00c472;
  --bm-lime: #dcf7e8;
  --bm-peach: #e6ebf2;
  --bm-red: #c8233f;
  --bm-surface2: #eef2f0;
  --bm-shadow: 0 1px 2px rgb(17 22 19 / .06), 0 2px 8px rgb(17 22 19 / .05);
  --bm-shadow-hi: 0 6px 22px rgb(17 22 19 / .12);
  --radius: 1rem;
}
:root:not([data-theme="dark"]) {
  --background: 150 14% 97%;      /* #f7f9f8 */
  --foreground: 140 12% 8%;       /* #111613 */
  --muted: 150 10% 94%;
  --muted-foreground: 150 6% 38%;
  --border: 150 9% 89%;
  --input: 150 9% 89%;
  --card: 0 0% 100%;
  --primary: 152 100% 30%;
  --title: #111613; --title-w: 600;
  /* the money green a shade darker than the preview's #00874a, which reads 4.3:1 on the grey page (WCAG AA asks 4.5) */
  --link: #007a43;
  /* offer, shop and hosting buttons in the hero's navy #13243a, not black (owner 4 Nov: "all ctas redirecting to product
     pages or hosting offers defo should not be black", "green sucks try blue", "#13243A I meant this color as navy
     blue, not the new one") */
  --cta-bg: #13243a; --cta-fg: #fff; --cta-text: #13243a; --cta-edge: #13243a; --cta-soft: #e6ebf2;
  --pos: #007a43; --neg: #c8233f;
}
:root[data-theme="dark"] {
  --cta-bg: #00c472; --cta-fg: #0b1a12; --cta-text: #00c472; --cta-edge: #00c472; --cta-soft: #12301f;
  --title: #f1f5f2; --link: #2fd88a;
  --bm-lime: #12301f; --bm-peach: #1b2a3d; --bm-ink: #f1f5f2; --bm-surface2: #1d2120;
  /* a light red on the dark header: #c8233f there fails WCAG AA contrast (axe, test/ui) */
  --bm-red: #ff8a9b;
}
:root[data-theme="dark"] .bm-art--lime, :root[data-theme="dark"] .bm-art--peach { color: #f1f5f2; }
body { font-family: var(--font); font-size: 15.5px; }
h1, h2, h3 { letter-spacing: -0.012em; }
main h2 { font-weight: 600; }

/* ---------- header (lib/header8.js) ---------- */
header.hdr.bmh-on { background: hsl(var(--card)); border-bottom: 1px solid hsl(var(--border)); backdrop-filter: none; }
header.hdr.bmh-on > .hd-row, header.hdr.bmh-on > .wrap.hd-row { display: none !important; }
.bmh-wrap { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
.bmh-ico { width: 18px; height: 18px; flex: none; }
.bmh-util { font-size: 13px; font-weight: 500; border-bottom: 1px solid hsl(var(--border) / .6); }
.bmh-util-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 36px; }
.bmh-ulinks { display: flex; gap: 20px; flex-wrap: wrap; }
.bmh-ulinks a { display: inline-flex; align-items: center; gap: 6px; color: hsl(var(--foreground)); }
.bmh-ulinks a:hover { text-decoration: underline; color: hsl(var(--foreground)); }
.bmh-ulinks .bmh-ico { width: 15px; height: 15px; }
.bmh-uright { display: flex; align-items: center; }
/* the live power / currency / language settings, as a quiet text button */
.bmh .hd-setup { position: relative; }
.bmh .hd-setup > summary { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 8px; border: 0 !important; border-radius: 8px !important; background: none !important; font: 500 13px var(--font); color: hsl(var(--foreground)); cursor: pointer; list-style: none; }
.bmh .hd-setup > summary::-webkit-details-marker { display: none; }
.bmh .hd-setup > summary:hover { background: hsl(var(--muted)) !important; }
.bmh .hd-setup > summary svg { width: 15px; height: 15px; }
.bmh .hd-setup > summary .l { display: inline !important; }
.bmh .hd-setup b { text-decoration: underline; text-underline-offset: 2px; font-weight: 700; }
.bmh .hd-setup .setup-pop { right: 0; left: auto; top: calc(100% + 6px); border-radius: 14px; box-shadow: 0 12px 32px rgb(17 22 19 / .18); border: 0; z-index: 60; }

.bmh-main { display: flex; align-items: center; gap: 14px; min-height: 66px; }
.bmh-burger { display: none; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 999px; background: none; color: hsl(var(--foreground)); cursor: pointer; }
.bmh-burger:hover { background: hsl(var(--muted)); }
.bmh-burger .bmh-ico { width: 22px; height: 22px; }
.bmh-logo { flex: none; display: inline-flex; }
.bmh .logo svg { width: 138px; height: auto; display: block; }
.bmh-search { flex: 1 1 420px; max-width: 560px; min-width: 260px; }
.bmh form.hd-search { position: relative; display: flex !important; align-items: center; gap: 8px; width: 100% !important; max-width: none !important; height: 44px !important; padding: 0 6px 0 16px; border: 1px solid transparent !important; border-radius: 999px !important; background: var(--bm-surface2) !important; box-shadow: none !important; overflow: visible !important; }
.bmh form.hd-search:focus-within { background: hsl(var(--card)) !important; border-color: hsl(var(--foreground)) !important; }
.bmh form.hd-search .hd-s-ic { display: inline-flex !important; color: hsl(var(--foreground)); }
.bmh form.hd-search .hd-s-ic svg { width: 18px; height: 18px; }
.bmh form.hd-search .hd-s-l, .bmh form.hd-search .hd-kbd { display: none !important; }
.bmh form.hd-search input { display: block !important; flex: 1; min-width: 0; height: 100%; border: 0 !important; background: transparent !important; padding: 0 !important; font-size: 15.5px; box-shadow: none !important; }
.bmh form.hd-search button[type="submit"] { display: inline-flex !important; align-items: center; height: 34px; padding: 0 14px !important; border: 0; border-radius: 999px !important; background: var(--cta-bg) !important; color: var(--cta-fg) !important; font: 600 14px var(--font); }
.bmh form.hd-search button[type="submit"] .hd-bi { display: none; }
.bmh form.hd-search button[type="submit"] .hd-bt { display: inline !important; }
.bmh form.hd-search .hd-sug { top: calc(100% + 8px) !important; left: 0 !important; right: 0 !important; width: auto !important; border-radius: 14px; box-shadow: 0 12px 32px rgb(17 22 19 / .16); border: 0; }

.bmh-menus { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.bmh-mbtn { display: inline-flex; align-items: center; gap: 4px; height: 38px; padding: 0 11px; border: 0; border-radius: 8px; background: none; color: hsl(var(--foreground)); font: 600 15px var(--font); cursor: pointer; white-space: nowrap; }
.bmh-mbtn:hover, .bmh-mbtn[aria-expanded="true"] { background: hsl(var(--muted)); color: hsl(var(--foreground)); }
.bmh-mbtn[aria-current="page"], .bmh-mbtn[data-cur] { box-shadow: inset 0 -2px 0 hsl(var(--foreground)); border-radius: 0; }
.bmh-mbtn .bmh-ico { width: 15px; height: 15px; transition: transform .15s; }
.bmh-mbtn[aria-expanded="true"] .bmh-ico { transform: rotate(180deg); }
.bmh-me { flex: none; }
.bmh .hd-me { display: flex !important; align-items: center; gap: 4px; }
.bmh .hd-theme, .bmh .hd-watch { display: inline-grid !important; place-items: center; position: relative; width: 40px; height: 40px; padding: 0 !important; border: 0 !important; border-radius: 999px !important; background: none !important; color: hsl(var(--foreground)) !important; }
.bmh .hd-theme:hover, .bmh .hd-watch:hover { background: hsl(var(--muted)) !important; }
.bmh .hd-watch .t { display: none !important; }
.bmh .hd-watch svg, .bmh .hd-theme svg { width: 21px; height: 21px; }
.bmh .hd-watch .wl-n { position: absolute; top: 1px; right: -1px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: hsl(var(--primary)); color: #fff; font-size: 11px; font-weight: 800; display: grid; place-items: center; }
.bmh .hd-watch .wl-n[hidden] { display: none !important; }
.bmh .hd-signin { height: 38px; padding: 0 16px; border-radius: 999px !important; background: var(--cta-bg) !important; color: var(--cta-fg) !important; border: 0 !important; font-weight: 600; margin-left: 4px; }

.bmh-cats { border-top: 1px solid hsl(var(--border) / .6); }
.bmh-cats-row { display: flex; align-items: center; gap: 2px; min-height: 44px; overflow: hidden; }
.bmh-cats-row::-webkit-scrollbar { display: none; }
.bmh-cat { display: inline-flex; align-items: center; gap: 5px; flex: none; padding: 8px 10px; border: 0; border-radius: 6px; background: none; color: hsl(var(--foreground)); font: 500 14px var(--font); white-space: nowrap; cursor: pointer; }
.bmh-cat:hover, .bmh-cat[aria-expanded="true"] { background: hsl(var(--muted)); color: hsl(var(--foreground)); }
.bmh-cat[aria-current="page"] { box-shadow: inset 0 -2px 0 hsl(var(--foreground)); border-radius: 0; }
.bmh-cat .bmh-ico { width: 14px; height: 14px; }
.bmh-hot, .bmh-hot:hover { color: var(--bm-red); }
.bmh-n { font-size: 12px; font-weight: 600; color: hsl(var(--muted-foreground)); }
.bmh-sep { flex: none; width: 1px; height: 20px; background: hsl(var(--border)); margin: 0 6px; }

/* mega panels: 8791's white menu, full width under the header */
.bmh-panel { position: absolute; left: 0; right: 0; top: 100%; z-index: 55; background: hsl(var(--card)); border-top: 1px solid hsl(var(--border)); border-radius: 0 0 20px 20px; box-shadow: 0 30px 50px -20px rgb(17 22 19 / .25); max-height: calc(100vh - 140px); overflow-y: auto; }
.bmh-mega { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 24px; padding-top: 20px; padding-bottom: 24px; max-width: 1440px; }
.bmh-colset { min-width: 0; display: grid; gap: 14px; align-content: start; }
.bmh-cols--6 { grid-template-columns: repeat(6, 1fr); }
/* names next to an icon wrap instead of being cut ("Litecoin…", live 4 Nov: the coin column is narrow) */
.bmh-item:has(img) .bmh-il b, .bmh-item:has(img) .bmh-il small { overflow-wrap: anywhere; }
.bmh-mega--drop { grid-template-columns: 1fr; }
.bmh-cols { display: grid; gap: 8px 22px; align-items: start; }
.bmh-cols--1 { grid-template-columns: 1fr; } .bmh-cols--2 { grid-template-columns: repeat(2, 1fr); } .bmh-cols--3 { grid-template-columns: repeat(3, 1fr); }
.bmh-cols--4 { grid-template-columns: repeat(4, 1fr); } .bmh-cols--5 { grid-template-columns: repeat(5, 1fr); }
.bmh-col { min-width: 0; }
.bmh-t { margin: 4px 10px 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: hsl(var(--muted-foreground)); }
.bmh-note { margin: 0 10px 8px; font-size: 13px; color: hsl(var(--muted-foreground)); }
.bmh-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; color: hsl(var(--foreground)); }
.bmh-item:hover { background: hsl(var(--muted)); color: hsl(var(--foreground)); }
.bmh-item img { width: 26px; height: 26px; object-fit: contain; flex: none; }
.bmh-item img.bmh-plogo { width: 30px; height: 30px; border-radius: 8px; background: #fff; box-shadow: 0 0 0 1px hsl(var(--border)); }
.bmh-ics { display: inline-flex; gap: 3px; flex: none; }
.bmh-ics img { width: 20px; height: 20px; }
.bmh-il { flex: 1; min-width: 0; }
.bmh-il b { display: block; font-weight: 600; font-size: 14.5px; }
.bmh-il small { display: block; font-size: 12.5px; color: hsl(var(--muted-foreground)); line-height: 1.35; }
.bmh-iv { flex: none; font-size: 13px; color: hsl(var(--muted-foreground)); white-space: nowrap; }
.bmh-iv b { color: hsl(var(--foreground)); }
.bmh-bad, .bmh-bad b, a.bmh-bad { color: var(--bm-red) !important; }
.bmh-all { display: inline-block; margin: 6px 10px 0; font-weight: 700; font-size: 14px; color: hsl(var(--foreground)); text-decoration: underline; text-underline-offset: 3px; }
.bmh-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 10px 8px; }
.bmh-chips a { padding: 4px 10px; border-radius: 999px; background: hsl(var(--muted)); font-size: 13px; font-weight: 600; color: hsl(var(--foreground)); }
.bmh-chips a:hover { background: hsl(var(--foreground)); color: hsl(var(--card)); }
.bmh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.bmh-feature { display: flex; flex-direction: column; gap: 6px; background: var(--bm-peach); border-radius: 16px; padding: 20px; color: var(--bm-ink); align-self: start; }
.bmh-feature:hover { color: var(--bm-ink); box-shadow: var(--bm-shadow-hi); }
.bmh-fk { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; opacity: .75; }
.bmh-feature b { font-size: 20px; line-height: 1.2; font-weight: 700; }
.bmh-fbig { font-size: 22px; font-weight: 800; }
.bmh-fp { font-size: 14px; opacity: .85; }
.bmh-feature img { max-height: 120px; object-fit: contain; align-self: center; margin: 6px 0; }
.bmh-fcta { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-weight: 700; font-size: 14px; }

/* drawer */
.bmh-drawer { position: fixed; inset: 0; z-index: 80; background: rgb(17 22 19 / .4); }
html.bmh-lock { overflow: hidden; }
.bmh-dpanel { position: absolute; inset: 0 auto 0 0; width: min(360px, 90vw); background: hsl(var(--card)); display: flex; flex-direction: column; }
.bmh-dhead { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-bottom: 1px solid hsl(var(--border)); font-size: 18px; }
.bmh-dclose { width: 40px; height: 40px; border: 0; border-radius: 999px; background: none; color: inherit; display: grid; place-items: center; cursor: pointer; }
.bmh-dbody { overflow-y: auto; padding: 6px 8px 24px; }
.bmh-dgroup summary { list-style: none; display: flex; justify-content: space-between; align-items: center; padding: 12px; font-weight: 700; font-size: 16px; cursor: pointer; border-radius: 8px; }
.bmh-dgroup summary::-webkit-details-marker { display: none; }
.bmh-dgroup[open] summary .bmh-ico { transform: rotate(180deg); }
.bmh-dgroup a, .bmh-dlink { display: block; padding: 9px 12px; border-radius: 8px; font-weight: 500; color: hsl(var(--foreground)); }
.bmh-dlink { font-weight: 700; font-size: 16px; padding: 12px; }
.bmh-dgroup a:hover, .bmh-dlink:hover { background: hsl(var(--muted)); }
.bmh-dbody hr { border: 0; border-top: 1px solid hsl(var(--border)); margin: 8px 12px; }

/* the live in-page tabs (Most profitable · Hosting · …) become 8791 chips */
.secnav { position: static !important; background: none !important; backdrop-filter: none !important; border: 0 !important; margin-top: 18px !important; }
.secnav a { padding: 6px 14px !important; margin: 0 !important; border: 0 !important; border-radius: 999px; background: hsl(var(--muted)); color: hsl(var(--foreground)) !important; font-weight: 500 !important; font-size: 14px !important; }
.secnav a:hover { box-shadow: inset 0 0 0 1px hsl(var(--foreground)); }
.secnav a[aria-current="true"], main:has(.prod) .secnav a[aria-current="true"] { background: hsl(var(--foreground)) !important; color: hsl(var(--card)) !important; }
.secnav a[aria-current="true"] b { background: hsl(var(--card) / .2) !important; color: inherit; }
/* the miner page's stats band is one grey panel: its figures aren't cards of their own */
.money-line .kpi { background: none !important; box-shadow: none !important; border-radius: 0 !important; }
.secnav-in { gap: 8px !important; }

/* ---------- buttons, chips, cards everywhere ---------- */
.btn { border-radius: 6px; font-weight: 600; }
.btn.cta, .btn.primary { background: var(--cta-bg) !important; color: var(--cta-fg) !important; border-color: transparent !important; border-radius: 6px; }
.btn.cta:hover, .btn.primary:hover { filter: none; background: color-mix(in srgb, var(--cta-bg) 82%, #fff) !important; }
.chip { border-radius: 999px; background: hsl(var(--muted)); border-color: transparent; }
.chip:hover { border-color: hsl(var(--foreground)); }
.badge { border-radius: 999px; }
.card, .hp-mc, .hp-post, .stat, .kpi, .panel, .tool-card, .hw-card, .vc, .vendor-card, .host-card, .pool-card, .db-card,
.mf-card, .best-use, .pc-kpis > div {
  border: 0 !important; border-radius: 16px !important; background: hsl(var(--card)); box-shadow: var(--bm-shadow);
}
/* boxes the live site draws as an outline only: on the 8791 grey page they need the white card surface too
   (owner 4 Nov: "/manufacturers - cards have no background"); they keep their own corners */
/* featured (partner) cards and rows are white like every other card; the orange ring alone marks them
   (owner 4 Nov: "all cards should have the same color background/white/"). The live site fills them with --cta-soft. */
.vend-card.is-partner, .op-row.is-partner, main:has(.prod) .op-row.is-partner, .hb-row.is-partner, .wm-row.featured { background: hsl(var(--card)) !important; }
main:has(.prod) .op-row.is-partner { border-color: #fdba74 !important; }
:root[data-theme="dark"] main:has(.prod) .op-row.is-partner { border-color: #7c2d12 !important; }
/* "View vendor" is the vendor card's CTA: navy like every other CTA, not a black outline (owner 4 Nov: "I again see
   the cta being black") */
.vend-go, .vend-card:hover .vend-go, .vend-card.is-partner:hover .vend-go { background: var(--cta-bg) !important; color: var(--cta-fg) !important; border-color: var(--cta-bg) !important; }
.vend-card:hover .vend-go { background: color-mix(in srgb, var(--cta-bg) 82%, #fff) !important; }
/* the card footer is the same on every card: the counts stacked on the left (locations under the miners, when there are
   any), "View vendor" at the bottom right. In one wrapping row the button dropped to its own line whenever the
   locations didn't fit beside it (owner 4 Nov: "Unify the layout please") */
.vend-foot { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "n go" "l go"; align-items: end; column-gap: 12px; row-gap: 2px; }
.vend-foot > .vf-n { grid-area: n; }
.vend-foot > .vf-l { grid-area: l; }
.vend-foot > .vf-l::before { content: none !important; }
.vend-foot > .vend-go { grid-area: go; align-self: end; margin-left: 0; }
.plx-tw, .tl-net, .tl-side, .fl-row, .hprov-stats > div { border-color: transparent !important; background: hsl(var(--card)); box-shadow: var(--bm-shadow); }
a.card:hover, a.hp-mc:hover, a.hp-post:hover { box-shadow: var(--bm-shadow-hi); }
/* clip, not hidden: hidden makes the table its own scroll box and the sticky column header then floats mid-table */
.t, table.t { border-radius: 12px; overflow: clip; box-shadow: var(--bm-shadow); background: hsl(var(--card)); }
.t thead th { background: var(--bm-surface2); }
.hp-pill { border-radius: 999px; background: #dcf7e8; color: var(--pos); font-weight: 700; }
:root[data-theme="dark"] .hp-pill { background: #12301f; }

/* ---------- home hero (navy, see below) ---------- */
.shop-intro, :root .catalog-home .shop-intro, :root:not([data-theme="dark"]) .catalog-home .shop-intro {
  background: var(--bm-lime); border-radius: 24px; padding: 44px 48px !important; margin-top: 22px; gap: 24px 40px;
}
@media (min-width: 901px) {
  :root .catalog-home .shop-intro { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
  :root .catalog-home .shop-intro > div:first-child { grid-column: 1; grid-row: 1; }
  :root .catalog-home .shop-intro > .hp-find { grid-column: 1; grid-row: 2; width: 100%; max-width: 620px; }
  :root .catalog-home .shop-intro > .shop-facts { grid-column: 2; grid-row: 1 / span 2; align-self: end; }
}
.shop-intro h1 { font-family: var(--bm-display); font-weight: 800; font-size: clamp(34px, 4.2vw, 58px); line-height: 1.04; letter-spacing: -0.03em; color: var(--bm-ink); max-width: 18ch; }
.shop-intro p { color: var(--bm-ink); font-size: 18px; font-weight: 500; opacity: .85; }
.hp-find, :root:not([data-theme="dark"]) .catalog-home .hp-find { background: hsl(var(--card)); border: 0; border-radius: 999px; box-shadow: var(--bm-shadow); padding-left: 20px; height: 54px; }
.hp-find .btn.cta { border-radius: 999px !important; height: 42px; }
.shop-facts b { font-family: var(--bm-display); font-weight: 800; font-size: 34px; letter-spacing: -0.02em; font-variant-numeric: tabular-nums lining-nums; color: var(--bm-ink); }
.shop-facts a span, .shop-facts span span { color: var(--bm-ink); opacity: .75; }
:root[data-theme="dark"] .shop-intro h1, :root[data-theme="dark"] .shop-intro p, :root[data-theme="dark"] .shop-facts b { color: #f1f5f2; }

/* ---------- product rows become 8791 product cards (chart, profit, payback, price and offers all kept) ---------- */
.bm-cards, main .shop-list { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); gap: 16px; }
main .shop-list > .shop-row {
  position: relative; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: auto !important;
  grid-template-areas: "img" "nm" "spark" "buy" "pr" !important; align-items: start; gap: 6px !important;
  padding: 16px 16px 18px !important; margin: 0 !important; height: auto !important; min-height: 0 !important;
  background: hsl(var(--card)); border: 0 !important; border-radius: 16px !important; box-shadow: var(--bm-shadow); color: hsl(var(--foreground));
}
main .shop-list > .shop-row:hover { box-shadow: var(--bm-shadow-hi); color: hsl(var(--foreground)); }
main .shop-list > .shop-row > .shop-rank { position: absolute; left: 14px; top: 12px; z-index: 1; display: inline-block !important; width: auto !important; height: auto !important; padding: 0 !important; font-size: 12px; font-weight: 800; line-height: 1.2; white-space: nowrap; color: var(--bm-red); background: none !important; border: 0 !important; }
main .shop-list > .shop-row > .shop-rank::before { content: "#"; }
main .shop-list > .shop-row > img { grid-area: img; justify-self: center; width: auto !important; height: 140px !important; max-width: 86%; object-fit: contain; margin: 12px 0 4px; }
main .shop-list > .shop-row > .shop-nm { grid-area: nm; display: block; min-width: 0; }
main .shop-list > .shop-row > .shop-nm > b { display: block; font-size: 16px; font-weight: 600; line-height: 1.3; }
main .shop-list > .shop-row .shop-facts2 { display: flex; flex-wrap: wrap; gap: 0 8px; font-size: 13px; color: hsl(var(--muted-foreground)); margin-top: 2px; }
main .shop-list > .shop-row .shop-coin { display: inline-flex; gap: 4px; }
main .shop-list > .shop-row .sc-nm { display: none; }
main .shop-list > .shop-row > .shop-spark { grid-area: spark !important; display: block !important; width: 100% !important; height: 44px !important; }
main .shop-list > .shop-row > .shop-spark svg { width: 100% !important; height: 100% !important; }
main .shop-list > .shop-row > .shop-pb { display: none !important; }
main .shop-list > .shop-row > .shop-buy { grid-area: buy; display: grid !important; grid-template-columns: 1fr; gap: 10px; text-align: left; }
main .shop-list > .shop-row .shop-lp { display: flex !important; flex-direction: column-reverse; align-items: flex-start; }
main .shop-list > .shop-row .shop-lp > span { font-size: 13px; color: hsl(var(--muted-foreground)); }
main .shop-list > .shop-row .shop-lp > b { font-size: 26px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.15; }
main .shop-list > .shop-row .shop-buy .btn.cta { width: 100%; height: 40px; justify-content: center; }
main .shop-list > .shop-row > .shop-pr { grid-area: pr; display: flex !important; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
main .shop-list > .shop-row > .shop-pr > b { display: inline-flex; padding: 3px 10px; border-radius: 999px; background: #dcf7e8; font-size: 14px; }
main .shop-list > .shop-row > .shop-pr > b.neg, main .shop-list > .shop-row > .shop-pr > b:not(.pos) { background: #fde4e8; }
:root[data-theme="dark"] main .shop-list > .shop-row > .shop-pr > b { background: #12301f; }
main .shop-list > .shop-row > .shop-pr > span { font-size: 13px; color: hsl(var(--muted-foreground)); }
main .shop-list > .shop-row .shop-pb2 { display: inline !important; font-weight: 600; color: hsl(var(--foreground)); }

/* ---------- footer: 8791 columns on white ---------- */
.ftr { background: hsl(var(--card)); border-top: 1px solid hsl(var(--border)); margin-top: 56px; }
.ftr h2 { font-size: 16px; font-weight: 700; }
.ftr ul a { color: hsl(var(--muted-foreground)); }
.ftr ul a:hover { color: hsl(var(--foreground)); text-decoration: underline; }
.ftr-soc { gap: 8px; }
.ftr-soc a { width: 36px; height: 36px; margin: 0; padding: 0; border-radius: 999px; background: hsl(var(--muted)); display: inline-grid; place-items: center; }
.ftr-soc a:hover { background: hsl(var(--foreground)); color: hsl(var(--card)); }
.ftr-soc svg { width: 17px; height: 17px; }

/* ---------- scam alert (lib/header8.js scamBar; html.scam-off once hidden for the day) ---------- */
.scam-off .bm-scam { display: none; }
.bm-scam { background: #fff1f1; border-bottom: 1px solid #f6caca; color: #7a1020; font-size: 14px; }
:root[data-theme="dark"] .bm-scam { background: #2a1214; border-color: #4a1d22; color: #ffb4bd; }
.bm-scam .bmh-wrap { display: flex; align-items: center; gap: 10px; min-height: 40px; padding-top: 6px; padding-bottom: 6px; }
.bm-scam b { font-weight: 700; }
.bm-scam a { color: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; margin-left: auto; white-space: nowrap; }
.bm-scam button { border: 0; background: none; color: inherit; cursor: pointer; font-size: 18px; line-height: 1; padding: 4px 6px; border-radius: 6px; }
.bm-scam .bmh-ico { width: 18px; height: 18px; }

/* ---------- smaller screens ---------- */
@media (max-width: 1240px) {
  .bmh-ulinks a:nth-child(n+4) { display: none; }
  .bmh-mbtn { padding: 0 8px; font-size: 14.5px; }
  .bmh-mega { grid-template-columns: minmax(0, 1fr); }
  .bmh-feature { display: none; }
}
@media (max-width: 1080px) {
  .bmh-menus { display: none; }
  .bmh-burger { display: inline-grid; }
  .bmh-search { max-width: none; }
  .bmh .hd-signin { display: none !important; }
}
@media (max-width: 760px) {
  .bmh-wrap { padding: 0 16px; }
  .bmh-ulinks { display: none; }
  .bmh-util-row { justify-content: flex-end; }
  .bmh-main { flex-wrap: wrap; gap: 6px 8px; padding: 8px 16px; }
  .bmh-search { order: 10; flex: 1 1 100%; }
  .bmh-me { margin-left: auto; }
  .bmh-cols--3, .bmh-cols--4, .bmh-cols--5 { grid-template-columns: 1fr 1fr; }
  .shop-intro { padding: 26px 22px !important; border-radius: 18px; }
  main .shop-list { grid-template-columns: 1fr 1fr; gap: 10px; }
  main .shop-list > .shop-row { padding: 12px !important; }
  main .shop-list > .shop-row > img { height: 100px !important; }
  main .shop-list > .shop-row .shop-lp > b { font-size: 21px; }
  .bm-scam .bmh-wrap { flex-wrap: wrap; gap: 4px 10px; }
  .bm-scam a { margin-left: 0; }
}

/* ---------- search field: input first, readable placeholder (a live rule pushed it aside) ---------- */
.bmh form.hd-search .hd-s-ic { order: 0; }
.bmh form.hd-search input { order: 1; width: auto !important; }
.bmh form.hd-search input::placeholder { color: hsl(var(--muted-foreground)) !important; opacity: 1 !important; }
.bmh form.hd-search button[type="submit"] { order: 2; }

/* ---------- strip: "More" fold-out ---------- */
.bmh-more { margin-left: auto; }
.bmh-more-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); margin-bottom: 8px; }
.bmh-t--sep { margin-top: 14px; padding-top: 12px; border-top: 1px solid hsl(var(--border)); }
.bmh-mega--drop .bmh-mega { padding: 0; }

/* ---------- home: 8791 sections ---------- */
/* the card rule (main .shop-list > .shop-row, display: grid !important) is more specific than .bm-hide, so the hidden
   cards are named here too: without it the homepage showed all 48 cards instead of 8 (live 4 Nov) */
.bm-hide, main .shop-list > .shop-row.bm-hide { display: none !important; }
.bm-sec { padding-top: 40px; }
.bm-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.bm-head h2 { margin: 0; font-size: 26px; font-weight: 600; letter-spacing: -0.01em; }
.bm-head .btn { height: 40px; padding: 0 16px; }
.bm-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.bm-tile { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 10px 6px 12px; border-radius: 14px; color: hsl(var(--foreground)); }
.bm-tile:hover { background: hsl(var(--card)); box-shadow: var(--bm-shadow); color: hsl(var(--foreground)); }
.bm-tile figure { margin: 0 0 8px; width: 132px; height: 104px; display: grid; place-items: center; }
.bm-tile img { max-height: 104px; max-width: 100%; object-fit: contain; }
.bm-tile span { font-size: 17px; font-weight: 600; }
.bm-tile small { font-size: 12.5px; color: hsl(var(--muted-foreground)); max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bm-promos { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bm-promo { display: flex; flex-direction: column; gap: 10px; min-height: 360px; padding: 28px; border-radius: 16px; background: var(--bm-surface2); color: hsl(var(--foreground)); }
.bm-promo:hover { color: hsl(var(--foreground)); box-shadow: var(--bm-shadow-hi); }
.bm-promo h3 { margin: 0; font-size: 26px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.2; }
.bm-promo p { margin: 0 0 6px; font-weight: 500; }
.bm-promo .btn { align-self: flex-start; height: 38px; }
.bm-promo-art { flex: 1; display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 150px; flex-wrap: wrap; }
.bm-hostlist { flex-direction: column; align-items: stretch; justify-content: center; }
.bm-hostlist span { display: flex; justify-content: space-between; gap: 12px; background: hsl(var(--card)); border-radius: 12px; padding: 12px 16px; box-shadow: var(--bm-shadow); }
.bm-hostlist em { font-style: normal; font-weight: 700; color: var(--pos); }
.bm-hostlist b { display: inline-flex; align-items: center; gap: 10px; }
.bm-hostlist img { width: 28px; height: 28px; border-radius: 7px; object-fit: contain; background: #fff; box-shadow: 0 0 0 1px hsl(var(--border)); }
.bm-logos img { height: 64px; width: 42%; max-width: 170px; object-fit: contain; background: hsl(var(--card)); border-radius: 14px; padding: 14px; box-shadow: var(--bm-shadow); }
.bm-services { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.bm-service { display: flex; flex-direction: column; gap: 8px; padding: 20px; border-radius: 16px; background: hsl(var(--card)); box-shadow: var(--bm-shadow); color: hsl(var(--foreground)); }
.bm-service:hover { color: hsl(var(--foreground)); box-shadow: var(--bm-shadow-hi); }
.bm-service h3 { margin: 0; font-size: 20px; font-weight: 600; }
.bm-service p { margin: 0; font-size: 14px; flex: 1; color: hsl(var(--muted-foreground)); }
.bm-service .btn { align-self: flex-start; height: 34px; padding: 0 12px; font-size: 14px; }
.bm-art { margin-top: 12px; height: 96px; border-radius: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 12px; text-align: center; }
.bm-art img { width: 40px; height: 40px; object-fit: contain; background: #fff; border-radius: 999px; padding: 4px; display: inline-block; margin: 0 2px; }
.bm-art--lime { background: var(--bm-lime); color: #111613; flex-direction: row; flex-wrap: wrap; }
.bm-art--ink { background: #111613; color: #c9d2cd; }
.bm-art--ink b { color: var(--bm-green); font-size: 28px; letter-spacing: -0.02em; }
.bm-art--peach { background: var(--bm-peach); color: #111613; }
.bm-art--peach b { font-size: 28px; color: var(--bm-red); }
.bm-art--code { background: #111613; }
.bm-art--code code { color: var(--bm-green); font-size: 14px; }
.bm-art span { font-size: 13px; }
.bm-art .bm-art-l { font-size: 15px; font-weight: 700; }
.bm-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: -4px 0 16px; }
.bm-chip { padding: 6px 14px; border-radius: 999px; border: 1px solid transparent; background: hsl(var(--muted)); font: 500 14px var(--font); color: hsl(var(--foreground)); cursor: pointer; }
.bm-chip:hover { border-color: hsl(var(--foreground)); }
.bm-chip[aria-pressed="true"] { background: hsl(var(--foreground)); color: hsl(var(--card)); }
.bm-top-sec .shop-list { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.bm-top-sec .shop-list > .shop-row { position: relative; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: auto !important; grid-template-areas: "img" "nm" "spark" "buy" "pr" !important; gap: 6px !important; padding: 16px 16px 18px !important; margin: 0 !important; background: hsl(var(--card)); border: 0 !important; border-radius: 16px !important; box-shadow: var(--bm-shadow); color: hsl(var(--foreground)); }
.bm-top-sec .shop-list > .shop-row:hover { box-shadow: var(--bm-shadow-hi); }
.bm-top-sec .shop-list > .shop-row > .shop-rank { position: absolute; left: 14px; top: 12px; display: inline-block !important; width: auto !important; height: auto !important; padding: 0 !important; font-size: 12px; font-weight: 800; color: var(--bm-red); background: none !important; border: 0 !important; }
.bm-top-sec .shop-list > .shop-row > .shop-rank::before { content: "#"; }
.bm-top-sec .shop-list > .shop-row > img { grid-area: img; justify-self: center; width: auto !important; height: 140px !important; max-width: 86%; object-fit: contain; margin: 12px 0 4px; }
.bm-top-sec .shop-list > .shop-row > .shop-nm { grid-area: nm; display: block; }
.bm-top-sec .shop-list > .shop-row > .shop-nm > b { display: block; font-size: 16px; font-weight: 600; }
.bm-top-sec .shop-list > .shop-row .shop-facts2 { display: flex; flex-wrap: wrap; gap: 0 8px; font-size: 13px; color: hsl(var(--muted-foreground)); }
.bm-top-sec .shop-list > .shop-row .sc-nm { display: none; }
.bm-top-sec .shop-list > .shop-row > .shop-spark { grid-area: spark !important; display: block !important; width: 100% !important; height: 44px !important; }
.bm-top-sec .shop-list > .shop-row > .shop-pb { display: none !important; }
.bm-top-sec .shop-list > .shop-row > .shop-buy { grid-area: buy; display: grid !important; grid-template-columns: 1fr; gap: 10px; }
.bm-top-sec .shop-list > .shop-row .shop-lp { display: flex !important; flex-direction: column-reverse; align-items: flex-start; }
.bm-top-sec .shop-list > .shop-row .shop-lp > span { font-size: 13px; color: hsl(var(--muted-foreground)); }
.bm-top-sec .shop-list > .shop-row .shop-lp > b { font-size: 26px; font-weight: 700; letter-spacing: -0.02em; }
.bm-top-sec .shop-list > .shop-row .shop-buy .btn.cta { width: 100%; height: 40px; justify-content: center; }
.bm-top-sec .shop-list > .shop-row > .shop-pr { grid-area: pr; display: flex !important; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.bm-top-sec .shop-list > .shop-row > .shop-pr > b { padding: 3px 10px; border-radius: 999px; background: #dcf7e8; font-size: 14px; }
.bm-top-sec .shop-list > .shop-row > .shop-pr > span { font-size: 13px; color: hsl(var(--muted-foreground)); }
.bm-top-sec .shop-list > .shop-row .shop-pb2 { display: inline !important; font-weight: 600; color: hsl(var(--foreground)); }
.bm-sitemap { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.bm-sm { background: hsl(var(--card)); border-radius: 16px; padding: 18px; box-shadow: var(--bm-shadow); }
.bm-sm h3 { margin: 0 0 8px; font-size: 16px; font-weight: 700; }
.bm-sm a { display: block; padding: 6px 0; border-top: 1px solid hsl(var(--border)); color: hsl(var(--foreground)); }
.bm-sm a:first-of-type { border-top: 0; }
.bm-sm a b { display: block; font-size: 14px; font-weight: 600; }
.bm-sm a small { display: block; font-size: 12px; color: hsl(var(--muted-foreground)); line-height: 1.35; }
.bm-sm a:hover b { text-decoration: underline; }
@media (max-width: 1180px) {
  .bm-services, .bm-top-sec .shop-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bm-sitemap { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
  .bm-services, .bm-top-sec .shop-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bm-promos { grid-template-columns: 1fr; }
  .bm-promo { min-height: 0; }
  .bm-sitemap { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .bm-head h2 { font-size: 22px; }
  .bm-services, .bm-sitemap { grid-template-columns: 1fr; }
  .bm-top-sec .shop-list { gap: 10px; }
  .bm-top-sec .shop-list > .shop-row { padding: 12px !important; }
  .bm-top-sec .shop-list > .shop-row > img { height: 100px !important; }
  .bm-top-sec .shop-list > .shop-row .shop-lp > b { font-size: 21px; }
  .bm-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bm-tile figure { width: 90px; height: 72px; }
  .bm-tile img { max-height: 72px; }
  .bm-tile span { font-size: 14px; }
}


/* ---------- home hero in navy #13243A (owner 4 Nov), white text, figures in the logo green ---------- */
.shop-intro, :root .catalog-home .shop-intro, :root:not([data-theme="dark"]) .catalog-home .shop-intro { background: #13243a !important; }
.shop-intro h1, :root[data-theme="dark"] .shop-intro h1 { color: #fff !important; }
.shop-intro p, :root[data-theme="dark"] .shop-intro p { color: rgb(255 255 255 / .82) !important; opacity: 1; }
.shop-facts b, :root[data-theme="dark"] .shop-facts b { color: var(--bm-green) !important; }
.shop-facts a span, .shop-facts span span { color: rgb(255 255 255 / .72) !important; opacity: 1; }
.shop-facts a:hover b { text-decoration: underline; }
.hp-find .btn.cta { background: var(--bm-green) !important; color: #0b1a12 !important; }

/* most profitable right now: next to the live category sidebar */
.bm-shopmain { margin-top: 40px; }
.bm-shopmain .bm-top-sec { padding-top: 0; min-width: 0; }
@media (min-width: 1181px) { .bm-shopmain .bm-top-sec .shop-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.bm-shopmain .shop-cats { background: hsl(var(--card)); border: 0; border-radius: 16px; box-shadow: var(--bm-shadow); }

/* the live header's fit script can switch to a compact search (width 0); in the 8791 header the field always fills the pill */
html .hdr .bmh form.hd-search input#hdQ { flex: 1 1 auto !important; width: 100% !important; min-width: 80px !important; max-width: none !important; opacity: 1 !important; position: static !important; clip: auto !important; }

/* ---------- plans page (pricing.js, owner 4 Nov: paid plans only, the launch offer, redesign) ----------
   Layout A (owner's pick): navy hero with the launch-offer card, two white plan cards, steps, the comparison table, examples. */
.pz .pz-hero { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr); gap: 32px; align-items: center; margin: 8px 0 28px; padding: 44px 48px; border-radius: 24px; background: #13243a; color: #fff; }
.pz .pz-h1 { font-family: var(--bm-display); font-weight: 650; font-size: clamp(32px, 4.2vw, 52px); line-height: 1.04; letter-spacing: -0.02em; margin: 0; color: #fff; text-wrap: balance; }
.pz .pz-lead { margin: 14px 0 0; font-size: 17px; line-height: 1.5; color: rgb(255 255 255 / .84); max-width: 58ch; }
.pz .pz-stats { display: flex; flex-wrap: wrap; gap: 0; margin: 26px 0 0; }
.pz .pz-stats > div { padding: 2px 22px 2px 14px; border-left: 1px solid rgb(255 255 255 / .35); }
.pz .pz-stats dt { font-family: var(--bm-display); font-size: 28px; font-weight: 650; color: #00c472; font-variant-numeric: tabular-nums; line-height: 1.1; }
.pz .pz-stats dd { margin: 2px 0 0; font-size: 13px; color: rgb(255 255 255 / .74); }
.pz .pz-offer { background: #dcf7e8; color: #111613; border-radius: 18px; padding: 22px 24px; display: grid; gap: 10px; }
.pz .pz-offer-k { margin: 0; font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.pz .pz-offer-t { margin: 0; font-family: var(--bm-display); font-weight: 650; font-size: 26px; line-height: 1.12; letter-spacing: -0.01em; text-wrap: balance; }
.pz .pz-offer-l { margin: 0; font-size: 14.5px; line-height: 1.45; }
.pz .pz-meter { height: 8px; border-radius: 999px; background: rgb(17 22 19 / .14); overflow: hidden; }
.pz .pz-meter i { display: block; height: 100%; border-radius: inherit; background: #13243a; }
.pz .pz-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin: 0 0 18px; }
.pz .pz-legacy { margin: 0; font-size: 14px; color: hsl(var(--muted-foreground)); max-width: 60ch; }
.pz .pz-sw { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: hsl(var(--card)); box-shadow: var(--bm-shadow); }
.pz .pz-sw label { padding: 7px 16px; border-radius: 999px; font-size: 14px; font-weight: 600; cursor: pointer; color: hsl(var(--muted-foreground)); white-space: nowrap; }
.pz .pz-sw label:hover { color: hsl(var(--foreground)); }
.pz .pz-sw-save { font-size: 12.5px; font-weight: 600; color: var(--pos); }
#pp-mo:checked ~ .pz-bar label[for="pp-mo"], #pp-yr:checked ~ .pz-bar label[for="pp-yr"] { background: #13243a; color: #fff; }
#pp-mo:checked ~ .pz-bar label[for="pp-yr"] .pz-sw-save { color: var(--pos); }
#pp-yr:checked ~ .pz-bar label[for="pp-yr"] .pz-sw-save { color: #00c472; }
#pp-mo:focus-visible ~ .pz-bar label[for="pp-mo"], #pp-yr:focus-visible ~ .pz-bar label[for="pp-yr"] { outline: 2px solid var(--title); outline-offset: 2px; }
.pz .pp-v { display: none; }
#pp-mo:checked ~ * .pp-v-mo, #pp-yr:checked ~ * .pp-v-yr { display: inline; }
.pz .pz-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.pz .pz-card { display: flex; flex-direction: column; gap: 14px; padding: 28px; border-radius: 20px; background: hsl(var(--card)); box-shadow: var(--bm-shadow); border: 1px solid transparent; }
.pz .pz-card-f { border-color: #13243a; box-shadow: var(--bm-shadow), inset 0 0 0 1px #13243a; }
.pz .pz-card-h { display: grid; gap: 8px; }
.pz .pz-card-h .badge, .pz .pz-pair-h .badge { font-size: 15px; font-weight: 700; padding: 0; }
.pz .pz-sub { margin: 0; color: hsl(var(--muted-foreground)); font-size: 14.5px; min-height: 2.9em; }
.pz .pz-free { margin: 0; padding: 7px 12px; border-radius: 10px; background: #dcf7e8; color: #111613; font-size: 13.5px; font-weight: 600; justify-self: start; width: fit-content; }
.pz .pz-price { line-height: 1.1; }
.pz .pz-amt { font-family: var(--bm-display); font-size: 44px; font-weight: 650; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.pz .pz-per { font-size: 15px; color: hsl(var(--muted-foreground)); white-space: nowrap; }
.pz .pz-save { display: block; margin-top: 4px; font-size: 13.5px; font-weight: 600; color: var(--pos); }
.pz .pz-com { margin: 0; font-size: 14px; font-weight: 600; }
.pz .pz-alt { margin: 0; font-size: 13px; color: hsl(var(--muted-foreground)); }
.pz .pz-list { list-style: none; margin: 4px 0 6px; padding: 14px 0 0; border-top: 1px solid hsl(var(--border)); display: grid; gap: 9px; font-size: 15px; }
.pz .pz-list li { display: grid; grid-template-columns: 18px 1fr; gap: 8px; }
.pz .pz-list li::before { content: "✓"; color: var(--pos); font-weight: 700; }
.pz .pz-list li:has(> b)::before { content: ""; }
.pz .pz-list li.pz-opt::before { content: "+"; color: hsl(var(--muted-foreground)); }
.pz .pz-btn { margin-top: auto; justify-content: center; min-height: 48px; font-size: 15.5px; }
.pz .pz-sec { margin-top: 48px; }
.pz .pz-h2 { font-family: var(--bm-display); font-weight: 650; font-size: clamp(24px, 2.6vw, 32px); letter-spacing: -0.01em; margin: 0 0 16px; }
.pz .pz-h3 { margin: 0 0 10px; font-size: 16px; }
.pz .pz-intro { margin: -6px 0 18px; }
.pz .pz-steps { list-style: none; counter-reset: pz; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pz .pz-steps li { counter-increment: pz; display: grid; gap: 6px; align-content: start; padding: 20px 22px; border-radius: 18px; background: hsl(var(--card)); box-shadow: var(--bm-shadow); }
.pz .pz-steps li::before { content: counter(pz); width: 32px; height: 32px; border-radius: 999px; display: grid; place-items: center; background: #e6ebf2; color: #111613; font-weight: 700; margin-bottom: 4px; }
.pz .pz-steps li span { color: hsl(var(--muted-foreground)); font-size: 14.5px; }
.pz .pz-tw { overflow-x: auto; border-radius: 20px; background: hsl(var(--card)); box-shadow: var(--bm-shadow); }
.pz .pz-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.pz .pz-table thead th, .pz .pz-table thead td { padding: 18px 16px 14px; text-align: center; border-bottom: 2px solid hsl(var(--border)); vertical-align: top; }
.pz .pz-table th[scope="row"] { text-align: left; font-weight: 500; padding: 12px 16px; }
.pz .pz-table td { text-align: center; padding: 12px 16px; width: 30%; }
.pz .pz-table tbody tr:not(.pz-group) > * { border-bottom: 1px solid hsl(var(--border)); }
.pz .pz-group th { text-align: left; padding: 22px 16px 8px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: hsl(var(--muted-foreground)); }
.pz .pz-fcol { background: hsl(var(--muted) / .55); }
.pz .pz-yes { color: var(--pos); font-weight: 700; font-size: 17px; }
.pz .pz-no { color: hsl(var(--muted-foreground)); }
.pz .pz-ex { padding: 24px 26px; border-radius: 20px; background: hsl(var(--card)); box-shadow: var(--bm-shadow); }
.pz .pz-ex .pz-h2 { font-size: 22px; }
.pz .pz-ex-row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 8px 16px; align-items: baseline; padding: 12px 0; border-top: 1px solid hsl(var(--border)); }
.pz .pz-ex-calc { color: hsl(var(--muted-foreground)); font-variant-numeric: tabular-nums; font-size: 14px; }
.pz .pz-ex-row b { font-size: 18px; font-variant-numeric: tabular-nums; }
.pz .pz-notes { margin: 12px 0 0; padding-left: 18px; display: grid; gap: 4px; }
.pz .pz-cmp { display: grid; gap: 26px; }
.pz .pz-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.pz .pz-pair-h { position: sticky; top: 0; z-index: 2; padding: 10px 0; background: hsl(var(--background)); border-bottom: 1px solid hsl(var(--border)); }
.pz .pz-tile { display: grid; gap: 8px; align-content: start; padding: 10px; border: 0; border-radius: 16px; background: hsl(var(--card)); box-shadow: var(--bm-shadow); font: inherit; color: inherit; text-align: left; cursor: zoom-in; }
.pz .pz-tile:hover { box-shadow: var(--bm-shadow-hi); }
.pz .pz-tile-f { box-shadow: var(--bm-shadow), inset 0 0 0 1px #13243a; }
.pz .pz-thumb { display: block; aspect-ratio: 16 / 7; overflow: hidden; border-radius: 10px; background: hsl(var(--muted)); }
.pz .pz-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: top left; display: block; }
.pz .pz-none { cursor: default; } .pz .pz-none .pz-thumb { display: grid; place-items: center; font-size: 28px; color: hsl(var(--muted-foreground)); }
.pz .pz-cap { font-size: 14px; font-weight: 600; padding: 0 4px 4px; }
.pz-dlg { max-width: min(1200px, 94vw); border: 0; border-radius: 18px; padding: 16px; box-shadow: 0 24px 60px rgb(17 22 19 / .3); }
.pz-dlg::backdrop { background: rgb(17 22 19 / .55); }
.pz-dlg img { max-width: 100%; height: auto; border-radius: 10px; display: block; }
.pz-dlg form { display: flex; justify-content: flex-end; }
.pz-dcap { margin: 6px 0 10px; font-weight: 600; }
.pz .pz-promise { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pz .pz-promise li { display: grid; gap: 6px; align-content: start; padding: 20px 22px; border-radius: 18px; background: hsl(var(--card)); box-shadow: var(--bm-shadow); font-size: 14.5px; }
.pz .pz-faq details.faq { background: hsl(var(--card)); border-radius: 14px; box-shadow: var(--bm-shadow); padding: 0 18px; margin: 0 0 10px; border: 0; }
.pz .pz-faq details.faq summary { padding: 15px 0; font-weight: 600; }
.pz .pz-faq details.faq p { margin: 0 0 16px; }
.pz .pz-cta { margin-top: 48px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding: 26px 28px; border-radius: 20px; background: #e6ebf2; color: #111613; }
.pz .pz-cta p { margin: 4px 0 0; }
:root[data-theme="dark"] .pz .pz-card-f, :root[data-theme="dark"] .pz .pz-tile-f { border-color: #00c472; box-shadow: var(--bm-shadow), inset 0 0 0 1px #00c472; }
:root[data-theme="dark"] .pz .pz-hero { background: #13243a; }
:root[data-theme="dark"] .pz .pz-free, :root[data-theme="dark"] .pz .pz-offer { background: #dcf7e8; color: #111613; }
:root[data-theme="dark"] .pz .pz-cta { background: #1d2a3a; color: #f1f5f2; }
:root[data-theme="dark"] .pz .pz-steps li::before { background: #1d2a3a; color: #f1f5f2; }
@media (max-width: 980px) {
  .pz .pz-hero { grid-template-columns: 1fr; padding: 32px 28px; }
  .pz .pz-cards, .pz .pz-steps, .pz .pz-promise { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .pz .pz-hero { padding: 26px 20px; border-radius: 18px; margin-top: 4px; }
  .pz .pz-lead { font-size: 15.5px; }
  .pz .pz-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 0; }
  .pz .pz-stats dt { font-size: 24px; }
  .pz .pz-offer { padding: 18px; } .pz .pz-offer-t { font-size: 22px; }
  .pz .pz-card { padding: 22px 18px; } .pz .pz-amt { font-size: 38px; } .pz .pz-sub { min-height: 0; }
  .pz .pz-bar { flex-direction: column; align-items: stretch; } .pz .pz-sw { justify-content: center; } .pz .pz-sw label { padding: 7px 12px; font-size: 13.5px; }
  .pz .pz-table { font-size: 13.5px; } .pz .pz-table td, .pz .pz-table th[scope="row"] { padding: 10px; }
  .pz .pz-pair { grid-template-columns: 1fr 1fr; gap: 8px; } .pz .pz-cap { font-size: 12.5px; }
  .pz .pz-ex-row { grid-template-columns: 1fr auto; } .pz .pz-ex-calc { grid-column: 1 / -1; grid-row: 2; }
}

/* ---------- phones (owner 4 Nov, mobile check: "search bar and button are off", stats "not well aligned",
   "scam alert should not sit next to the hot deals ... for example hosting") ---------- */
@media (max-width: 760px) {
  /* the strip: Hot deals, Hosting, the profitability table first; the scam alert folds into More (header8.js) */
  .bmh-cats-row > .bmh-hot:first-child { order: -3; }
  .bmh-cats-row > [data-drop="host"] { order: -2; }
  .bmh-cats-row .bmh-n { display: none; }
  /* scrolling down tucks the power line and the logo row away, the search and the strip stay; scrolling up brings them
     back (header8.js sets --bmh-tuck) */
  header.hdr.bmh-on { top: calc(-1 * var(--bmh-tuck, 0px)) !important; transition: top .2s ease; }
}
@media (max-width: 640px) {
  /* hero figures: three equal columns on one line, figure over its label */
  :root .catalog-home .shop-intro > .shop-facts, .shop-intro .shop-facts { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 !important; }
  .shop-intro .shop-facts > * { display: grid !important; align-content: start; gap: 2px; min-width: 0; margin: 0 !important; padding: 0 0 0 12px !important; border: 0 !important; border-left: 1px solid rgb(255 255 255 / .3) !important; }
  .shop-intro .shop-facts > :first-child { padding-left: 0 !important; border-left: 0 !important; }
  .shop-intro .shop-facts b { font-size: 28px; line-height: 1.1; }
  .shop-intro .shop-facts span span, .shop-intro .shop-facts a span { font-size: 13px; }
}
