/* Market Movers v2. Scoped to .mm-home / .mm-page; uses the site ink, paper, pink and blue plus the market pastels. */
.mm-home,.mm-page{--mm-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--mm-pink:#ff2f87;--mm-pink-dark:#c9236c;--mm-shadow:4px 4px 0 #17232b;--mm-ink:#17232b;--mm-muted:#4f5b62;--mm-up:#d81b72;--mm-down:#0d78b5;--mm-up-panel:#ecc6d8;--mm-down-panel:#c6d8e1;--mm-line:2px solid #17232b}
.mm-home[hidden]{display:none!important}
.mm-home{--mm-gutter:var(--home-gutter,20px)}
.mm-home .mm-banner{padding-bottom:14px!important;padding-inline:var(--mm-gutter)!important}
.mm-home .mm-banner h2{margin-bottom:0}
/* Homepage heading system: the Guides banner's four columns (label, title, copy, button at the right). */
.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:1fr 2fr 2fr auto;align-items:center}
.mm-home .mm-banner>a{justify-self:end;white-space:nowrap}
/* Body content shares the banner's gutter (the site --pad), so dates, direction labels and cards line up with MARKETS. */
.mm-home-body.page-width{width:100%;max-width:none;margin:0;padding:0 var(--mm-gutter) 34px;box-sizing:border-box}
.mm-period-line,.mm-dates,.mm-updated{font-variant-numeric:tabular-nums;font:500 14px/1.45 var(--sans,system-ui,sans-serif);color:var(--mm-muted);margin:0 0 14px}
.mm-period-line strong{color:var(--mm-ink);font-weight:700}
.mm-qual{font:400 13px/1.5 var(--sans,system-ui,sans-serif);color:var(--mm-muted);margin:18px 0 0;max-width:72ch}
.mm-note{font:500 14px/1.45 var(--sans,system-ui,sans-serif);border-left:4px solid var(--mm-ink);padding:6px 12px;margin:0 0 16px;background:#fff}
.mm-group+.mm-group{margin-top:20px}
.mm-group-head{font:700 12px/1.2 var(--sans,system-ui,sans-serif);letter-spacing:.12em;text-transform:uppercase;margin:0 0 10px;display:flex;align-items:center;gap:8px}
.mm-group-head::before{content:"";width:12px;height:12px;border:var(--mm-line);background:var(--mm-up-panel)}
.mm-group-down .mm-group-head::before{background:var(--mm-down-panel)}
[data-mm-dates] span,.mm-updated{font-family:var(--mm-mono);font-size:12.5px;letter-spacing:.02em}
/* cards: dark border + restrained hard offset shadow (Stories cards); the whole card is the "View sales" link target */
.mm-card{position:relative;background:#fff;border:var(--mm-line);box-shadow:var(--mm-shadow);color:var(--mm-ink);min-width:0;transition:transform .16s ease,box-shadow .16s ease}
.mm-card:has(.mm-link:hover){transform:translateY(-2px);box-shadow:4px 6px 0 #17232b}
.mm-card:has(.mm-link:focus-visible){outline:3px solid var(--mm-ink);outline-offset:4px}
.mm-card .mm-link:focus-visible{outline:0}
.mm-card .mm-link::after{content:"";position:absolute;inset:0;z-index:1}
@media(prefers-reduced-motion:reduce){.mm-card{transition:none}.mm-card:has(.mm-link:hover){transform:none}}
.mm-img{position:relative;overflow:hidden;background:var(--mm-up-panel);border-bottom:var(--mm-line)}
.mm-down .mm-img{background:var(--mm-down-panel)}
.mm-img img{position:absolute;left:10%;bottom:6%;width:80%;height:auto;opacity:0}
.mm-img img.is-placed{opacity:1}
.mm-name{font:400 21px/1.15 var(--serif,Georgia,serif);margin:0;overflow-wrap:anywhere}
.mm-spec{font:500 12.5px/1.3 var(--sans,system-ui,sans-serif);color:var(--mm-muted);margin:5px 0 0}
.mm-pct{font:400 30px/1 var(--serif,Georgia,serif);margin:0;font-variant-numeric:tabular-nums;white-space:nowrap}
.mm-up .mm-pct{color:var(--mm-up)}.mm-down .mm-pct{color:var(--mm-down)}
.mm-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0;align-items:start}
.mm-pair dt,.mm-facts dt{font:600 11px/1.2 var(--mm-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mm-muted)}
.mm-pair dd,.mm-facts dd{margin:2px 0 0;display:flex;flex-direction:column}
.mm-pair b{font:400 18px/1.2 var(--serif,Georgia,serif);font-variant-numeric:tabular-nums lining-nums}
.mm-pair dd span,.mm-facts dd span{font:500 12px/1.35 var(--mm-mono);color:var(--mm-muted);font-variant-numeric:tabular-nums}
/* "View sales": the homepage's established pink underline (guide-score-link) */
.mm-link{display:inline-flex;align-items:center;min-height:44px;font:700 13px/1.2 var(--sans,system-ui,sans-serif);letter-spacing:.06em;text-transform:uppercase;color:var(--mm-ink);text-decoration:underline;text-decoration-color:var(--mm-pink);text-decoration-thickness:2px;text-underline-offset:4px}
.mm-link:hover{color:var(--mm-pink-dark);text-decoration-color:var(--mm-pink-dark)}
.mm-home a:focus-visible,.mm-page a:focus-visible,.mm-page button:focus-visible,.mm-page input:focus-visible,.mm-page select:focus-visible,.mm-page [tabindex]:focus-visible{outline:3px solid var(--mm-ink);outline-offset:3px}
/* vertical (homepage) card */
.mm-list-v{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.mm-card-v{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto 1fr auto auto;grid-template-areas:"img img" "id pct" "pair pair" "link link";column-gap:12px}
.mm-card-v .mm-img{grid-area:img;height:96px}
.mm-card-v .mm-card-id{grid-area:id;padding:12px 0 0 14px;min-width:0}
.mm-card-v .mm-pct{grid-area:pct;padding:12px 14px 0 0}
.mm-card-v .mm-pair{grid-area:pair;padding:10px 14px 0}
.mm-card-v .mm-link{grid-area:link;padding:0 14px 2px;justify-self:start}
/* horizontal (full page) card */
.mm-list-h{display:flex;flex-direction:column;gap:12px}
.mm-card-h{display:grid;grid-template-columns:176px minmax(0,1fr) auto;grid-template-rows:1fr auto;grid-template-areas:"img id pct" "img pair link";column-gap:16px;row-gap:6px;padding-right:14px}
.mm-card-h .mm-img{grid-area:img;border-bottom:0;border-right:var(--mm-line);min-height:100%}
.mm-card-h .mm-card-id{grid-area:id;padding-top:12px;min-width:0}
.mm-card-h .mm-pct{grid-area:pct;padding-top:12px;text-align:right}
.mm-card-h .mm-pair{grid-area:pair;padding-bottom:10px;max-width:300px}
.mm-card-h .mm-link{grid-area:link;align-self:end;justify-self:end}
.mm-groups{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start;padding-right:4px}
.mm-groups .mm-group+.mm-group{margin-top:0}
/* full page hero + controls */
/* One gutter for the whole page (the site --pad, as on the homepage), so hero, controls, cards and their shadows keep >=20px on phones. */
@media(max-width:700px){.mm-page>.page-width:not(.catalog-head){padding-inline:20px;box-sizing:border-box}}
/* Hero: flat base hero (v7 overrides colors below). Full-bleed
   without changing the shared catalog-head container. */
.mm-page .mm-hero{--mm-hero-bg:#5e3a9e;--mm-hero-ink:#f6f1e7;background:var(--mm-hero-bg);box-shadow:0 0 0 100vmax var(--mm-hero-bg);clip-path:inset(0 -100vmax);color:var(--mm-hero-ink);margin-bottom:22px}
.mm-page .mm-hero :is(.kicker,h1,p){color:var(--mm-hero-ink)}
/* Layered-paper graphic (the catalog-art wash + block layers) carrying the tagline in the handwriting font.
   Decorative angles live here only; the title and explanation stay straight. */
.mm-paper{position:relative;justify-self:center;width:min(100%,420px);height:132px;margin:0;display:grid;place-items:center}
.mm-paper i{position:absolute;inset:14px 6px;background:#c6d8e1;transform:translate(-16px,8px) rotate(-6deg)}
.mm-paper i+i{background:#f1e4a2;border:2px solid var(--mm-ink);transform:translate(12px,-4px) rotate(-3deg)}
.mm-hand{position:relative;font:400 clamp(22px,2.2vw,30px)/1.15 Kalam,'Comic Sans MS',cursive;color:var(--mm-ink);transform:rotate(-3deg);padding:0 28px;text-align:center}
.mm-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding-top:4px;padding-bottom:18px}
.mm-controls p{margin:0}
.mm-periods{display:inline-flex;border:var(--mm-line);background:#f1eee6}
.mm-periods a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;font:700 13px/1 var(--sans,system-ui,sans-serif);letter-spacing:.06em;text-transform:uppercase;color:var(--mm-ink);text-decoration:none}
.mm-periods a+a{border-left:var(--mm-line)}
.mm-periods a[aria-current=true]{background:var(--mm-ink);color:#fff}
.mm-periods a[aria-current=false]:hover{background:#fff;text-decoration:underline;text-decoration-color:var(--mm-pink);text-decoration-thickness:2px;text-underline-offset:5px}
.mm-out{min-height:120px;padding-bottom:8px}
.mm-page>.mm-qual{margin:10px auto 40px}
.mm-skeleton{display:grid;gap:12px}.mm-skeleton i{display:block;height:96px;border:var(--mm-line);background:#f1efe9}
.mm-empty{border:var(--mm-line);background:#fff;padding:18px 20px}
.mm-empty p{margin:0 0 10px;font:500 15px/1.45 var(--sans,system-ui,sans-serif)}
.mm-empty .mm-empty-title{font:400 24px/1.2 var(--serif,Georgia,serif)}
.mm-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:var(--mm-line);background:var(--mm-ink);color:#fff;font:700 13px/1 var(--sans,system-ui,sans-serif);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;cursor:pointer}
.mm-fail{border:var(--mm-line);background:#fff;padding:18px 20px}
/* focused comparison */
.mm-back{display:inline-flex;align-items:center;min-height:44px;font:700 13px/1 var(--sans,system-ui,sans-serif);letter-spacing:.06em;text-transform:uppercase;color:var(--mm-ink);margin-bottom:8px}
.mm-compare-head{box-shadow:var(--mm-shadow);display:grid;grid-template-columns:180px minmax(0,1fr) auto;gap:18px;align-items:center;border:var(--mm-line);background:#fff;padding-right:18px}
.mm-compare-head .mm-img{height:110px;border-bottom:0;border-right:var(--mm-line)}
.mm-compare-head h2{font:400 30px/1.15 var(--serif,Georgia,serif);margin:0;outline:0}
.mm-scope{font:500 13.5px/1.4 var(--sans,system-ui,sans-serif);color:var(--mm-muted);margin:8px 0 0}
.mm-compare-head .mm-pct{font-size:40px;text-align:right}
.mm-compare-head .mm-pct span{display:block;font:500 14px/1.4 var(--sans,system-ui,sans-serif);color:var(--mm-muted);margin-top:4px}
.mm-facts{display:grid;grid-template-columns:1fr 1fr;border:var(--mm-line);border-top:0;background:#fff;margin:0 0 22px;box-shadow:var(--mm-shadow)}
.mm-facts>div{padding:12px 18px}.mm-facts>div+div{border-left:var(--mm-line)}
.mm-facts b{font:400 24px/1.2 var(--serif,Georgia,serif);font-variant-numeric:tabular-nums}
.mm-tabs{display:flex;gap:0;border-bottom:var(--mm-line)}
.mm-tabs button{min-height:44px;padding:0 16px;border:var(--mm-line);border-bottom:0;background:#f1efe9;color:var(--mm-ink);font:700 13px/1 var(--sans,system-ui,sans-serif);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;margin-right:-2px}
.mm-tabs button[aria-selected=true]{background:#fff;position:relative;top:2px;padding-bottom:2px}
.mm-tabs button span{font-weight:500;font-family:var(--mm-mono)}
.mm-search-note{font:500 13px/1.4 var(--sans,system-ui,sans-serif);color:var(--mm-muted);margin:12px 0 0}
/* the shared Market Record list, laid out inline instead of as a full-screen dialog */
.mm-page .v128-records-dialog.mm-records{position:static!important;inset:auto!important;width:auto!important;height:auto!important;max-height:none!important;overflow:visible!important;display:block!important;transform:none!important;z-index:auto!important;border:0!important;padding:0!important;margin:0!important;background:transparent!important}
.mm-page .mm-records .v128-records-nav{position:static!important;display:flex!important;flex-wrap:wrap!important;gap:10px 18px!important;align-items:end!important;padding:14px 0!important;margin:0!important;border:0!important;background:transparent!important}
.mm-page .mm-records .v128-records-scroll{overflow-x:auto!important;overflow-y:visible!important;height:auto!important;max-height:none!important;padding:0!important}
@media(max-width:1100px){.mm-groups{grid-template-columns:1fr}}
@media(max-width:850px){.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:1fr 2fr}.mm-home .mm-banner>a{justify-self:start;grid-column:1/-1}}
@media(max-width:600px){.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:1fr}}
@media(max-width:900px){.mm-list-v{grid-template-columns:1fr;gap:12px}
 .mm-card-v{grid-template-rows:auto 1fr auto;grid-template-columns:116px minmax(0,1fr) auto;grid-template-areas:"img id pct" "img pair pair" "img link link";column-gap:12px;padding-right:12px}
 .mm-card-v .mm-img{height:auto;min-height:100%;border-bottom:0;border-right:var(--mm-line)}
 .mm-card-v .mm-card-id{padding:10px 0 0}.mm-card-v .mm-pct{padding:10px 0 0}.mm-card-v .mm-pair{padding:8px 0 0}.mm-card-v .mm-link{padding:0}
 .mm-compare-head{grid-template-columns:120px minmax(0,1fr);grid-template-areas:"img id" "pct pct";padding-right:0}
 .mm-compare-head .mm-img{grid-area:img;height:96px}.mm-compare-head>div{grid-area:id;padding:10px 12px 10px 0}
 .mm-compare-head .mm-pct{grid-area:pct;text-align:left;border-top:var(--mm-line);padding:12px 16px;font-size:34px}
 .mm-compare-head h2{font-size:24px}}
@media(max-width:600px){.mm-card-h,.mm-card-v{grid-template-rows:auto auto 1fr;grid-template-columns:92px minmax(0,1fr) auto;grid-template-areas:"img id pct" "pair pair pair" "link link link";padding-right:0}
 .mm-card-h .mm-img,.mm-card-v .mm-img{min-height:84px;height:100%}
 .mm-card-h .mm-card-id,.mm-card-v .mm-card-id{padding:10px 0 8px}
 .mm-card-h .mm-pct,.mm-card-v .mm-pct{padding:10px 12px 0 0;font-size:26px}
 .mm-card-h .mm-pair,.mm-card-v .mm-pair{border-top:var(--mm-line);padding:8px 12px 0}
 .mm-card-h .mm-link,.mm-card-v .mm-link{justify-self:start;padding:0 12px}
 .mm-card-h .mm-img{border-right:var(--mm-line)}
 .mm-name{font-size:19px}
 .mm-compare-head{grid-template-columns:92px minmax(0,1fr)}.mm-compare-head .mm-img{height:84px}
 .mm-facts{grid-template-columns:1fr}.mm-facts>div+div{border-left:0;border-top:var(--mm-line)}
 .mm-tabs button{flex:1;padding:0 8px;font-size:12px}
 .mm-paper{height:84px;width:min(100%,300px);justify-self:start;margin-top:14px}.mm-paper i{inset:10px 4px}.mm-hand{font-size:20px}}
/* Shared bordered button: View all Market Movers, Explore Market Movers / Market Data, Show more sales.
   Same box and pale-pink hover as the homepage .guide-home-link>a (Explore all Guides / Stories); visible keyboard focus. */
.mm-hero-cta,.mm-more,.mm-home .mm-banner>a{display:inline-flex!important;align-items:center;box-sizing:border-box;padding:15px 20px!important;border:2px solid #17232b!important;border-radius:0!important;background:#fff!important;color:#17232b!important;box-shadow:4px 4px 0 #17232b!important;font:700 11px/1 var(--sans,"Libre Franklin",sans-serif)!important;letter-spacing:.12em!important;text-transform:uppercase!important;text-decoration:none!important;cursor:pointer;transition:transform .16s,box-shadow .16s,background .16s}
.mm-hero-cta{margin-top:22px}
.mm-hero-cta:hover,.mm-more:hover,.mm-home .mm-banner>a:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #17232b!important;background:#e2bfd0!important;color:#17232b!important}
.mm-hero-cta:focus-visible,.mm-more:focus-visible,.mm-home .mm-banner>a:focus-visible{outline:3px solid #17232b;outline-offset:4px}
.mm-hero .mm-hero-cta:focus-visible{outline-color:#f6f1e7}
@media(prefers-reduced-motion:reduce){.mm-hero-cta,.mm-more,.mm-home .mm-banner>a{transition:none}.mm-hero-cta:hover,.mm-more:hover,.mm-home .mm-banner>a:hover{transform:none}}
.mm-more-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:18px 0 6px}
.mm-more-row p{margin:0;font:500 13px/1.4 var(--sans,system-ui,sans-serif);color:var(--mm-muted)}
/* ===== v6 (Oct 16): typography reuse, catalog cards, softer rows, '90s artwork, whole-card hover ===== */
/* 1. Typography: hero = market-page hero (.rc-market-hero: Newsreader 500, clamp(42px,6vw,92px)/1.02, -.05em; dek Libre Franklin 400);
   car names = Guide-card titles (.model: Newsreader 400 19px, -.055em); supporting text = card copy (Libre Franklin 400). Mono stays for dates/counts/labels. */
.mm-page .mm-hero h1{font-weight:500;font-size:clamp(42px,6vw,92px);line-height:1.02;letter-spacing:-.05em}
.mm-page .mm-hero .catalog-head-copy>p{font:400 clamp(17px,1.6vw,23.04px)/1.5 var(--sans,"Libre Franklin",sans-serif);letter-spacing:normal}
.mm-name{font:400 19px/1.15 var(--serif,Newsreader,Georgia,serif);letter-spacing:-.055em}
.mm-spec{font:400 13px/1.4 var(--sans,"Libre Franklin",sans-serif)}
.mm-page .mm-hero .mm-paper i{background:#c6d8e1;opacity:.4;filter:saturate(.6)}
.mm-page .mm-hero .mm-paper i+i{background:#f1e4a2;opacity:1;filter:saturate(.75) brightness(.96);border-color:#17232b}
/* 5a. One cropped, faint squiggle + halftone patch behind the note (muted pink, original SVG). */
.mm-page .mm-hero .mm-paper::before{content:"";position:absolute;right:-18px;top:-10px;width:170px;height:120px;pointer-events:none;opacity:.22;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='120'%3E%3Cg fill='none' stroke='%23e2bfd0' stroke-width='4' stroke-linecap='round'%3E%3Cpath d='M8 30q14-18 28 0t28 0 28 0 28 0 28 0'/%3E%3Cpath d='M20 62q14-18 28 0t28 0 28 0 28 0'/%3E%3C/g%3E%3Cg fill='%23e2bfd0'%3E%3Ccircle cx='60' cy='96' r='3'/%3E%3Ccircle cx='76' cy='96' r='3.5'/%3E%3Ccircle cx='92' cy='96' r='4'/%3E%3Ccircle cx='108' cy='96' r='4.5'/%3E%3Ccircle cx='124' cy='96' r='5'/%3E%3Ccircle cx='68' cy='110' r='2.5'/%3E%3Ccircle cx='84' cy='110' r='3'/%3E%3Ccircle cx='100' cy='110' r='3.5'/%3E%3Ccircle cx='116' cy='110' r='4'/%3E%3Ccircle cx='132' cy='110' r='4.5'/%3E%3C/g%3E%3C/svg%3E") no-repeat}
@media(max-width:600px){.mm-page .mm-hero .mm-paper::before{right:-10px;width:130px;height:96px;background-size:130px auto}}
/* 3. Homepage catalog cards: taller car panel (space above roof/below wheels; scale is uniform and never fills), pastel carried through, lighter tonal pricing panel. */
.mm-card-v.mm-up{background:#f6e3ec}.mm-card-v.mm-down{background:#e3edf2}
.mm-card-v .mm-img{height:150px}
.mm-card-v{grid-template-rows:auto auto 1fr auto}
.mm-card-v .mm-card-id{padding:14px 0 12px 14px}.mm-card-v .mm-pct{padding:14px 14px 12px 0;text-align:right;align-self:start}
.mm-card-v .mm-pair{background:rgba(255,255,255,.55);border-top:var(--mm-line);padding:12px 14px;margin:0;align-self:stretch}
.mm-card-v .mm-link{padding:4px 14px 6px}
/* 4. Full-page rows: horizontal; warm paper text area, roomier thumbnail, lighter shadow; name leads, % follows, figures beneath. */
.mm-card-h{background:var(--paper,#f1eee6);box-shadow:3px 3px 0 rgba(23,35,43,.7);grid-template-columns:196px minmax(0,1fr) auto;grid-template-rows:auto auto 1fr;grid-template-areas:"img id link" "img pct pct" "img pair pair";row-gap:4px}
.mm-card-h .mm-img{min-height:128px}
.mm-card-h .mm-pct{padding-top:0;text-align:left;font-size:26px}
.mm-card-h .mm-link{align-self:start;justify-self:end;padding-top:4px}
.mm-card-h .mm-pair{padding:6px 0 12px}
/* Whole-card hover: reuses the Stories card rollover (v107 [data-series-start] .journal-card:is(:hover,:focus-visible): full fill, inner panels
   transparent, 5px hard shadow; v43 lift translate(-2px,-2px)); fills from the site's existing hovers (v100 #edc6da pink, v107 #c7deee blue). */
.mm-card.mm-up{--mm-hover:#edc6da}.mm-card.mm-down{--mm-hover:#c7deee}
.mm-card:has(.mm-link:hover){transform:none;box-shadow:var(--mm-shadow)}
.mm-card-h:has(.mm-link:hover){box-shadow:3px 3px 0 rgba(23,35,43,.7)}
@media(hover:hover){.mm-card:has(.mm-link:hover){background:var(--mm-hover)!important;transform:translate(-2px,-2px);box-shadow:5px 5px 0 #17232b}
 .mm-card:has(.mm-link:hover) :is(.mm-img,.mm-pair){background:transparent}}
.mm-card:has(.mm-link:focus-visible){background:var(--mm-hover)!important;transform:translate(-2px,-2px);box-shadow:5px 5px 0 #17232b}
.mm-card:has(.mm-link:focus-visible) :is(.mm-img,.mm-pair){background:transparent}
@media(prefers-reduced-motion:reduce){.mm-card:has(.mm-link:hover),.mm-card:has(.mm-link:focus-visible){transform:none!important}}
/* 5b. Homepage section: sparse dots + short squiggles near the outer edges only, existing muted pink/blue at 8%; no extra height. */
.mm-home{position:relative;isolation:isolate}
@media(max-width:600px){.mm-card-h{grid-template-columns:92px minmax(0,1fr) auto;grid-template-areas:"img id pct" "pair pair pair" "link link link"}.mm-card-h .mm-pct{text-align:right;padding:10px 12px 0 0}.mm-card-h .mm-img{min-height:92px}.mm-card-h .mm-link{justify-self:start}
 .mm-card-v .mm-img{min-height:104px}.mm-card-v .mm-pair{padding:8px 12px}.mm-card-v .mm-card-id{padding:10px 0 8px}}
@media(max-width:900px) and (min-width:601px){.mm-card-v .mm-img{height:auto}.mm-card-v .mm-pair{border-top:0}}
/* Direction labels: Dealers elbow arrow (ink outline 5, hard offset shadow). Up: --pink #ff2f87 fill, muted pink #e2bfd0 shadow; down: --blue #118bd0 fill, pale blue #c6d8e1 shadow. */
.mm-group-head::before{content:none}
.mm-dir-arrow{width:22px;height:22px;flex:none;overflow:visible}
.mm-dir-up .pa-fill{fill:#ff2f87}.mm-dir-up .pa-shadow{fill:#e2bfd0}
.mm-dir-down .pa-fill{fill:#118bd0}.mm-dir-down .pa-shadow{fill:#c6d8e1}
/* ===== v7 (Oct 16) ===== */
/* Hero: the Guide-shelf card pale blue (v48 .guide-shelf-grid a #d7e8f4) with dark ink (12.76:1); eyebrow in the site's existing dark pink #b51e63 (5.03:1;
   site pink #ff2f87 is 2.79:1 and #c9236c 4.25:1, both below AA for 12px text). Yellow note and white button unchanged. */
.mm-page .mm-hero{--mm-hero-bg:#d7e8f4;--mm-hero-ink:#17232b}
.mm-page .mm-hero .kicker{color:#b51e63}
.mm-hero .mm-hero-cta:focus-visible{outline-color:#17232b}
/* Hero artwork re-tuned for the pale blue: muted-pink back layer, yellow note as-is, faint blue patch. */
.mm-page .mm-hero .mm-paper i{background:#e2bfd0;opacity:.7;filter:none}
.mm-page .mm-hero .mm-paper i+i{background:#f1e4a2;opacity:1;filter:none}
.mm-page .mm-hero .mm-paper::before{opacity:.16;filter:hue-rotate(150deg) saturate(3) brightness(.55)}
/* Homepage cards: one shared row grid (subgrid) so names/specs reserve the same height and every pricing panel's top rule lines up per row;
   spec text reserves two lines (never clipped). */
.mm-list-v{grid-auto-rows:auto}
.mm-card-v{grid-row:span 4;grid-template-rows:subgrid;row-gap:0}
.mm-card-v .mm-spec{min-height:calc(2em*1.4)}
/* Pastel body + lighter pricing panel in every state (hover/focus keep the light panel over the hover fill). */
.mm-card-v .mm-pair,.mm-card-v:has(.mm-link:hover) .mm-pair,.mm-card-v:has(.mm-link:focus-visible) .mm-pair{background:rgba(255,255,255,.55)}
@media(max-width:900px){.mm-card-v{grid-row:auto;grid-template-rows:auto auto 1fr}}
@media(max-width:600px){.mm-card-v{grid-template-rows:auto auto 1fr}}

/* ===== v8 (Oct 17) ===== */
/* Guide cards (home-v2 .market-showcase .market-show-card): 2px #17232b border, no resting shadow; hover lift -2px + 5px 5px 0 #17232b;
   title .model Newsreader 400 19px/1.08, -.055em; score panel rgba(255,255,255,.4) under a 2px rule. */
.mm-card,.mm-card-h{border:2px solid #17232b;box-shadow:none}
.mm-card:has(.mm-link:hover),.mm-card-h:has(.mm-link:hover){box-shadow:none}
@media(hover:hover){.mm-card:has(.mm-link:hover){transform:translate(-2px,-2px);box-shadow:5px 5px 0 #17232b}}
.mm-card:has(.mm-link:focus-visible){box-shadow:5px 5px 0 #17232b}
.mm-name{font:400 19px/1.08 var(--serif,Newsreader,Georgia,serif);letter-spacing:-.055em}
.mm-card-v .mm-pair,.mm-card-v:has(.mm-link:hover) .mm-pair,.mm-card-v:has(.mm-link:focus-visible) .mm-pair{background:rgba(255,255,255,.4)}
/* One restrained edge treatment: sparse dots in the outer gutters only (clear of text and cards), muted pink left / blue right at 8%. */
.mm-home::before,.mm-home::after{content:"";position:absolute;z-index:-1;pointer-events:none;opacity:.04;top:120px;width:40px;height:240px;background-repeat:no-repeat}
.mm-home::before{left:calc((var(--mm-gutter) - 40px)/2);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='240'%3E%3Cg fill='%23c9236c'%3E%3Ccircle cx='10' cy='14' r='4'/%3E%3Ccircle cx='28' cy='62' r='3'/%3E%3Ccircle cx='12' cy='118' r='4.5'/%3E%3Ccircle cx='26' cy='176' r='3'/%3E%3Ccircle cx='14' cy='226' r='4'/%3E%3C/g%3E%3C/svg%3E")}
.mm-home::after{right:calc((var(--mm-gutter) - 40px)/2);top:auto;bottom:80px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='240'%3E%3Cg fill='%230d78b5'%3E%3Ccircle cx='30' cy='20' r='3.5'/%3E%3Ccircle cx='12' cy='80' r='4'/%3E%3Ccircle cx='28' cy='140' r='3'/%3E%3Ccircle cx='14' cy='200' r='4.5'/%3E%3C/g%3E%3C/svg%3E")}
@media(max-width:1100px){.mm-home::before,.mm-home::after{display:none}}
/* Section spacing: the neighboring homepage rail (.market-showcase) uses 49px; the body ends on the same rhythm. */
.mm-home-body.page-width{padding-bottom:49px}
/* "How cars make the cut" inline disclosure: body type, dark ink, thin rule, ~65ch; no box, modal or animation. */
.mm-cut{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 0 12px}
.mm-cut-intro{margin:0;font:400 15px/1.5 var(--sans,"Libre Franklin",sans-serif);color:var(--mm-ink)}
.mm-cut-toggle{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0;border:0;background:none;color:var(--mm-ink);font:600 15px/1.3 var(--sans,"Libre Franklin",sans-serif);cursor:pointer;text-decoration:underline;text-decoration-color:var(--mm-pink);text-decoration-thickness:2px;text-underline-offset:4px}
.mm-cut-toggle:hover{color:var(--mm-pink-dark)}
.mm-cut-toggle:focus-visible{outline:3px solid var(--mm-ink);outline-offset:3px}
.mm-cut-sign{display:inline-block;width:1ch;font-weight:700;text-decoration:none}
.mm-cut-panel{max-width:65ch;border-top:1px solid var(--mm-ink);padding:12px 0 4px;margin:0 0 16px}
.mm-cut-panel p{margin:0 0 10px;font:400 15px/1.6 var(--sans,"Libre Franklin",sans-serif);color:var(--mm-ink)}
.mm-cut-wrap{padding-top:4px}
@media(max-width:700px){.mm-cut{flex-direction:column;align-items:flex-start;gap:0}}
/* Hero feature: the top mover's cutout over the tilted yellow paper (replaces the handwritten note). */
.mm-page .mm-hero .mm-feature{height:auto;min-height:220px;width:min(100%,440px)}
.mm-feature[hidden]{display:none!important}
.mm-page .mm-hero .mm-feature::before{z-index:0}
.mm-feature-body{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"img img" "label label" "name pct" "link link";column-gap:12px;width:100%;padding:18px 34px 14px;box-sizing:border-box;transform:rotate(-3deg)}
.mm-feature .mm-img{grid-area:img;height:110px;background:transparent!important;border:0}
.mm-page .mm-hero .mm-feature-label{grid-area:label;display:flex;align-items:center;gap:6px;margin:4px 0 2px;font:600 11px/1.2 var(--mm-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mm-ink)}
.mm-feature-label .mm-dir-arrow{width:18px;height:18px}
.mm-page .mm-hero .mm-feature-name{grid-area:name;margin:0;font:400 19px/1.08 var(--serif,Newsreader,Georgia,serif);letter-spacing:-.055em;color:var(--mm-ink)!important;min-width:0}
.mm-page .mm-hero .mm-feature-pct{grid-area:pct;margin:0;font:400 26px/1 var(--serif,Newsreader,Georgia,serif);font-variant-numeric:tabular-nums;white-space:nowrap}
.mm-feature.mm-up .mm-feature-pct{color:var(--mm-up)!important}.mm-feature.mm-down .mm-feature-pct{color:var(--mm-down)!important}
.mm-feature .mm-link{grid-area:link;justify-self:start;min-height:40px;position:relative}
.mm-feature .mm-link::after{content:none}
@media(max-width:600px){.mm-page .mm-hero .mm-feature{min-height:0;width:100%;justify-self:stretch;margin-top:12px}
 .mm-feature-body{grid-template-columns:96px minmax(0,1fr) auto;grid-template-areas:"img label label" "img name pct" "img link link";padding:12px 18px;transform:rotate(-2deg)}
 .mm-feature .mm-img{height:64px;align-self:center}.mm-page .mm-hero .mm-feature-name{font-size:17px}.mm-page .mm-hero .mm-feature-pct{font-size:22px}.mm-feature .mm-link{min-height:36px}}
/* Space is reserved while the build loads (no layout shift); an empty period hides the feature entirely. */
.mm-feature.is-pending{visibility:hidden}
@media(max-width:600px){.mm-page .mm-hero .mm-feature{min-height:118px}}
/* ===== v9 (Oct 17) ===== */
/* Homepage banner without the tagline column (the intro now sits beside the disclosure). */
.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:1fr 4fr auto}
@media(max-width:850px){.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:1fr 2fr}}
@media(max-width:600px){.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:1fr}}
/* Hero feature: car, label, name and figures stay level; only the yellow paper behind is rotated. */
.mm-feature-body{transform:none!important}
/* Phones: wider image column, image panel spans the name rows and the car is centered (JS); names wrap at word boundaries. */
@media(max-width:600px){.mm-card-h,.mm-card-v{grid-template-columns:128px minmax(0,1fr) auto}
 .mm-card-h .mm-img,.mm-card-v .mm-img{min-height:96px;align-self:stretch}
 .mm-name{overflow-wrap:break-word;word-break:normal;hyphens:manual}}
/* ===== v10 (Oct 17) ===== */
/* Row/compact cards (full-page rows at every width; homepage cards on phones): car left; right column = name (full width, wraps),
   percentage beneath it, then specifications; the two-column Previous/Latest panel is unchanged. Text sizes unchanged. */
.mm-card-h .mm-card-id{display:contents}
.mm-card-h .mm-name{grid-area:name;padding-top:12px;min-width:0}
.mm-card-h .mm-spec{grid-area:spec;margin:2px 0 0;min-width:0}
.mm-card-h{grid-template-rows:auto auto auto 1fr;grid-template-areas:"img name link" "img pct pct" "img spec spec" "img pair pair"}
.mm-card-h .mm-pct{grid-area:pct;text-align:left;padding:2px 0 0}
@media(max-width:600px){
 .mm-card-v .mm-card-id{display:contents}
 .mm-card-h,.mm-card-v{grid-template-columns:128px minmax(0,1fr);grid-template-rows:auto auto auto auto auto;grid-template-areas:"img name" "img pct" "img spec" "pair pair" "link link";column-gap:12px;padding-right:0}
 .mm-card-h .mm-img,.mm-card-v .mm-img{grid-row:1/4}
 .mm-card-h .mm-name,.mm-card-v .mm-name{grid-area:name;padding:10px 12px 0 0;min-width:0}
 .mm-card-h .mm-pct,.mm-card-v .mm-pct{grid-area:pct;text-align:left;padding:4px 12px 0 0;align-self:start}
 .mm-card-h .mm-spec,.mm-card-v .mm-spec{grid-area:spec;margin:4px 0 0;padding:0 12px 10px 0;min-height:0}
 .mm-card-h .mm-pair,.mm-card-v .mm-pair{grid-area:pair}
 .mm-card-h .mm-link,.mm-card-v .mm-link{grid-area:link;justify-self:start;padding:0 12px}}
/* Hero feature: larger percentage only (cards unchanged). */
.mm-page .mm-hero .mm-feature-pct{font-size:40px}
@media(max-width:600px){.mm-page .mm-hero .mm-feature-pct{font-size:32px}}
@media(max-width:600px){.mm-feature-body{grid-template-columns:96px minmax(0,1fr);grid-template-areas:"img label" "img name" "img pct" "img link"}.mm-page .mm-hero .mm-feature-pct{margin-top:2px}}
/* ===== v11 (Oct 17) ===== */
/* Shared site gutter on /market-movers/: the homepage --home-gutter (home-entry-review.css: clamp(24px,5vw,72px); 20px on phones),
   the same left edge as the homepage sections and the market-page hero. */
.mm-page{--mm-gutter:clamp(24px,5vw,72px)}
@media(max-width:700px){.mm-page{--mm-gutter:20px}}
.mm-page>.page-width{width:100%!important;max-width:none!important;margin-inline:0!important;padding-inline:var(--mm-gutter)!important;box-sizing:border-box}
/* ===== v12 (Oct 17) ===== */
/* Intro + "How cars make the cut" match the RevCounter Score intro (<p> Libre Franklin 400 15px/1.45 ink) and its
   "How the score works →" link (home-v2 .guide-score-link: 500 15px/1.4, 2px #ff2f87 underline rule, hover #c9236c); button on its own line. */
.mm-cut{display:block;margin:0 0 14px}
.mm-cut-intro{margin:0 0 4px;font:400 15px/1.45 var(--sans,"Libre Franklin",sans-serif);color:#17232b}
.mm-cut-toggle{display:inline-block;min-height:0;padding:0 0 2px;border:0;border-bottom:2px solid #ff2f87;background:none;color:#17232b;font:500 15px/1.4 var(--sans,"Libre Franklin",sans-serif);text-decoration:none;cursor:pointer}
.mm-cut-toggle:hover{color:#c9236c;border-bottom-color:#c9236c}
.mm-cut-sign{display:inline;width:auto;font-weight:500}
@media(max-width:700px){.mm-cut{flex-direction:initial}.mm-cut-toggle{font-size:14px}}
/* Expanded copy spans to the right edge of the last card column (the card grid's full width); readable cap on huge screens. */
.mm-cut-panel{max-width:min(100%,1400px)}
.mm-cut-panel p,.mm-cut-updated{max-width:none}
/* Dates: own line, site data style (mono), separators spaced; the period label stays visible. */
.mm-period-line strong{display:block;margin-bottom:2px}
[data-mm-dates] span[aria-hidden]{padding:0 .35em}
.mm-controls{column-gap:24px}
/* Empty state: muted mint (Guide cards #c8e9dc); its button yellow (site --yellow #ffd426), hover muted pink #e2bfd0. */
.mm-empty{background:#c8e9dc}
.mm-empty .mm-btn{background:#ffd426;color:#17232b;border-color:#17232b}
.mm-empty .mm-btn:hover{background:#e2bfd0;color:#17232b}
/* Stale notice: muted yellow paper #f1e4a2 with a muted-pink #e2bfd0 edge. */
.mm-note{background:#f1e4a2;border-left-color:#e2bfd0}
/* Cards: faint ink dots (8%) across the card body; the image panel and price panel keep their own fills. */
.mm-card{background-image:radial-gradient(rgba(23,35,43,.04) 1.2px,transparent 1.6px);background-size:10px 10px}
.mm-card-h .mm-pair{background:transparent}
/* Hero feature: label/name top aligned with the % top; car a little lower and larger (level; paper stays rotated). */
.mm-feature-body{grid-template-areas:"img img" "label pct" "name pct" "link link"}
.mm-page .mm-hero .mm-feature-pct{align-self:start;margin-top:4px}
.mm-page .mm-hero .mm-feature-label{margin-top:8px}
.mm-feature .mm-img{height:132px;margin-top:10px}
@media(max-width:600px){.mm-feature-body{grid-template-areas:"img label" "img name" "img pct" "img link"}.mm-feature .mm-img{height:76px;margin-top:6px}.mm-page .mm-hero .mm-feature-label{margin-top:0}}
.mm-page .mm-cut-panel{max-width:min(calc(100% - 4px),1400px)}
/* ===== v13 (Oct 17): "View sales" detail view ===== */
/* Header and medians boxes: pale blue (v7 hero / Guide-shelf #d7e8f4) with faint muted-pink (#e2bfd0) dots at ~8% visual weight; text unchanged. */
.mm-compare-head,.mm-facts{background-color:#d7e8f4;background-image:radial-gradient(rgba(226,191,208,.25) 1.6px,transparent 2px);background-size:12px 12px}
.mm-compare-head .mm-img{background-image:none}
/* Supporting-sales table area stays white for legibility (inside the shared Market Record list). */
/* Intro layout + type as v12: scope line in body type, period ranges in the mono data style. */
.mm-scope{font:400 15px/1.45 var(--sans,"Libre Franklin",sans-serif);color:#17232b}
.mm-facts dd span{font:500 12.5px/1.4 var(--mm-mono);letter-spacing:.02em;color:var(--mm-muted)}
.mm-search-note{font:400 15px/1.45 var(--sans,"Libre Franklin",sans-serif);color:#17232b}
/* Period tabs: selected pale blue #d7e8f4; hover muted pink #e2bfd0 with dark ink text (9.6:1); focus ring kept. */
.mm-tabs button{background:#f1eee6;color:#17232b}
.mm-tabs button[aria-selected=true]{background:#d7e8f4}
.mm-tabs button:hover{background:#e2bfd0;color:#17232b}
.mm-tabs button:focus-visible{outline:3px solid #17232b;outline-offset:2px;position:relative;z-index:1}
/* v13b: selected and hover tabs use the supporting-sales table's row-hover pink #e1becd (--market-ruby, ink text 9.49:1); pale-blue selected dropped. */
.mm-tabs button[aria-selected=true],.mm-tabs button:hover{background:#e1becd;color:#17232b}
/* ===== v14 (Oct 17, t656) ===== */
/* Handwritten margin note (Collections-card hand font, much smaller): muted ink, slightly angled, attached to the big heading. */
.mm-hand-note{margin:0;font:400 17px/1.2 var(--hand,Kalam),Kalam,'Comic Sans MS',cursive!important;color:#6b7479!important;transform:rotate(-3deg);transform-origin:left center;letter-spacing:0;white-space:nowrap}
.mm-page .mm-hero .mm-hand-note{margin:2px 0 0 clamp(40px,10vw,180px);font-size:19px!important;color:#5b6a73!important}
.mm-page .mm-hero .mm-hand-note+p{margin-top:14px}
.mm-home .mm-title{min-width:0}
.mm-home .mm-title .mm-hand-note{margin:4px 0 0 18%;white-space:normal}
/* Homepage intro = Collections banner (Ten ways in.): label | heading | copy, button at the right. */
.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:1fr 2fr 3fr auto;align-items:start}
.mm-home .mm-banner>a{align-self:center}
.mm-home .mm-intro>p{margin:0;max-width:none}
.mm-home .mm-cut-panel p{margin:0 0 10px}
.mm-home .mm-intro .mm-cut{margin:8px 0 0}
.mm-intro .mm-cut-toggle{font-size:14px}
.mm-home .mm-cut-panel{margin:12px 0 0;max-width:none}
@media(max-width:850px){.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:1fr 2fr}.mm-home .mm-intro{grid-column:1/-1}}
@media(max-width:600px){.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:1fr}.mm-home .mm-banner>a{justify-self:start}.mm-home .mm-title .mm-hand-note{margin-left:30%}}
/* Expander footnote: the selected period's windows, small and muted. */
.mm-cut-panel .mm-cut-dates{margin:6px 0 0;font:500 12.5px/1.5 var(--mm-mono)!important;letter-spacing:.02em;color:var(--mm-muted)!important;font-variant-numeric:tabular-nums}
.mm-cut-dates:empty{display:none}
/* 90/30 tabs: selected = table row-hover pink #e1becd (as the detail tabs); hover = the white buttons' hover pink #e2bfd0. Same on list and detail. */
.mm-periods{background:#f1eee6}
.mm-periods a[aria-current=true]{background:#e1becd;color:#17232b}
.mm-periods a[aria-current=false]:hover{background:#e2bfd0;color:#17232b;text-decoration:none}
.mm-tabs button:hover{background:#e2bfd0}
.mm-tabs button[aria-selected=true]{background:#e1becd}
/* Supporting-sales table: wheel/trackpad scrolling passes through to the page (no scroll trap); horizontal scroll kept for narrow screens. */
.mm-page .mm-records .v128-records-scroll{overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior:auto!important;scrollbar-gutter:auto!important}
/* Sticky table header (desktop, >=1024px where both tables fit): the header row sticks just under the sticky site header (--mm-head-h, measured by
   market-movers.js) and scrolls away with the table's end (sticky is bounded by its table). The container must not be a scroll box here. */
@media(min-width:1024px){.mm-page .mm-records .v128-records-scroll{overflow:visible!important}
 .mm-page #mm-tabpanel .evidence-table thead th{position:sticky;top:var(--mm-head-h,96px);z-index:3}}
/* ===== v15 (Oct 17, t661) ===== */
/* Expander dates lighter. */
.mm-cut-panel .mm-cut-dates{color:#7b858a!important}
/* /market-movers/ body: [90 DAYS | 30 DAYS] + "How cars make the cut" on one row (wraps on phones); panel full width below. */
.mm-page .mm-controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;padding-top:4px;padding-bottom:18px}
.mm-page .mm-controls .mm-cut{margin:0}
.mm-page .mm-controls .mm-cut-panel{flex:0 0 100%;margin:0}
/* ===== v16 (Oct 17) ===== */
/* Disclosure chevron (⌄ closed / ⌃ open) beside "How cars make the cut". */
.mm-cut-sign{display:inline-block;margin-left:2px;font-weight:600;line-height:1;transform:translateY(-1px)}
.mm-cut-toggle[aria-expanded=true] .mm-cut-sign{transform:translateY(3px)}
/* ===== v17 (Oct 17): homepage compact cards ===== */
/* Homepage only (.mm-home .mm-card-v): shorter car panel, no spec line, tighter padding; same grid, colors, hover and link. */
.mm-home .mm-card-v .mm-img{height:100px}
.mm-home .mm-card-v .mm-card-id{padding:10px 0 8px 14px}.mm-home .mm-card-v .mm-pct{padding:10px 14px 8px 0;font-size:26px}
.mm-home .mm-card-v .mm-pair{padding:8px 14px}
.mm-home .mm-card-v .mm-pair b{font-size:17px}
.mm-home .mm-card-v .mm-link{min-height:38px;padding:2px 14px 4px}
.mm-home .mm-list-v{gap:14px}
@media(max-width:900px) and (min-width:601px){.mm-home .mm-card-v .mm-img{height:auto}}
@media(max-width:600px){.mm-home .mm-card-v{grid-template-columns:104px minmax(0,1fr);grid-template-areas:"img name" "img pct" "pair pair" "link link";grid-template-rows:auto auto auto auto}
 .mm-home .mm-card-v .mm-img{grid-row:1/3;min-height:76px;height:auto}
 .mm-home .mm-card-v .mm-name{padding:10px 12px 0 0}.mm-home .mm-card-v .mm-pct{padding:2px 12px 8px 0;font-size:24px}
 .mm-home .mm-card-v .mm-pair{padding:8px 12px}.mm-home .mm-card-v .mm-link{padding:0 12px}}
/* ===== v18 (Oct 17, t665) ===== */
/* Homepage compact cards: car panel +11% (100 -> 111px; phones 76 -> 84px). */
.mm-home .mm-card-v .mm-img{height:111px}
@media(max-width:900px) and (min-width:601px){.mm-home .mm-card-v .mm-img{height:auto}}
@media(max-width:600px){.mm-home .mm-card-v .mm-img{height:auto;min-height:84px}}
/* Empty state: quiet neutral box (off-white #fbfaf6, ink rule) instead of mint; button in the site's muted yellow #f1e4a2, hover muted pink #e2bfd0. */
.mm-empty{background:#fbfaf6}
/* Class avoids "btn" so the site's link-arrow script (v94) keeps the copy's →. */
.mm-empty .mm-empty-action{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:2px solid #17232b;background:#f1e4a2;color:#17232b;font:600 14px/1 var(--sans,"Libre Franklin",sans-serif);text-decoration:none;cursor:pointer}
.mm-empty .mm-empty-action:hover,.mm-empty .mm-empty-action:focus-visible{background:#e2bfd0;color:#17232b}
/* ===== v21 (Oct 17): homepage title on one line on desktop at the shared section-heading size (never shrunk);
   the title column sizes to the heading and the copy column takes the rest. Phones wrap naturally. */
@media(min-width:1100px){.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{grid-template-columns:minmax(0,1fr) max-content minmax(0,3fr) auto}
 .mm-home #mm-home-title{white-space:nowrap}}
/* v22 (t679): kicker centered on the headline like Ten ways in. (grid align-items:center on kicker + h2).
   The title wrapper dissolves into the banner grid so h2 shares row 1 with the kicker; the hand note takes row 2 under it. */
@media(min-width:601px){.mm-home .collections-home-banner.mm-banner.guide-home-link.page-width{row-gap:0}
 .mm-home .mm-title{display:contents}
 .mm-home .mm-banner>.kicker{grid-column:1;grid-row:1;align-self:center;margin-top:8px}
 .mm-home .mm-banner h2{grid-column:2;grid-row:1;align-self:center}
 .mm-home .mm-title .mm-hand-note{grid-column:2;grid-row:2;align-self:start}}
@media(min-width:851px){.mm-home .mm-intro{grid-column:3;grid-row:1/span 2;align-self:start}.mm-home .mm-banner>a{grid-column:4;grid-row:1/span 2}}
@media(min-width:601px) and (max-width:850px){.mm-home .mm-intro{grid-row:3;margin-top:1.5rem}}

/* RC placeholder for cars without card art (David t-override 2026-10-17: keep qualifying cars, no exclusion). */
.mm-img-ph{display:grid;place-items:center}.mm-ph-mark{font:700 clamp(28px,4vw,44px)/1 Newsreader,Georgia,serif;letter-spacing:.02em;color:rgba(20,30,35,.22)}

/* ===== Oct 18 (David t718) ===== */
/* "← All Market Movers" back link: hover/focus color = the page's link-hover pink (same as .mm-link:hover). */
.mm-back{transition:color .15s}.mm-back:hover,.mm-back:focus-visible{color:var(--mm-pink-dark);text-decoration:underline;text-decoration-color:var(--mm-pink-dark);text-underline-offset:4px}
/* Supporting-sales search box 30% wider (148px -> 193px) so "Year, version, VIN or source" is not cut off. */
.mm-page .mm-records .v128-record-search{flex:0 0 auto!important;width:193px!important;max-width:100%!important}.mm-page .mm-records .v128-record-search input{width:100%!important}
/* "Median calculated from all N sales": smaller, lighter grey. */
.mm-page .mm-search-note{font:400 12.5px/1.45 var(--sans,"Libre Franklin",sans-serif);color:#858e94}
/* No-image placeholder: the site's Bad Ideas poster art (assets/editorial/bad-ideas-poster.svg) without the "EXCELLENT MACHINES. QUESTIONABLE GUEST LIST." line. */
.mm-img-ph{background:#efe9da!important}.mm-img .mm-ph-art{position:absolute!important;inset:0!important;left:0!important;bottom:auto!important;opacity:1!important;display:block;width:100%!important;height:100%!important;object-fit:contain;object-position:center}

/* Fill-in cars (.mm-fill) look exactly like other movers (t746): no styling. */
/* Homepage rows (t821), desktop only; phones keep the compact stacked cards. Every row uses the 3-up upright card width and
   proportions; incomplete rows (1 or 2 cards) are centered. A single card is never a full-width horizontal strip. */
@media(min-width:901px){
 .mm-list-v.mm-n-1{grid-template-columns:calc((100% - 2*16px)/3);justify-content:center}
 .mm-home .mm-list-v.mm-n-1{grid-template-columns:calc((100% - 2*14px)/3)}
}
.mm-hero-cta[hidden]{display:none!important}

/* ===== Oct 18 (David t752) ===== */
/* Two cards in a row: the same width/height/car scale as a 3-up card, centered together (not stretched). */
@media(min-width:901px){
 .mm-list-v.mm-n-2{grid-template-columns:repeat(2,calc((100% - 2*16px)/3));justify-content:center}
 .mm-home .mm-list-v.mm-n-2{grid-template-columns:repeat(2,calc((100% - 2*14px)/3))}
}
/* "How cars make the cut": homepage panel opens beneath the whole heading row; title and button stay put. */
.mm-home .mm-banner>.mm-cut-panel{grid-column:1/-1;grid-row:auto;margin:16px 0 0;max-width:none}
@media(min-width:851px){.mm-home .mm-banner>.mm-cut-panel{grid-row:3}}
/* Sentence-case card labels (View sales →, Previous, Latest), like the site's other text links and labels. */
.mm-link,.mm-pair dt,.mm-facts dt{text-transform:none!important;letter-spacing:0!important}
.mm-pair dt,.mm-facts dt{font:600 12px/1.2 var(--sans,"Libre Franklin",sans-serif)!important}
/* Handwritten line: beneath the title in the left column, in the hero eyebrow's dark magenta. */
.mm-page .mm-hero .mm-hand-note{margin:2px 0 0 4px;color:#b51e63!important}
.mm-home .mm-title .mm-hand-note,.mm-home .mm-banner .mm-hand-note{margin-left:4px;color:#b51e63!important}
@media(max-width:600px){.mm-home .mm-title .mm-hand-note{margin-left:4px}}
/* Period tabs and supporting-sales tabs reuse the E46 guide tab styling (.rc-diagnostic .rc-spec-tabs). */
.mm-periods{display:inline-flex;gap:0;border:0!important;background:none!important;border-bottom:1px solid #17232b!important}
.mm-tabs{border-bottom:1px solid #17232b!important;gap:0}
.mm-periods a,.mm-tabs button{font:600 14px/1.3 var(--sans,"Libre Franklin",sans-serif)!important;letter-spacing:normal!important;text-transform:none!important;min-height:43px;padding:12px 25px!important;border:1px solid #17232b!important;border-bottom:0!important;background:#c9dbe1!important;color:#17232b!important;border-radius:0;position:relative;top:auto;bottom:-1px;box-shadow:none!important;text-decoration:none!important;margin-right:-1px;box-sizing:border-box}
.mm-periods a+a{border-left:1px solid #17232b!important}
.mm-periods a[aria-current=true],.mm-tabs button[aria-selected=true]{background:#f3f3ed!important;border-bottom:1px solid #f3f3ed!important;box-shadow:inset 0 3px #dd2c83!important;padding-bottom:12px!important}
.mm-periods a[aria-current=false]:hover,.mm-tabs button[aria-selected=false]:hover{background:#dcd4e4!important;color:#17232b!important;text-decoration:none!important}
.mm-periods a:focus-visible,.mm-tabs button:focus-visible{outline:2px solid #c62776;outline-offset:-6px}
.mm-tabs button span{font:inherit!important}
@media(max-width:600px){.mm-periods a,.mm-tabs button{font-size:13px!important;padding:11px 12px!important}}
/* Supporting-sales table: Market Record table typography (sizes/weights already shared via market-record-list.js); same ink. */
.mm-page .mm-records table td,.mm-page .mm-records table td *{color:#11110f}
.mm-page .mm-records table td small{color:#5d625b}

/* ===== Oct 18 (David t765) ===== */
/* Expanded "How cars make the cut": copy runs the full width of its rule (responsive, no character cap). */
.mm-cut-panel p,.mm-home .mm-cut-panel p,.mm-page .mm-cut-panel p{max-width:none!important}
.mm-page .mm-controls .mm-cut-panel,.mm-home .mm-banner>.mm-cut-panel{width:100%;max-width:none!important;box-sizing:border-box}
/* Tabs: closed rectangles (bottom border too), text vertically centered; same states everywhere. */
.mm-periods{border-bottom:0!important;align-items:stretch}
.mm-periods a,.mm-tabs button{display:inline-flex!important;align-items:center;justify-content:center;line-height:1.3!important}
.mm-periods a,.mm-periods a[aria-current=true]{border-bottom:1px solid #17232b!important;bottom:auto!important;padding-top:0!important;padding-bottom:0!important}
.mm-tabs button{padding-top:0!important;padding-bottom:0!important}
/* Individual mover view: top period tabs move into the Find a record row; toggle sits under the comparison box. */
[data-mm-cohort-view] .mm-controls{display:none}
.mm-records-nav{display:flex!important;flex-wrap:wrap;align-items:flex-end;gap:12px 20px}
.mm-rec-periods{margin-left:auto}
.mm-page .mm-records .v128-record-search{width:251px!important}
.mm-cut-slot{display:flex;flex-direction:column;align-items:flex-end;padding:10px 18px 0;margin:0 0 14px}
.mm-cut-slot .mm-cut{margin:0}
.mm-cut-slot .mm-cut-panel{align-self:stretch;margin:10px 0 0}
@media(max-width:600px){.mm-rec-periods{margin-left:0}.mm-cut-slot{padding:10px 12px 0}}
/* Hand-drawn line in the Market Movers blue token. */
.mm-page .mm-hero .mm-hand-note,.mm-home .mm-title .mm-hand-note,.mm-home .mm-banner .mm-hand-note{color:var(--mm-down)!important}
.mm-tabs button{gap:.3em}
/* ===== Oct 18 (David t768) ===== */
/* "Find a record" label at the size of the "Median calculated from all N sales" line below it. */
.mm-page .mm-records .v128-record-search{font-size:12.5px!important}
/* Held-back period on an individual mover: message sits in the table area. */
.mm-records-held .mm-held{margin:14px 0 24px;font:400 15px/1.5 var(--sans,"Libre Franklin",sans-serif);color:#17232b}
/* Market Movers page: Moving up / Moving down headings in their arrow colors. */
.mm-page .mm-group-up .mm-group-head{color:#ff2f87}
.mm-page .mm-group-down .mm-group-head{color:#118bd0}
/* t790 spec line placement: the gearbox line sits directly beneath the car name on homepage phone cards and in the hero (no implicit grid column). */
.mm-feature .mm-feature-spec{grid-area:spec;margin:2px 0 0;min-width:0}
.mm-feature-body{grid-template-areas:"img img" "label pct" "name pct" "spec spec" "link link"}
@media(max-width:600px){.mm-feature-body{grid-template-areas:"img label" "img name" "img spec" "img pct" "img link"}
 .mm-home .mm-card-v{grid-template-areas:"img name" "img spec" "img pct" "pair pair" "link link";grid-template-rows:auto auto auto auto auto}
 .mm-home .mm-card-v .mm-img{grid-row:1/4}
 .mm-home .mm-card-v .mm-spec{grid-area:spec;margin:2px 0 0;padding:0 12px 0 0;min-height:0}}
.mm-card-h{grid-template-areas:"img name link" "img spec spec" "img pct pct" "img pair pair"}
.mm-card-h .mm-spec{margin:2px 0 0}
@media(max-width:600px){.mm-card-h,.mm-page .mm-card-v{grid-template-areas:"img name" "img spec" "img pct" "pair pair" "link link"}
 .mm-card-h .mm-spec,.mm-page .mm-card-v .mm-spec{margin:2px 0 0;padding:0 12px 0 0}
 .mm-card-h .mm-pct,.mm-page .mm-card-v .mm-pct{padding:4px 12px 10px 0}}
/* t861: phones only - Moving up and Moving down are separate carousels (homepage Collections carousel: column flow,
   88vw cards, hidden scrollbar, v42.js controls); each label sits above its own carousel, generous space between. */
@media(max-width:600px){
 .mm-page .mm-groups .mm-list-h.mm-rail{display:grid!important;grid-auto-flow:column;grid-auto-columns:88vw;grid-template-columns:none;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:2px 2px 6px;margin:0 -2px}
 .mm-page .mm-groups .mm-list-h.mm-rail::-webkit-scrollbar{display:none}
 .mm-page .mm-groups .mm-rail.mm-n-1{grid-auto-columns:100%}
 .mm-page .mm-groups{gap:48px}
 .mm-page .mm-group .rail-controls{padding:0 0 10px;border-top:0;background:transparent}
 .mm-page .mm-group .rail-controls>span{display:none}
 .mm-page .mm-group .rail-controls:has(+.mm-rail.mm-n-1){display:none}
}
/* t866 #3: the divider under the image/title row runs edge to edge on phones (the pair block no longer stops at 300px) */
@media(max-width:600px){.mm-card-h .mm-pair,.mm-card-v .mm-pair{max-width:none;margin-left:0;margin-right:0;justify-self:stretch}}
/* Phone cards, homepage and /market-movers/: the image column's right rule meets the Previous/Latest top rule.
   Full-page rows kept a 4px row-gap, so the vertical rule stopped short of that horizontal rule. One 2px corner, no second stroke. */
@media(max-width:600px){
 .mm-card-h,.mm-card-v{row-gap:0}
 .mm-card-h .mm-img,.mm-card-v .mm-img{align-self:stretch;height:auto;min-height:100%;border-bottom:0;border-right:var(--mm-line)}
 .mm-card-h .mm-pair,.mm-card-v .mm-pair{border-top:var(--mm-line);margin-top:0}
}
