/* Restyle (Tim, 21 Oct 2026): restrained buttons (6px radius, consistent heights), typographic prices, report rows that never clash. Loaded last. */
:root { --r-btn: 6px; --r-ctl: 6px; --btn-h: 40px; --btn-h-sm: 32px; }

/* ---- Buttons: primary solid yellow, secondary outline, tertiary text ---- */
.btn, .btn-primary, .btn-secondary, button.chip, .chips button, .pipe-counts button, .area-dd-btn, .bf-filt-btn, .hdr-b, .bf-act,
.cr-chip, .fx-chip, .ab-chip, .letter-tools button, .letter-variants button, .sent-ask button, dialog button, a.gmaps, .hw-toc a, .toast button {
  border-radius: var(--r-btn) !important; letter-spacing: 0; font-weight: 600; box-shadow: none !important; }
.btn { min-height: var(--btn-h) !important; padding: 0 16px; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: background .12s, border-color .12s, color .12s; }
.btn-sm, .rp-list .rp-acts2 .btn, .rp-acts .rp-prim { min-height: var(--btn-h-sm) !important; height: auto; font-size: 13px !important; padding: 0 12px !important; border-radius: var(--r-btn) !important; }
.btn-primary, .btn.btn-primary, a.gmaps { background: var(--accent) !important; color: var(--accent-ink) !important; border: 1px solid var(--accent) !important; }
.btn-primary:hover { filter: brightness(.95); }
.btn-secondary, .btn.btn-secondary, .btn:not(.btn-primary):not(.btn-text), button.chip, .chips button, .pipe-counts button, .bf-filt-btn, .area-dd-btn, .cr-chip, .fx-chip, .ab-chip, .letter-tools button, .letter-variants button, .sent-ask button:not(.btn-primary), .hw-toc a {
  background: transparent !important; color: var(--ink) !important; border: 1px solid var(--line-strong) !important; }
.btn-secondary:hover, .btn:not(.btn-primary):not(.btn-text):hover, .chips button:hover, .hw-toc a:hover { background: var(--card2) !important; }
.btn-text, .btn.btn-text { background: transparent !important; border: 1px solid transparent !important; color: var(--link, var(--ink)) !important; padding: 0 8px !important; }
.btn-text:hover { text-decoration: underline; text-underline-offset: 3px; }
/* active chips / toggles: quiet fill, not a yellow blob */
.chips button[aria-pressed="true"], button.chip[aria-pressed="true"], .chips button.on, button.chip.on, .bf-filt-btn[aria-pressed="true"], .pipe-counts button[aria-pressed="true"], .pipe-counts button.on {
  background: var(--ink) !important; color: var(--card) !important; border-color: var(--ink) !important; }

/* ---- Segmented controls and tabs ---- */
.seg, .seg.basemap, .basemap, #bf-view .ov-seg { border-radius: 8px !important; }
.seg .seg-btn, .basemap button { border-radius: 6px !important; }
.seg-btn[aria-pressed="true"] { background: var(--card) !important; color: var(--ink) !important; box-shadow: 0 1px 2px rgba(0,0,0,.18) !important; }
html[data-theme="dark"] .seg-btn[aria-pressed="true"] { background: var(--card2) !important; }

/* ---- Inputs ---- */
select, .filters select, .filters input[type=search], input[type=search] { border-radius: var(--r-ctl) !important; }

/* ---- Status badges: small, square-ish, consistent ---- */
.rp-chip, .status-pill, .letter-badge, .rag, .sbadge, .need, .ai-tag, .doc-mode, .rp-n, .am-pick, .flow-strip span, .badge, .rm-chip, .os-tag, .added-tag, .rm-rank, .plot-chip, .score-badge {
  border-radius: 4px !important; letter-spacing: .01em; }
.rp-chip { height: 20px; padding: 0 8px; font-size: 11.5px; font-weight: 600; }
.toast { border-radius: 8px !important; }

/* ---- Prices: typography, never a pill ---- */
.pr { display: inline-flex; align-items: baseline; gap: 4px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pr .pr-v { font-weight: 600; color: var(--ink); letter-spacing: -.01em; }
.pr .pr-l { font-size: 11px; font-weight: 500; color: var(--muted); text-transform: lowercase; }
.pr-x { display: block; font-size: 12.5px; color: var(--muted); margin-top: 2.0px; line-height: 1.4; }
.smp-price { background: none !important; padding: 0 !important; border-radius: 0 !important; color: inherit !important; }
.smp-price .pr-v { font-size: 1.05rem; }
.smp-th { align-items: baseline !important; flex-wrap: nowrap !important; }
.smp-th .smp-t { min-width: 0; }
.smp-th .pr { flex: none; margin-left: auto; }
.smp-info-hd .pr { margin-top: 2.0px; } .smp-info-hd .pr .pr-v { font-size: 1.25rem; }
.hw-rep .pr { float: right; margin-left: 8px; } .hw-rep .pr-x { clear: both; }

/* ---- Report rows: icon | title + subtitle | price + status ---- */
.rp-list > .rp-b { grid-template-columns: 32px minmax(0,1fr) auto !important; grid-template-areas: "ic t p" "ic d s" "x x x" !important; column-gap: 12px !important; row-gap: 2.0px !important; }
.rp-list > .rp-b.off { grid-template-areas: "ic t p" "ic d s" "x x x" !important; }
.rp-list > .rp-b.ask { grid-template-columns: 32px minmax(0,1fr) auto !important; grid-template-areas: "ic t p" "ic d d" "x x x" !important; }
.rp-list .rp-price { grid-area: p; justify-self: end; align-self: baseline; }
.rp-list .rp-price .pr-v { font-size: 14px; }
.rp-list .rp-t { grid-area: t; align-self: baseline; }
.rp-list .rp-d { grid-area: d; min-width: 0; color: var(--muted) !important; }
.rp-list .rp-d.rp-test { grid-area: x; margin: 8px 0 0 48px; font-size: 11.5px !important; white-space: normal; }
.rp-list .rp-s { grid-area: s; justify-self: end; max-width: 46vw !important; font-size: 12px !important; }
.rp-list > .rp-b.off .rp-t, .rp-list > .rp-b.off .rp-price .pr-v { color: var(--muted) !important; }
.rp-list > .rp-b.off .rp-why { grid-area: d; }
.rp-list > .rp-b.off { opacity: 1 !important; }
.rp-list .rp-ic { border-radius: 6px !important; }
.rp-list .rp-acts2 { flex-wrap: wrap !important; row-gap: 8px; }
.rp-list .rp-acts2 .btn-text { margin-left: 0; }
.rp-list .rp-scope3.seg { border-radius: 8px !important; }
.rp-list .rp-scope3 .seg-btn { border-radius: 6px !important; }
.rp-grid.rp-list { border-radius: 10px !important; }
.rp-b { border-radius: 10px !important; }
.rp-more { border-radius: var(--r-btn) !important; }
.smp-acts .btn { min-height: var(--btn-h) !important; }
.rp-list > .rp-b.rp-wrap:has(.rp-test) { grid-template-areas: "ic t p" "ic d s" "x x x" "y y y" !important; }
.rp-list .rp-d.rp-test { grid-area: y !important; }
.smp-th { flex-wrap: wrap !important; }
.smp-acts { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; }
.smp-acts .btn { width: 100%; padding: 0 8px; }
.smp-acts .btn-primary:first-child:nth-last-child(3) { grid-column: 1 / -1; }
.smp-acts .btn:only-child { grid-column: 1 / -1; }
.smp-vars { display: flex; flex-wrap: wrap; gap: 8px; }
.smp-vars .btn { min-height: var(--btn-h-sm) !important; font-size: 13px; padding: 0 8px; }
/* ---- Who's it for (branded, compact) + How it works (visual) · Tim, 21 Oct 2026 ---- */
.txt-link { all: unset; cursor: pointer; color: var(--link) !important; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; background: none !important; border: 0 !important; padding: 0 !important; min-height: 0 !important; }
.txt-link:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
.sb-brand { font-size: 11px; letter-spacing: .16em; font-weight: 600; color: var(--brand); }
.smp-info.sb .smp-info-in { padding: 0 0 16px; overflow: hidden auto; }
.sb-band { background: #0a0a0a; display: flex; align-items: center; justify-content: space-between; padding: 8px 12px 8px 16px; border-bottom: 3px solid var(--brand); }
.sb-x { all: unset; cursor: pointer; color: #fff; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 6px; } .sb-x:hover { background: rgba(255,255,255,.1); }
.sb-hero { display: flex; gap: 16px; align-items: center; padding: 16px 16px 8px; }
.sb-cv { flex: none; width: 72px; aspect-ratio: 3 / 4; background: var(--card2); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; display: grid; place-items: center; }
.sb-cv img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.sb-cv.smp-ph img { display: none; } .sb-cv.smp-ph::after { content: ""; width: 40%; height: 50%; border: 2px solid var(--line-strong); border-radius: 2px; }
.sb-ht h3 { margin: 0 0 8px; font-size: 1.2rem; line-height: 1.2; }
.sb-pr { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; } .sb-pr .pr-v { font-size: 1.4rem; font-weight: 600; }
.sb-badge { display: inline-block; font-size: 11px; font-weight: 600; letter-spacing: .03em; padding: 4px 8px; border-radius: 4px; background: var(--accent-soft); color: var(--ink); border: 1px solid var(--line-strong); white-space: nowrap; }
.sb-badge.rv { background: transparent; }
.sb-h { margin: 12px 16px 8px; font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.sb-for { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 16px; }
.sb-chip { display: inline-flex; align-items: center; gap: 8px; padding: 4px 8px; border: 1px solid var(--line-strong); border-radius: 6px; font-size: .88rem; } .sb-chip .ico { width: 16px; height: 16px; color: var(--link); }
.sb-use { margin: 0; padding: 0 16px 0 32px; line-height: 1.45; font-size: .95rem; } .sb-use li { margin: 2.0px 0; }
.sb-not { margin: 8px 16px 0; font-size: .82rem; color: var(--muted); }
.smp-info.sb .smp-acts { padding: 0 16px; margin-top: 16px; }
.sb-how { display: inline-block; margin: 12px 16px 0; font-size: .9rem; }
.hw-hero { background: #0a0a0a; color: var(--card2); border-radius: 10px; padding: 16px 16px 16px; margin-bottom: 16px; border-bottom: 3px solid var(--brand); }
.hw-hero h2 { margin: 8px 0 4px; font-size: 1.6rem; color: #fff; } .hw-hero > p { margin: 0 0 16px; color: #aab3c5; }
.hw-step { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.hw-step li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 8px 4px; background: rgba(255,255,255,.05); border-radius: 8px; }
.hw-si { width: 40px; height: 40px; border-radius: 50%; background: var(--brand); color: #111; display: grid; place-items: center; }
.hw-sn { position: absolute; top: 6px; left: 8px; font-size: 11px; color: #9aa4b8; font-weight: 600; }
.hw-step strong { font-size: .92rem; color: #fff; } .hw-step small { font-size: .74rem; color: #aab3c5; line-height: 1.3; }
@media (max-width: 480px) { .hw-step { grid-template-columns: 1fr 1fr; } }
.hw-h { margin: 16px 0 8px; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.hw-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } @media (min-width: 760px) { .hw-tiles { grid-template-columns: repeat(4, 1fr); } }
.hw-tile { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; gap: 4px; padding: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 8px; color: var(--ink); }
.hw-tile .ico { color: var(--link); width: 22px; height: 22px; } .hw-tile small { color: var(--muted); font-size: .8rem; line-height: 1.3; } .hw-tile:hover { border-color: var(--line-strong); }
.hw-note { font-size: .85rem; color: var(--muted); margin: 8px 0 0; line-height: 1.5; }
.hw-reps2 { display: flex; gap: 8px; overflow-x: auto; padding: 2.0px 2.0px 8px; scroll-snap-type: x mandatory; }
.hw-rc { all: unset; box-sizing: border-box; cursor: pointer; flex: none; width: 132px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 4px; padding: 8px; background: var(--card); border: 1px solid var(--line); border-radius: 8px; color: var(--ink); }
.hw-cv { aspect-ratio: 3 / 4; background: var(--card2); border-radius: 4px; overflow: hidden; display: grid; place-items: center; margin-bottom: 4px; } .hw-cv img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.hw-cv.smp-ph img { display: none; } .hw-cv.smp-ph::after { content: ""; width: 40%; height: 45%; border: 2px solid var(--line-strong); border-radius: 2px; }
.hw-rc strong { font-size: .85rem; line-height: 1.25; } .hw-rc .pr-v { font-size: 1rem; font-weight: 600; } .hw-rc .sb-badge { align-self: flex-start; }
.hw-flow { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; justify-content: space-between; gap: 0; }
.hw-flow li { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 8px; font-size: .78rem; text-align: center; position: relative; }
.hw-flow li .ico { width: 36px; height: 36px; padding: 8px; box-sizing: border-box; border-radius: 50%; border: 2px solid var(--line-strong); background: var(--card); position: relative; z-index: 1; }
.hw-flow li:last-child .ico { background: var(--brand); color: #111; border-color: var(--brand); }
.hw-flow li + li::before { content: ""; position: absolute; top: 18px; right: 50%; width: 100%; height: 2px; background: var(--line-strong); }
.hw-src { display: flex; flex-wrap: wrap; gap: 8px; } .hw-src span { font-size: .78rem; font-weight: 600; padding: 4px 8px; border-radius: 4px; background: var(--card2); border: 1px solid var(--line); color: var(--ink); }
.hw-faqs { border-top: 1px solid var(--line); } .hw-faq { border-bottom: 1px solid var(--line); border-top: 0 !important; padding: 0 !important; }
.hw-faq summary { list-style: none; padding: 12px 32px 12px 0; position: relative; font-weight: 600; cursor: pointer; } .hw-faq summary::-webkit-details-marker { display: none; }
.hw-faq summary::after { content: "+"; position: absolute; right: 4px; top: 10px; font-size: 1.2rem; color: var(--muted); } .hw-faq[open] summary::after { content: "–"; }
.hw-faq p { margin: 0 0 12px !important; color: var(--muted); }
.smp-info.sb .sb-h { margin: 12px 16px 8px !important; } .smp-info.sb .sb-not { margin: 8px 16px 0 !important; }
.smp-cover.smp-ph::after { content: none !important; }
.smp-info.sb .sb-use { padding: 0 16px 0 32px !important; }
