/* "Calm" look (proposal, loaded after styles.css).
   Modeled on how Apple, Stripe, Linear, Vercel, Tesla, NVIDIA, Coinbase, Airbnb, Cloudflare and Palantir use colour:
   1. one accent (our orange), only for the primary action, key numbers and the brand
   2. neutrals do the rest: near-black surfaces, off-white / grey text, translucent white borders
   3. sale / lease / hosting told apart by label text, not by colour
   4. red = banned / errors only; no decorative greens, yellows, blues or violets
   5. third-party buttons (WhatsApp, Telegram) are neutral with monochrome icons
   6. no neon glows; the globe is the one visual centrepiece, in accent + neutrals */

:root {
  --text: #ededf0; --muted: #c4c8d0; --dim: #8d93a0;
  --line: rgba(255,255,255,.08); --line-hi: rgba(255,255,255,.16);
  --btc-glow: transparent; --cyan-glow: transparent; --yellow-glow: transparent; --violet-glow: transparent;
  --lease-glow: transparent; --wa-glow: transparent; --red-glow: transparent;
  /* former accents collapse into neutrals */
  --cyan: #ededf0; --cyan-hi: #ffffff;
  --yellow: #c4c8d0; --lease: #c4c8d0; --sale: #ededf0; --violet: #c4c8d0;
  --wa: #ededf0; --wa-hi: #ffffff;
  --globe-line: linear-gradient(90deg, rgba(255,148,22,0), #ff9416 50%, rgba(255,148,22,0));
}

/* no neon: glows and glitch effects off */
*, *::before, *::after { text-shadow: none !important; }
/* the hero glitch stays (it's part of the brand), in the new palette: white + orange slices instead of cyan + yellow */
.glitch::before { color: #ffffff; }
.glitch::after { color: var(--btc); }
.hero::before { opacity: .35; }

/* gradient rules → one thin accent line */
.panel::before, .modal-in::before { background: var(--btc) !important; }

/* buttons: one accent (primary), everything else neutral */
.btn-dark { background: #ededf0; color: #0a0b0f; }
.btn-dark:hover { background: #fff; filter: none; }
/* ghost buttons: an even, visible outline in both themes (kept on hover) */
:root { --edge: rgba(255,255,255,.34); --tint: rgba(255,255,255,.07); }
html[data-theme="light"] { --edge: rgba(12,14,20,.4); --tint: rgba(12,14,20,.05); }
.btn-ghost, .btn-line { background: linear-gradient(var(--bg), var(--bg)) padding-box, linear-gradient(var(--edge), var(--edge)) border-box !important; }
.btn-ghost:hover, .btn-line:hover { color: var(--text) !important; background: linear-gradient(var(--tint), var(--tint)) padding-box, linear-gradient(var(--bg), var(--bg)) padding-box, linear-gradient(var(--text), var(--text)) border-box !important; }
a.stat:hover, a.stat:focus-visible { border-color: var(--btc) !important; }
.nav a:not(.btn) { white-space: nowrap; }
.btn-tg, .btn-wa { background: transparent !important; color: var(--text) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.22); }
.btn-tg:hover, .btn-wa:hover { background: rgba(255,255,255,.07) !important; filter: none !important; }
.btn-primary:hover { filter: none; }

/* header: "Highlighted" link no longer green */
.nav a.nav-hl { color: inherit; }
.nav a.nav-hl:hover { color: var(--btc-hi); }   /* brighter orange on hover, readable in both themes */

/* ticker */
.ticker-dot { background: var(--dim); box-shadow: none; }

/* listing cards */
.card:hover { filter: none; }
.card:hover::after { background: linear-gradient(rgba(255,255,255,.28), rgba(255,255,255,.28)) border-box !important; }
.card-hl, .card-hl::after { filter: none !important; }
.card-hl::after { background: linear-gradient(135deg, var(--btc), rgba(255,148,22,.12) 35%, rgba(255,255,255,.08) 60%) border-box !important; }
.plaque, .plaque.sale, .plaque.lease, .plaque.hosting, .plaque.inquiry, .plaque.both .p-sale, .plaque.both .p-lease {
  background: rgba(8,9,12,.78) !important; color: #fff !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.25) !important;
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.plaque.both { box-shadow: none !important; gap: 1px; }
.new-badge { background: #ededf0; color: #0a0b0f; animation: none; }
.card-mw { text-shadow: 0 2px 10px rgba(0,0,0,.7) !important; }
.card-id { color: var(--dim); }
.card-loc svg { color: var(--dim); }
.card-broker { color: var(--dim); }
.spec:nth-child(2) .spec-v { color: var(--text); }
.spec:nth-child(3) .spec-v { color: var(--btc); }          /* the price is the one coloured number */
.photo-gate:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.5); }
.tg-logo { background: rgba(255,255,255,.14); box-shadow: none; }

/* section headings: words stay white; the accent is kept for the hero line only */
.section-head h2 em, .alerts-intro h2 em, html[data-page="hosting"] .desk-hero h1 em { color: inherit !important; font-style: normal; }
.estate .eyebrow::before, .quick .eyebrow, .quick .eyebrow::before { color: var(--dim) !important; }
.hero h1 .glow, .about-hero h1 em { color: var(--btc); }

/* filters: active = white, not a colour per type */
.seg button[aria-pressed="true"], .seg button[data-type][aria-pressed="true"] { background: #ededf0 !important; color: #0a0b0f !important; box-shadow: none !important; }
.seg button[data-type="featured"] { color: inherit; }
.pk[aria-pressed="true"] { background: #ededf0 !important; color: #0a0b0f !important; border-color: #ededf0 !important; }

/* country chips */
.chip .n, .chip.hosting .n, .chip.active .n { color: var(--dim); }
.chip.sites .n { color: var(--btc); }
.chip.sites { box-shadow: none; border-color: rgba(255,148,22,.5); }
.chip.hosting, .chip.active { border-color: var(--line-hi); }

/* quick deals + highlighted rail: neutral with the accent edge */
.qcard { background: var(--panel); }
.qcard::after { background: linear-gradient(135deg, rgba(255,148,22,.7), rgba(255,255,255,.08) 40%) border-box !important; }
.qcard:hover { filter: none; }
.hl-kicker, .hl-all { color: var(--btc) !important; }
.hl-item:hover, .hl-item:focus-visible { background: rgba(255,255,255,.04); border-color: var(--line-hi); }
.hl-item.svc-sale, .hl-item.svc-lease, .hl-item.svc-both, .hl-item.svc-hosting { border-left-color: var(--line-hi); }
.mini.svc-lease, .mini.svc-hosting { border-left-color: var(--line-hi); }
.q-head .q-badge.svc-lease, .q-head .q-badge.svc-hosting, .q-head .q-badge.svc-both { background: #ededf0 !important; color: #0a0b0f !important; box-shadow: none !important; }
.tag.host { background: transparent; }

/* globe: accent for countries with sites, neutral steps for the rest, red only for bans */
.map-card .graticule { stroke: rgba(255,255,255,.07) !important; filter: none !important; stroke-dasharray: none; }
.map-card .graticule-major { stroke: rgba(255,255,255,.18) !important; filter: none !important; }
.map-card .country.tier-sites, .map-card .tops .country.tier-sites { fill: rgba(255,148,22,.55) !important; stroke: #ffb04a !important; animation: none !important; filter: none !important; }
.map-card .country.tier-hosting, .map-card .tops .country.tier-hosting { fill: rgba(237,237,240,.28) !important; stroke: rgba(255,255,255,.7) !important; filter: none !important; }
.map-card .country.tier-active, .map-card .tops .country.tier-active { fill: rgba(237,237,240,.1) !important; stroke: rgba(255,255,255,.35) !important; filter: none !important; }
.map-card .country.tier-banned, .map-card .tops .country.tier-banned { fill: rgba(255,42,61,.12) !important; stroke: rgba(255,77,94,.55) !important; filter: none !important; }
.map-card .country:hover { filter: none !important; }
.b-core { fill: #fff; stroke: var(--btc); filter: none; }
.b-ring { stroke: rgba(255,255,255,.6); }
/* globe gradients (drawn by app.js; CSS beats SVG presentation attributes) */
#beam stop { stop-color: #ffffff; }
/* ocean: the deep teal sea with a blue rim, like the 404 globe (user, 2 Oct 2026): app.js's own gradient, not repainted */
.map-card .g-ocean { fill: url(#ocean) !important; }   /* styles.css "Globe v3" made the sphere nearly clear */
html[data-theme="light"] .map-card .g-ocean, html[data-theme="light"] .map-card .s404 { fill: rgba(12,14,20,.02) !important; }   /* light: no blue (user, 2 Oct 2026): the clean pale globe as before */
#shine stop { stop-color: #ffffff; }
.map-card { border-color: var(--line-hi) !important; }
.map-card .country.tier-sites, .map-card .tops .country.tier-sites { fill: rgba(255,148,22,.42) !important; }

/* NEW and Highlighted keep the accent: orange means "look here" (price goes back to white) */
.spec:nth-child(3) .spec-v { color: var(--text); font-weight: 700; }
.new-badge { background: var(--btc) !important; color: #0a0500 !important; animation: newPulse 2.4s ease-in-out infinite; }
@keyframes newPulse { 50% { box-shadow: 0 0 0 4px rgba(255,148,22,.25); } }
.ticker-item .up, .ticker-item .new { color: var(--btc); }
.card-hl::after { background: linear-gradient(var(--btc), var(--btc)) border-box !important; }
.card-art .q-tag, .q-tag { background: var(--btc) !important; color: #0a0500 !important; border-color: var(--btc) !important; box-shadow: none !important; font-weight: 700; }
.q-tag svg { display: none; }
.q-tag::before { content: "★"; margin-right: 2px; }
/* the one green on the site: the WhatsApp Quick inquiry button (instantly read as "chat now") */
.card-wa, .q-main.btn-wa { background: #1daa61 !important; color: #ffffff !important; box-shadow: none !important; }   /* WhatsApp's own button: its green, white text */
.card-wa:hover, .q-main.btn-wa:hover { background: #25d366 !important; }
.nav a.nav-hl { color: var(--btc); }
.seg button[data-type="featured"]:not([aria-pressed="true"]) { color: var(--btc); }
@media (prefers-reduced-motion: reduce) { .new-badge { animation: none; } }

/* ======================= Light theme (html[data-theme="light"], set by the header switch) =======================
   Same rules as dark: one orange accent, neutral greys, green only on the WhatsApp button, red only for bans.
   Orange is a step deeper so it keeps contrast on white. Photos keep their dark overlays (white text on photos). */
html[data-theme="light"] {
  color-scheme: light;
  --void: #f3f4f6; --bg: #f7f8fa; --panel: #ffffff; --panel-2: #fbfbfc;
  --line: rgba(12,14,20,.10); --line-hi: rgba(12,14,20,.18);
  --text: #121419; --muted: #3c414b; --dim: #6a707c;
  --btc: #e67800; --btc-hi: #ff8a0a;
  --cyan: #121419; --cyan-hi: #000000; --sale: #121419;
  --yellow: #3c414b; --lease: #3c414b; --violet: #3c414b;
  --wa: #121419; --wa-hi: #000000;
  --land: #e4e6ea;
}
html[data-theme="light"] body::after { background: none; }                 /* no CRT scanlines / vignette */
html[data-theme="light"] .hero::before { background: linear-gradient(rgba(12,14,20,.07) 1px, transparent 1px) 0 0 / 60px 60px, linear-gradient(90deg, rgba(12,14,20,.07) 1px, transparent 1px) 0 0 / 60px 60px; }
html[data-theme="light"] .hero::after { background: radial-gradient(closest-side, rgba(255,148,22,.16), transparent 75%); }
html[data-theme="light"] .site-header, html[data-theme="light"] .filters.is-stuck { background: rgba(255,255,255,.86); }
html[data-theme="light"] .ticker { background: #ffffff; }
html[data-theme="light"] .stat, html[data-theme="light"] a.stat:hover, html[data-theme="light"] a.stat:focus-visible { background: #ffffff; }
html[data-theme="light"] .estate { background: var(--bg); }
html[data-theme="light"] .site-footer { background: #eceef1; }
html[data-theme="light"] .mobile-cta { background: rgba(255,255,255,.94); }
html[data-theme="light"] .map-tools button, html[data-theme="light"] .map-hint, html[data-theme="light"] .map-tip,
html[data-theme="light"] .hl-gate, html[data-theme="light"] .nav-toggle { background: rgba(255,255,255,.92); color: var(--text); border-color: var(--line-hi); }
html[data-theme="light"] .nav-drawer, html[data-theme="light"] .nav-dd-menu { background: #ffffff; border-color: var(--line-hi); }
html[data-theme="light"] .nav-toggle span { background: var(--text); }
html[data-theme="light"] .qcard { background: #ffffff; }
html[data-theme="light"] .q-minimap { background: #eef0f3; border-color: var(--line-hi); }
html[data-theme="light"] .hl-item img, html[data-theme="light"] .hl-noimg { background: #e4e6ea; }
html[data-theme="light"] .select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23121419' stroke-width='1.6' fill='none'/%3E%3C/svg%3E"); }
html[data-theme="light"] .seg button[aria-pressed="true"], html[data-theme="light"] .pk[aria-pressed="true"] { background: #121419 !important; color: #ffffff !important; border-color: #121419 !important; }
html[data-theme="light"] .btn-dark { background: #121419; color: #ffffff; }
html[data-theme="light"] .btn-dark:hover { background: #000; }
html[data-theme="light"] .btn-tg, html[data-theme="light"] .btn-wa:not(.card-wa):not(.q-main) { box-shadow: inset 0 0 0 1px rgba(12,14,20,.28); }
html[data-theme="light"] .new-badge, html[data-theme="light"] .q-tag, html[data-theme="light"] .card-art .q-tag { color: #ffffff !important; }
html[data-theme="light"] .btn-primary, html[data-theme="light"] .chip[aria-pressed="true"] { color: #ffffff; }
html[data-theme="light"] .glitch::before { color: #121419; }
html[data-theme="light"] .card:hover::after { background: linear-gradient(rgba(12,14,20,.3), rgba(12,14,20,.3)) border-box !important; }
html[data-theme="light"] .specs { background: #f5f6f8; }
html[data-theme="light"] .photo-gate { color: #fff; }
/* globe on light: pale sea, grey land, orange sites */
html[data-theme="light"] #beam stop { stop-color: #e67800; }
html[data-theme="light"] .map-card { background: #f7f8fa; }
html[data-theme="light"] .map-card .graticule { stroke: rgba(12,14,20,.08) !important; }
html[data-theme="light"] .map-card .graticule-major { stroke: rgba(12,14,20,.16) !important; }
html[data-theme="light"] .map-card .country, html[data-theme="light"] .map-card .country.tier-active, html[data-theme="light"] .map-card .tops .country.tier-active { fill: #dfe2e7 !important; stroke: rgba(12,14,20,.28) !important; }
html[data-theme="light"] .map-card .country.tier-hosting, html[data-theme="light"] .map-card .tops .country.tier-hosting { fill: #a9aeb8 !important; stroke: #6a707c !important; }
html[data-theme="light"] .map-card .country.tier-sites, html[data-theme="light"] .map-card .tops .country.tier-sites { fill: rgba(230,120,0,.6) !important; stroke: #b35c00 !important; }
html[data-theme="light"] .map-card .country.tier-banned, html[data-theme="light"] .map-card .tops .country.tier-banned { fill: rgba(220,40,60,.14) !important; stroke: rgba(200,30,50,.5) !important; }
html[data-theme="light"] .g-back path { opacity: .35; }
html[data-theme="light"] .b-core { fill: #e67800; stroke: #fff; }

/* the header switch */
.theme-switch { display: inline-grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid var(--line-hi); background: transparent; color: var(--text); cursor: pointer; flex: none; }
.theme-switch:hover { background: rgba(127,127,127,.12); }
.theme-switch:focus-visible { outline: 2px solid var(--btc); outline-offset: 2px; }
.theme-switch svg { width: 18px; height: 18px; }
.theme-switch .ts-moon { display: none; }                 /* the icon shows where a tap takes you */
html[data-theme="light"] .theme-switch .ts-moon { display: block; }
html[data-theme="light"] .theme-switch .ts-sun { display: none; }
/* room for the theme switch in mid-width headers */
@media (min-width: 820px) and (max-width: 1120px) {
  .nav a:not(.btn) { padding: 10px 8px; letter-spacing: .06em; font-size: 12px; }
  .nav { gap: 2px; }
  .theme-switch { width: 34px; height: 34px; margin: 0 4px; }
}
.site-header .brand { margin-right: 12px; }
/* globe halo + glow layer in the new palette */
.map-frame { filter: none; }
.glow-layer .tier-hosting { fill: #ededf0; opacity: .35; }
.glow-layer .tier-active { fill: #ededf0; opacity: .15; }
html[data-theme="light"] .glow-layer { display: none; }
html[data-theme="light"] .map-card .tops { filter: none; }
html[data-theme="light"] .map-card .country.tier-banned, html[data-theme="light"] .map-card .tops .country.tier-banned { fill: rgba(220,40,60,.07) !important; stroke: rgba(200,30,50,.35) !important; }
html[data-theme="light"] .map-card .country.tier-sites, html[data-theme="light"] .map-card .tops .country.tier-sites { fill: #f0a24a !important; stroke: #b35c00 !important; }
/* alerts block: no yellow / cyan wash */
.alerts-card { background: radial-gradient(80% 110% at 0% 0%, rgba(255,148,22,.07), transparent 60%), var(--panel); }
.alerts-mini { border-color: var(--line-hi); color: var(--text); }
.alerts-mini:hover { background: var(--tint); }
.alerts-points li::before { color: var(--btc); }
.alerts-tg { background: var(--panel-2) !important; border-color: var(--line-hi) !important; box-shadow: none !important; }
html[data-theme="light"] select { background-repeat: no-repeat !important; background-position: right 14px center !important; }
html[data-theme="light"] .alerts-row .select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23121419' stroke-width='1.6' fill='none'/%3E%3C/svg%3E"); }
/* bands that stay dark in the light theme (deliberate contrast strips): dark tokens scoped to them */
html[data-theme="light"] .cta-band {
  --text: #ededf0; --muted: #c4c8d0; --dim: #8d93a0; --bg: #0b0d12; --panel: #0b0f19; --panel-2: #0e1320;
  --line: rgba(255,255,255,.08); --line-hi: rgba(255,255,255,.16); --edge: rgba(255,255,255,.34); --tint: rgba(255,255,255,.07);
  --cyan: #ededf0; --btc: #ff9416; color: var(--text);
}
/* light globe backdrop: a plotting-table look (soft centre light, faint graphite grid) so the space isn't empty */
html[data-theme="light"] .map-card {
  background:
    radial-gradient(70% 75% at 50% 48%, rgba(255,255,255,.95), rgba(255,255,255,0) 70%),
    radial-gradient(120% 100% at 50% 50%, transparent 55%, rgba(12,14,20,.06)),
    linear-gradient(rgba(12,14,20,.06) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(90deg, rgba(12,14,20,.06) 1px, transparent 1px) 0 0 / 28px 28px,
    #eceef2 !important;
}
/* Instagram: no rainbow gradient, a neutral outline like the other third-party buttons */
.btn-ig { background: transparent !important; color: var(--text) !important; box-shadow: inset 0 0 0 1px var(--edge); }
.btn-ig:hover { background: var(--tint) !important; filter: none !important; }
/* listing popup: one accent for the location, whatever the deal type */
dialog.qmodal, dialog.qmodal:has(.q-badge.svc-hosting), dialog.qmodal:has(.q-badge.svc-sale),
dialog.qmodal:has(.q-badge.svc-lease), dialog.qmodal:has(.q-badge.svc-both) { --svc: #ff9416; --svc-a: rgba(255,148,22,.26); --svc-b: rgba(255,148,22,.06); }
.q-loc { color: var(--dim); }
.q-loc-text { background: var(--panel-2) !important; border-color: var(--line-hi) !important; }
.q-minimap { border-color: var(--line-hi) !important; }
.mm-grid { stroke: rgba(255,255,255,.07); }
/* light: the mini map becomes a pale map with graphite borders */
html[data-theme="light"] dialog.qmodal { --svc: #e67800; --svc-a: rgba(230,120,0,.22); }
html[data-theme="light"] .q-minimap { background: #eceef2 !important; }
html[data-theme="light"] .mm-land { fill: #ffffff !important; stroke: rgba(12,14,20,.22) !important; }
html[data-theme="light"] .mm-grid { stroke: rgba(12,14,20,.06); }
html[data-theme="light"] .mm-dot { fill: #ffffff; }
.svc-txt, .svc-txt.svc-sale, .svc-txt.svc-lease, .svc-txt.svc-hosting, .svc-txt.svc-both { color: var(--text) !important; }
/* popup map: the listing's state / country outlined in our orange (both themes) */
.mm-home { fill: rgba(255,148,22,.10); stroke: #ff9416; stroke-width: 1.8; stroke-linejoin: round; }
html[data-theme="light"] .mm-home { fill: rgba(230,120,0,.10); stroke: #e67800; }
.mm-target { stroke: #ff9416 !important; stroke-width: 1.8; }
/* Listings desk: one accent on every tab (no yellow / blue / cyan per desk) */
html[data-page] .desk-hero h1 em { color: var(--btc) !important; }
.dt, .dt-hosting, .dt-lease, .dt-buy, .dt-list { --dc: var(--btc); }
.dt[aria-selected="true"] { color: #0a0500; }
html[data-desk] .desk-form .btn-primary { background: var(--btc) !important; color: #0a0500 !important; }
html[data-theme="light"] .dt[aria-selected="true"], html[data-theme="light"][data-desk] .desk-form .btn-primary { color: #ffffff !important; }
.clear-filters { border-color: var(--line-hi); color: var(--text); }
.clear-filters:hover { background: var(--tint); border-color: var(--text); color: var(--text); }

/* wider layout on desktop: 1240 → 1440px content column (1640px on very wide screens) */
@media (min-width: 1400px) { :root { --max: 1440px; --gutter: 40px; } }
/* very wide screens: 1640px and 4 cards per row (each card about as wide as before) */
@media (min-width: 1760px) { :root { --max: 1640px; } .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
/* About: warm glow instead of cyan / yellow; cards on the one accent */
.about-hero::after { background: radial-gradient(closest-side, rgba(255,148,22,.14), transparent 75%); }
html[data-theme="light"] .about-hero::after { background: radial-gradient(closest-side, rgba(255,148,22,.10), transparent 75%); }
.ab-card { --ac: var(--btc) !important; }
.ab-lease .ab-go, .ab-go { color: var(--btc) !important; }
.ab-tag, .ab-lease .ab-tag { color: #0a0500 !important; }
html[data-theme="light"] .ab-tag, html[data-theme="light"] .ab-lease .ab-tag { color: #ffffff !important; }
.ab-owner { background: radial-gradient(80% 140% at 0% 0%, rgba(255,148,22,.08), transparent 60%), var(--panel) !important; border-left-color: var(--btc) !important; }
.ab-owner .ab-tag { --ac: var(--btc); background: var(--btc) !important; }
/* desk box + currency badge: no cyan / green */
.desk-max { background: radial-gradient(90% 110% at 0% 0%, rgba(255,148,22,.07), transparent 60%), var(--panel); }
.currency-note .cn-ico { background: rgba(255,148,22,.14); color: var(--btc); }
/* phones: switch in the slide-out menu instead of the header */
@media (max-width: 819px) { .nav > .theme-switch { display: none; } }
.nd-theme { display: flex; align-items: center; gap: 10px; margin: 8px 16px; padding: 12px 14px; background: transparent; border: 1px solid var(--line-hi); color: var(--text); font: 600 13px var(--mono); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.nd-theme .ndt-dark { display: none; }
html[data-theme="light"] .nd-theme .ndt-dark { display: inline; }
html[data-theme="light"] .nd-theme .ndt-light { display: none; }
@media (min-width: 820px) { .nd-theme { display: none; } }
/* "N highlighted" tag in the country bar: highlighted = orange, like the cards */
.tag.hl { background: var(--btc) !important; color: #0a0500 !important; border-color: var(--btc) !important; box-shadow: none !important; }
html[data-theme="light"] .tag.hl { color: #ffffff !important; }

/* header links: an orange underline grows from the centre on hover; "Highlighted" also glows and grows a little */
.nav a:not(.btn) { position: relative; transition: color .2s, transform .2s, text-shadow .2s; }
.nav a:not(.btn)::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: 4px; height: 2px; background: var(--btc); transition: left .22s ease, right .22s ease; pointer-events: none; }
.nav a:not(.btn):hover::after, .nav a:not(.btn):focus-visible::after { left: 8px; right: 8px; }
.nav .nav-dd-menu a::after { display: none; }   /* dropdown items keep their own hover */
.nav a.nav-hl { display: inline-block; }
.nav a.nav-hl:hover, .nav a.nav-hl:focus-visible { transform: scale(1.08); text-shadow: 0 0 12px rgba(255,148,22,.6), 0 0 2px rgba(255,148,22,.4) !important; }
html[data-theme="light"] .nav a.nav-hl:hover, html[data-theme="light"] .nav a.nav-hl:focus-visible { text-shadow: 0 0 10px rgba(230,120,0,.35) !important; }
@media (prefers-reduced-motion: reduce) { .nav a:not(.btn), .nav a:not(.btn)::after { transition: none; } .nav a.nav-hl:hover { transform: none; } }
.nav > .btn + .theme-switch { margin-left: 8px; }

/* X: neutral outline like Instagram */
.btn-x { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--edge); }
.btn-x:hover { background: var(--tint); }
.btn-x svg { width: 16px; height: 16px; }
.follow-btn.f-x:hover { border-color: var(--text); background: var(--tint); }

/* globe fills its column on wide screens (the 1.35:1 box capped at 680px left a gap before the side panel) */
@media (min-width: 1200px) { .map-shell .map-card { aspect-ratio: auto; height: clamp(560px, 46vw, 780px); max-height: none; } }
/* highlighted side panel: orange edge like the other Highlighted elements */
.hl-rail { border-color: rgba(255,148,22,.45) !important; box-shadow: none !important; }
.follow-btn.f-th:hover { border-color: var(--text); background: var(--tint); }
.follow-btn.f-fb:hover { border-color: var(--text); background: var(--tint); }
.follow-btn.f-li:hover { border-color: var(--text); background: var(--tint); }
.follow-btn.f-rd:hover { border-color: var(--text); background: var(--tint); }

/* deal-flow band: a clean Bitcoin mark, two main actions, a quiet "Follow us" row */
.cta-band::after {
  content: ""; right: clamp(24px, 5vw, 72px); top: 50%; bottom: auto; transform: translateY(-50%);
  width: clamp(160px, 22vw, 300px); aspect-ratio: 1; font-size: 0; -webkit-text-stroke: 0;
  background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><circle cx='32' cy='32' r='30.5' fill='none' stroke='%23ff9416' stroke-width='1.2'/><circle cx='32' cy='32' r='27' fill='%23ff9416' fill-opacity='.06'/><path fill='%23ff9416' d='M46.11 27.441c.636-4.258-2.606-6.547-7.039-8.074l1.438-5.768-3.512-.875-1.4 5.616c-.922-.23-1.87-.447-2.812-.662l1.41-5.653-3.509-.875-1.439 5.766c-.764-.174-1.514-.346-2.242-.527l.004-.018-4.842-1.209-.934 3.75s2.605.597 2.55.634c1.422.355 1.68 1.296 1.636 2.042l-1.638 6.571c.098.025.225.061.365.117l-.37-.092-2.297 9.205c-.174.432-.615 1.08-1.609.834.035.051-2.552-.637-2.552-.637l-1.743 4.019 4.57 1.139c.85.213 1.683.436 2.502.646l-1.453 5.835 3.507.875 1.44-5.772c.957.26 1.887.5 2.797.726L27.504 50.8l3.511.875 1.453-5.823c5.987 1.133 10.49.676 12.384-4.739 1.527-4.36-.076-6.875-3.226-8.515 2.294-.529 4.022-2.038 4.483-5.155zM38.087 38.69c-1.086 4.36-8.426 2.004-10.807 1.412l1.928-7.729c2.38.594 10.011 1.77 8.88 6.317zm1.085-11.312c-.99 3.966-7.1 1.951-9.083 1.457l1.748-7.01c1.983.494 8.367 1.416 7.335 5.553z'/></svg>") center / contain no-repeat; opacity: .32;
  filter: drop-shadow(0 0 28px rgba(255,148,22,.25));
}
html[data-theme="light"] .cta-band::after { opacity: .38; }
@media (max-width: 760px) { .cta-band::after { opacity: .14; right: -30px; } }
.cta-band .hero-cta { flex-wrap: wrap; }
.cta-follow { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 22px; }
.cta-follow-l { font: 600 12px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--dim); margin-right: 6px; }
.cta-follow .follow-btn { min-height: 36px; padding: 0 12px; font-size: 13px; }
.cta-band { background: radial-gradient(80% 120% at 100% 100%, rgba(255,148,22,.10), transparent 60%), radial-gradient(70% 120% at 0% 0%, rgba(255,148,22,.18), transparent 60%), #070910; }
/* header logo: orange glow (was cyan) */
.brand-mark { filter: drop-shadow(0 0 7px rgba(255,148,22,.45)); }
html[data-theme="light"] .brand-mark { filter: drop-shadow(0 0 6px rgba(230,120,0,.35)); }

/* Top miners for this site (listing pop-up) */
.miner-box { border: 1px solid var(--line-hi); padding: 14px 14px 10px; margin: 0 0 18px; }
.mb-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.mb-kicker { font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--btc); }
.mb-meta, .mb-note { font-size: 12px; color: var(--dim); margin: 0; }
.mb-coins { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.mb-coins button { font: 600 12px var(--mono); letter-spacing: .04em; padding: 5px 10px; background: transparent; color: var(--text); border: 1px solid var(--line-hi); cursor: pointer; }
.mb-coins button:hover { border-color: var(--btc); }
.mb-coins button[aria-pressed="true"] { background: var(--btc); border-color: var(--btc); color: #1a0d00; }
.mb-table { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: fixed; }
.mb-table th { font: 500 11px var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--dim); text-align: left; padding: 0 6px 6px; }
.mb-table th:first-child { width: 42%; }
.mb-table td { padding: 8px 6px; border-top: 1px solid var(--line); color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mb-table td:first-child a { color: var(--text); text-decoration: none; }
.mb-table td:first-child a:hover { color: var(--btc); }
.mb-table .r { text-align: right; color: var(--text); font-weight: 600; }
.mb-table tr.mb-best td:first-child { box-shadow: inset 3px 0 0 var(--btc); padding-left: 10px; }
.mb-foot { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-top: 8px; font-size: 12px; color: var(--dim); }
.mb-foot a { color: var(--btc); text-decoration: none; margin-left: 10px; }
.mb-foot a:hover { text-decoration: underline; }
/* site economics under the top-miners table (10 Oct 2026) */
.mb-econ { border-top: 1px solid var(--line-hi); margin-top: 10px; padding-top: 10px; }
.mb-econ-h { font-size: 13px; color: var(--text); font-weight: 600; margin: 0 0 8px; }
.mb-econ-g { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.mb-econ-c { border: 1px solid var(--line); padding: 7px 8px; min-width: 0; }
.mb-econ-c small { display: block; font: 500 10px var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mb-econ-c b { display: block; font-size: 15px; color: var(--text); margin-top: 2px; }
.mb-econ-c.is-loss b { color: #d64545; }
.mb-econ-p { font-size: 12px; color: var(--muted); margin: 8px 0 4px; }
.mb-econ-p b { color: var(--text); }
.mb-econ-a { display: inline-block; font-size: 12px; color: var(--btc); text-decoration: none; margin-top: 2px; }
.mb-econ-a:hover { text-decoration: underline; }
@media (max-width: 560px) { .mb-econ-g { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .mb-table th:nth-child(3), .mb-table td:nth-child(3) { display: none; } .mb-table th:first-child { width: 50%; } }

/* listings filters on phones: country on its own row, size + sort side by side (three in a row got cut off) */
@media (max-width: 600px) {
  .filters #countryFilter { flex: 1 1 100%; }
  .filters #mwFilter, .filters #sortFilter { flex: 1 1 calc(50% - 6px); min-width: 0; }
}

/* phones: the filter bar stays pinned, but compact once it is: the type tabs in one swipeable row and the three
   dropdowns side by side; count, clear, alerts and back-to-top only at the top of the list (they took half the screen) */
@media (max-width: 640px) {
  .filters .seg { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .filters .seg::-webkit-scrollbar { display: none; }
  .filters .seg button { flex: 0 0 auto; white-space: nowrap; }
  /* three dropdowns in one row (short labels from app.js); count + clear + alerts on one small line */
  .filters #countryFilter, .filters #mwFilter, .filters #sortFilter { flex: 1 1 calc(33.33% - 6px) !important; min-width: 0; min-height: 38px; font-size: 12.5px; padding-left: 10px; }
  .filters .result-count { width: auto !important; margin: 0 auto 0 0; font-size: 11px; }
  .filters .clear-filters, .filters .alerts-mini { min-height: 32px; padding: 4px 10px; font-size: 11px; }
  .filters.is-stuck { gap: 6px; padding-top: 6px; padding-bottom: 6px; }
  .filters.is-stuck .seg button { padding-top: 7px; padding-bottom: 7px; }
  .filters.is-stuck #countryFilter, .filters.is-stuck #mwFilter, .filters.is-stuck #sortFilter { flex: 1 1 0; min-width: 0; min-height: 34px; padding-top: 4px; padding-bottom: 4px; font-size: 12px; }
  .filters.is-stuck .result-count, .filters.is-stuck .clear-filters, .filters.is-stuck .alerts-mini, .filters.is-stuck .to-top { display: none !important; }
}
}

/* accounts: guests see "Get verified to inquire" instead of WhatsApp (3 Oct 2026) */
.card-join { flex: 1; }
.q-join-note { margin: 10px 0 0; font-size: 13px; line-height: 1.5; color: var(--dim); }

/* header account entry (3 Oct 2026): Sign in / My profile where the Telegram button was */
.nav a.nav-acct svg { width: 15px; height: 15px; }
.nav-acct-dd .nav-dd-menu { right: 0; left: auto; min-width: 230px; }
.nav-acct-dd .nav-dd-top .dd-caret { border-color: currentColor; }
.na-who { display: grid; gap: 4px; padding: 12px 16px 10px; border-bottom: 1px solid var(--line); }
.na-email { font-size: 12px; color: var(--dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 220px; }
.na-st { font: 600 11px "JetBrains Mono", monospace; letter-spacing: .06em; text-transform: uppercase; }
.na-ok { color: #1f9d55; } .na-wait { color: var(--btc); } .na-todo { color: var(--btc); } .na-no { color: var(--dim); }
.nav-acct-dd .nav-dd-menu a::before { display: none; }
.na-out, .nd-out { display: block; width: 100%; text-align: left; background: none; border: 0; border-top: 1px solid var(--line); padding: 11px 16px; font: 500 12px "JetBrains Mono", monospace; letter-spacing: .06em; text-transform: uppercase; color: var(--dim); cursor: pointer; }
.na-out:hover, .nd-out:hover { color: var(--text); }
.nd-acct { display: grid; padding: 4px 0 10px; margin-bottom: 8px; border-bottom: 1px solid var(--line); }
.nd-acct-h { font: 600 11px "JetBrains Mono", monospace; letter-spacing: .08em; text-transform: uppercase; color: var(--dim); padding: 6px 0 8px; }
.nd-acct a { padding: 9px 0; }
.nd-out { padding-left: 0; }
.nav-acct-dd .nav-dd-menu { background: var(--panel, #0b0f19) !important; backdrop-filter: none !important; box-shadow: 0 14px 34px rgba(12,14,20,.18); }

/* listing buttons by account state (3 Oct 2026) */
.card-tg { flex: 1; }
.card-tg svg { width: 15px; height: 15px; }
.btn.cta-wait { flex: 1; opacity: .85; }

/* ☆ save on listing cards (signed-in members) */
.card { position: relative; }
.card-save { position: absolute; top: 10px; right: 10px; z-index: 3; width: 34px; height: 34px; display: grid; place-items: center; background: rgba(12,14,20,.62); color: #ffffff; border: 1px solid rgba(255,255,255,.35); font-size: 18px; line-height: 1; cursor: pointer; }
.card-save.on { color: #ff9416; border-color: #ff9416; }
.card-save:hover { border-color: #ff9416; }

.desk-acct { padding: 22px 24px; border: 1px solid var(--line-hi); background: var(--panel); }
.desk-acct h3 { margin: 0 0 8px; }
.desk-acct p { color: var(--muted); line-height: 1.6; margin: 0 0 16px; max-width: 62ch; }
@media (max-width: 420px) { .nav a.nav-acct span { font-size: 11px; letter-spacing: .04em; } }

.nav a.nav-acct .na-s { display: none; }
@media (max-width: 1120px) { .nav a.nav-acct .na-l { display: none; } .nav a.nav-acct .na-s { display: inline; } }

/* log in / sign up pop-up (nav.js) */
.cs-login { width: min(440px, calc(100vw - 32px)); padding: 0; border: 1px solid var(--line-hi); background: var(--panel, #0b0f19); color: var(--text); }
.cs-login::backdrop { background: rgba(2,3,8,.6); backdrop-filter: blur(3px); }
.csl-in { position: relative; display: grid; gap: 10px; padding: 28px 26px 22px; }
.csl-in h2 { font-family: "Chakra Petch", sans-serif; text-transform: uppercase; font-size: 24px; margin: 0; }
.csl-lead { color: var(--muted); line-height: 1.55; margin: 0 0 6px; font-size: 14.5px; }
.csl-lead b { color: var(--text); }
.csl-in label { font-size: 13px; font-weight: 600; }
.csl-in input { width: 100%; box-sizing: border-box; background: var(--bg); color: var(--text); border: 1px solid var(--line-hi); padding: 12px; font: 15px "Space Grotesk", sans-serif; }
.csl-in input:focus { outline: 2px solid var(--btc); border-color: transparent; }
.csl-go { width: 100%; justify-content: center; }
.csl-msg { min-height: 1em; margin: 2px 0 0; font-size: 13.5px; line-height: 1.5; }
.csl-msg.ok { color: var(--text); } .csl-msg.err { color: #e5484d; }
.csl-dev { font-size: 12px; }
.csl-fine { color: var(--dim); font-size: 12px; line-height: 1.5; margin: 6px 0 0; }
.csl-x { position: absolute; top: 10px; right: 10px; width: 34px; height: 34px; background: none; border: 1px solid var(--line-hi); color: var(--text); font-size: 20px; cursor: pointer; }

/* locked listing figures (guests and unverified members) */
.specs-lock .spec-v { font-size: 12px; letter-spacing: .04em; color: var(--dim); text-transform: uppercase; }
.specs-lock .spec-v.spec-open { font-size: inherit; letter-spacing: normal; color: var(--text); text-transform: none; }
.card-peek { flex: 1; }

/* pop-ups: one scrollbar only (the window itself doesn't scroll; its content does) */
dialog.modal { overflow: hidden; }
dialog.modal > .modal-in { overflow-y: auto; max-height: calc(100dvh - 24px); }
.miner-box { margin-top: 18px; }

/* About: office map placeholder (Google Maps loads on click) */
.office-map { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 100%; height: 260px; border: 0; cursor: pointer;
  background: var(--panel-2); color: var(--text); font: inherit;
  background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 28px 28px; }
.office-map svg { width: 34px; height: 34px; color: var(--btc); }
.office-map span { font-weight: 600; }
.office-map small { color: var(--dim); font-size: 13px; }
.office-map:hover small, .office-map:focus-visible small { color: var(--btc); }

/* account button: verified badge; log-in pop-up: what a free account gives (3 Oct 2026) */
.nav-acct .na-badge { display: inline-flex; align-items: center; gap: 4px; margin-left: 2px; padding: 2px 7px 2px 3px; background: #140a00; color: #ffb04a; font-size: 10.5px; letter-spacing: .08em; line-height: 1; }
.nav-acct .na-badge svg { width: 15px; height: 15px; color: #ffb04a; }
@media (max-width: 1120px) { .nav-acct .na-badge-t { display: none; } .nav-acct .na-badge { padding: 2px; } }
.na-st.na-reg { color: var(--muted); }
.csl-perks { margin: 14px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.csl-perks b { color: var(--text); }
/* the "verified members" note for regular listings (signed-in, not verified) */
.cs-login .csl-id { margin: 0 0 4px; font: 600 12px/1 "JetBrains Mono", monospace; letter-spacing: .08em; color: var(--dim); }
.cs-login .csl-acts { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }

/* menu: Highlighted is the first item under Listings, in the accent colour (5 Oct 2026) */
.nav-dd-menu a.dd-hl { color: var(--btc); font-weight: 700; }
.nd-links a.dd-hl { color: var(--btc); }
/* "Site listings" (5 Oct 2026): the dropdown's top link in the accent colour, like "Highlighted" used to be */
.nav a.nav-dd-top.nav-hl { display: inline-flex; }
.nav a.nav-dd-top.nav-hl .dd-caret { border-color: currentColor; }

/* homepage: "From the blog" (5 Oct 2026) */
.home-blog .fb-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.fb-all { font-weight: 700; color: var(--btc); text-decoration: none; white-space: nowrap; }
.fb-all:hover { text-decoration: underline; }
.fb-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.fb-card { display: flex; flex-direction: column; background: var(--panel); border: 1px solid var(--line-hi); color: inherit; text-decoration: none; overflow: hidden; transition: border-color .2s, transform .2s, box-shadow .2s; }
.fb-card:hover { border-color: var(--btc); transform: translateY(-3px); box-shadow: 0 16px 36px -24px rgba(0,0,0,.45); }
.fb-img { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--line); }
.fb-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
.fb-card:hover .fb-img img { transform: scale(1.05); }
.fb-new { position: absolute; top: 12px; left: 12px; padding: 5px 9px; font: 700 10.5px/1 "JetBrains Mono", monospace; letter-spacing: .12em; text-transform: uppercase; background: var(--btc); color: #140a00; }
.fb-in { display: flex; flex-direction: column; gap: 10px; padding: 18px 18px 20px; flex: 1; }
.fb-cat { align-self: flex-start; padding: 4px 9px; font: 600 10.5px/1 "JetBrains Mono", monospace; letter-spacing: .12em; text-transform: uppercase; color: var(--btc); border: 1px solid color-mix(in srgb, var(--btc) 45%, transparent); background: color-mix(in srgb, var(--btc) 8%, transparent); }
.fb-card h3 { font-family: "Chakra Petch", sans-serif; text-transform: uppercase; font-size: 19px; line-height: 1.15; margin: 0; }
.fb-card p { margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.55; flex: 1; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.fb-meta { font: 12px "JetBrains Mono", monospace; color: var(--dim); }
.fb-empty { grid-column: 1 / -1; padding: 24px; border: 1px dashed var(--line-hi); color: var(--btc); font-weight: 700; text-decoration: none; text-align: center; }
@media (max-width: 1000px) { .fb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fb-grid .fb-card:nth-child(3) { display: none; } }
@media (max-width: 640px) { .fb-grid { grid-template-columns: 1fr; } .fb-grid .fb-card:nth-child(3) { display: flex; } }
@media (prefers-reduced-motion: reduce) { .fb-card, .fb-img img { transition: none; } }

/* ---------- Country profile inside the country bar (6 Oct 2026): score, price, power mix, mining status, board ---------- */
.cp { flex: 1 1 100%; display: grid; gap: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.cp-wait { color: var(--dim); font: 12px var(--mono); }
.cp-k { display: block; font: 600 10.5px var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--dim); }
.cp-score { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.cp-total { --v: 0; position: relative; width: 92px; height: 92px; flex: none; border-radius: 50%; display: grid; place-content: center; text-align: center;
  background: radial-gradient(closest-side, var(--panel, #0b0f19) 78%, transparent 79% 100%), conic-gradient(var(--btc) calc(var(--v) * 1%), var(--line-hi) 0); }
.cp-total b { font: 700 32px/1 var(--display); color: var(--text); }
.cp-total small { font: 11px var(--mono); color: var(--dim); }
.cp-score-txt { flex: 1 1 300px; min-width: 0; display: grid; gap: 6px; }
.cp-score-txt strong { font: 700 18px var(--display); text-transform: uppercase; color: var(--text); }
.cp-parts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 28px; max-width: 760px; }
.cp-part { display: grid; grid-template-columns: minmax(0, 1fr) 90px 44px; align-items: center; gap: 10px; font-size: 13px; color: var(--muted); }
.cp-part i { display: block; height: 6px; background: var(--line-hi); border-radius: 3px; overflow: hidden; }
.cp-part em { display: block; height: 100%; background: var(--btc); border-radius: 0 3px 3px 0; }
.cp-part b { font: 600 12.5px var(--mono); color: var(--text); text-align: right; }
.cp-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.cp-card { min-width: 0; padding: 14px 15px; border: 1px solid var(--line); background: var(--tint, rgba(255,255,255,.03)); display: grid; gap: 6px; align-content: start; }
.cp-big { font: 700 26px/1.1 var(--display); color: var(--text); }
.cp-big small { font: 500 13px var(--mono); color: var(--dim); margin-left: 2px; }
.cp-big.cp-na { font-size: 17px; color: var(--muted); }
.cp-sub { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--muted); }
.cp-dim { color: var(--dim); }
.cp-bar { display: flex; gap: 2px; height: 10px; margin: 2px 0; }
.cp-bar span:first-child { border-radius: 4px 0 0 4px; } .cp-bar span:last-child { border-radius: 0 4px 4px 0; }
.cp-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 3px 10px; font-size: 12px; color: var(--muted); }
.cp-legend li { display: inline-flex; align-items: center; gap: 5px; }
.cp-legend i { width: 9px; height: 9px; border-radius: 2px; }
.cp-legend b { color: var(--text); font-weight: 600; }
/* mix: orange for hydro / wind & solar, neutrals for the rest (one-accent site look) */
.cp .m0 { background: #c4c8d0; } .cp .m1 { background: #7d8391; } .cp .m2 { background: #ff9416; } .cp .m3 { background: #ffc27a; } .cp .m4 { background: #4a505c; }
html[data-theme="light"] .cp .m0 { background: #3a3f4b; } html[data-theme="light"] .cp .m1 { background: #8d93a0; } html[data-theme="light"] .cp .m2 { background: #e07a00; }
html[data-theme="light"] .cp .m3 { background: #ffbe6e; } html[data-theme="light"] .cp .m4 { background: #c9ccd3; }
.cp-status { justify-self: start; padding: 5px 10px; font: 700 13px var(--mono); letter-spacing: .04em; text-transform: uppercase; border: 1px solid currentColor; }
.cp-status.s-legal { color: var(--text); }
.cp-status.s-regulated { color: var(--btc); }
.cp-status.s-restricted, .cp-status.s-unclear { color: #d0293b; border-style: dashed; }
.cp-status.s-banned { color: #fff; background: #d0293b; border-color: #d0293b; }
html[data-theme="light"] .cp-status.s-regulated { color: #b35c00; }
.cp-how { font-size: 12.5px; color: var(--dim); }
.cp-how summary { cursor: pointer; list-style: none; }
.cp-how summary::-webkit-details-marker { display: none; }
.cp-how summary::before { content: "ⓘ "; color: var(--btc); }
.cp-how a { color: var(--muted); text-decoration: underline; text-underline-offset: 2px; }
.cp-how p { margin: 8px 0 0; max-width: 100ch; line-height: 1.55; color: var(--muted); }
@media (max-width: 1100px) { .cp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .cp-grid, .cp-parts { grid-template-columns: 1fr; }
  .cp-total { width: 76px; height: 76px; } .cp-total b { font-size: 26px; }
  .cp-part { grid-template-columns: minmax(0, 1fr) 70px 40px; }
}

/* stock category photos on listing cards are labelled (audit LEG-6, 10 Oct 2026) */
.illus { position: absolute; right: 10px; top: 10px; z-index: 2; font: 600 10px/1 var(--mono, monospace); letter-spacing: .08em; text-transform: uppercase; color: #fff; background: rgba(4,5,10,.62); padding: 5px 7px; pointer-events: none; }

/* hero with the globe image (toolbox, about), 10 Oct 2026: copy left, globe right, space.js debris behind it */
.tb-hero .wrap { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 24px; align-items: center; }
/* the live globe (hero-globe.js) reuses the home map's styles via .map-card, minus the frame */
html .tb-globe.map-card, html[data-theme] .tb-globe.map-card { position: relative; display: block; aspect-ratio: 1.15 / 1; height: auto; min-height: 0; max-height: none; overflow: visible; background-image: none !important; background-color: transparent !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important; clip-path: none !important; cursor: grab; }
.tb-globe.map-card::before, .tb-globe.map-card::after { display: none !important; }
.tb-globe.map-card:active { cursor: grabbing; }
.tb-globe svg { position: relative; z-index: 1; display: block; width: 100%; height: 100%; overflow: visible; }
.tb-globe .space-layer { z-index: 0; }
.tb-globe .needle { cursor: inherit; }
.tb-hint { position: absolute; left: 50%; bottom: 2%; transform: translateX(-50%); z-index: 2; font: 500 10px var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--dim); pointer-events: none; white-space: nowrap; }
@media (max-width: 900px) { .tb-hero .wrap { grid-template-columns: minmax(0, 1fr); } .tb-globe.map-card { max-width: 480px; width: 100%; margin: 0 auto; height: auto; aspect-ratio: 1.15 / 1; } }
.tb-hero .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tb-hero .hero-cta { margin-top: 30px; }   /* breathing room between the intro and the buttons */

/* centred page headers on phones (10 Oct 2026): eyebrow, headline, intro and buttons of page and section heads.
   The big animated heroes (home, About, Toolbox, Listings desk) stay left-aligned: they read better that way (user, 10 Oct 2026). */
@media (max-width: 720px) {
  .hb-head, .hb-head .lede, .calc .crumbs, .ev-head, .bl-head, .art-hero,
  .lost-grid > div:first-child, .section-head, .section-head > div, .section-head p { text-align: center; }
  .hb-head .lede, .section-head p, .ev-head p, .bl-head p, .lost-grid > div:first-child > p { margin-left: auto; margin-right: auto; }
  .lost-cta, .lost-legend, .calc-nav { justify-content: center; }
  .section-head { flex-direction: column; align-items: center; justify-content: center; }
  .section-head.fb-head .fb-all { align-self: center; }
}

/* floating header on phones (10 Oct 2026): no bar behind the logo, log-in and menu buttons; they stay pinned and float over the page.
   The buttons keep their own backgrounds; only the logo mark shows (no wordmark). */
@media (max-width: 819px) {
  .site-header, html[data-theme="light"] .site-header, html[data-theme="dark"] .site-header { background: transparent !important; border-bottom: 0 !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .site-header::after, .site-header::before { display: none !important; }
  .site-header .brand-name { display: none; }   /* the logo mark is enough on phones (user, 10 Oct 2026) */
  .site-header .brand-mark { width: 39px; height: 39px; }   /* 15% larger than the desktop 34px */
  .site-header .nav-acct, .site-header .nav-toggle { box-shadow: 0 4px 14px rgba(0, 0, 0, .18); }
  .ticker, html[data-theme="light"] .ticker, html[data-theme="dark"] .ticker { background: transparent !important; border-bottom: 0 !important; box-shadow: none !important; }   /* no band under the floating header */
}

/* Toolbox: groups set apart by an orange label and line, in the dropdown and on /toolbox (10 Oct 2026) */
.nav-dd-menu .dd-group { display: block; margin: 6px 12px 2px; padding: 9px 4px 3px; border-top: 2px solid var(--btc); font: 600 10px var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--btc); }
.nd-links .dd-group { display: block; margin: 10px 0 2px 22px; padding-top: 8px; border-top: 2px solid var(--btc); font: 600 10px var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--btc); }
.tb-h { display: flex; align-items: center; gap: 14px; font-size: 13px !important; margin: 34px 0 14px !important; }
.tb-h::after { content: ""; flex: 1 1 auto; height: 2px; background: linear-gradient(90deg, var(--btc), rgba(255, 148, 22, .15)); }

/* pages that never fill the ticker (only the home page does) show no empty bar */
.ticker:has(.ticker-track:empty) { display: none; }

/* floating header on desktop (10 Oct 2026): no bar at the top of the page; once scrolled, the header becomes a floating glass panel
   inset from the edges, so the links stay readable over the content */
@media (min-width: 820px) {
  .site-header, html[data-theme="light"] .site-header, html[data-theme="dark"] .site-header { background: transparent !important; border-bottom: 0 !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .site-header::after { display: none !important; }
  .site-header .wrap { transition: background .25s ease, box-shadow .25s ease, border-color .25s ease, margin .25s ease, height .25s ease; border: 1px solid transparent; }
  html.is-scrolled .site-header .wrap { margin-top: 8px; height: calc(100% - 12px); width: calc(100% - 2 * var(--gutter)); max-width: calc(var(--max) - 2 * var(--gutter)); padding-left: 16px; padding-right: 8px; border-color: transparent;
    background: rgba(255, 255, 255, .38); backdrop-filter: blur(18px) saturate(180%); -webkit-backdrop-filter: blur(18px) saturate(180%); box-shadow: 0 10px 30px rgba(12, 14, 20, .08); }   /* see-through frosted glass */
  html[data-theme="dark"].is-scrolled .site-header .wrap { background: rgba(11, 13, 18, .42); box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
}

/* recently sold listings (12 Oct 2026): 7 days on the site, then archived */
.sold-badge { position: absolute; top: 44px; right: 10px; z-index: 2; padding: 4px 10px; background: #121419; color: #fff; font: 700 11px var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.card-sold .card-art { filter: grayscale(.85); }
.card-sold .card-art::after { content: ""; position: absolute; inset: 0; background: rgba(18,20,25,.18); pointer-events: none; }
.card-sold .specs .spec-v { color: var(--muted); }
.card-sold .card-date { color: var(--btc); font-weight: 600; }

/* globes that link countries (Toolbox, 404): a country is clickable (14 Oct 2026) */
[data-globe-links] path.country { cursor: pointer; }
[data-globe-links] path.country:hover { filter: brightness(1.08); }

/* country profile next to the globe (14 Oct 2026): on wide screens the picked country's profile sits at the top of the
   right-hand column (above its highlighted sites), which widens a little for it; narrower screens keep it above the listings */
@media (min-width: 1200px) { .map-shell.has-country { grid-template-columns: minmax(0, 1fr) 430px !important; } }
.hl-list > .country-bar.in-rail { display: grid; gap: 12px; margin: 0 0 6px; padding: 12px 10px 14px; clip-path: none; border: 0; border-bottom: 1px solid var(--line); background: transparent; }
.country-bar.in-rail::before { display: none; }
.country-bar.in-rail[hidden] { display: none; }
.in-rail .cb-main { flex: none; }
.in-rail .cb-title h3 { font-size: 24px; }
.in-rail .cb-actions { gap: 8px 12px; }
.in-rail .cb-actions .btn { flex: 1 1 100%; justify-content: center; }
.in-rail .cp { padding-top: 12px; gap: 10px; }
.in-rail .cp-score { gap: 12px; flex-wrap: nowrap; align-items: flex-start; }
.in-rail .cp-total { width: 72px; height: 72px; } .in-rail .cp-total b { font-size: 24px; }
.in-rail .cp-score-txt { flex: 1 1 auto; }
.in-rail .cp-score-txt strong { font-size: 15px; }
.in-rail .cp-parts { grid-template-columns: 1fr; gap: 4px; }
.in-rail .cp-part { grid-template-columns: minmax(0, 1fr) 70px 38px; font-size: 12.5px; gap: 8px; }
.in-rail .cp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.in-rail .cp-card { padding: 10px 11px; }
.in-rail .cp-big { font-size: 21px; }
.in-rail .cp-sub { font-size: 12px; }
.hl-sub { padding: 4px 8px 2px; }

/* phone menu sections (14 Oct 2026): Site listings and Toolbox open on tap, one at a time */
.nd-links .nd-top { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 54px; padding: 0 22px; background: none; border: 0; border-bottom: 1px solid var(--line);
  font: 600 16px var(--display, sans-serif); letter-spacing: .08em; text-transform: uppercase; color: var(--text); text-align: left; cursor: pointer; }
.nd-links .nd-top[aria-expanded="true"] { color: var(--btc); background: var(--tint, rgba(255,255,255,.03)); }
.nd-chev { width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translate(-2px, -2px); transition: transform .2s; flex: none; }
.nd-top[aria-expanded="true"] .nd-chev { transform: rotate(225deg) translate(-2px, -2px); }
.nd-group { background: var(--tint, rgba(255,255,255,.03)); border-bottom: 1px solid var(--line); padding-bottom: 6px; }
.nd-group[hidden] { display: none; }
.nd-group .nd-sub { border-bottom: 0; }
@media (prefers-reduced-motion: reduce) { .nd-chev { transition: none; } }

/* currency picker on the tools (14 Oct 2026): small, sits with the inputs it changes; never in the header */
.fx-pick { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px; font: 600 11px var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--dim); }
.fx-pick select { font: 600 13px var(--mono); letter-spacing: .02em; color: var(--text); background: var(--panel, #fff); border: 1px solid var(--line-hi, #d5d9e0); padding: 7px 30px 7px 10px; min-height: 36px; cursor: pointer;
  appearance: none; -webkit-appearance: none; background-repeat: no-repeat; background-position: right 10px center; background-size: 12px 8px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23e67800' stroke-width='2'/%3E%3C/svg%3E"); }
.fx-pick select:focus-visible { outline: 2px solid var(--btc); outline-offset: 1px; }
.calc-in > .fx-pick { display: flex; justify-content: space-between; padding-bottom: 0; margin-bottom: 4px; border-bottom: 0; }
/* the currency note: source and date of the rate (user, 14 Oct 2026); and the picker as one more field in the board controls */
.fx-pick { flex-wrap: wrap; }
.fx-note { flex: 1 1 100%; font: 400 11.5px/1.45 var(--sans); letter-spacing: 0; text-transform: none; color: var(--dim); }
.fx-note[hidden] { display: none; }
.calc-in > .fx-pick { flex-wrap: wrap; }
.fx-pick.hb-fx { display: grid; gap: 6px; margin: 0; align-content: start; }
.fx-pick.hb-fx select { width: 100%; }
:not(.fx-pick) > .fx-note { grid-column: 1 / -1; flex: 1 1 100%; max-width: none; margin-top: -4px; }

/* ---------- Crypto Dictionary (/dictionary), 14 Oct 2026, v2: by topic, hero with a term of the day, sticky topic sidebar, card grid ---------- */
.dict { padding: 28px 0 70px; }
.dict-hero { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 28px; align-items: stretch; margin-bottom: 34px; }
.dict-hero h1 { margin: 10px 0 12px; font: 700 clamp(44px, 7vw, 84px)/.95 var(--display); text-transform: uppercase; }
.dict-hero h1 em { font-style: normal; color: var(--btc); }
.dict-lede { margin: 0 0 20px; max-width: 60ch; font-size: 17px; line-height: 1.55; color: var(--muted); }
.dict-search input { width: 100%; min-height: 54px; padding: 0 18px 0 48px; font: 16px var(--sans); color: var(--text); background: var(--panel) no-repeat 16px center / 20px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='%23e67800' stroke-width='2.4'/%3E%3Cpath d='M15.5 15.5L21 21' stroke='%23e67800' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E");
  border: 2px solid var(--text); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%); }
.dict-search input:focus-visible { outline: none; border-color: var(--btc); }
.dict-tod { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 26px 26px 24px; color: #f3f4f6; background: #121419;
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%); }
.dict-tod::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: var(--btc); }
.dict-tod-k { font: 600 11px var(--mono); letter-spacing: .16em; text-transform: uppercase; color: #ff9a2e; }
.dict-tod h2 { margin: 0; font: 700 34px/1.05 var(--display); text-transform: uppercase; color: #fff; }
.dict-tod p { margin: 0; font-size: 15.5px; line-height: 1.55; color: #c9ccd3; flex: 1; }
.dict-tod a { align-self: flex-start; font: 600 12px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: #ff9a2e; text-decoration: none; }
.dict-tod a:hover { text-decoration: underline; }
.dict-body { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 34px; align-items: start; }
.dict-side { position: sticky; top: 84px; display: grid; gap: 22px; }
.dict-side-topics { display: grid; gap: 4px; }
.dict-side-topics a { display: flex; justify-content: space-between; gap: 10px; padding: 10px 12px; font: 600 12px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); text-decoration: none; border-left: 3px solid transparent; }
.dict-side-topics a b { font-weight: 600; color: var(--dim); }
.dict-side-topics a:hover { color: var(--text); background: var(--tint, rgba(0,0,0,.03)); }
.dict-side-topics a.is-on { color: var(--text); border-left-color: var(--btc); background: var(--panel); }
.dict-side-topics a.is-on b { color: var(--btc); }
.dict-side-topics a.is-empty { opacity: .4; }
.dict-side-pop { display: flex; flex-wrap: wrap; gap: 6px; }
.dict-side-pop span { flex: 1 1 100%; font: 600 10.5px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--dim); margin-bottom: 2px; }
.dict-side-pop a { padding: 5px 9px; font-size: 13px; color: var(--text); text-decoration: none; background: var(--panel); border: 1px solid var(--line-hi); }
.dict-side-pop a:hover { border-color: var(--btc); color: var(--btc); }
.dict-topic { scroll-margin-top: 90px; margin-bottom: 30px; }
.dict-topic[hidden], .dict-term[hidden] { display: none !important; }
.dict-topic-h { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 2px solid var(--text); }
.dict-ico { display: grid; place-items: center; width: 52px; height: 52px; font-size: 24px; color: #fff; background: var(--btc); clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%); }
.dict-topic-h h2 { margin: 0; font: 700 28px/1.1 var(--display); text-transform: uppercase; }
.dict-topic-h p { margin: 2px 0 0; font-size: 14.5px; color: var(--muted); }
.dict-topic-h > b { font: 600 12px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--dim); white-space: nowrap; }
.dict-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.dict-term { scroll-margin-top: 120px; display: flex; flex-direction: column; gap: 6px; padding: 12px 14px 11px; background: var(--panel); border: 1px solid var(--line); border-top: 3px solid var(--line-hi); transition: border-color .15s; }
.dict-term:hover { border-top-color: var(--btc); }
.dict-term h3 { margin: 0; font: 700 16px/1.2 var(--display); text-transform: uppercase; letter-spacing: .01em; }
.dict-term h3 a { color: var(--text); text-decoration: none; }
.dict-term h3 a:hover { color: var(--btc); }
.dict-term > p { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.dict-rel { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 9px; font-size: 12.5px; }
.dict-rel span { font: 600 10px var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--dim); }
.dict-rel a { color: var(--text); text-decoration: underline; text-decoration-color: var(--line-hi); text-underline-offset: 3px; }
.dict-rel a:hover { color: var(--btc); text-decoration-color: currentColor; }
.dict-use { margin-top: auto; display: flex; align-items: center; gap: 8px; padding-top: 7px; border-top: 1px dashed var(--line-hi); font-size: 12.5px; line-height: 1.35; color: var(--text); text-decoration: none; }
.dict-use span { flex: none; padding: 3px 7px; font: 700 10px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: #fff; background: var(--btc); }
.dict-use:hover { color: var(--btc); }
.dict-term.is-name { border-top-color: var(--btc); }
.dict-term.is-target { border-color: var(--btc); box-shadow: 0 0 0 3px rgba(230,120,0,.18); }
.dict-none { margin: 0 0 18px; color: var(--muted); }
.dict-foot { margin-top: 10px; font-size: 13.5px; color: var(--dim); }
.dict-foot a, .dict-none a { color: var(--btc); }
/* back to top (15 Oct 2026): a small chamfered orange button that appears once the reader is well into the list (dictionary.js);
   on phones it sits above the sticky bottom bar */
.dict-top { position: fixed; right: var(--gutter); bottom: 24px; z-index: 55; display: grid; place-items: center; width: 42px; height: 42px; padding: 0;
  color: #fff; background: var(--btc); border: 0; cursor: pointer; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .2s, transform .2s, visibility 0s .2s, background-color .15s; }
.dict-top.is-on { opacity: 1; visibility: visible; transform: none; transition: opacity .2s, transform .2s, visibility 0s, background-color .15s; }
.dict-top:hover { background: var(--btc-hi, #ff8a0a); }
.dict-top:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; clip-path: none; }
.dict-top svg { width: 18px; height: 18px; }
.dict-hero h1:focus { outline: none; }
@media (max-width: 767px) { .dict-top { bottom: calc(84px + env(safe-area-inset-bottom)); width: 40px; height: 40px; } }
@media (prefers-reduced-motion: reduce) { .dict-term, .dict-top, .dict-top.is-on { transition: none; } .dict-top { transform: none; } }
/* compact cards (15 Oct 2026, user: less scrolling): 3 columns on wide screens, 2 on mid-size screens and tablets, 1 on phones */
@media (max-width: 1100px) { .dict-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .dict-grid { grid-template-columns: 1fr; gap: 8px; } .dict-term { padding: 11px 12px 10px; gap: 5px; } .dict-topic { margin-bottom: 24px; } }
@media (max-width: 860px) {
  .dict-hero { grid-template-columns: 1fr; }
  .dict-body { grid-template-columns: 1fr; gap: 14px; }
  .dict-side { top: 56px; z-index: 5; gap: 0; margin: 0 -16px; padding: 8px 16px; background: var(--bg); border-bottom: 1px solid var(--line); }
  .dict-side-topics { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
  .dict-side-topics a { flex: none; padding: 8px 11px; border: 1px solid var(--line-hi); border-left-width: 1px; background: var(--panel); }
  .dict-side-topics a.is-on { border-color: var(--btc); }
  .dict-side-pop { display: none; }
  .dict-topic-h { grid-template-columns: 44px minmax(0, 1fr); } .dict-topic-h > b { display: none; } .dict-ico { width: 44px; height: 44px; font-size: 20px; }
  .dict-topic { scroll-margin-top: 120px; } .dict-term { scroll-margin-top: 150px; }
}

/* phones (15 Oct 2026): no empty strip under the header (the 64px hero top padding is for desktop), and the Toolbox tools
   two per row with a short description so the list doesn't run on forever */
@media (max-width: 640px) {
  .hero, .about-hero { padding-top: 22px; }
  .wrap .calc-hub { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 20px; }
  .calc-hub .calc-card { padding: 14px 12px 12px; gap: 6px; }
  .calc-hub .calc-card h2 { font-size: 16px; line-height: 1.15; }
  .calc-hub .calc-card p { font-size: 12.5px; line-height: 1.4; max-height: 4.2em; align-self: start; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .calc-hub .calc-card span { font-size: 12.5px; }
}
/* "Sign up free to view" (15 Oct 2026): orange outline (fills orange on hover), so the solid orange "Ask on Telegram" stays the main action */
.btn.card-join:not(.cta-wait) { background: transparent; color: var(--btc); border: 2px solid var(--btc); box-shadow: none; }
.btn.card-join:not(.cta-wait):hover, .btn.card-join:not(.cta-wait):focus-visible { background: var(--btc); color: #fff; }

/* Toolbox on phones (15 Oct 2026): the globe becomes a faded, slowly turning backdrop behind the intro instead of a block
   of its own (it cost a full screen of scrolling); touches pass through it, so it never gets in the way of scrolling */
@media (max-width: 900px) {
  .tb-hero .wrap { position: relative; }
  .tb-hero .tb-copy { position: relative; z-index: 1; }
  html .tb-hero .tb-globe.map-card, html[data-theme] .tb-hero .tb-globe.map-card {
    position: absolute; z-index: 0; top: -30px; right: -38%; width: 105%; max-width: none; margin: 0;
    opacity: .2; pointer-events: none; -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 45%, transparent 72%); mask-image: radial-gradient(circle at 50% 50%, #000 45%, transparent 72%);
  }
  .tb-hero .tb-hint { display: none; }
}

/* page globes (15 Oct 2026): calculators, ASIC Board and Coin Board get the Toolbox's faded globe behind their heading, each
   turned to a different region (scripts/add_page_globes.py). It sits under all content (the wrap is its own stacking layer)
   and ignores the pointer. */
main.hb > .wrap { position: relative; isolation: isolate; }
html .pg-globe.tb-globe.map-card, html[data-theme] .pg-globe.tb-globe.map-card {
  position: absolute; z-index: -1; top: -70px; right: -90px; width: 600px; max-width: none; margin: 0; aspect-ratio: 1.15 / 1;
  opacity: .26; pointer-events: none;
  -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 42%, transparent 70%); mask-image: radial-gradient(circle at 50% 50%, #000 42%, transparent 70%);
}
.pg-globe .tb-hint { display: none; }
@media (max-width: 900px) {
  html .pg-globe.tb-globe.map-card, html[data-theme] .pg-globe.tb-globe.map-card { top: -40px; right: -42%; width: 110%; opacity: .2; }
}
/* phones: the header floats over the page, so the page starts right under it */
@media (max-width: 640px) {
  .hero, .about-hero { padding-top: 10px; }
  main.hb, main.ev, main.dict { padding-top: 12px; }
}
/* the page globe must never widen the page on phones (15 Oct 2026: the ASIC Board could be dragged sideways); clip, not hidden,
   so the calculators' sticky input panel keeps working */
main.hb { overflow-x: clip; }
@supports not (overflow: clip) { main.hb > .wrap { overflow-x: hidden; } }

/* home page (15 Oct 2026) ------------------------------------------------------------------------------------------------
   1) the map section stays hidden until asked for (Explore the map, Map buttons, menu /#map, Toolbox globe /#country-NNN) */
html:not(.show-map) #map { display: none; }
/* 2) the hero gets the faded, turning globe on the right of the headline */
.hero .wrap { position: relative; isolation: isolate; }
html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { top: -60px; right: -60px; width: 660px; opacity: .34; }
@media (max-width: 900px) {
  html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { top: -30px; right: -45%; width: 110%; opacity: .2; }
}
/* 3) listings on phones: two compact cards per row */
@media (max-width: 639px) {
  .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .grid .card-art { height: 108px; }
  .grid .card-art .card-mw { left: 9px; right: 9px; bottom: 8px; font-size: 14px; line-height: 1.08; }
  .grid .card-art .photo-gate, .grid .card-art .card-id, .grid .card-art .illus { display: none; }
  .grid .card-art .plaque { transform: scale(.78); transform-origin: top left; }
  .grid .card-art .q-tag { top: 34px; left: 9px; transform: scale(.82); transform-origin: top left; }
  .grid .card-art .new-badge { transform: scale(.8); transform-origin: top right; }
  .grid .card-body { padding: 9px 9px 10px; gap: 6px; }
  .grid .card-loc { font-size: 9.5px; letter-spacing: .03em; gap: 4px; }
  .grid .card-loc svg { width: 11px; height: 11px; flex: none; }
  .grid .card-date { font-size: 9px; letter-spacing: .04em; margin-top: -2px; }
  .grid .spec { padding: 6px 5px 5px; }
  .grid .spec-v { font-size: 11px; }
  .grid .spec-l { font-size: 7.5px; letter-spacing: .08em; }
  .grid .specs-lock .spec-v { font-size: 9px; letter-spacing: 0; }
  .grid .card-asset { font-size: 11.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-height: 2.7em; }
  .grid .card-broker { display: none; }
  .grid .card-foot { gap: 6px; padding-top: 2px; }
  .grid .card-foot .btn { flex: 1 1 auto; min-height: 34px; padding: 6px 8px; font-size: 10.5px; letter-spacing: .04em; }
  .grid .card-foot .btn svg { width: 13px; height: 13px; }
  .grid .card-foot .btn-line[data-country] { display: none; }   /* the map is a tap away from the menu and the hero */
}

/* 15 Oct 2026: phones: the header bar fits its buttons (42px + 5px each side), no empty strip under it, on every page */
@media (max-width: 819px) { :root { --header-h: 52px; } }
/* the hero globe runs up behind the ticker instead of being cut off at the hero's top edge; the ticker is frosted glass over it */
.hero { overflow-x: clip; overflow-y: visible; }
.ticker { position: relative; z-index: 1; }
html .ticker, html[data-theme="light"] .ticker { background: rgba(255, 255, 255, .5) !important; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
html[data-theme="dark"] .ticker { background: rgba(5, 7, 13, .5) !important; }
@media (max-width: 819px) {
  html .ticker, html[data-theme="light"] .ticker, html[data-theme="dark"] .ticker { background: transparent !important; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
}
@media (max-width: 900px) {
  html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { top: -58px; }
}
/* backdrop globes (15 Oct 2026): debris, satellites, coins and the roadster fly around them (space.js on [data-space]), so the
   edge fade is looser; on the light theme they sit lighter (user: "too dark on light theme") */
html .pg-globe.tb-globe.map-card, html[data-theme] .pg-globe.tb-globe.map-card {
  -webkit-mask-image: radial-gradient(ellipse at 50% 50%, #000 52%, transparent 88%); mask-image: radial-gradient(ellipse at 50% 50%, #000 52%, transparent 88%);
}
html:not([data-theme="dark"]) .pg-globe.tb-globe.map-card { opacity: .17; filter: brightness(1.12) saturate(.85); }
html:not([data-theme="dark"]) .hero-pg.pg-globe.tb-globe.map-card { opacity: .22; }
@media (max-width: 900px) { html:not([data-theme="dark"]) .pg-globe.tb-globe.map-card { opacity: .15; } }
.pg-globe .space-layer { z-index: 0; }
/* home hero globe further right (user, 15 Oct 2026) */
@media (min-width: 901px) { html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { right: -200px; } }
@media (max-width: 900px) { html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { right: -58%; } }
/* light theme: backdrop globes as a pale watermark (user, 15 Oct 2026: "still too dark"): greys lifted, contrast down */
html:not([data-theme="dark"]) .pg-globe.tb-globe.map-card { opacity: .14; filter: contrast(.6) brightness(1.3) saturate(.8); }
html:not([data-theme="dark"]) .hero-pg.pg-globe.tb-globe.map-card { opacity: .18; }
@media (max-width: 900px) { html:not([data-theme="dark"]) .pg-globe.tb-globe.map-card { opacity: .13; } }
/* user, 15 Oct 2026: "badly visible, make it brighter": backdrop globes clearly visible, no paling filter */
html .pg-globe.tb-globe.map-card, html[data-theme] .pg-globe.tb-globe.map-card { filter: none; opacity: .5; }
html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { opacity: .7; }
@media (max-width: 900px) {
  html .pg-globe.tb-globe.map-card, html[data-theme] .pg-globe.tb-globe.map-card { opacity: .32; }
  html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { opacity: .38; }
}
/* middle ground (user, 15 Oct 2026: visible, but still a background) */
html .pg-globe.tb-globe.map-card, html[data-theme] .pg-globe.tb-globe.map-card { opacity: .32; filter: saturate(.85); }
html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { opacity: .42; }
@media (max-width: 900px) {
  html .pg-globe.tb-globe.map-card, html[data-theme] .pg-globe.tb-globe.map-card { opacity: .2; }
  html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { opacity: .24; }
}
/* desktop too (user, 15 Oct 2026): less gap between the header and the page content */
@media (min-width: 641px) {
  .hero, .about-hero { padding-top: 30px; }
  main.hb, main.ev, main.dict { padding-top: 20px; }
}
/* Toolbox: the intro starts at the top instead of centring against the tall globe (less gap under the header) */
@media (min-width: 901px) { .tb-hero .wrap { align-items: start; } .tb-hero .tb-globe.map-card { margin-top: -24px; } }
/* home hero globe (15 Oct 2026): closer to the headline, and a glitch in the headline's style (hero-globe.js times it so it
   never fires together with the headline's) */
@media (min-width: 901px) { html .hero-pg.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card { right: -110px; } }
.hero-pg.is-glitch svg { animation: globeGlitch .34s steps(1) 1; }
@keyframes globeGlitch {
  0%   { transform: translate(-7px, 0) skewX(-3deg); clip-path: inset(14% 0 52% 0); filter: drop-shadow(5px 0 0 var(--btc)) drop-shadow(-5px 0 0 #121419); }
  25%  { transform: translate(6px, 1px); clip-path: inset(58% 0 14% 0); filter: drop-shadow(-4px 0 0 var(--btc)) drop-shadow(4px 0 0 #121419); }
  50%  { transform: translate(-3px, -1px) skewX(2deg); clip-path: inset(32% 0 38% 0); filter: drop-shadow(3px 0 0 var(--btc)); }
  75%  { transform: translate(4px, 0); clip-path: inset(0 0 70% 0); filter: drop-shadow(-3px 0 0 #121419); }
  100% { transform: none; clip-path: none; filter: none; }
}
html[data-theme="dark"] .hero-pg.is-glitch svg { animation-name: globeGlitchDark; }
@keyframes globeGlitchDark {
  0%   { transform: translate(-7px, 0) skewX(-3deg); clip-path: inset(14% 0 52% 0); filter: drop-shadow(5px 0 0 var(--btc)) drop-shadow(-5px 0 0 #fff); }
  25%  { transform: translate(6px, 1px); clip-path: inset(58% 0 14% 0); filter: drop-shadow(-4px 0 0 var(--btc)) drop-shadow(4px 0 0 #fff); }
  50%  { transform: translate(-3px, -1px) skewX(2deg); clip-path: inset(32% 0 38% 0); filter: drop-shadow(3px 0 0 var(--btc)); }
  75%  { transform: translate(4px, 0); clip-path: inset(0 0 70% 0); filter: drop-shadow(-3px 0 0 #fff); }
  100% { transform: none; clip-path: none; filter: none; }
}
@media (prefers-reduced-motion: reduce) { .hero-pg.is-glitch svg { animation: none; } }

/* live home globe (15 Oct 2026): the globe body stays dim like a backdrop, the live data glows at full strength:
   the sites (pins), the energy arcs between them and the night side where the sun is down right now */
html .hero-pg.pg-globe.tb-globe.map-card.is-live, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card.is-live { opacity: 1; }
.hero-pg.is-live svg > .g-back, .hero-pg.is-live svg > .g-ocean, .hero-pg.is-live svg > .graticule, .hero-pg.is-live svg > .tops,
.hero-pg.is-live svg > .glow-layer, .hero-pg.is-live svg > .g-overlay { opacity: .42; }
.hero-pg.is-live svg > .g-atmo { opacity: .85; }
.hero-pg.is-live .space-layer { opacity: .6; }
.hero-pg.is-live .g-night { fill: rgba(18, 20, 25, .13); pointer-events: none; }
html[data-theme="dark"] .hero-pg.is-live .g-night { fill: rgba(0, 0, 0, .42); }
.hero-pg.is-live .needles { opacity: .95; }
.g-arcs { pointer-events: none; }
.g-arcs path { fill: none; stroke-linecap: round; }
.g-arc-base { stroke: #e67800; stroke-width: 1.3; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: 0; animation: arcDraw 2.8s ease-out forwards; }
.g-arc-pulse { stroke: #ff9416; stroke-width: 3; stroke-dasharray: .12 1; stroke-dashoffset: .12; opacity: 0; filter: drop-shadow(0 0 4px rgba(255, 148, 22, .9)); animation: arcPulse 1.7s .8s ease-in-out forwards; }
@keyframes arcDraw { 0% { stroke-dashoffset: 1; opacity: .7; } 40% { stroke-dashoffset: 0; opacity: .7; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes arcPulse { 0% { stroke-dashoffset: .12; opacity: 0; } 12% { opacity: 1; } 85% { opacity: 1; } 100% { stroke-dashoffset: -1; opacity: 0; } }
@media (max-width: 900px) {
  .hero-pg.is-live svg > .g-back, .hero-pg.is-live svg > .g-ocean, .hero-pg.is-live svg > .graticule, .hero-pg.is-live svg > .tops,
  .hero-pg.is-live svg > .glow-layer, .hero-pg.is-live svg > .g-overlay { opacity: .24; }
  .hero-pg.is-live .needles, .hero-pg.is-live .g-arcs { opacity: .55; }
  .hero-pg.is-live .g-night { opacity: .6; }
  .hero-pg.is-live .space-layer { opacity: .35; }
  .hero-pg.is-live svg > .g-atmo { opacity: .5; }
}
/* live globe refinements: a soft terminator (real ones are blurred by the atmosphere), headline stays clear of the globe on
   desktop, and on phones the live layers stay well behind the text */
.hero-pg.is-live .g-night { filter: blur(7px); }
html:not([data-theme="dark"]) .hero-pg.is-live .g-night { fill: rgba(18, 20, 25, .09); }
@media (min-width: 901px) { html .hero-pg.pg-globe.tb-globe.map-card.is-live, html[data-theme] .hero-pg.pg-globe.tb-globe.map-card.is-live { right: -150px; } }
@media (max-width: 900px) {
  .hero-pg.is-live .needles, .hero-pg.is-live .g-arcs { opacity: .3; }
  .hero-pg.is-live .g-night { opacity: .45; }
}

/* cinematic Earth in the home hero (15 Oct 2026, hero-earth.js, WebGL): full strength, no edge mask (the atmosphere fades
   itself), bigger and a little further out; fades in once the map texture is drawn */
html .hero-pg.is-earth.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.is-earth.pg-globe.tb-globe.map-card {
  opacity: 1; filter: none; -webkit-mask-image: none; mask-image: none;
}
@media (min-width: 901px) { html .hero-pg.is-earth.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.is-earth.pg-globe.tb-globe.map-card { width: 780px; top: -110px; right: -175px; } }
.hero-pg .earth-gl { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; display: block; opacity: 0; transition: opacity 1.4s ease; }
.hero-pg.is-ready .earth-gl { opacity: 1; }
.hero-pg.is-earth .space-layer { opacity: .7; }
.hero-pg.is-glitch .earth-gl { animation: globeGlitch .34s steps(1) 1; }
html[data-theme="dark"] .hero-pg.is-glitch .earth-gl { animation-name: globeGlitchDark; }
@media (max-width: 900px) {
  html .hero-pg.is-earth.pg-globe.tb-globe.map-card, html[data-theme] .hero-pg.is-earth.pg-globe.tb-globe.map-card { opacity: .38; top: -50px; right: -48%; width: 118%; }
}
@media (prefers-reduced-motion: reduce) { .hero-pg.is-glitch .earth-gl { animation: none; } .hero-pg .earth-gl { transition: none; } }

/* home hero Earth (15 Oct 2026): the Higgsfield renders (dark: night grid, light: hologram), animated by hero-fx.js.
   Dark: black falls away into the page (screen); light: white falls away (multiply). */
.hero-earth { position: absolute; z-index: -1; top: -95px; right: -140px; width: 700px; aspect-ratio: 1 / 1; pointer-events: none; }
.hero-earth .space-layer { opacity: .65; }
.earth-stage { position: absolute; inset: 0; z-index: 1; transform: perspective(1400px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); }
.earth-img, .earth-fx { position: absolute; inset: 0; width: 100%; height: 100%; animation: earthBreathe 14s ease-in-out infinite alternate; }
.earth-img { display: none; }
html[data-theme="dark"] .earth-img-dark { display: block; }   /* transparent background baked into the image */
html:not([data-theme="dark"]) .earth-img-light { display: block; }
@keyframes earthBreathe { from { transform: scale(1); } to { transform: scale(1.025); } }
@media (max-width: 900px) { .hero-earth { top: -30px; width: var(--earth-size, 58%); right: calc(var(--earth-size, 58vw) * -.1); opacity: 1; } }   /* phones (16 Oct 2026): full colour, behind the headline only, never under the paragraph (hero-fx.js sets --earth-size) */
@media (prefers-reduced-motion: reduce) { .earth-img, .earth-fx { animation: none; } .hero-earth.is-glitch .earth-stage { animation: none; } }
/* phones (16 Oct 2026): the coins and debris get a bigger field than the small globe: over the headline to the left and above,
   never down over the paragraph */
@media (max-width: 900px) {
  .hero-earth .space-layer { inset: -35% auto auto -120%; width: 232%; height: 135%; }   /* a canvas needs an explicit size, insets alone don't stretch it */
  /* light theme: the dark globe fades out toward its left, where the black headline runs over it */
  html:not([data-theme="dark"]) .hero-earth .earth-stage { -webkit-mask-image: linear-gradient(95deg, transparent 22%, rgba(0,0,0,.25) 46%, #000 74%); mask-image: linear-gradient(95deg, transparent 22%, rgba(0,0,0,.25) 46%, #000 74%); }
}
/* light theme (16 Oct 2026): the night render cut out as a solid object (earth-solid), full strength like on dark; the swarm's
   front canvas (near coins, closest debris) sits above the globe */
.hero-earth .space-front { z-index: 2; opacity: .95; }
html:not([data-theme="dark"]) .hero-earth .space-layer:not(.space-front) { opacity: .8; }