:root {
  --bg: #f5f1e8;            /* warm paper */
  --card: #fdfbf5;
  --ink: #1b2421;           /* green-black ink */
  --muted: #62705f;
  --line: #ddd3bd;          /* hairline */
  --accent: #0b5f52;        /* deep koho green */
  --accent-soft: #e8efe6;
  --gold: #9a7b2d;          /* koa gold */
  --red: #a93c2a;
  --shadow: 0 1px 2px rgba(27, 36, 33, .04), 0 10px 30px rgba(27, 36, 33, .05);
  --radius: 6px;            /* editorial, not bubbly */
  font-size: 16px;
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: Inter, system-ui, sans-serif; line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, .brand-name, .stat b, .score-num, .medal-num {
  font-family: Fraunces, Georgia, serif; font-weight: 600; letter-spacing: -.015em;
}
h1 { font-size: clamp(1.9rem, 3.2vw, 2.6rem); line-height: 1.12; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
.kicker {
  display: block; font-family: Inter, sans-serif; font-size: .72rem;
  font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--gold); margin-bottom: .35rem;
}
/* entrance motion — quiet, fast, off for reduced-motion. NOTE: fill-mode is
   deliberately NOT `both`: a retained `to{transform:none}` resolves to an
   identity matrix that still counts as a transform, making every .card a
   containing block for position:fixed — which silently broke the mobile
   bottom-sheet dropdowns (they anchored to the card, not the viewport). */
.card, .agent-row, .lens, .seg-context { animation: rise .4s cubic-bezier(.2,.7,.3,1); }
.agent-row:nth-child(2) { animation-delay: .04s; }
.agent-row:nth-child(3) { animation-delay: .08s; }
.agent-row:nth-child(4) { animation-delay: .12s; }
.agent-row:nth-child(5) { animation-delay: .16s; }
.agent-row:nth-child(6) { animation-delay: .20s; }
@keyframes rise { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

#topbar {
  display: flex; align-items: center; gap: 1.5rem;
  padding: .7rem 1.4rem; background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 50;
}
#menu-btn { display: none; }
.brand { display: flex; align-items: center; gap: .5rem; }
/* the mark: the score-medallion arc around a chosen (gold) center — koho, to choose */
.brand-glyph { flex: none; }
.brand-glyph .bg-seal { transition: fill .2s; }
.brand:hover .brand-glyph .bg-seal { fill: var(--ink); }
.brand-name { font-size: 1.32rem; color: var(--ink); letter-spacing: .01em; }
#topbar nav { display: flex; gap: 1.25rem; flex-wrap: wrap; align-items: center;
  margin-left: auto;
  font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
#topbar nav a { color: var(--muted); }
#topbar nav a:hover { color: var(--accent); text-decoration: none; }
/* THE conversion path gets a button, not a link — everything funnels here */
#nav-cta { background: var(--gold); color: #fff !important; padding: .42rem .9rem;
  border-radius: 999px; white-space: nowrap;
  transition: background .15s, transform .15s; }
#nav-cta:hover { background: #84671f; transform: translateY(-1px); }

main { max-width: 1080px; margin: 0 auto; padding: 1.4rem 1.2rem 4rem; min-height: 70vh; }

/* home hero — ink duotone, editorial left-set type, paper page below */
.hero {
  /* no photo: the data is the visual. Deep koho ink with a koa-gold radiance
     behind the live proof card — editorial, fast, zero image bytes. */
  text-align: left; padding: 4.6rem 2.2rem 3.4rem; position: relative;
  margin: -1.4rem -1.2rem 1.8rem; overflow: hidden; color: #f3efe4;
  background:
    radial-gradient(620px 420px at 82% 38%, rgba(207, 164, 75, .16), transparent 70%),
    radial-gradient(900px 600px at -10% 110%, rgba(17, 112, 95, .35), transparent 65%),
    linear-gradient(160deg, #0d1f1b 0%, #0e2722 55%, #0a1a16 100%);
  border-bottom: 3px solid var(--gold);
}
.hero .hero-inner { max-width: 1080px; margin: 0 auto; }
.hero .kicker { color: #cfa44b; }
.hero h1 { font-size: clamp(2.1rem, 4.4vw, 3.3rem); margin: 0 0 .7rem;
  color: #f8f5ec; max-width: 14em; }
.hero p.sub { color: #cfd8cd; max-width: 560px; margin: 0 0 1.7rem;
  font-size: 1.04rem; }
.hero .stat-strip { color: #9fb0a2; margin: 2.2rem 0 0; justify-content: flex-start; }
.hero .stat b { color: #f3efe4; }
.hero .searchbox { margin: 0 0 1.4rem; }
.hero .searchbox input { border-color: transparent; }
.hero .cta-row { justify-content: flex-start; }
.hero .cta.secondary { background: rgba(248, 245, 236, .94); }
/* hero: copy left, live proof card right — the bright zone gets a message */
.hero .hero-inner { display: flex; gap: 3rem; align-items: center;
  justify-content: space-between; }
.hero .hero-copy { flex: 1 1 0; min-width: 0; max-width: 620px; }
.hero-trust { color: #cfd8cd; }
.hero-trust b { color: #f0c987; }
.hero-proof { cursor: pointer; flex: none; display: flex; flex-direction: column;
  align-items: center; gap: .1rem; background: var(--card); color: var(--ink);
  border-radius: 14px; border-top: 3px solid var(--gold);
  padding: 1.2rem 1.7rem 1.05rem; text-align: center; min-width: 235px;
  box-shadow: 0 18px 50px rgba(8, 22, 18, .5);
  transition: transform .15s ease, box-shadow .15s ease; }
.hero-proof:hover { text-decoration: none; transform: translateY(-2px);
  box-shadow: 0 22px 60px rgba(8, 22, 18, .55); }
.hero-proof .hp-kicker { font-size: .62rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--gold);
  margin-bottom: .3rem; }
.hero-proof .hp-name { font-family: Fraunces, Georgia, serif;
  font-size: 1.18rem; margin-top: .3rem; }
.hero-proof .hp-stats { margin-top: .25rem; }
.hero-proof .hp-link { color: var(--accent); font-weight: 600; margin-top: .4rem; }
@media (max-width: 1100px) { .hero-proof { display: none; } }

/* anonymized score rows on the landing page — grades, not endorsements */
.anon-row { display: flex; align-items: center; gap: 1.2rem; color: var(--ink); }
.anon-row:hover { text-decoration: none; }
.anon-row .anon-main { display: flex; flex-direction: column; gap: .1rem; }
.anon-row .see-who { margin-left: auto; color: var(--accent); font-weight: 600;
  white-space: nowrap; }
.searchbox { position: relative; max-width: 560px; margin: 0 auto; }
.searchbox input {
  width: 100%; font-size: 1.05rem; padding: .85rem 1.1rem;
  border: 1.5px solid var(--line); border-radius: 14px; background: var(--card);
  box-shadow: var(--shadow); outline: none;
}
.searchbox input:focus { border-color: var(--accent); }
.typeahead {
  position: absolute; left: 0; right: 0; top: 105%; background: var(--card);
  border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow);
  text-align: left; overflow: hidden; z-index: 40;
}
.typeahead a { display: flex; justify-content: space-between; gap: 1rem;
  padding: .55rem .9rem; color: var(--ink); border-bottom: 1px solid var(--line); }
.typeahead a:last-child { border-bottom: none; }
.typeahead a:hover { background: var(--accent-soft); text-decoration: none; }
.typeahead .ta-sub { color: var(--muted); font-size: .85rem; }

.cta-row { display: flex; gap: 1rem; justify-content: center; margin: 1.6rem 0; flex-wrap: wrap; }
.cta {
  display: inline-block; padding: .8rem 1.5rem; border-radius: 12px;
  font-weight: 600; font-size: 1rem; box-shadow: var(--shadow);
}
.cta.primary { background: var(--accent); color: #fff; }
.cta.primary:hover { background: #0a5a51; text-decoration: none; }
.cta.secondary { background: var(--card); color: var(--accent); border: 1.5px solid var(--accent); }
.cta.secondary:hover { background: var(--accent-soft); text-decoration: none; }
/* gold = the conversion action, identical to the header pill */
.cta.gold { background: var(--gold); color: #fff; }
.cta.gold:hover { background: #84671f; text-decoration: none; }

/* numbered how-it-works steps */
.step-num { font-family: Fraunces, Georgia, serif; font-size: 2.1rem;
  line-height: 1; color: var(--gold); display: block; margin-bottom: .35rem; }

.stat-strip { display: flex; gap: 2.4rem; justify-content: center; flex-wrap: wrap;
  margin: 2rem 0; color: var(--muted); font-size: .95rem; }
.stat b { display: block; font-size: 1.7rem; color: var(--ink); }

/* panels — paper sheets with a hairline crown, not floating app cards */
.card {
  background: var(--card); border: 1px solid var(--line);
  border-top: 2px solid var(--ink);
  border-radius: 0 0 var(--radius) var(--radius); box-shadow: var(--shadow);
  padding: 1.2rem 1.4rem; margin-bottom: 1.1rem;
}
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
@media (max-width: 760px) { .grid2, .grid3 { grid-template-columns: 1fr; } }
.muted { color: var(--muted); }
.small { font-size: .85rem; }
h2.sec { margin: 2.2rem 0 .9rem; font-size: 1.5rem; }
/* every table is a ledger: hairlines, aligned figures */
table.data { font-variant-numeric: tabular-nums; }
.stat b, .ar-stats b, .sc-stats b { font-variant-numeric: tabular-nums; }

/* the Koho medallion — arc gauge, color carries the verdict */
.medal { position: relative; display: inline-flex; flex-direction: column;
  align-items: center; min-width: 76px; }
.medal svg { display: block; }
.medal-track { fill: none; stroke: var(--line); stroke-width: 5; }
.medal-arc { fill: none; stroke-width: 5; stroke-linecap: round;
  stroke-dasharray: var(--c); stroke-dashoffset: var(--off);
  animation: arc-in .9s cubic-bezier(.25,.8,.3,1) both; }
@keyframes arc-in { from { stroke-dashoffset: var(--c); } to { stroke-dashoffset: var(--off); } }
.medal-num { position: absolute; top: 34px; left: 50%;
  transform: translate(-50%, -50%); font-size: 1.45rem; line-height: 1;
  font-variant-numeric: tabular-nums; white-space: nowrap; }
/* the denominator, always visible: 9.1 over a small /10 inside the ring */
.of10 { font-style: normal; font-weight: 600; font-size: .44em;
  color: var(--muted); letter-spacing: 0; margin-left: 1px; }
.medal-of10 { position: absolute; top: 46px; left: 50%;
  transform: translateX(-50%); font-size: .55rem; font-weight: 700;
  color: var(--muted); letter-spacing: .03em; line-height: 1; }
.profile-head .medal-of10 { top: 57px; font-size: .62rem; color: #8fa496; }
.medal-lab { font-size: .6rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .1em; color: var(--muted); margin-top: .1rem;
  text-align: center; max-width: 86px; }

/* agent rows */
.agent-row {
  display: flex; gap: 1rem; align-items: center; padding: .85rem 1rem;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  margin-bottom: .6rem;
}
.agent-row:hover { border-color: var(--accent); }
.agent-row .ar-main { flex: 1; min-width: 0; }
.agent-row .ar-name { font-weight: 600; font-size: 1.05rem; }
.agent-row .ar-sub { color: var(--muted); font-size: .85rem; }
.agent-row .ar-stats { display: flex; gap: 1.3rem; font-size: .85rem;
  color: var(--muted); white-space: nowrap; }
.agent-row .ar-stats b { display: block; color: var(--ink); font-size: 1rem; }
.agent-row .ar-stats i.typ { display: block; font-style: normal; font-size: .68rem;
  color: var(--muted); opacity: .8; }
@media (max-width: 760px) { .agent-row { flex-wrap: wrap; } .ar-stats { flex-wrap: wrap; gap: .8rem; } }

/* search console — one coherent panel, aligned grid */
.search-console { padding: 1rem 1.2rem 1.1rem; }
.search-console .sc-top { display: flex; justify-content: space-between;
  align-items: center; gap: 1rem; margin-bottom: .9rem; }
.filter-grid { display: grid; grid-template-columns: repeat(5, 1fr);
  gap: .8rem; align-items: end; }
.filter-grid label { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.flabel { font-size: .68rem; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--gold); white-space: nowrap; }
.results-bar { display: flex; justify-content: space-between; align-items: end;
  gap: 1rem; margin: 1.2rem 0 .9rem; flex-wrap: wrap; }
.results-bar .sortctl { display: flex; flex-direction: column; gap: .3rem;
  min-width: 210px; }
/* ONE ranking-context panel: an optional island-scope action (when the search
   pools all islands — Oʻahu-skewed) + a single on-demand "how are these ranked"
   that also carries the medallion(career)-vs-row(segment) note. Replaces the old
   scattered scope-note / scope-warn / order-why blocks. */
.rank-context { margin: 0 0 1.1rem; }
/* scope action — gold (act on me): narrow an all-islands search to one island */
.rc-scope { padding: .7rem .95rem; margin-bottom: .55rem; color: var(--muted);
  line-height: 1.55; background: #f7ecd9; border-left: 3px solid var(--gold);
  border-radius: 0 8px 8px 0; }
.rc-scope b { color: var(--ink); }
.sw-isles { display: inline-flex; gap: .4rem; flex-wrap: wrap; margin-top: .5rem; }
.chip-btn { background: #fff; border: 1px solid var(--gold); color: var(--gold);
  font-size: .8rem; font-weight: 600; padding: .25rem .7rem; border-radius: 999px;
  cursor: pointer; transition: background .15s, color .15s; }
.chip-btn:hover { background: var(--gold); color: #fff; }
/* "How are these ranked?" — collapsed by default, accent (informational) */
.rc-how > summary { cursor: pointer; list-style: none; color: var(--muted); font-weight: 600; }
.rc-how > summary::-webkit-details-marker { display: none; }
.rc-how > summary::after { content: " ▾"; color: var(--accent); font-weight: 700; }
.rc-how[open] > summary::after { content: " ▴"; }
.rc-how > summary:hover { color: var(--ink); }
.rc-how-body { margin-top: .5rem; padding: .55rem .85rem; line-height: 1.55;
  color: var(--muted); background: var(--accent-soft);
  border-left: 3px solid var(--accent); border-radius: 0 8px 8px 0; }
.rc-how-body b { color: var(--ink); }
.rc-how-body i { font-style: normal; color: var(--ink); font-weight: 600; }
/* in-body divider between the ranking explanation and the medallion/row note */
.rc-rule { display: block; height: 1px; margin: .6rem 0; background: #e2dccb; }

/* legacy filter bar (top/commissions pages) */
.filters { margin-bottom: 1.1rem; }
.filters:not(.search-console) { display: flex; gap: .6rem; flex-wrap: wrap; align-items: end; }
.filters label { display: flex; flex-direction: column; font-size: .75rem;
  color: var(--muted); font-weight: 600; gap: .25rem; }
.filters input {
  padding: .45rem .6rem; border: 1.5px solid var(--line); border-radius: 9px;
  background: var(--card); font-size: .92rem; min-width: 130px;
}

/* ---- custom select ---- */
.ksel { position: relative; min-width: 150px; }
.ksel-btn {
  display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  width: 100%; padding: .5rem .75rem; cursor: pointer;
  border: 1.5px solid var(--line); border-radius: 10px; background: var(--card);
  font: inherit; font-size: .92rem; color: var(--ink); text-align: left;
  transition: border-color .15s, box-shadow .15s;
}
.ksel-btn:hover { border-color: var(--accent); }
/* current value never wraps — ellipsize so the (esp. mobile 2-col) grid stays tidy */
.ksel-cur { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksel.open .ksel-btn { border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(14, 112, 101, .12); }
.ksel-chev { color: var(--muted); transition: transform .18s; flex: none; }
.ksel.open .ksel-chev { transform: rotate(180deg); }
.ksel-menu {
  position: absolute; left: 0; top: calc(100% + 6px); min-width: 100%;
  max-height: 290px; overflow-y: auto; z-index: 60;
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 8px 30px rgba(20, 30, 40, .14); padding: .35rem;
  animation: ksel-in .14s ease-out;
}
@keyframes ksel-in { from { opacity: 0; transform: translateY(-4px); }
                     to { opacity: 1; transform: none; } }
.ksel-menu a {
  display: block; padding: .45rem .65rem; border-radius: 8px;
  color: var(--ink); font-size: .9rem; white-space: nowrap; cursor: pointer;
}
.ksel-menu a:hover { background: var(--accent-soft); text-decoration: none; }
.ksel-menu a.on { background: var(--accent); color: #fff; font-weight: 600; }
/* an active (non-default) filter reads at a glance */
.ksel-btn.set { border-color: var(--accent); background: var(--accent-soft);
  font-weight: 600; }
.ksel-btn.set .ksel-cur { color: var(--accent); }
/* sheet header (mobile only — hidden on desktop where the menu is a dropdown) */
.ksel-head { display: none; }
/* one-tap escape from an over-narrow search */
.filter-reset { font: inherit; font-size: .8rem; font-weight: 600;
  color: var(--accent); background: none; border: none; cursor: pointer;
  padding: .3rem .2rem; white-space: nowrap; }
.filter-reset:hover { text-decoration: underline; }
.empty-results p { margin: 0 0 .9rem; }
.empty-results .cta { display: inline-block; }
.filters .seg-side { display: flex; gap: 0; }
.seg-side button {
  padding: .5rem 1rem; border: 1.5px solid var(--line); background: var(--card);
  font-weight: 600; cursor: pointer; font-size: .92rem;
}
.seg-side button:first-child { border-radius: 9px 0 0 9px; }
.seg-side button:last-child { border-radius: 0 9px 9px 0; }
.seg-side button.on { background: var(--accent); color: #fff; border-color: var(--accent); }

/* profile header */
/* profile masthead — the record opens like a title page: deep seal-green
   panel, gold rule, cream serif name; same language as the home hero */
.profile-head { display: flex; gap: 1.4rem; align-items: center; flex-wrap: nowrap;
  background: linear-gradient(120deg, #0d231e, #123129 55%, #0c211c);
  border: 1px solid #0a1d18; border-top: 2px solid var(--gold); }
/* identity flexes and wraps INTERNALLY; the verdict column is rigid — the
   medallions live top-right and can never be pushed down a row */
.profile-head > div:first-child { flex: 1 1 auto; min-width: 0; }
.profile-head .badges { flex: none; }
.profile-head .kicker { margin-bottom: .3rem; color: #cfa44b; }
.profile-head h1 { margin: 0; font-size: clamp(1.9rem, 3vw, 2.4rem); color: #f8f5ec; }
.profile-head .ph-sub { color: #9fb0a2; margin-top: .15rem; }
.profile-head .ph-sub .muted { color: #8fa496; }
/* medallions read bigger and brighter on the dark panel */
.profile-head .medal { min-width: 92px; }
.profile-head .medal svg { width: 84px; height: 84px; }
.profile-head .medal-num { top: 42px; font-size: 1.7rem; color: #f8f5ec !important; }
.profile-head .medal-lab { color: #8fa496; margin-top: .15rem; }
.profile-head .medal-track { stroke: rgba(245, 241, 232, .16); }
.badges { display: flex; gap: .7rem; margin-left: auto; }
.chips { display: flex; gap: .45rem; flex-wrap: wrap; margin-top: .6rem; }
.chip { background: var(--accent-soft); color: var(--accent); font-size: .78rem;
  font-weight: 600; padding: .2rem .6rem; border-radius: 999px; }
.chip.warn { background: #f7ecd9; color: var(--gold); }

/* "also sold here" tail — agents with a real but too-light local record,
   collapsed so they never read as part of the headline ranking */
.tail-disc { margin-top: 1.1rem; border-top: 1px dashed var(--line); padding-top: .9rem; }
.tail-disc > summary { cursor: pointer; list-style: none; color: var(--muted);
  font-size: .95rem; padding: .55rem .2rem; border-radius: 10px; }
.tail-disc > summary::-webkit-details-marker { display: none; }
.tail-disc > summary::after { content: " ▾"; color: var(--gold); font-weight: 700; }
.tail-disc[open] > summary::after { content: " ▴"; }
.tail-disc > summary:hover { color: var(--ink); }
.tail-disc > summary b { color: var(--ink); }
.tail-disc .td-lead { margin: .2rem .2rem .8rem; }
.td-none { border-top: 3px solid var(--gold); }

/* lens switcher — pick your side of the deal */
.lens-switch-wrap { margin: 1.1rem 0 .4rem; }
.lens-switch-label { font-size: .7rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .09em; color: var(--muted); margin: 0 0 .55rem .1rem; }
.lens-switch { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.lens {
  display: flex; flex-direction: column; gap: .15rem; padding: .9rem 1.2rem;
  background: var(--card); border: 2px dashed var(--line); border-radius: 14px;
  color: var(--ink); box-shadow: var(--shadow);
}
.lens:hover { text-decoration: none; border-style: solid; border-color: var(--accent); }
.lens.buy:hover { border-style: solid; border-color: var(--gold); }
.lens .lens-kicker { font-size: .72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: var(--muted); }
.lens .lens-title { font-family: Fraunces, Georgia, serif; font-size: 1.2rem;
  color: var(--ink); }
.lens .lens-sub { font-size: .82rem; color: var(--muted); }
.lens .lens-cue { font-size: .7rem; font-weight: 600; color: var(--accent); margin-top: .35rem; }
.lens.buy .lens-cue { color: var(--gold); }
.lens.on { border-style: solid; border-color: var(--accent); background: var(--accent-soft); }
.lens.on .lens-kicker { color: var(--accent); }
.lens.on .lens-cue { display: none; }
.lens.buy.on { border-color: var(--gold); background: #f7f0df; }
.lens.buy.on .lens-kicker { color: var(--gold); }
.lens-note { margin: 0 0 1.2rem .2rem; }
@media (max-width: 640px) { .lens-switch { grid-template-columns: 1fr; } }

/* score parts bars */
.partbar { margin: .45rem 0; }
.partbar .pb-lab { display: flex; justify-content: space-between; align-items: baseline;
  font-size: .82rem; color: var(--muted); margin-bottom: .15rem; }
.partbar .pb-track { background: var(--line); height: 8px; border-radius: 5px; }
.partbar .pb-fill { background: var(--accent); height: 8px; border-radius: 5px; }
.pb-tip { border-bottom: 1px dotted #98a39b; cursor: help; }
.pb-tip:focus { outline: none; border-bottom: 1px dotted var(--accent); }
.pb-w { margin-left: .2em; }
.seg-bar { margin: .8rem 0; }
.seg-bar .pb-lab span:first-child { color: var(--ink); font-size: .92rem; }
.seg-bar .pb-sub { margin-top: .2rem; }

/* tables */
table.data { width: 100%; border-collapse: collapse; font-size: .88rem; }
table.data th { text-align: left; color: var(--gold); font-weight: 700;
  border-bottom: 1.5px solid var(--ink); padding: .4rem .5rem; font-size: .72rem;
  text-transform: uppercase; letter-spacing: .09em; }
table.data td { border-bottom: 1px solid var(--line); padding: .5rem .5rem; }
table.data tr:hover td { background: var(--accent-soft); }
.pos { color: #2c6e49; font-weight: 600; }
.neg { color: var(--red); font-weight: 600; }

.chart-box { position: relative; height: 260px; }
.map-box { height: 360px; border-radius: 10px; overflow: hidden; isolation: isolate; }
.legend-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%;
  margin-right: .3rem; vertical-align: baseline; }

/* forms */
form.nice { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: .8rem; }
form.nice label { display: flex; flex-direction: column; font-size: .78rem;
  color: var(--muted); font-weight: 600; gap: .25rem; }
form.nice input, form.nice select, form.nice textarea {
  padding: .5rem .6rem; border: 1.5px solid var(--line); border-radius: 9px;
  font-size: .92rem; background: var(--card); font-family: inherit;
}
form.nice textarea { grid-column: 1 / -1; }
form.nice > button {
  grid-column: 1 / -1; justify-self: start; padding: .6rem 1.4rem;
  background: var(--accent); color: #fff; border: none; border-radius: 10px;
  font-weight: 600; font-size: .95rem; cursor: pointer;
}
.flash-ok { background: var(--accent-soft); color: var(--accent); padding: .6rem 1rem;
  border-radius: 9px; font-weight: 600; }

/* compare */
.cmp-grid { display: grid; gap: 1rem; }

footer { border-top: 1px solid var(--line); background: var(--card); margin-top: 3rem; }
.foot-inner { max-width: 1080px; margin: 0 auto; padding: 1.4rem 1.2rem;
  color: var(--muted); font-size: .8rem; }

.loading { text-align: center; color: var(--muted); padding: 3rem 0; }

/* before-you-hire sheet — a standard card; glyphs and kickers do the talking */
.hire-sheet .hs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2.4rem; }
@media (max-width: 760px) { .hire-sheet .hs-grid { grid-template-columns: 1fr; } }
.hs-kick { font-size: .72rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--muted); margin: .3rem 0 .5rem; }
.hs-good, .hs-probe { list-style: none; margin: 0 0 .4rem; padding: 0; }
.hs-good li, .hs-probe li { position: relative; padding-left: 1.35rem;
  margin: .5rem 0; font-size: .92rem; }
.hs-good li::before { content: "✓"; position: absolute; left: 0;
  color: var(--accent); font-weight: 700; }
.hs-probe li::before { content: "▲"; position: absolute; left: 0;
  color: var(--gold); font-size: .72em; top: .4em; }
.hs-ask { display: block; font-size: .85rem; color: var(--muted);
  font-style: italic; margin-top: .15rem; }
.hs-q { margin: 0 0 1rem; padding-left: 1.25rem; }
.hs-q li { margin: .6rem 0 .75rem; font-size: .92rem; }
.hs-q li::marker { color: var(--gold); font-weight: 700; }
.hs-why { display: block; font-size: .78rem; color: var(--muted);
  font-style: italic; margin-top: .12rem; }

/* search-context bar on profiles */
.seg-context { display: flex; gap: 1.1rem; align-items: center;
  border-left: 4px solid var(--gold); }
.seg-context .sc-main { flex: 1; min-width: 0; }
.seg-context .sc-label { font-size: 1.02rem; }
.seg-context .sc-stats { display: flex; gap: 1.4rem; flex-wrap: wrap;
  margin: .35rem 0; font-size: .92rem; }
.seg-context .sc-stats b { font-size: 1.05rem; }
@media (max-width: 760px) { .seg-context { flex-wrap: wrap; } }

/* agent portal — bespoke lead-review experience */
.portal-head { display: flex; justify-content: space-between; align-items: flex-start;
  gap: 1rem 1.5rem; flex-wrap: wrap; margin-bottom: 1.2rem; }
.portal-head h1 { margin: .1rem 0 .15rem; }
.ph-links { display: flex; gap: 1.1rem; white-space: nowrap; padding-top: 1.4rem; }
.sec2 { font-size: 1.2rem; margin: 0 0 1rem; }
.portal-scores .pf-scores { display: flex; gap: 2rem 2.6rem; flex-wrap: wrap; }
.pf-side { display: flex; gap: 1.1rem; align-items: flex-start; flex: 1 1 320px; min-width: 0; }
.pf-side .medal { flex: none; }
.pf-bars { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .5rem; }
.pf-note { margin: 1.1rem 0 0; }
.portal-how { background: var(--accent-soft); border-color: transparent; }
.how-steps { margin: 0; padding-left: 1.2rem; display: flex; flex-direction: column; gap: .55rem; }
.how-steps li { line-height: 1.5; color: var(--muted); }
.how-steps li b { color: var(--ink); }
.portal-stats { justify-content: flex-start; margin: 1.6rem 0 .4rem; }
/* lead cards */
.lead-card { border-left: 3px solid var(--line); }
.lead-card.lead-awaiting { border-left-color: var(--gold); }
.lead-card.lead-sent { border-left-color: var(--accent); }
.lead-card.lead-declined { opacity: .72; }
.lead-card .lead-head { display: flex; justify-content: space-between;
  align-items: center; gap: 1rem; flex-wrap: wrap; }
.lead-st { font-weight: 600; }
.lead-st-awaiting { background: #f7ecd9; color: var(--gold); }
.lead-st-sent { background: var(--accent-soft); color: var(--accent); }
.lead-st-declined { background: var(--line); color: var(--muted); }
.lead-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: .55rem 1.4rem; margin: .7rem 0 .2rem; }
.lead-grid .ll { display: block; font-size: .7rem; font-weight: 700; letter-spacing: .05em;
  text-transform: uppercase; color: var(--muted); margin-bottom: .1rem; }
.lead-grid b { font-weight: 600; color: var(--ink); }
.lead-cta { margin-top: .7rem; display: inline-block; font-size: .9rem; padding: .55rem 1.1rem; }
.lead-link { display: inline-block; margin-top: .6rem; font-weight: 600; font-size: .88rem; }
.portal-empty { color: var(--muted); }

/* photo band */
.photo-band { position: relative; margin: 1.6rem 0 .4rem; border-radius: 16px;
  overflow: hidden; box-shadow: var(--shadow); }
.photo-band img { width: 100%; height: 240px; object-fit: cover; display: block; }
.photo-band figcaption { position: absolute; left: 0; right: 0; bottom: 0;
  padding: 1.4rem 1.2rem .9rem; color: #fff; font-family: Fraunces, Georgia, serif;
  font-size: 1.15rem;
  background: linear-gradient(0deg, rgba(10,28,34,.72), transparent); }

/* ---- premium polish ---- */
h2.sec { display: flex; align-items: center; gap: .55rem; }
h2.sec::before { content: ""; width: 5px; height: 1.15em; border-radius: 3px;
  background: linear-gradient(180deg, var(--accent), #0a4f63); flex: none; }
.cta, .agent-row, .lens, .ksel-btn, form.nice button {
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s,
              background .15s;
}
.cta:hover, form.nice button:hover { transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(20, 30, 40, .12); }
.agent-row:hover { transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(20, 30, 40, .10); }
.lens:hover { transform: translateY(-1px); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px;
  border-radius: 4px; }
::selection { background: var(--accent-soft); }

/* ---- mobile ---- */
@media (max-width: 760px) {
  :root { font-size: 15px; }
  main { padding: 1rem .85rem 3rem; }
  /* wrap so .nav-search (flex-basis:100%) takes its own row — without this
     the single unwrappable line overflows every page ~145px at 390px */
  #topbar { gap: .8rem; padding: .6rem 1rem; flex-wrap: wrap; }
  #menu-btn {
    display: flex; flex-direction: column; justify-content: center; gap: 4.5px;
    margin-left: auto; width: 42px; height: 38px; padding: 8px 10px;
    background: none; border: 1.5px solid var(--line); border-radius: 9px;
    cursor: pointer;
  }
  #menu-btn span { display: block; height: 2px; border-radius: 2px;
    background: var(--ink); transition: transform .2s, opacity .2s; }
  #menu-btn.x span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
  #menu-btn.x span:nth-child(2) { opacity: 0; }
  #menu-btn.x span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
  #topbar nav {
    display: none; position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; align-items: stretch; gap: 0; background: var(--card);
    border-bottom: 1px solid var(--line); box-shadow: 0 14px 30px rgba(20,30,40,.12);
    padding: .4rem 0; text-align: left;
  }
  #topbar nav.open { display: flex; }
  #topbar nav a { padding: .8rem 1.2rem; font-size: 1rem; color: var(--ink);
    border-bottom: 1px solid var(--line); }
  #topbar nav a:last-child { border-bottom: none; }
  /* in the sheet the CTA reads as a real button, not another row */
  #topbar nav #nav-cta { margin: .55rem 1rem .5rem; padding: .75rem 1rem;
    border-radius: 999px; text-align: center; border-bottom: none; }

  .hero { margin: -1rem -.85rem 1.2rem; padding: 3rem 1rem 2.2rem;
    border-radius: 0 0 18px 18px; }
  .hero h1 { font-size: clamp(1.7rem, 7.5vw, 2.3rem); }
  .hero p.sub { font-size: .92rem; }
  .cta-row { flex-direction: column; align-items: stretch; gap: .6rem; }
  .cta { text-align: center; }
  .stat-strip { gap: 1.2rem; }
  .stat b { font-size: 1.3rem; }

  .profile-head { gap: .8rem; flex-wrap: wrap; } /* phones: stack is correct */
  .profile-head h1 { font-size: 1.5rem; }
  .badges { margin-left: 0; }
  .filters { gap: .5rem; }
  .filters label { flex: 1 1 45%; }
  .filters .seg-side { flex: 1 1 100%; }
  .seg-side button { flex: 1; }
  .ksel { min-width: 0; width: 100%; }

  .agent-row { gap: .7rem; padding: .75rem .8rem; }
  .agent-row .ar-stats { gap: .8rem; font-size: .78rem; width: 100%;
    justify-content: space-between; }
  .agent-row .ar-stats b { font-size: .92rem; }

  table.data { font-size: .8rem; display: block; overflow-x: auto; }
  table.data th, table.data td { padding: .35rem .4rem; }
  .chart-box { height: 220px; }
  .map-box { height: 280px; }
  .lens .lens-title { font-size: 1.05rem; }
  h2.sec { font-size: 1.15rem; }
}

.typ-inline { font-style: normal; font-size: .75rem; color: var(--muted); }

/* sticky row-label column for the compare matrix */
.cmp-table th:first-child, .cmp-table td:first-child {
  position: sticky; left: 0; background: var(--card); z-index: 2;
  min-width: 118px; max-width: 150px;
}

/* desktop filters toggle is invisible — filters always shown */
.filters-toggle { display: none; }
#ksel-backdrop { position: fixed; inset: 0; background: rgba(15, 25, 30, .45);
  z-index: 80; }

/* tablet: five-across gets cramped — go three-across */
@media (min-width: 761px) and (max-width: 1000px) {
  .filter-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 760px) {
  /* filters are ALWAYS visible on mobile — no hide-behind-a-toggle step.
     Two clear columns, every control full-width and big enough to tap. */
  .filter-grid { grid-template-columns: 1fr 1fr; gap: .8rem .6rem; }
  .filter-grid label { width: 100%; }
  .search-console .sc-top { flex-direction: column; align-items: stretch;
    gap: .6rem; margin-bottom: .9rem; }
  .search-console .sc-top .filter-reset { align-self: flex-end; }
  .results-bar { align-items: center; }
  .results-bar .sortctl { min-width: 0; flex: 1; max-width: 260px; }

  /* (the desktop z-index stacking contexts on these filter containers are gated to
     ≥761px — see note there — so the fixed bottom sheet escapes above the backdrop) */

  /* dropdowns present as a true bottom sheet: header pinned, options scroll.
     Scoped to :not([hidden]) — an author `display` would otherwise beat the
     UA [hidden]{display:none} and leave every closed sheet stacked at bottom. */
  .ksel-menu:not([hidden]) {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto;
    display: flex; flex-direction: column; max-height: 72vh; z-index: 90;
    padding: 0; border-radius: 18px 18px 0 0;
    box-shadow: 0 -8px 40px rgba(15, 25, 30, .3);
    animation: ksel-up .2s ease-out;
  }
  .ksel-head { display: flex; align-items: center; justify-content: space-between;
    padding: .95rem 1.1rem .75rem; border-bottom: 1px solid var(--line);
    font-weight: 700; font-size: 1rem; color: var(--ink); }
  .ksel-done { font: inherit; font-weight: 700; font-size: .95rem; color: var(--accent);
    background: none; border: none; padding: .2rem .4rem; cursor: pointer; }
  .ksel-filter { margin: .6rem .8rem .1rem; width: auto; }
  .ksel-opts { flex: 1 1 auto; min-height: 0; overflow-y: auto;
    -webkit-overflow-scrolling: touch; padding: .4rem .6rem
    calc(.6rem + env(safe-area-inset-bottom)); }
  .ksel-menu a { white-space: normal; padding: .85rem .8rem; font-size: 1rem;
    border-radius: 10px; }

  /* touch targets ≥44px */
  .ksel-btn { min-height: 46px; }
  .cta, form.nice > button, .seg-side button { min-height: 46px; }
  .agent-row { cursor: pointer; }
  .agent-row label { padding: .35rem .5rem; }
}
@keyframes ksel-up { from { opacity: 0; transform: translateY(14px); }
                     to { opacity: 1; transform: none; } }

/* legal pages */
.legal h3 { margin: 1.3rem 0 .35rem; font-size: 1.05rem; }
.legal p { max-width: 70ch; }

/* stat columns align across rows; flags sit under the identity line */
.agent-row .ar-stats > span { min-width: 96px; text-align: center; }
.agent-row .ar-flags { margin-top: .3rem; }
@media (max-width: 760px) {
  .agent-row .ar-stats > span { min-width: 0; text-align: left; }
}

/* ── badge animations ──────────────────────────────────────────────────────── */
@keyframes shimmer-gold {
  0%   { background-position: -250% center; }
  100% { background-position: 250% center; }
}
@keyframes glow-ember {
  0%, 100% { box-shadow: 0 0 5px 1px rgba(220, 110, 20, .45),
                          inset 0 1px 0 rgba(255, 255, 255, .3); }
  50%       { box-shadow: 0 0 16px 5px rgba(230, 120, 20, .75),
                          inset 0 1px 0 rgba(255, 255, 255, .3); }
}

/* earned badges — base: neutral foil for misc/upcomer */
.earned-badges { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .7rem; }
.badge { font-size: .76rem; font-weight: 700; letter-spacing: .055em;
  text-transform: uppercase; padding: .36rem .85rem; border-radius: 999px;
  border: 1px solid #c8a84b; color: #6e5618;
  background: linear-gradient(180deg, #fdf8ea, #f3e8c8);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85),
              inset 0 -1px 0 rgba(154, 123, 45, .18),
              0 1px 3px rgba(27, 36, 33, .10); }

/* top 1% — shimmering gold, sweeping highlight */
.badge-top1 {
  background: linear-gradient(105deg,
    #4a2d00 0%, #9a7010 12%, #ddb030 28%,
    #f8e070 42%, #ffe898 50%, #f8e070 58%,
    #ddb030 72%, #9a7010 88%, #4a2d00 100%);
  background-size: 300% 100%;
  border: 1.5px solid #f0c840;
  color: #1a0d00;
  font-weight: 800;
  text-shadow: 0 1px 0 rgba(255, 235, 120, .5);
  box-shadow: inset 0 1px 0 rgba(255, 245, 140, .55),
              0 2px 8px rgba(180, 130, 0, .5),
              0 0 0 1px rgba(240, 200, 60, .25);
  animation: shimmer-gold 3.5s linear infinite; }

/* top 1% buyer — same shimmering gold as listing-side top-1 */
.badge-topbuy1 {
  background: linear-gradient(105deg,
    #4a2d00 0%, #9a7010 12%, #ddb030 28%,
    #f8e070 42%, #ffe898 50%, #f8e070 58%,
    #ddb030 72%, #9a7010 88%, #4a2d00 100%);
  background-size: 300% 100%;
  border: 1.5px solid #f0c840;
  color: #1a0d00;
  font-weight: 800;
  text-shadow: 0 1px 0 rgba(255, 235, 120, .5);
  box-shadow: inset 0 1px 0 rgba(255, 245, 140, .55),
              0 2px 8px rgba(180, 130, 0, .5),
              0 0 0 1px rgba(240, 200, 60, .25);
  animation: shimmer-gold 3.5s linear infinite; }

/* top 5% + top buyer — deep seal green (distinguished but not top-1) */
.badge-top5, .badge-topbuy {
  border-color: var(--gold);
  color: #f3e7c4;
  background: linear-gradient(180deg, #11705f, #0a5346);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18),
              inset 0 -1px 0 rgba(0, 0, 0, .22),
              0 1px 4px rgba(27, 36, 33, .22); }

/* rising star — pulsing ember glow */
.badge-rising {
  border-color: #c05515;
  color: #fff5e8;
  background: linear-gradient(160deg, #e86820 0%, #bb4510 100%);
  box-shadow: 0 0 6px 1px rgba(220, 110, 20, .5),
              inset 0 1px 0 rgba(255, 255, 255, .3);
  animation: glow-ember 2.2s ease-in-out infinite; }

/* quick closer — platinum shimmer */
.badge-fast {
  background: linear-gradient(105deg,
    #18181e 0%, #484860 12%, #8888aa 28%,
    #d0d0e8 42%, #efefff 50%, #d0d0e8 58%,
    #8888aa 72%, #484860 88%, #18181e 100%);
  background-size: 300% 100%;
  border: 1.5px solid #b8b8d0;
  color: #0c0c18;
  font-weight: 800;
  text-shadow: 0 1px 0 rgba(210, 210, 255, .45);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .65),
              0 2px 8px rgba(80, 80, 140, .35),
              0 0 0 1px rgba(180, 180, 220, .2);
  animation: shimmer-gold 3s linear infinite; }

/* luxury — deep amethyst with outer glow */
.badge-luxury {
  border-color: #9a68df;
  color: #f5eeff;
  background: linear-gradient(160deg, #6c3cc8 0%, #3e1a8a 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28),
              0 2px 10px rgba(110, 50, 200, .5),
              0 0 0 1px rgba(170, 110, 255, .2); }

/* overflow chip — quiet ghost */
.badge-more { border-color: rgba(207, 164, 75, .5); color: #cfa44b;
  background: rgba(253, 251, 245, .06); box-shadow: none; }
.medal-pop .mp-body b { color: var(--gold); }

/* global header search */
/* min-width: the "Find an agent…" placeholder must never clip (again) */
.nav-search { position: relative; flex: 1; min-width: 9.6em; max-width: 320px; }
.nav-search input { width: 100%; font-size: .9rem; padding: .45rem .8rem;
  border: 1.5px solid var(--line); border-radius: 999px; background: var(--card);
  outline: none; }
.nav-search input:focus { border-color: var(--accent); }
.nav-search .typeahead { top: calc(100% + 6px); }
@media (max-width: 760px) { .nav-search { order: 3; flex-basis: 100%; max-width: none; } }

/* score medallion hover/tap breakdown — shown via the body-level #pop-layer so no
   card/row stacking context (rise animation, fill-mode:both) can paint over it */
.medal.has-pop { cursor: help; }
.has-pop > .medal-pop { display: none; } /* inline copy is only a template */
/* the same hover box on any element: wrap a label with tip() in app.js.
   Trigger style: dotted underline + help cursor. */
.tip { border-bottom: 1px dotted #98a39b; cursor: help; }
.tip:focus { outline: none; border-bottom: 1px dotted var(--accent); }
.mp-body { font-size: .78rem; font-weight: 400; line-height: 1.5; color: var(--ink);
  text-transform: none; letter-spacing: normal; }
.badge.has-pop { cursor: help; }
#pop-layer { position: fixed; left: 0; top: 0; z-index: 1000; }
#pop-layer .medal-pop { width: 280px; background: var(--card); color: var(--ink);
  border: 1px solid var(--line); border-top: 3px solid var(--ink);
  border-radius: 0 0 10px 10px; box-shadow: 0 12px 34px rgba(20,30,40,.25);
  padding: .7rem .8rem; text-align: left; font-weight: 400;
  animation: popfade .14s ease; }
@keyframes popfade { from { opacity: 0; transform: translateY(4px); } }
.mp-head { font-size: .74rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: var(--gold); margin-bottom: .45rem; }
.mp-row { display: grid; grid-template-columns: 1fr 52px 62px; align-items: center;
  gap: .4rem; font-size: .8rem; margin: .25rem 0; }
.mp-row b { white-space: nowrap; }
.mp-row > span:first-child i { color: var(--muted); font-style: normal; font-size: .7rem; }
.mp-bar { background: var(--line); height: 6px; border-radius: 4px; overflow: hidden; }
.mp-bar i { display: block; height: 6px; }
.mp-row b { text-align: right; font-size: .74rem; font-variant-numeric: tabular-nums; }
.mp-foot { font-size: .7rem; color: var(--muted); margin-top: .5rem; line-height: 1.4; }

/* per-deal hover box (sales history) — replaces the old external Redfin link */
.mp-body .dp-row { display: flex; justify-content: space-between; align-items: baseline;
  gap: 1rem; padding: .16rem 0; font-size: .82rem; color: var(--muted); }
.mp-body .dp-row b { color: var(--ink); font-weight: 600; white-space: nowrap;
  font-variant-numeric: tabular-nums; }
.mp-body .dp-row .dp-cut { color: var(--gold); font-style: normal; font-size: .72rem;
  margin-left: .3rem; }
.mp-body .dp-note { margin-top: .45rem; font-size: .75rem; color: var(--gold); line-height: 1.4; }
.deal-map { position: relative; width: 240px; max-width: 100%; height: 140px; margin-top: .6rem;
  overflow: hidden; border-radius: 8px; border: 1px solid var(--line); background: #eef2f4; }
.deal-map .dm-grid { position: absolute; width: 768px; height: 768px; }
.deal-map .dm-grid img { position: absolute; width: 256px; height: 256px; }
.deal-pin { position: absolute; left: 50%; top: 50%; width: 12px; height: 12px;
  margin: -12px 0 0 -6px; background: var(--accent); border: 2px solid #fff;
  border-radius: 50% 50% 50% 0; transform: rotate(-45deg);
  box-shadow: 0 1px 5px rgba(0,0,0,.35); }

/* "What drives the score" panel on the profile — bars + the stored score */
.calc .pb-w { color: var(--muted); font-style: normal; font-weight: 400;
  font-size: .72rem; margin-left: .35rem; white-space: nowrap; }
.calc-sum { display: flex; justify-content: space-between; align-items: baseline;
  border-top: 1.5px solid var(--ink); margin-top: .7rem; padding-top: .5rem;
  font-size: 1rem; }
.calc-sum b { font-family: Fraunces, Georgia, serif; font-size: 1.35rem; }
.calc-of10 { color: var(--muted); font-size: .78rem; }
.calc-note { margin-top: .55rem; }

/* the exact-math tooltip on the panel heading */
#pop-layer .medal-pop:has(.eq) { width: 360px; max-width: calc(100vw - 16px); }
.eq { font-variant-numeric: tabular-nums; }
.eq-row { display: flex; justify-content: space-between; gap: .8rem; padding: .12rem 0; }
.eq-row > span:last-child { white-space: nowrap; }
.eq-head { color: var(--muted); font-size: .68rem; text-transform: uppercase;
  letter-spacing: .05em; }
.eq-sum { border-top: 1px solid var(--line); margin-top: .15rem; padding-top: .3rem; }
.eq-curve > span:last-child { white-space: normal; text-align: right; }
.eq-total { border-top: 1.5px solid var(--ink); margin-top: .2rem; padding-top: .35rem; }
.eq-foot { color: var(--muted); margin-top: .45rem; font-size: .72rem; line-height: 1.45; }

/* badge specialty strip on /top */
.badge-strip { display: flex; flex-wrap: wrap; gap: .45rem; margin: 1rem 0 1.2rem; }
.bchip { font: inherit; font-size: .82rem; padding: .38rem .75rem; cursor: pointer;
  border: 1.5px solid var(--line); border-radius: 999px; background: var(--card);
  color: var(--ink); transition: border-color .15s, background .15s; }
.bchip:hover { border-color: var(--accent); }
.bchip.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.bchip i { font-style: normal; opacity: .65; font-size: .72rem; margin-left: .25rem; }
@media (max-width: 760px) { .badge-strip { overflow-x: auto; flex-wrap: nowrap;
  padding-bottom: .4rem; -webkit-overflow-scrolling: touch; }
  .bchip { white-space: nowrap; flex: none; } }

/* client proposals dashboard (/my) */
.my-prop { border: 1px solid var(--line); border-radius: 10px; padding: 1rem;
  margin: .9rem 0; background: var(--bg); }
.my-prop.chosen { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft, #e3efe9); }
.mp-agent { display: flex; gap: 1rem; align-items: center; margin-bottom: .6rem; }
.mp-agent > div:nth-child(2) { flex: 1; min-width: 0; }
.mp-fee { text-align: right; }
.mp-fee b { display: block; font-size: 1.35rem; font-family: Fraunces, Georgia, serif; }
.chosen-tag { color: var(--accent); font-size: .78rem; font-weight: 700;
  margin-left: .5rem; text-transform: uppercase; letter-spacing: .04em; }
.mp-choose { display: flex; gap: .9rem; align-items: center; flex-wrap: wrap;
  margin-top: .6rem; }
.mp-choose label { display: flex; flex-direction: column; gap: .25rem; }
@media (max-width: 760px) { .mp-agent { flex-wrap: wrap; } .mp-fee { text-align: left; } }

/* admin inline contact-fix form */
.inline-contact { display: inline-flex; gap: .4rem; margin-left: .5rem; }
.inline-contact input { font: inherit; font-size: .82rem; padding: .25rem .55rem;
  border: 1.5px solid var(--line); border-radius: 6px; }
.inline-contact button { font: inherit; font-size: .8rem; padding: .25rem .7rem;
  cursor: pointer; border: none; border-radius: 6px; background: var(--accent); color: #fff; }
.flash-warn { background: #f7ecd8; color: #7a5a18; padding: .6rem 1rem;
  border-radius: 8px; }

/* shortlist controls — the basket flow */
.sl-btn { font: inherit; font-size: .78rem; font-weight: 600; padding: .34rem .7rem;
  white-space: nowrap; cursor: pointer; border: 1.5px solid var(--accent);
  border-radius: 999px; background: transparent; color: var(--accent);
  transition: background .15s, color .15s; }
.sl-btn:hover { background: var(--accent-soft, #e3efe9); }
.sl-btn.on { background: var(--accent); color: #fff; }
/* sticky agent action bar — appears when the profile header scrolls away,
   so shortlist/proposals stay one tap away anywhere on the record */
#agent-stick { position: fixed; left: 0; right: 0; z-index: 50;
  background: rgba(253, 251, 245, .96);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line); box-shadow: var(--shadow);
  transform: translateY(-115%); transition: transform .22s ease;
  pointer-events: none; }
#agent-stick.show { transform: translateY(0); pointer-events: auto; }
.as-inner { max-width: 1080px; margin: 0 auto; display: flex; align-items: center;
  gap: .7rem; padding: .45rem 1.2rem; }
.as-score { font-family: Fraunces, Georgia, serif; font-weight: 600;
  font-size: 1.15rem; font-variant-numeric: tabular-nums; flex: none; }
.as-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-brk { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-lens { display: inline-flex; border: 1.5px solid var(--line); border-radius: 999px;
  overflow: hidden; font-size: .72rem; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; flex: none; }
.as-lens a { padding: .32rem .75rem; color: var(--muted); text-decoration: none;
  white-space: nowrap; transition: color .15s; }
.as-lens a:hover { color: var(--ink); text-decoration: none; }
.as-lens a.on { background: var(--accent); color: #fff; }
.as-lens a.buy.on { background: var(--gold); }
.as-actions { margin-left: auto; display: inline-flex; gap: .5rem;
  align-items: center; flex: none; }
.as-cta { font-size: .8rem; padding: .42rem .85rem; }
@media (max-width: 760px) { .as-brk { display: none; }
  .as-cta { display: none; } /* small screens: shortlist is the one action */
}

/* end-of-record CTA strip */
.sl-end { display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap; }
.sl-end-actions { display: inline-flex; gap: .6rem; align-items: center;
  flex-wrap: wrap; }
.sl-end-actions .sl-btn { font-size: .85rem; padding: .5rem 1rem; }
.slc { display: inline-flex; align-items: center; gap: .3rem;
  background: var(--accent-soft, #e3efe9); color: var(--ink);
  border-radius: 999px; padding: .15rem .6rem; font-size: .8rem; }
.slc a { color: inherit; opacity: .7; text-decoration: none; font-weight: 700; }
.slc a:hover { opacity: 1; }
/* header shortlist — the persistent "cart": always visible, badge counts picks */
#sl-link { order: 5; position: relative; display: flex; align-items: center;
  gap: .4rem; font-size: .78rem; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--muted); white-space: nowrap; }
#sl-link:hover { color: var(--accent); text-decoration: none; }
#sl-link.has { color: var(--accent); }
#sl-link svg { flex: none; }
#sl-count { font-family: Inter, sans-serif; font-size: .7rem; line-height: 1;
  min-width: 1.05rem; padding: .2rem .28rem; border-radius: 999px;
  background: var(--gold); color: #fff; text-align: center; }
@keyframes sl-pop { 0% { transform: scale(1); } 40% { transform: scale(1.5); }
                    100% { transform: scale(1); } }
#sl-count.pulse { animation: sl-pop .45s cubic-bezier(.2, .7, .3, 1); }
@media (max-width: 1080px) {
  /* tight headers: icon+count only (the count is the message) */
  #sl-link .sl-word { display: none; }
}
@media (max-width: 760px) {
  /* stays OUT of the hamburger: brand | search | shortlist | menu */
  #sl-link { order: 4; }
  #menu-btn { order: 5; }
}

/* the funnel banner — one per list/landing surface, all roads → proposals */
.funnel-cta { display: flex; align-items: center; justify-content: space-between;
  gap: .9rem 1.4rem; flex-wrap: wrap; border-left: 4px solid var(--gold); }
.funnel-cta > div { flex: 1 1 30ch; }
.funnel-cta .cta { white-space: nowrap; }

/* transient confirmation when an agent is added (replaces the old bottom bar) */
#sl-toast { position: fixed; left: 50%; bottom: calc(1.2rem + env(safe-area-inset-bottom));
  transform: translate(-50%, 10px); background: var(--ink); color: #fff;
  padding: .55rem 1.05rem; border-radius: 999px; font-size: .88rem;
  box-shadow: var(--shadow); z-index: 60; max-width: 94vw; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
  opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
#sl-toast.show { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
#sl-toast a { color: #9fe3d8; font-weight: 600; }

/* comparison: per-criterion leader */
.cmp-table th { min-width: 128px; }
.cmp-table td.best-cell { background: var(--accent-soft, #e3efe9);
  border-radius: 6px; position: relative; }
.best-tag { display: block; font-size: .62rem; font-weight: 700; color: var(--accent);
  text-transform: uppercase; letter-spacing: .06em; margin-top: .15rem; }

/* ─── /proposals — the RFP checkout: roster + form up top, compare below ─── */
.rfp-lead { max-width: 760px; margin: .2rem 0 1.1rem; }
.rfp-lens { display: inline-flex; margin: 0 0 1.4rem; border: 1.5px solid var(--line);
  border-radius: 999px; overflow: hidden; background: var(--card); box-shadow: var(--shadow); }
.rfp-lens a { padding: .5rem 1.25rem; font-weight: 700; font-size: .9rem; color: var(--muted); }
.rfp-lens a:hover { text-decoration: none; color: var(--ink); }
.rfp-lens a.on { background: var(--accent); color: #fff; }
.rfp-lens a.buy.on { background: var(--gold); }

/* desktop: roster top-left, request form in a sticky right rail, comparison
   full-height on the left; collapses to roster → form → compare on mobile */
.rfp-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px;
  grid-template-areas: "roster form" "compare form"; gap: 1.1rem 1.4rem; align-items: start; }
.rfp-roster { grid-area: roster; }
.rfp-compare { grid-area: compare; min-width: 0; }
.rfp-aside { grid-area: form; position: sticky; top: 70px; }
.rfp-solo { max-width: 740px; }
@media (max-width: 940px) {
  .rfp-layout { grid-template-columns: 1fr; grid-template-areas: "roster" "form" "compare"; }
  .rfp-aside { position: static; }
}

/* roster — the single control surface for who competes */
.rfp-roster { margin-bottom: 0; }
.rr-head { display: flex; align-items: baseline; justify-content: space-between;
  gap: 1rem; margin-bottom: .35rem; }
.rr-head h2 { margin: 0; }
.rr-count { font-size: .72rem; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.rr-list { display: flex; flex-direction: column; }
.rr-agent { display: flex; align-items: center; gap: .75rem; padding: .5rem 0;
  border-bottom: 1px solid var(--line); }
.rr-agent:last-child { border-bottom: none; }
.rr-score { flex: none; width: 2.7rem; text-align: center;
  font-family: Fraunces, Georgia, serif; font-weight: 600; font-size: 1.2rem;
  font-variant-numeric: tabular-nums; line-height: 1; }
.rr-id { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.rr-id a { font-weight: 600; }
.rr-id i { font-style: normal; font-size: .8rem; color: var(--muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rr-rm { flex: none; width: 28px; height: 28px; padding: 0; border-radius: 999px;
  border: 1px solid var(--line); background: transparent; color: var(--muted);
  font: inherit; font-size: 1.15rem; line-height: 1; cursor: pointer;
  transition: background .15s, color .15s, border-color .15s; }
.rr-rm:hover { background: #f4e4df; border-color: var(--red); color: var(--red); }
.rr-empty { margin: 0; color: var(--muted); font-size: .9rem; }
.rr-add { margin-top: .8rem; max-width: none; }
.rr-note { margin: .7rem 0 0; }

/* the request form — gold-crowned to read as THE primary action */
.rfp-form.card { border-top: 3px solid var(--gold); }
.rf-title { margin: 0; }
.rf-sub { margin: .25rem 0 1rem; }
.rf-fine { margin-top: .9rem; }
.check-label { flex-direction: row !important; align-items: flex-start;
  gap: .5rem; font-size: .78rem; color: var(--muted); cursor: pointer; }
.check-label input[type=checkbox] { margin-top: .15em; flex-shrink: 0; }

/* foot of the comparison: a second shot at the conversion */
.cmp-foot { display: flex; align-items: center; justify-content: space-between;
  gap: .8rem 1.4rem; flex-wrap: wrap; margin-top: .4rem; }
.cmp-foot .cta { white-space: nowrap; }

/* open select menus must paint above the animated row cards (each row is its
   own stacking context via the rise animation's fill-mode) — and the container
   whose menu is OPEN must beat its sibling filter bars too. DESKTOP ONLY: on
   mobile the menu is a body-anchored fixed bottom sheet, and a z-index here would
   make these containers stacking contexts that trap the sheet (z-index 90) BELOW
   the full-screen backdrop (z-index 80) — the sheet would open but paint under the
   dim. So keep position:relative everywhere (for the desktop absolute dropdown's
   offset parent) but apply the z-index only ≥761px. */
.search-console, .results-bar, .filters { position: relative; }
@media (min-width: 761px) {
  .search-console, .results-bar, .filters { z-index: 40; }
  .search-console:has(.ksel.open), .results-bar:has(.ksel.open),
  .filters:has(.ksel.open) { z-index: 45; }
}
.ksel-filter { width: 100%; box-sizing: border-box; font: inherit; font-size: .88rem;
  padding: .42rem .6rem; margin-bottom: .3rem; border: 1.5px solid var(--line);
  border-radius: 8px; background: var(--bg); }
.ksel-filter:focus { outline: none; border-color: var(--accent); }

/* ---------- guided intake (rank hero), concierge picks, sector top-10s ---- */
.gi-hero { margin: .2rem 0 1rem; position: relative; }
@media (min-width: 761px) {
  .gi-hero { z-index: 41; }
  .gi-hero:has(.ksel.open) { z-index: 46; }
}
.gi-line { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center;
  font-size: 1.02rem; }
.gi-line .ksel { display: inline-block; }
.gi-go { margin-left: auto; }
@media (max-width: 560px) { .gi-go { margin-left: 0; width: 100%; } }

.picks-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(255px, 1fr));
  gap: .9rem; margin: 1rem 0; }
.pick-card { display: flex; flex-direction: column; gap: .55rem; }
.pick-chip { align-self: flex-start; background: var(--accent); color: #fff;
  font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  padding: .26rem .62rem; border-radius: 999px; }
.pick-head { display: flex; gap: .7rem; align-items: center; }
.pick-why { margin: 0; font-size: .92rem; }
.pick-stats { margin-top: auto; }
.pick-resp { margin: 0; }
.pick-card .sl-btn { align-self: flex-start; }
.picks-ctas { display: flex; gap: .7rem; flex-wrap: wrap; margin: 1.1rem 0 .6rem; }

.best-row { display: flex; gap: .55rem; align-items: stretch; }
.best-pos { flex: 0 0 1.7rem; display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 1.06rem; color: var(--accent); }
.best-row .agent-row { flex: 1; min-width: 0; }
.best-links { display: flex; flex-wrap: wrap; gap: .5rem; margin: .4rem 0 1rem; }
.gi-side { display: inline-flex; }
.gi-side button { padding: .3rem .7rem; }

/* ---------- unified slate page (/picks = checkout) ---------- */
.ctx-bar { display: flex; justify-content: space-between; align-items: center;
  gap: .6rem; flex-wrap: wrap; padding: .55rem .9rem; margin: .3rem 0 .7rem;
  font-size: .95rem; }
.ctx-acts { display: flex; gap: .45rem; align-items: center; }
.ctx-acts a { padding: .15rem .55rem; border-radius: 999px; font-size: .82rem; }
.ctx-acts a.on { background: var(--accent); color: #fff; }
.ctx-acts button { border: 1.5px solid var(--line); background: var(--card);
  border-radius: 999px; padding: .2rem .6rem; font: inherit; font-size: .82rem;
  cursor: pointer; }
.slate-layout { display: grid; grid-template-columns: 1.45fr 1fr; gap: 1.1rem;
  align-items: start; }
.slate-form { position: sticky; top: 1rem; }
.slate-grid { grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); }
.pick-top { display: flex; justify-content: space-between; align-items: center; gap: .4rem; }
.pick-chip.yours { background: var(--gold); }
.pick-acts { display: flex; gap: .3rem; }
.pick-act { border: 1.5px solid var(--line); background: var(--card);
  border-radius: 999px; padding: .12rem .5rem; font: inherit; font-size: .76rem;
  cursor: pointer; color: var(--muted); }
.pick-act:hover { border-color: var(--accent); color: var(--accent); }
.pick-empty { align-items: flex-start; justify-content: center; border-style: dashed; }
.cmp-disc { margin: 1rem 0 .6rem; }
.cmp-disc summary { cursor: pointer; font-weight: 600; padding: .5rem 0; }
.slate-cta-bar { display: none; }
@media (max-width: 900px) {
  .slate-layout { grid-template-columns: 1fr; }
  .slate-form { position: static; }
  .slate-cta-bar { display: block; position: fixed; left: 0; right: 0; bottom: 0;
    padding: .55rem .85rem calc(.55rem + env(safe-area-inset-bottom));
    background: var(--card); border-top: 1px solid var(--line); z-index: 60;
    text-align: center; }
  .slate-cta-bar .cta { width: 100%; }
  main { padding-bottom: 5rem; }
}

/* slim slate roster (replaces the busy pick cards) */
.sr-roster { padding: .7rem .9rem; }
.sr-row { display: flex; align-items: center; gap: .65rem; padding: .48rem 0;
  border-bottom: 1px solid var(--line); }
.sr-row:last-of-type { border-bottom: none; }
.sr-score { flex: none; width: 2.4rem; text-align: center; font-weight: 700;
  font-size: 1.02rem; font-variant-numeric: tabular-nums; }
.sr-id { flex: 1; min-width: 0; line-height: 1.3; display: flex;
  flex-direction: column; gap: .06rem; }
.sr-id a { font-weight: 600; }
.sr-line1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sr-line1 i { font-style: normal; font-size: .8rem; color: var(--muted); }
.sr-why { font-size: .8rem; color: var(--muted); }
.sr-tag { flex: none; font-size: .74rem; color: var(--accent);
  border: 1px solid var(--accent-soft); background: var(--accent-soft);
  border-radius: 999px; padding: .16rem .55rem; white-space: nowrap; cursor: help; }
.sr-tag.yours { color: var(--gold); background: #f4ecdc; border-color: #f4ecdc; }
.sr-acts { flex: none; display: flex; gap: .3rem; }
.sr-open { justify-content: space-between; border-bottom: none; }
.sr-note { margin: .6rem 0 0; }
@media (max-width: 560px) {
  /* tag drops to its own line under the name — never hidden, never cramped */
  .sr-row { flex-wrap: wrap; row-gap: .25rem; }
  .sr-tag { order: 5; margin-left: 3.05rem; }
}

/* ---------- the dossier deck (slate v3: luxury editorial) ---------- */
.slate-hero { text-align: center; max-width: 760px; margin: 0 auto .4rem; }
.slate-hero h1 { margin: .2rem 0 .4rem; }
.slate-hero .ctx-bar { justify-content: center; margin: .8rem auto .2rem; }
.deck-wrap { margin: 1rem 0 .4rem; }
.deck { display: flex; gap: .9rem; overflow-x: auto; scroll-snap-type: x mandatory;
  padding: .4rem .2rem .7rem; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.deck::-webkit-scrollbar { display: none; }
.dcard { flex: 0 0 82%; max-width: 330px; scroll-snap-align: center;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: var(--shadow); padding: 1.15rem 1.05rem .85rem; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: .42rem; }
.d-kicker { font-size: .68rem; font-weight: 700; letter-spacing: .15em;
  text-transform: uppercase; color: var(--gold); }
.d-kicker.yours { color: var(--accent); }
.d-medal .medal { margin: 0 auto; }
.d-name { font-family: "Fraunces", serif; font-size: 1.32rem; font-weight: 600;
  margin: 0; line-height: 1.15; }
.d-name a { color: inherit; text-decoration: none; }
.d-name a:hover { color: var(--accent); }
.d-brk { font-size: .8rem; color: var(--muted); }
.d-rule { width: 36px; border: 0; border-top: 1px solid var(--line); margin: .3rem auto; }
.d-why { font-size: .93rem; line-height: 1.5; margin: 0; }
.d-stats { font-size: .78rem; color: var(--muted); margin: 0; }
.d-acts { display: flex; gap: 1.1rem; margin-top: auto; padding-top: .55rem; }
.d-acts button { background: none; border: none; padding: 0; font: inherit;
  font-size: .8rem; color: var(--muted); cursor: pointer; }
.d-acts button:hover { color: var(--accent); }
.d-ghost { justify-content: center; border-style: dashed; box-shadow: none;
  gap: .7rem; min-height: 220px; }
.deck-dots { display: flex; justify-content: center; gap: .42rem; margin-top: .2rem; }
.deck-dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--line);
  transition: background .2s; }
.deck-dots i.on { background: var(--accent); }
.slate-tools { max-width: 760px; margin: 0 auto; }
.slate-tools .rr-add { margin-top: .2rem; }
.slate-brief { max-width: 760px; margin: 1.3rem auto 0; }
.rf-lux { font-family: "Fraunces", serif; font-size: 1.45rem; font-weight: 600;
  margin: 0 0 .3rem; }
.slate-fine { text-align: center; margin: .9rem auto 0; max-width: 640px; }
@media (min-width: 901px) {
  .deck { overflow: visible; flex-wrap: nowrap; }
  .dcard { flex: 1 1 0; max-width: none; min-width: 0; padding: 1.05rem .8rem .8rem; }
  .deck-dots { display: none; }
}

/* the ONE conversion link: gold pill (adaptive label — promise when empty,
   cart when filled); keep the word visible even on small screens */
#sl-link.gold { background: var(--gold); color: #fff; border-radius: 999px;
  padding: .42rem .85rem; font-weight: 600; font-size: .85rem; gap: .4rem; }
#sl-link.gold:hover { background: #836723; color: #fff; }
#sl-link.gold.has { color: #fff; }
#sl-link.gold #sl-count { background: #fff; color: var(--gold); }
@media (max-width: 760px) {
  #sl-link.gold .sl-word { display: inline; }
}

/* ---------- slate v4: slots + proceed + pools (cart → checkout) ---------- */
.slot-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: .55rem;
  max-width: 860px; margin: .9rem auto .7rem; }
.slot { position: relative; background: var(--card); border: 1px solid var(--line);
  border-radius: 8px; box-shadow: var(--shadow); padding: .9rem .4rem .6rem;
  display: flex; flex-direction: column; align-items: center; gap: .2rem;
  min-width: 0; text-align: center; }
.slot-x { position: absolute; top: -7px; right: -7px; width: 22px; height: 22px;
  border-radius: 50%; border: 1.5px solid var(--red); background: #fff;
  color: var(--red); font-size: .95rem; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center; padding: 0; }
.slot-x:hover { background: var(--red); color: #fff; }
.slot-tag { font-size: .62rem; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--gold); }
.slot-score { font-weight: 800; font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.slot-name { font-size: .78rem; line-height: 1.2; overflow: hidden; display: -webkit-box;
  -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.slot-empty { border-style: dashed; box-shadow: none; justify-content: center;
  font-size: 1.5rem; color: var(--muted); cursor: pointer; background: transparent;
  min-height: 92px; }
.slot-empty:hover { color: var(--accent); border-color: var(--accent); }
.proceed { max-width: 860px; margin: 0 auto 1.2rem; text-align: center;
  padding: 1rem; }
.proceed .cta { width: 100%; max-width: 480px; font-size: 1.02rem; }
.proceed p { margin: .55rem 0 0; }
.slate-pools { max-width: 860px; margin: 0 auto; }
.pl-card { padding: .35rem .9rem; }
.pl-row { display: flex; align-items: center; gap: .65rem; padding: .55rem 0;
  border-bottom: 1px solid var(--line); }
.pl-row:last-child { border-bottom: none; }
.pl-row.on { opacity: .75; }
.pl-score { flex: none; width: 2.4rem; text-align: center; font-weight: 700;
  font-size: 1.02rem; font-variant-numeric: tabular-nums; }
.pl-main { flex: 1; min-width: 0; line-height: 1.32; }
.pl-name a { font-weight: 600; }
.pl-name i { font-style: normal; font-size: .8rem; color: var(--muted); }
.pl-why { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; font-size: .8rem; color: var(--muted); }
.pl-add { flex: none; border: 1.5px solid var(--accent); background: var(--card);
  color: var(--accent); border-radius: 999px; padding: .3rem .75rem; font: inherit;
  font-size: .8rem; font-weight: 600; cursor: pointer; }
.pl-add:hover { background: var(--accent-soft); }
.pl-add.on { background: var(--accent); color: #fff; }
.brief-strip { display: flex; flex-wrap: wrap; gap: .45rem; justify-content: center;
  align-items: center; margin: .8rem 0 .2rem; }
.bs-chip { background: var(--card); border: 1px solid var(--line); border-radius: 999px;
  padding: .28rem .7rem; font-size: .82rem; }
.bs-chip b { font-variant-numeric: tabular-nums; }
.bs-edit { font-size: .82rem; margin-left: .3rem; }
@media (max-width: 640px) {
  .slot-row { gap: .4rem; }
  .slot { padding: .75rem .25rem .5rem; }
  .slot-score { font-size: 1.05rem; }
  .slot-name { font-size: .68rem; }
  .slot-tag { font-size: .56rem; }
}

/* slate v4.1 — unified: left-aligned, one 860px column, site components only */
.slate-hero { text-align: left; max-width: 860px; margin: 0 auto .5rem; }
.slate-hero .ctx-bar { justify-content: space-between; margin: .8rem 0 .2rem; }
.slate-sec { max-width: 860px; margin: 0 auto 1rem; }
.slate-sec .cmp-table { font-size: .85rem; }
.slate-fine { text-align: left; max-width: 860px; margin: .6rem auto 0; }
.slate-brief, .slate-pools { max-width: 860px; }
.proceed { text-align: left; display: flex; flex-wrap: wrap; align-items: center;
  gap: .35rem 1rem; }
.proceed .cta { width: auto; flex: none; }
.proceed p { margin: 0; flex: 1; min-width: 220px; }
.slot-row { grid-template-columns: repeat(auto-fit, minmax(152px, 1fr)); }
.slot { padding: 1.2rem .5rem .75rem; gap: .35rem; }
.slot-kick { font-size: .6rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--gold); }
.slot-medal .medal { margin: 0 auto; }
.slot-name { font-family: "Fraunces", serif; font-size: 1rem; font-weight: 600;
  line-height: 1.18; color: inherit; }
.slot-name:hover { color: var(--accent); text-decoration: none; }
.slot-bdg { font-size: .58rem; padding: .24rem .55rem; letter-spacing: .04em;
  white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.slot-brk { font-size: .72rem; color: var(--muted); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }

/* /best matrix index rows: side label + price-range chips */
.bm-row { display: flex; align-items: baseline; gap: .8rem; margin: .35rem 0; }
.bm-side { flex: 0 0 7.6rem; font-size: .8rem; font-weight: 600; color: var(--muted); }
.bm-row .best-links { margin: 0; }
.chip-rising { border-color: #c8771f; color: #a85a18; }
.chip-rising:hover { background: #fdf2e4; }
@media (max-width: 560px) {
  .bm-row { flex-direction: column; gap: .15rem; }
  .bm-side { flex: none; }
}

/* ===== Hall of Fame: /best index + list pages ===== */

/* island separator on the index */
.best-island-sep { border: none; border-top: 1px solid var(--line); margin: 2.8rem 0 2rem; }

/* sub-section label: "Top listing agents" / "Rising stars" */
.hof-section-head { font-family: Fraunces, Georgia, serif; font-size: .95rem;
  font-weight: 600; color: var(--accent); letter-spacing: -.01em;
  margin: 1.5rem 0 .65rem; }
.hof-section-head:first-of-type { margin-top: .5rem; }

/* chips row below each island's podiums */
.best-index-ctas { display: flex; flex-wrap: wrap; gap: .5rem; margin: .5rem 0 .3rem; }

/* 3-column podium grid */
.hof-podium { display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1rem; margin: 1.2rem 0 2rem; align-items: start; }

/* podium card base */
.hof-card { background: var(--card); border: 1px solid var(--line);
  border-radius: 10px; padding: 1.3rem 1.2rem 1.1rem;
  display: flex; flex-direction: column; gap: .5rem;
  cursor: pointer; position: relative; overflow: hidden;
  transition: box-shadow .18s, transform .18s; }
.hof-card:hover { transform: translateY(-3px); }

/* colored top accent band */
.hof-card::before { content: ""; position: absolute;
  top: 0; left: 0; right: 0; height: 4px; }
.hof-card--gold   { border-color: rgba(200,162,36,.32);
  box-shadow: 0 2px 16px rgba(200,162,36,.09), var(--shadow); }
.hof-card--gold::before   { background: linear-gradient(90deg,#c9a227,#e8c84e,#c9a227); }
.hof-card--silver { border-color: rgba(140,158,170,.28);
  box-shadow: 0 2px 14px rgba(140,158,170,.07), var(--shadow); }
.hof-card--silver::before { background: linear-gradient(90deg,#8fa0ac,#b8cad4,#8fa0ac); }
.hof-card--bronze { border-color: rgba(160,103,58,.28);
  box-shadow: 0 2px 14px rgba(160,103,58,.08), var(--shadow); }
.hof-card--bronze::before { background: linear-gradient(90deg,#a0673a,#c8865a,#a0673a); }

/* rank badge "#1 · Gold" */
.hof-rank { display: flex; align-items: baseline; gap: .35rem; margin-bottom: .05rem; }
.hof-rank-num { font-family: Fraunces, Georgia, serif; font-weight: 640;
  font-size: 1.75rem; line-height: 1; letter-spacing: -.03em; }
.hof-rank-lab { font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em; }
.hof-card--gold   .hof-rank-num,
.hof-card--gold   .hof-rank-lab { color: #a87a08; }
.hof-card--silver .hof-rank-num,
.hof-card--silver .hof-rank-lab { color: #5a7a8a; }
.hof-card--bronze .hof-rank-num,
.hof-card--bronze .hof-rank-lab { color: #86481e; }

/* identity row: name + firm LEFT, Koho badge RIGHT */
.hof-identity { display: flex; align-items: center; gap: .85rem;
  margin: .2rem 0 .4rem; }
.hof-id-left { flex: 1; min-width: 0; }
.hof-identity > .medal { flex: 0 0 auto; }

/* agent name — Fraunces, slightly larger on #1 */
.hof-name { font-family: Fraunces, Georgia, serif; font-weight: 640;
  font-size: 1.04rem; line-height: 1.22; display: block; }
.hof-name a { color: var(--ink); text-decoration: none; }
.hof-name a:hover { color: var(--accent); }
.hof-card--gold .hof-name { font-size: 1.12rem; }

/* brokerage */
.hof-firm { font-size: .76rem; color: var(--muted); line-height: 1.35;
  margin-top: .18rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* generated "why they ranked" blurb */
.hof-parts { display: flex; flex-direction: column; gap: .28rem; margin: .1rem 0 .5rem; }
.hof-part { display: flex; align-items: center; gap: .5rem; }
.hof-part-lbl { flex: 0 0 5.2rem; font-size: .58rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em; color: var(--muted); }
.hof-part-track { flex: 1; height: 4px; background: var(--line); border-radius: 2px; overflow: hidden; }
.hof-part-fill { height: 100%; border-radius: 2px; transition: width .3s ease; }
.hof-part-val { flex: 0 0 1.7rem; text-align: right; font-size: .62rem;
  font-weight: 700; font-variant-numeric: tabular-nums; }

/* compact stats: "69 sales · $1.1M median" — hairline above */
.hof-meta { font-size: .78rem; color: var(--muted);
  padding-top: .5rem; border-top: 1px solid var(--line); }
.hof-meta b { color: var(--ink); font-variant-numeric: tabular-nums; }

/* shortlist button */
.hof-card .sl-btn { align-self: flex-start; margin-top: .5rem; }

/* mobile: single column */
@media (max-width: 680px) { .hof-podium { grid-template-columns: 1fr; } }

/* divider: "Also ranked" between top 3 and rest */
.hof-divider { display: flex; align-items: center; gap: .8rem;
  margin: 1.6rem 0 .9rem; color: var(--muted);
  font-size: .68rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em; }
.hof-divider::before, .hof-divider::after {
  content: ""; flex: 1; height: 1px; background: var(--line); }

/* positions 4–10: still premium, subordinate to podium */
.hof-list { display: flex; flex-direction: column; gap: .5rem; }
.hof-row { display: flex; gap: .6rem; align-items: center; }
.hof-row-pos { flex: 0 0 1.9rem; display: flex; align-items: center;
  justify-content: center; font-family: Fraunces, Georgia, serif;
  font-weight: 640; font-size: 1rem; color: var(--muted); opacity: .6; }
.hof-row > .agent-row { flex: 1; margin-bottom: 0; }

/* the email preview — the product, shown verbatim */
.mail-preview { background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 1rem 1.1rem; font-size: .78rem;
  line-height: 1.5; white-space: pre-wrap; overflow-x: auto; }


/* landing v3: hero search (the zero-commitment hook) + stakes cards */
.hero-search { max-width: 560px; margin: 0 0 1.2rem; position: relative; }
.hero-search input { width: 100%; box-sizing: border-box; font: inherit;
  font-size: 1.06rem; padding: .85rem 1.1rem; border-radius: 10px;
  border: 1.5px solid rgba(243, 239, 228, .25); background: rgba(248, 245, 236, .97);
  box-shadow: 0 10px 36px rgba(0, 0, 0, .35); }
.hero-search input:focus { outline: none; border-color: var(--gold); }
.hero-search .typeahead { top: calc(100% + 4px); }
.stake { display: flex; flex-direction: column; gap: .3rem; }
.stake-n { font-family: "Fraunces", serif; font-size: 1.9rem; font-weight: 640;
  color: var(--accent); line-height: 1; }
.stake h3 { margin: .1rem 0 .2rem; }

/* ---------- the live ledger (landing): heartbeat strip + receipt rows ----- */
.pulsebar { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
  margin: -1rem 0 1.4rem; padding: .55rem .9rem; font-size: .85rem;
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); color: var(--muted); }
.pulsebar b { color: var(--ink); }
.pulsebar a { margin-left: auto; white-space: nowrap; }
.pb-dot, .lg-dot { width: 8px; height: 8px; border-radius: 50%; flex: none;
  background: var(--line); }
.pb-dot, .lg-dot.on { background: #1d8a5f; animation: pulse-dot 2.4s ease-in-out infinite; }
@keyframes pulse-dot { 0%, 100% { box-shadow: 0 0 0 0 rgba(29, 138, 95, .45); }
  50% { box-shadow: 0 0 0 5px rgba(29, 138, 95, 0); } }
@media (prefers-reduced-motion: reduce) { .pb-dot, .lg-dot.on { animation: none; } }
.ledger { padding: .35rem 1rem; max-width: 860px; }
.lg-row summary { display: flex; align-items: center; gap: .6rem;
  padding: .55rem 0; cursor: pointer; list-style: none; }
.lg-row summary::-webkit-details-marker { display: none; }
.lg-row { border-bottom: 1px solid var(--line); }
.lg-row:last-of-type { border-bottom: none; }
.lg-when { flex: none; width: 2.6rem; font-size: .78rem; color: var(--muted);
  font-variant-numeric: tabular-nums; }
.lg-what { flex: 1; min-width: 0; font-size: .92rem; }
.lg-who { flex: none; display: flex; align-items: baseline; gap: .45rem;
  font-size: .88rem; }
.lg-who b { font-variant-numeric: tabular-nums; }
.lg-delta { font-style: normal; font-size: .78rem; color: var(--muted); }
.lg-delta.up { color: #1d8a5f; }
.lg-delta.dn { color: var(--red); }
.lg-receipt { margin: 0 0 .8rem 3.2rem; max-width: 460px; }
.lgr-row { display: flex; justify-content: space-between; gap: 1rem;
  padding: .3rem 0; font-size: .88rem; border-bottom: 1px dashed var(--line); }
.lgr-row i { font-style: normal; color: var(--muted); font-size: .78rem; }
.lgr-sum b { color: var(--accent); }
.lg-receipt p { margin: .5rem 0 0; }
@media (max-width: 640px) {
  .lg-row summary { flex-wrap: wrap; row-gap: .15rem; }
  .lg-who { margin-left: 3.2rem; }
  .lg-receipt { margin-left: .4rem; }
  .pulsebar a { margin-left: 0; flex-basis: 100%; }
}

/* ---------- the pulse board: departure-board of the newest closings ------- */
.pulse-board-wrap { margin: -0.6rem 0 1.6rem; }
.pulse-board { max-width: 760px; margin: 0 auto; border-radius: 12px;
  overflow: hidden; color: #e9e4d6; border: 1px solid rgba(207, 164, 75, .35);
  background:
    radial-gradient(480px 200px at 85% 0%, rgba(207, 164, 75, .12), transparent 70%),
    linear-gradient(165deg, #0d1f1b 0%, #10261f 60%, #0a1a16 100%);
  box-shadow: 0 18px 50px rgba(13, 31, 27, .25); }
.pbd-head { display: flex; align-items: center; gap: .6rem;
  padding: .8rem 1.15rem .7rem; border-bottom: 1px solid rgba(233, 228, 214, .12); }
.pbd-title { font-size: .72rem; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: #cfa44b; }
.pbd-stamp { margin-left: auto; font-size: .74rem; color: #9fb0a2;
  font-variant-numeric: tabular-nums; }
.pbd-pause { border: 1px solid rgba(233, 228, 214, .25); background: none;
  color: #cfd8cd; border-radius: 999px; width: 26px; height: 26px; flex: none;
  font-size: .6rem; line-height: 1; cursor: pointer; padding: 0; }
.pbd-pause:hover { border-color: #cfa44b; color: #cfa44b; }
.pbd-window { height: 9.2rem; overflow: hidden; position: relative; }
.pbd-window::after { content: ""; position: absolute; left: 0; right: 0;
  bottom: 0; height: 1.6rem; pointer-events: none;
  background: linear-gradient(rgba(10, 26, 22, 0), rgba(10, 26, 22, .85)); }
.pbd-list { will-change: transform; }
.pbd-row { display: flex; align-items: center; gap: .9rem; height: 4.6rem;
  box-sizing: border-box; padding: 0 1.15rem;
  border-bottom: 1px solid rgba(233, 228, 214, .08); }
.pbd-day { flex: none; width: 2.6rem; font-size: .7rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; color: #8fa092; }
.pbd-main { flex: 1; min-width: 0; display: flex; flex-direction: column;
  gap: .14rem; }
.pbd-what { font-size: .94rem; line-height: 1.3; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; }
.pbd-agent { font-size: .8rem; color: #b9c6ba; width: fit-content; }
.pbd-agent:hover { color: #cfa44b; text-decoration: none; }
.pbd-score, .pbd-move { flex: none; font-variant-numeric: tabular-nums;
  font-family: "Fraunces", serif; font-size: 1.18rem; font-weight: 600;
  color: #f3efe4; }
.pbd-move i { font-style: normal; color: #cfa44b; font-size: .9rem;
  padding: 0 .1rem; }
.pbd-foot { padding: .65rem 1.15rem .8rem; font-size: .76rem; color: #9fb0a2;
  border-top: 1px solid rgba(233, 228, 214, .12); }
.pbd-foot b { color: #e9e4d6; }
.pbd-foot a { color: #cfa44b; }
@media (max-width: 560px) {
  .pbd-row { gap: .6rem; padding: 0 .85rem; }
  .pbd-day { width: 2.1rem; }
  .pbd-what { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; font-size: .86rem; }
  .pbd-score, .pbd-move { font-size: 1.05rem; }
  .pbd-window { height: 9.6rem; }
  .pbd-row { height: 4.8rem; }
}

/* how to read a Koho Score: the site's own medallions as the legend */
.curve-card { padding: 1.1rem 1.4rem .9rem; }
.cv-row { display: grid; grid-template-columns: 96px 1fr; gap: 1.2rem;
  align-items: center; padding: .55rem 0; border-bottom: 1px solid var(--line); }
.cv-row:last-of-type { border-bottom: none; }
.cv-medal { justify-self: center; }
.cv-medal .medal { margin: 0; }
.cv-body { display: flex; flex-direction: column; gap: .45rem; min-width: 0; }
.cv-line { font-size: .95rem; }
.cv-pct { font-family: "Fraunces", serif; font-size: 1.25rem; font-weight: 600;
  font-variant-numeric: tabular-nums; }
.cv-n { font-style: normal; font-size: .82rem; color: var(--muted);
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.cv-track { height: 10px; border-radius: 999px; background: var(--accent-soft);
  overflow: hidden; }
.cv-track i { display: block; height: 100%; border-radius: 999px; }
.cv-foot { margin: .65rem 0 0; }
@media (max-width: 560px) {
  .cv-row { grid-template-columns: 84px 1fr; gap: .8rem; }
  .cv-line { font-size: .88rem; }
  .cv-pct { font-size: 1.1rem; }
}

/* medallion pop: the percentile line is prose, not a component row */
.mp-pctl { font-size: .8rem; line-height: 1.4; margin: .15rem 0 .45rem; }
.mp-pctl b { font-variant-numeric: tabular-nums; }