/* Miner product page in the store design (owner 2 Nov 2026; miner.js, with home-store.css for the price tag and the
   similar-miner cards). Photo beside the name and today's numbers, a section bar under the header, the sellers as round
   rows (still a sortable table: app.js sorts by the headings), Featured first with their promotions in full.
   Round shapes as on the homepage: pills for every control, 22 px cards, 16 px photo panels. minerprices colours only.
   Not named miner-*.css: blockers with anti-cryptomining lists drop files named like that (2 Nov 2026, the page went unstyled). */

.ms { max-width: 1320px; margin: 0 auto; padding: 0 24px 56px; }
.ms-crumbs .crumbs { margin: 22px 0 16px; }

/* ---------- product hero ---------- */
.ms-hero { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 36px; align-items: start; }
.ms-pic { position: sticky; top: 92px; display: grid; gap: 8px; padding: 8px; border: 1px solid hsl(var(--border)); border-radius: 22px; background: hsl(var(--card)); }
.ms-ph { display: block; padding: 32px; border-radius: 16px; background: #f5f2ec; }
.ms-ph img { display: block; width: 100%; height: 336px; object-fit: contain; mix-blend-mode: multiply; }
.ms-pic p { margin: 0 8px 4px !important; }
.ms-info { min-width: 0; padding-top: 4px; }
.ms-tag { display: inline-flex; align-items: center; height: 30px; padding: 0 14px; border-radius: 999px; background: var(--brand-soft); color: #5536d6; font-size: 13px; font-weight: 700; }
.ms-h1 { margin: 14px 0 0; font-stretch: 100%; font-size: clamp(30px, 3.4vw, 46px); line-height: 1.06; font-weight: 800; letter-spacing: -.035em; text-wrap: balance; color: var(--title); }
.ms-h1::before { display: none !important; }
.ms-h1 .badge { vertical-align: middle; font-size: 12px; letter-spacing: .02em; }
.ms-lead { margin: 12px 0 0; max-width: 62ch; font-size: 16.5px; line-height: 1.55; color: #4b5260; }
.ms-specs { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.ms-specs li { display: inline-flex; align-items: baseline; gap: 6px; height: 36px; padding: 0 14px; border: 1px solid hsl(var(--border)); border-radius: 999px; background: hsl(var(--card)); font-size: 13.5px; line-height: 34px; white-space: nowrap; }
.ms-specs span { color: #5c6371; }
.ms-specs b { font-weight: 700; }

.ms-nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 20px; }
.ms-n { display: flex; flex-direction: column; gap: 3px; min-width: 0; padding: 14px 16px; border: 1px solid hsl(var(--border)) !important; border-radius: 22px !important; background: hsl(var(--card)); }
.ms-n .l { font-size: 13px; font-weight: 600; color: #5c6371; }
.ms-n .v { font-size: 21px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ms-n small { font-size: 12.5px; line-height: 1.35; color: #5c6371; }
.ms-main { border-color: #b8e6d6 !important; background: #eef8f4; }
.ms-main .v { font-size: 30px; color: var(--green-600) !important; }
.ms-main.bad { border-color: #f0cfcb !important; background: #fbeeec; }
.ms-main.bad .v { color: #b43832 !important; }
.ms-info .split { height: 8px; margin: 16px 0 10px; border-radius: 999px; }
.ms-info .split > span { border-radius: 999px; }
.ms-note { margin: 6px 0 0; font-size: 13px; color: #5c6371; }

.ms-buy { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 22px; padding-top: 20px; border-top: 1px solid hsl(var(--border)); }
.ms-price { height: 50px; padding: 0 22px; font-size: 24px; line-height: 50px; }
.ms-price small { font-size: 13px; }
.ms-cta { display: inline-flex; align-items: center; gap: 8px; height: 50px; padding: 0 26px; border-radius: 999px; background: var(--ink); color: #fff; font: 750 16px var(--font); text-decoration: none; }
.ms-cta:hover { background: var(--brand-deep); color: #fff; }
.ms-none { font-weight: 650; color: #4b5260; }
.ms-buy .cmp-tog { height: 42px; padding: 0 16px; border-radius: 999px; font-size: 14px; }
.ms-pay { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: #4b5260; white-space: nowrap; }
.ms-under { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.ms-under .ms-note { margin: 0; }
.ms-pay svg { width: 15px; height: 15px; color: var(--brand-deep); }
.ms-pay input { width: 92px; height: 42px; padding: 0 14px; border: 1px solid #d9d2c3; border-radius: 999px; background: hsl(var(--card)); font: 650 15px var(--font); color: hsl(var(--foreground)); }

/* ---------- section bar: stays under the header ---------- */
.ms-bar { position: sticky; top: 73px; z-index: 20; margin: 34px -24px 0; background: hsl(var(--background) / .96); border-block: 1px solid hsl(var(--border)); backdrop-filter: blur(6px); }
.ms-bar-in { display: flex; gap: 8px; padding: 10px 24px; overflow-x: auto; scrollbar-width: none; }
.ms-bar-in::-webkit-scrollbar { display: none; }
.ms-bar a { display: inline-flex; flex: none; align-items: center; gap: 7px; height: 40px; padding: 0 18px; border: 1px solid hsl(var(--border)); border-radius: 999px; background: hsl(var(--card)); color: hsl(var(--foreground)); font-size: 14.5px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.ms-bar a:hover { border-color: var(--brand-deep); background: var(--brand-soft); color: inherit; }
.ms-bar em, .ms-count { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 7px; border-radius: 999px; background: var(--brand); color: var(--on-brand); font-size: 12.5px; font-style: normal; font-weight: 750; letter-spacing: 0; }
.ms-count { vertical-align: 4px; }

/* ---------- sections ---------- */
.ms-sec { padding-top: 36px; scroll-margin-top: 140px; }
.ms-sec-h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 16px; }
.ms-sec-h h2 { margin: 0; font-size: 26px; font-weight: 800; letter-spacing: -.025em; }
.ms-sec-h h2::before { display: none !important; }
.ms-sec-h > span { font-size: 14px; color: #5c6371; }
.ms-card { padding: 18px 20px; border: 1px solid hsl(var(--border)); border-radius: 22px; background: hsl(var(--card)); }
.ms-card h3 { margin: 0 0 8px; font-size: 16.5px; font-weight: 750; }
.ms-card h3::before { display: none !important; }
.ms-scroll { overflow-x: auto; }
.ms-empty { padding: 36px 24px; border: 1px dashed hsl(var(--border)); border-radius: 22px; text-align: center; color: #4b5260; }
.ms-page .notice { margin: 18px 0 0; border-radius: 16px; }

/* ---------- where to buy: the table drawn as round seller rows ---------- */
.ms-offers, .ms-offers thead, .ms-offers tbody { display: block; }
.ms-offers { width: 100%; border: 0; }
.ms-offers tr { display: grid; grid-template-columns: minmax(0, 1fr) 150px 130px 100px 100px 150px; align-items: center; column-gap: 14px; }
.ms-offers td, .ms-offers th { display: block; min-width: 0; padding: 0; border: 0; background: none; text-align: left; }
.ms-offers .num { text-align: right; }
.ms-offers thead tr { padding: 0 20px 8px; }
.ms-offers th { font-size: 12.5px; font-weight: 650; color: #5c6371; white-space: nowrap; }
.ms-offers th[data-sort] { cursor: pointer; }
.ms-offers th[data-sort]::after { content: " ↕"; color: #a7a3b3; }
.ms-offers th[aria-sort="ascending"]::after { content: " ↑"; color: var(--brand-deep); }
.ms-offers th[aria-sort="descending"]::after { content: " ↓"; color: var(--brand-deep); }
.ms-offers th[data-sort]:hover { color: hsl(var(--foreground)); }
.ms-offers tbody { display: grid; gap: 10px; }
.ms-offers tbody tr { position: relative; padding: 14px 16px 14px 14px; border: 1px solid hsl(var(--border)); border-radius: 22px; background: hsl(var(--card)); }
.ms-offers tbody tr:hover { border-color: #b3a0ff; }
.ms-offers tbody tr > td, .ms-offers tbody tr:hover > td { background: none !important; box-shadow: none !important; }   /* the shared Featured/verified cell tints (theme.css) */
.ms-offers tr.is-feat { border-color: #b8a8ff; background: linear-gradient(90deg, #f6f3ff, hsl(var(--card)) 70%); box-shadow: inset 4px 0 0 var(--brand); }
.ms-seller { display: flex !important; align-items: flex-start; gap: 12px; }
.ms-logo { display: grid; flex: none; place-items: center; width: 48px; height: 48px; overflow: hidden; border: 1px solid hsl(var(--border)); border-radius: 50%; background: #fff; font-size: 18px; font-weight: 800; color: #5536d6; }
.ms-logo img { width: 34px; height: 34px; object-fit: contain; }
.ms-sname { min-width: 0; padding-top: 2px; }
.ms-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ms-badges b { margin-right: 2px; font-size: 16px; font-weight: 750; }
.ms-badges b a { color: inherit; text-decoration: none; }
.ms-badges b a:hover { text-decoration: underline; text-decoration-color: var(--brand); text-underline-offset: 3px; }
.ms-offers .badge { height: 24px; padding: 0 10px; border-radius: 999px; font-size: 10.5px; }
.ms-ship { font-size: 14px; }
.ms-ship::before, .ms-roi::before { display: none; }
.ms-stock small { display: block; margin-top: 3px; font-size: 12px; color: #5c6371; }
.ms-roi { font-size: 14px; font-variant-numeric: tabular-nums; }
.ms-oprice b { font-size: 19px; font-weight: 800; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.ms-oprice small { display: block; font-size: 12px; color: #5c6371; }
.ms-buycell { text-align: right !important; }
.ms-go { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 20px; border-radius: 999px; background: var(--brand); color: var(--on-brand); font-size: 14.5px; font-weight: 750; text-decoration: none; white-space: nowrap; }
.ms-go:hover { background: var(--brand-deep); color: var(--on-brand); }
.ms-go-p { display: none; }
/* promotions in full: every deal as a round label, every perk, then each deal's conditions and end date */
.ms-promos { margin-top: 6px; }
.ms-promos .pm-pills { margin: 0; gap: 6px; }
.ms-promos .pm-pill { display: inline-flex; padding: 4px 12px 4px 9px; border-radius: 999px; font-size: 13px; }
.ms-promos .pm-pill code { border-radius: 999px; padding: 0 8px; }
.ms-promos .pm-perks { margin-top: 6px; font-size: 12.5px; }
.ms-pdet { margin: 6px 0 0; font-size: 12.5px; line-height: 1.45; color: #4b5260; }
.ms-pdet b { font-weight: 650; color: hsl(var(--foreground)); }
.ms-offers .more-opts { margin-top: 8px; }
.ms-offers .more-opts .badge { height: 22px; }

/* ---------- profit, chart, specs ---------- */
.ms-pay-s input { height: 40px; }
.ms-periods { padding: 6px 20px; }
.ms-periods table, .ms-algos { width: 100%; border-collapse: collapse; }
.ms-periods th, .ms-periods td, .ms-algos th, .ms-algos td { padding: 13px 4px; border-bottom: 1px solid hsl(var(--border)); background: none; font-size: 15px; text-align: left; }
.ms-periods tr:last-child > *, .ms-algos tr:last-child > * { border-bottom: 0; }
.ms-periods thead th, .ms-algos thead th { padding-top: 10px; font-size: 12.5px; font-weight: 650; color: #5c6371; }
.ms-periods .num, .ms-algos .num { text-align: right; font-variant-numeric: tabular-nums; }
.ms-periods tbody th { font-weight: 700; }
.ms-periods td b { font-size: 16px; }
.ms-algos th[data-sort] { cursor: pointer; }
.ms-good { color: var(--green-700); font-weight: 700; }
.ms-good.neg { color: #b43832; }
.ms-scroll .ms-algos th, .ms-scroll .ms-algos td { white-space: nowrap; padding-inline: 8px; }
.ms-chart { padding: 20px 20px 14px; }
.ms-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 10px; }
.ms-legend span { display: inline-flex; align-items: center; gap: 7px; }
.ms-legend i { display: inline-block; width: 18px; height: 4px; border-radius: 999px; }
.ms-k-avg { background: var(--green-500); } .ms-k-min { background: var(--brand-deep); }
.ms-specgrid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.ms-spectab > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 2px; border-bottom: 1px solid hsl(var(--border)); font-size: 14.5px; }
.ms-spectab > div:last-child { border-bottom: 0; }
.ms-spectab > div > span:first-child { color: #5c6371; }
.ms-spectab > div > span:last-child { font-weight: 650; text-align: right; }
.ms-side { display: grid; gap: 16px; }
.ms-about { margin: 0; font-size: 14.5px; line-height: 1.65; color: #3b3f48; }
.ms-coins { display: flex; flex-wrap: wrap; gap: 8px; }
.ms-coins a { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px 0 8px; border: 1px solid hsl(var(--border)); border-radius: 999px; color: hsl(var(--foreground)); font-size: 14px; font-weight: 650; text-decoration: none; }
.ms-coins a:hover { border-color: var(--brand-deep); background: var(--brand-soft); }
.ms-coins img { width: 22px; height: 22px; border-radius: 50%; }
.ms-similar { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---------- dark theme ---------- */
:root[data-theme="dark"] .ms-ph { background: #f1eee8; }
:root[data-theme="dark"] .ms-offers .badge.ok { color: #4fd1a5; }
:root[data-theme="dark"] .ms-offers .badge.bad { background: #2c1513; color: #f08b82; }
:root[data-theme="dark"] .ms-offers .badge.warn { background: #2e2410; color: #f2c46d; }
:root[data-theme="dark"] .ms-ship::before, :root[data-theme="dark"] .ms-roi::before { color: #b7bfcb !important; }
:root[data-theme="dark"] .ms-tag { background: #251e45; color: var(--brand-light); }
:root[data-theme="dark"] .ms-lead, :root[data-theme="dark"] .ms-pay, :root[data-theme="dark"] .ms-none, :root[data-theme="dark"] .ms-pdet,
:root[data-theme="dark"] .ms-about, :root[data-theme="dark"] .ms-empty { color: #c3c9d4; }
:root[data-theme="dark"] .ms-specs span, :root[data-theme="dark"] .ms-n .l, :root[data-theme="dark"] .ms-n small, :root[data-theme="dark"] .ms-note,
:root[data-theme="dark"] .ms-sec-h > span, :root[data-theme="dark"] .ms-offers th, :root[data-theme="dark"] .ms-stock small, :root[data-theme="dark"] .ms-oprice small,
:root[data-theme="dark"] .ms-periods thead th, :root[data-theme="dark"] .ms-algos thead th, :root[data-theme="dark"] .ms-spectab > div > span:first-child { color: #b7bfcb; }
:root[data-theme="dark"] .ms-main { border-color: #1f5a4a !important; background: #0f2c25; }
:root[data-theme="dark"] .ms-main .v, :root[data-theme="dark"] .ms-good { color: #4fd1a5 !important; }
:root[data-theme="dark"] .ms-good.neg { color: #f08b82 !important; }
:root[data-theme="dark"] .ms-main.bad { border-color: #5a2a26 !important; background: #2c1513; }
:root[data-theme="dark"] .ms-main.bad .v { color: #f08b82 !important; }
:root[data-theme="dark"] .ms-cta { background: var(--ink-text); color: var(--ink); }
:root[data-theme="dark"] .ms-cta:hover { background: var(--brand-light); color: var(--ink); }
:root[data-theme="dark"] .ms-pay input { border-color: #3a4252; }
:root[data-theme="dark"] .ms-bar a:hover, :root[data-theme="dark"] .ms-coins a:hover { background: #251e45; }
:root[data-theme="dark"] .ms-offers tr.is-feat { border-color: #4a3b8c; background: linear-gradient(90deg, #211a3d, hsl(var(--card)) 70%); }
:root[data-theme="dark"] .ms-logo { border-color: #3a4252; }
:root[data-theme="dark"] .ms-pdet b { color: hsl(var(--foreground)); }

/* ---------- narrower screens ---------- */
@media (max-width: 1240px) {
  .ms-offers tr { grid-template-columns: minmax(0, 1fr) 120px 120px 90px 90px 140px; column-gap: 10px; }
}
@media (max-width: 1100px) {
  .ms-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 950px) {
  .ms-hero { grid-template-columns: 1fr; gap: 20px; }
  .ms-pic { position: static; }
  .ms-ph img { height: 240px; }
  .ms-specgrid { grid-template-columns: 1fr; }
  .ms-similar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* sellers: name and promotions on top, the facts below with the price on the button */
  .ms-offers thead tr { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 0 10px; }
  .ms-offers thead th:not([data-sort]) { display: none; }
  .ms-offers thead th[data-sort] { display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border: 1px solid hsl(var(--border)); border-radius: 999px; background: hsl(var(--card)); font-size: 13.5px; }
  .ms-offers thead th[aria-sort] { border-color: var(--brand-deep); background: var(--brand-soft); color: hsl(var(--foreground)); }
  .ms-offers tbody tr { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "s s s" "h h b" "k r b"; align-items: center; gap: 6px 12px; padding: 14px; }
  .ms-seller { grid-area: s; margin-bottom: 4px; } .ms-ship { grid-area: h; } .ms-stock { grid-area: k; } .ms-roi { grid-area: r; } .ms-buycell { grid-area: b; }
  .ms-ship, .ms-roi { font-size: 13.5px; text-align: left !important; }
  .ms-ship::before, .ms-roi::before { content: attr(data-l) ": "; display: inline; color: #5c6371; }
  .ms-stock small { display: inline; margin: 0 0 0 6px; }
  .ms-oprice { display: none !important; }
  .ms-go { flex-direction: column; gap: 0; height: auto; min-height: 50px; padding: 6px 20px; line-height: 1.2; }
  .ms-go-p { display: block; font-size: 16px; font-weight: 800; }
  .ms-go span { font-size: 12.5px; font-weight: 650; }
  :root[data-theme="dark"] .ms-offers thead th[aria-sort] { background: #251e45; }
}
@media (max-width: 700px) {
  .ms { padding: 0 16px 40px; }
  .ms-crumbs .crumbs { margin: 14px 0 12px; }
  .ms-ph { padding: 18px; } .ms-ph img { height: 190px; }
  .ms-h1 { font-size: 29px; }
  .ms-lead { font-size: 15px; }
  .ms-specs { gap: 6px; }
  .ms-specs li { height: 32px; padding: 0 11px; font-size: 12.5px; line-height: 30px; }
  .ms-nums { gap: 8px; }
  .ms-n { padding: 12px 14px; }
  .ms-n .v { font-size: 18px; } .ms-main .v { font-size: 24px; }
  .ms-buy { gap: 10px; }
  .ms-price { height: 46px; padding: 0 18px; font-size: 21px; line-height: 46px; }
  .ms-cta { flex: 1 1 auto; justify-content: center; height: 46px; padding: 0 18px; font-size: 15px; }
  .ms-pay-t { display: none; }
  .ms-under { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.ms-under .ms-note { margin: 0; }
  .ms-pay input { width: 78px; padding: 0 10px; text-align: center; }
  .ms-bar { margin: 26px -16px 0; }
  .ms-bar-in { padding: 8px 16px; gap: 6px; }
  .ms-bar a { height: 36px; padding: 0 14px; font-size: 13.5px; }
  .ms-sec { padding-top: 28px; }
  .ms-sec-h h2 { font-size: 21px; }
  .ms-card { padding: 14px 16px; }
  .ms-periods { padding: 4px 14px; }
  .ms-periods th, .ms-periods td { padding: 11px 2px; font-size: 14px; }
  .ms-periods td b { font-size: 14.5px; }
  .ms-logo { width: 40px; height: 40px; } .ms-logo img { width: 28px; height: 28px; }
  .ms-badges b { font-size: 15px; }
  .ms-similar { grid-template-columns: 1fr; }
}