/* MTR theme — V26 design system (Dani handoff, 2026-08-08). One stylesheet.
   The rule that explains every decision here: hierarchy comes from scale,
   weight, position and space, never from putting something in a box. Boxes are
   reserved for things that are genuinely objects, and the only shadow on any
   page belongs to the score card. */

/* ---------- Font: one family, five weights, self-hosted ---------- */
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-500-normal.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-600-normal.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-700-normal.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-800-normal.woff2) format('woff2');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'PJS Fallback';src:local('Arial');size-adjust:104%;ascent-override:98%;descent-override:26%;line-gap-override:0%}

/* ---------- Tokens ---------- */
:root{
  --ink:#0B1220;--body:#45526B;--muted:#54687E;          /* the ONLY muted on light */
  --hairline:#E4E9F0;--hairline-soft:#F0F3F7;--surface:#F5F7FA;--white:#FFFFFF;
  --accent:#2C50E8;--accent-hover:#2340CC;--accent-light:#7C9BFF;--accent-tintbg:#DEE6FF;--violet:#A78BFA;
  --green-dark:#0A7A62;--green-bright:#33D0A8;--green-tint:#E3F5F1;--green-cell:#EAF8F4;
  --red-dark:#A33B22;--red-tint:#FBEDE9;
  --label-on-dark:#94A3B8;--dark-line:#232F49;
  --dark-card:linear-gradient(168deg,#141F35 0%,#0B1220 62%);
  --dark-band:linear-gradient(158deg,#182642 0%,#0B1220 70%);
  --ui:'Plus Jakarta Sans','PJS Fallback',system-ui,sans-serif;
  --r-chip:5px;--r-btn:6px;--r-card:8px;--r-score:10px;
  --maxw:1200px;--pad:32px;
  /* Back-compat aliases: inline styles in templates reference these. They now
     resolve to v26 values, so no stale gold or navy can render anywhere. */
  --brand-950:#0B1220;--brand-900:#0B1220;--accent-400:#2C50E8;--accent-500:#2340CC;--accent-700:#2C50E8;
  --accent-tint:#DEE6FF;--slate-700:#45526B;--slate-500:#54687E;--slate-400:#54687E;--border:#E4E9F0;
  --brand-tint:#EDF1F8;--page:#FFFFFF;--ok-tint:#E3F5F1;--ok-ink:#0A7A62;--warn-tint:#FBEDE9;--warn-ink:#A33B22;
  --mono:'Plus Jakarta Sans','PJS Fallback',system-ui,sans-serif;--r:8px;--r-sm:6px;
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--body);font:15px/1.75 var(--ui);-webkit-font-smoothing:antialiased;font-feature-settings:'tnum'}
img{max-width:100%;height:auto}
::selection{background:var(--accent-tintbg)}
a{color:var(--ink);text-decoration-color:var(--accent);text-decoration-thickness:1.5px;text-underline-offset:3px}
a:hover{color:var(--accent)}
h1,h2,h3{color:var(--ink);line-height:1.12;text-wrap:balance;margin:0 0 .5em;font-family:var(--ui)}
h1{font-size:clamp(30px,4vw,40px);font-weight:800;letter-spacing:-.04em;line-height:1.05}
h2{font-size:22px;font-weight:800;letter-spacing:-.03em}
h3{font-size:16px;font-weight:700;letter-spacing:-.02em}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--accent-light);outline-offset:2px;border-radius:2px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.mtr-wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.mtr-section{padding:clamp(36px,5vw,56px) 0}
.mtr-muted{color:var(--muted)}
.mtr-small{font-size:13.5px;line-height:1.6}

/* Micro label replaces every mono eyebrow: PJS 700 uppercase, tracked. */
.mtr-eyebrow{font:700 10.5px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.mtr-eyebrow--accent{color:var(--accent)}

/* ---------- Buttons ---------- */
.mtr-btn{display:inline-block;font:700 14px var(--ui);border-radius:var(--r-btn);padding:11px 20px;border:1px solid transparent;cursor:pointer;text-decoration:none;line-height:1.4}
.mtr-btn--primary{background:var(--accent);color:#fff}
.mtr-btn--primary:hover{background:var(--accent-hover);color:#fff}
.mtr-btn--outline,.mtr-btn--ghost{border-color:#D6DDE7;color:var(--ink);background:#fff;font-weight:600}
.mtr-btn--lg{font-size:15.5px;padding:14px 22px;text-align:center;display:block}
/* Demo CTA panel: the one place on a review the reader is asked to act. */
.mtr-demo-cta{border:1px solid var(--accent) !important;border-radius:var(--r-card);padding:18px !important;background:#F7F9FF}
.mtr-demo-cta .mtr-demo-line{margin:8px 0 0;font-size:13.5px;line-height:1.55;color:var(--body)}
.mtr-rail .mtr-demo-cta{padding:18px !important}
.mtr-btn--outline:hover,.mtr-btn--ghost:hover{border-color:var(--ink);color:var(--ink)}

/* ---------- Chips ---------- */
.mtr-chip{display:inline-block;font:600 12px var(--ui);background:var(--surface);color:var(--ink);border:1px solid var(--hairline);border-radius:var(--r-chip);padding:3px 9px}
.mtr-chip a{text-decoration:none}
.mtr-pill-progress,.mtr-chip-pending{display:inline-block;font:700 10.5px var(--ui);letter-spacing:.07em;color:var(--muted);border:1px dashed #8C9BAF;border-radius:var(--r-chip);padding:3px 9px;text-transform:uppercase;white-space:nowrap}
.mtr-pill-queue{display:inline-block;font:600 11px var(--ui);color:var(--ink);background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-chip);padding:3px 9px;white-space:nowrap}
.mtr-label-sponsored{display:inline-block;font:700 10px var(--ui);letter-spacing:.1em;background:var(--accent-tintbg);color:var(--accent);border-radius:var(--r-chip);padding:3px 8px;text-transform:uppercase}
.mtr-guidetag{display:inline-block;margin-top:8px;font:700 10px var(--ui);letter-spacing:.08em;text-transform:uppercase;background:var(--green-tint);color:var(--green-dark);border-radius:999px;padding:2px 9px}

/* Score chip: ink ground, white numeral. */
.mtr-score-chip{display:inline-flex;align-items:center;justify-content:center;font:700 15px var(--ui);background:var(--ink);color:#fff;border-radius:var(--r-chip);padding:5px 10px;line-height:1;letter-spacing:-.02em}
.mtr-score-chip--lg{font-size:24px;padding:10px 13px;border-radius:var(--r-btn)}
.mtr-score-chip--sm{font-size:12.5px;padding:4px 7px}

/* ---------- The score card: the one dark object, the one shadow ---------- */
.mtr-scorecard{background:var(--dark-card);border-radius:var(--r-score);padding:26px 24px;box-shadow:0 24px 48px -28px rgba(11,18,32,.62);color:#C3CEDE}
.mtr-scorecard .lab{font:700 10.5px var(--ui);letter-spacing:.1em;color:#8A9BB5;text-transform:uppercase;margin-bottom:14px}
.mtr-scorecard .num{display:flex;align-items:baseline;gap:8px}
.mtr-scorecard .num b{font-size:64px;font-weight:800;letter-spacing:-.055em;color:#fff;line-height:.85}
.mtr-scorecard .num span{font:500 15px var(--ui);color:#6E809C}
.mtr-scorecard .stars{margin-top:14px;display:flex;align-items:center;gap:10px}
.mtr-stars{position:relative;display:inline-block;line-height:1;font-size:19px;letter-spacing:2.5px;color:#2A3A55}
.mtr-stars>span{position:absolute;left:0;top:0;overflow:hidden;white-space:nowrap;color:var(--green-bright)}
.mtr-scorecard .word{font-size:13px;font-weight:600;color:#C3CEDE}
.mtr-scorecard .rankline{margin-top:14px;padding-bottom:22px;border-bottom:1px solid var(--dark-line);font-size:14px;color:#C3CEDE;line-height:1.5}
.mtr-scorecard .rankline b{color:var(--accent-light);font-weight:700}
.mtr-scorecard .axes{display:flex;flex-direction:column;gap:14px;padding-top:22px}
.mtr-scorecard .axes .r{display:flex;justify-content:space-between;gap:12px;margin-bottom:6px;font-size:13px;color:#C3CEDE}
.mtr-scorecard .axes .r b{font:700 13px var(--ui);color:#fff}
.mtr-scorecard .axes .t{height:3px;background:var(--dark-line)}
.mtr-scorecard .axes .t i{display:block;height:3px;background:var(--green-bright)}
.mtr-scorecard>a{display:block;margin-top:22px;font-size:13px;font-weight:600;color:#fff;text-decoration:none}
.mtr-scorecard>a:hover{color:var(--accent-light)}
.mtr-scorecard--unscored .num b{color:#3A4A66}
.mtr-scorecard--unscored .axes .t i{background:#2A3A55}

/* Compact scorecard for list rows: 20px numeral + five-bar sparkline (42x18). */
.mtr-sc-compact{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;vertical-align:middle}
.mtr-sc-compact b{font:800 20px var(--ui);letter-spacing:-.03em;color:var(--ink)}
.mtr-spark{display:inline-flex;align-items:flex-end;gap:2px;height:18px;width:42px}
.mtr-spark i{flex:1 1 0;background:var(--green-bright);border-radius:1px;min-height:2px}
.mtr-sc-compact--unscored b{color:#8C9BAF;font-weight:700;font-size:16px}
.mtr-sc-compact--unscored .mtr-spark i{background:var(--hairline);height:4px !important}

/* ---------- Axis rows (review body) ---------- */
.mtr-axisrow{display:flex;align-items:baseline;gap:16px;padding-bottom:10px;border-bottom:1px solid var(--hairline-soft);margin-top:32px}
.mtr-axisrow .n{font:800 20px var(--ui);color:var(--green-dark);letter-spacing:-.03em;flex:none}
.mtr-axisrow .n--low{color:var(--red-dark)}
.mtr-axisrow h3{margin:0;font-size:16px;font-weight:700}
.mtr-axisrow .w{margin-left:auto;font:600 11.5px var(--ui);letter-spacing:.07em;color:var(--muted);white-space:nowrap;text-transform:uppercase}
.mtr-axisbody{margin:16px 0 0;font-size:15px;line-height:1.75;color:var(--body);max-width:66ch;text-wrap:pretty}

/* ---------- Layout: article + sidebar ---------- */
.mtr-layout{display:flex;flex-wrap:wrap;gap:56px;align-items:flex-start}
.mtr-layout>div:first-child,.mtr-layout>.mtr-main{flex:2.15 1 0%;min-width:290px}
.mtr-rail{flex:1 1 0%;min-width:290px;align-self:flex-start;display:flex;flex-direction:column;gap:40px}
/* Review layout: DOM-first aside floats right at desktop via row-reverse and
   lands on top when wrapped, keeping the score first on mobile. */
.mtr-layout--review{flex-direction:row-reverse}

/* Sidebar fact lists */
.mtr-facts .h{font:700 10.5px var(--ui);letter-spacing:.1em;color:var(--muted);text-transform:uppercase;padding-bottom:12px;border-bottom:1px solid var(--hairline)}
.mtr-facts .row{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--hairline-soft);font-size:14px}
.mtr-facts .row:last-child{border-bottom:0}
.mtr-facts .row span:first-child{color:var(--muted);flex:none}
.mtr-facts .row span:last-child{color:var(--ink);text-align:right;min-width:0}

/* ---------- Sections: hairlines, not cards ---------- */
.mtr-panel{background:transparent;border:0;border-radius:0;padding:40px 0 32px;border-bottom:1px solid var(--hairline)}
.mtr-rail .mtr-panel{padding:0;border:0}
.mtr-panel--tint{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-card);padding:20px 22px}
.mtr-verdict{border-left:0}
/* A step above body copy, not display type: the verdict should read as the
   page's strongest paragraph rather than a second headline. */
.mtr-verdict p{font-size:clamp(16px,1.6vw,18px);font-weight:600;letter-spacing:-.015em;line-height:1.6;color:var(--ink);max-width:38em}
.mtr-winhead{font:800 17px var(--ui);margin:0 0 10px;letter-spacing:-.01em}
.mtr-wins-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:32px;padding:40px 0 32px;border-bottom:1px solid var(--hairline)}
.mtr-wins-grid .mtr-panel{padding:0;border:0}

/* Prose */
.mtr-prose{font-size:15px;line-height:1.75;color:var(--body)}
.mtr-prose p{max-width:66ch;text-wrap:pretty}
.mtr-prose h2{margin-top:1.6em}
.mtr-prose blockquote{margin:1.4em 0;padding-left:18px;border-left:2px solid var(--accent);font-size:19px;font-weight:600;color:var(--ink);line-height:1.55}
.mtr-prose table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.mtr-prose table thead,.mtr-prose table tbody{display:table;width:100%;min-width:520px}

/* Answer block: cobalt rule, no tinted card */
.mtr-answer{border-left:2px solid var(--accent);padding:4px 0 4px 18px;margin:18px 0}
.mtr-answer p{margin:6px 0 0;font-size:15px;line-height:1.7;color:var(--body);max-width:70ch}

/* ---------- Cards (objects only) ---------- */
.mtr-card,.mtr-post-card{background:#fff;border:1px solid var(--hairline);border-radius:var(--r-card);padding:16px;text-decoration:none;display:flex;flex-direction:column;gap:10px}
.mtr-post-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.mtr-card-head{display:flex;gap:10px;align-items:center}
.mtr-card-head .t{font-weight:700;color:var(--ink);font-size:15px;letter-spacing:-.01em}
.mtr-card-head .c{font-size:12.5px;color:var(--muted)}
/* space-between never shrinks its items, so at 768px the three-up card grid
   gives the foot 211px of room for content that needs more, and the CTA hangs
   6px past the viewport. Let it wrap instead of overflowing. */
.mtr-card-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 10px;margin-top:auto;padding-top:8px}
.mtr-card-foot>*{min-width:0}
.mtr-card-foot a{font-size:13.5px;font-weight:600;text-decoration:none;color:var(--accent)}
.mtr-post-card:hover,.mtr-card:hover{border-color:#C6D0DD}
.mtr-post-card .t{font-weight:700;color:var(--ink);font-size:15.5px;line-height:1.35;display:block;margin-top:6px}
.mtr-post-card .mtr-tile-count{margin-top:auto}
.mtr-post-card .x{font-size:13.5px;color:var(--muted);line-height:1.6;display:block;margin-top:6px}
.mtr-lead-post{display:block;text-decoration:none;border-bottom:1px solid var(--hairline);padding:0 0 28px}
.mtr-lead-post:hover h2{color:var(--accent)}
.mtr-lead-post h2{margin:8px 0 0;font-size:clamp(22px,3vw,30px)}
.mtr-lead-post .stand{margin:10px 0 0;font-size:16px;line-height:1.65;color:var(--body);max-width:70ch}
.mtr-lead-post .meta{display:block;margin-top:14px;font:700 10.5px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* ---------- Tables ---------- */
.mtr-tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;min-width:0}
.mtr-panel,.mtr-layout>*{min-width:0}
/* min-width:0 above lets tables shrink, but it also disables the flex-basis
   wrap the two-column layout relied on. Below 960px the layout stacks
   explicitly instead: content first, rail after, both full width. */
@media (max-width:960px){
  .mtr-layout,.mtr-layout--review{flex-direction:column}
  .mtr-layout>div:first-child,.mtr-layout>.mtr-main,.mtr-rail{flex:1 1 100%;width:100%;max-width:100%}
}
.mtr-table{width:100%;border-collapse:collapse;font-size:14px}
.mtr-table thead th{font:700 10.5px var(--ui);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);text-align:left;padding:0 14px 10px 0;border-bottom:1px solid var(--ink)}
.mtr-table tbody td,.mtr-table tbody th{padding:13px 14px 13px 0;border-bottom:1px solid var(--hairline-soft);vertical-align:middle;text-align:left;font-weight:400;color:var(--body)}
.mtr-table tbody th{color:var(--ink)}
.mtr-table tbody tr:last-child td,.mtr-table tbody tr:last-child th{border-bottom:0}
.mtr-table td.win{background:var(--green-cell);color:var(--green-dark);font-weight:700}
.mtr-table .rankcell{width:52px}
.mtr-cell-vendor{display:flex;gap:10px;align-items:center;font-weight:700;color:var(--ink)}
.mtr-rank{display:inline-block;font:700 12px var(--ui);color:var(--muted)}
.mtr-rank--top{color:var(--green-dark)}
.mtr-rank--hero-wrap .mtr-rank{font-size:13px;color:var(--accent)}

/* Ranked category board. A flat rule between rows made three hundred products
   read as one block of text, so each product gets its own boxed row: white
   against the section surface, a hairline all the way round, and a real gap
   between them. The rank sits inside the box rather than floating beside it.
   Scoped above the stack breakpoint, because below it every row is already
   a card and these rules would fight that. */
@media (min-width:761px){
  .mtr-table--grid{border-collapse:separate;border-spacing:0 8px}
  .mtr-table--grid thead th{padding:0 14px 4px;border-bottom:0}
  .mtr-table--grid thead th:first-child{padding-left:16px}
  .mtr-table--grid tbody tr{background:#fff}
  .mtr-table--grid tbody td,
  .mtr-table--grid tbody th{
    padding:14px;
    border-top:1px solid var(--hairline);
    border-bottom:1px solid var(--hairline);
    background:#fff;
  }
  .mtr-table--grid tbody th:first-child{
    border-left:1px solid var(--hairline);
    border-radius:var(--r-card) 0 0 var(--r-card);
    padding-left:16px;
  }
  .mtr-table--grid tbody td:last-child{
    border-right:1px solid var(--hairline);
    border-radius:0 var(--r-card) var(--r-card) 0;
    padding-right:16px;
  }
  /* Light vertical rules so the columns read as columns, without boxing every
     cell. The name column keeps no divider: the logo already separates it. */
  .mtr-table--grid tbody td:not(:last-child){border-right:1px solid var(--hairline-soft)}
  .mtr-table--grid tbody th:first-child{border-right:1px solid var(--hairline-soft)}
  .mtr-table--grid tbody tr:hover td,
  .mtr-table--grid tbody tr:hover th{border-top-color:var(--accent);border-bottom-color:var(--accent)}
  .mtr-table--grid tbody tr:hover th:first-child{border-left-color:var(--accent)}
  .mtr-table--grid tbody tr:hover td:last-child{border-right-color:var(--accent)}
  .mtr-table--grid tbody tr:last-child td,
  .mtr-table--grid tbody tr:last-child th{border-bottom:1px solid var(--hairline)}
  .mtr-table--grid tbody tr:last-child:hover td,
  .mtr-table--grid tbody tr:last-child:hover th{border-bottom-color:var(--accent)}
  .mtr-cell-act{text-align:right;white-space:nowrap;width:1%}
}
/* The product name is the thing a reader reaches for, so it is a link. Plain
   ink until hover, because a column of blue links reads as an ad unit. */
.mtr-cell-name{color:var(--ink);text-decoration:none;font-weight:700}
.mtr-cell-name:hover{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}
/* Row-scale button. Same shape as every other button on the site, sized so it
   does not out-shout the score next to it. */
.mtr-btn--row{font:700 12.5px var(--ui);padding:7px 13px;border-radius:var(--r-btn)}
@media (max-width:760px){
  .mtr-cell-act{text-align:left;padding-top:10px !important}
  .mtr-btn--row{display:inline-block;width:100%;text-align:center;padding:10px 13px}
}
@media (max-width:760px){
  .mtr-table--stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .mtr-table--stack,.mtr-table--stack tbody,.mtr-table--stack tr,.mtr-table--stack td{display:block;width:100%}
  .mtr-table--stack tr{border:1px solid var(--hairline);border-radius:var(--r-card);background:#fff;padding:12px 14px;margin-bottom:10px}
  .mtr-table--stack td,.mtr-table--stack tbody th{border:0;padding:2px 0}
  .mtr-table--stack td[data-l]::before{content:attr(data-l) ": ";font:700 10px var(--ui);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);display:inline-block;margin-right:6px}
  .mtr-table--stack td.mtr-cell-rank::before{content:none}
  .mtr-tablewrap{background:none}
}

/* ---------- Header ---------- */
.mtr-topbar{display:none}
.mtr-header{border-bottom:1px solid var(--hairline);background:#fff}
.mtr-header-in{max-width:var(--maxw);margin:0 auto;padding:9px var(--pad);min-height:46px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.mtr-logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.mtr-logo svg{flex:none;display:block}
.mtr-logo-mark{display:none}
.mtr-logo-word{font-weight:800;font-size:15.5px;letter-spacing:-.035em;color:var(--ink);white-space:nowrap;font-family:var(--ui)}
.mtr-logo-word em{font-style:normal;font-weight:800;color:var(--accent)}
.mtr-nav{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.mtr-nav a{text-decoration:none;font-size:14px;font-weight:500;color:var(--body)}
.mtr-nav a:hover,.mtr-nav a[aria-current]{color:var(--ink);font-weight:600}
.mtr-header-search{margin-left:auto;flex:0 1 182px;min-width:0;display:flex;align-items:center;gap:7px;border:1px solid var(--hairline);border-radius:7px;padding:0 10px;background:#FAFBFD}
.mtr-header-search input{flex:1;min-width:0;border:none;background:none;padding:9px 0;font-size:13.5px;color:var(--ink);outline:none;font-family:inherit}
.mtr-header-cta{flex:none;background:var(--accent);color:#fff !important;font-size:13.5px;font-weight:700;padding:10px 18px;border-radius:7px;white-space:nowrap;text-decoration:none;border:0}
.mtr-header-cta:hover{background:var(--accent-hover)}
.mtr-burger{display:none;appearance:none;background:none;border:1px solid var(--hairline);border-radius:var(--r-btn);width:40px;height:40px;cursor:pointer;position:relative}
.mtr-burger span,.mtr-burger span::before,.mtr-burger span::after{display:block;position:absolute;width:18px;height:2px;background:var(--ink);left:10px;top:19px}
.mtr-burger span::before,.mtr-burger span::after{content:"";left:0}
.mtr-burger span::before{top:-6px}
.mtr-burger span::after{top:6px}

.mtr-drawer{display:none;position:fixed;inset:0;background:#fff;z-index:60;padding:0;overflow:auto}
.mtr-drawer.open{display:block}
.mtr-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-bottom:1px solid var(--hairline);position:sticky;top:0;background:#fff}
.mtr-drawer-body{padding:18px 20px 32px}
.mtr-drawer-body a{display:block;font-weight:700;font-size:17px;color:var(--ink);text-decoration:none;padding:13px 6px;border-bottom:1px solid var(--hairline)}
.mtr-drawer-body input{width:100%;font:15px var(--ui);border:1px solid var(--hairline);background:var(--surface);border-radius:var(--r-btn);padding:11px 12px;margin-bottom:14px}
.mtr-drawer-close{appearance:none;background:transparent;border:1px solid var(--hairline);border-radius:var(--r-btn);width:38px;height:38px;font-size:20px;line-height:1;color:var(--ink);cursor:pointer}
.mtr-drawer-close:hover{border-color:var(--ink)}
@media (max-width:1100px){
  .mtr-nav,.mtr-header-search,.mtr-header-cta{display:none}
  .mtr-burger{display:block;margin-left:auto}
}

/* ---------- Hero / bands ---------- */
.mtr-hero{background:#fff;border-bottom:1px solid var(--hairline)}
.mtr-hero-center{padding-top:clamp(48px,7vw,84px);padding-bottom:clamp(40px,6vw,64px)}
.mtr-hero h1{font-size:clamp(34px,5.2vw,58px);letter-spacing:-.045em;max-width:18ch}
.mtr-hero .sub{font-size:clamp(16px,2vw,18px);line-height:1.6;color:var(--body);max-width:56ch;margin:18px 0 0}
.mtr-herosearch{display:flex;gap:0;max-width:560px;margin-top:28px;border:1px solid var(--hairline);border-radius:var(--r-card);overflow:hidden;background:#fff}
.mtr-herosearch input{flex:1;min-width:0;border:0;padding:15px 16px;font:15px var(--ui);color:var(--ink);outline:none;background:transparent}
.mtr-herosearch button{border:0;background:var(--accent);color:#fff;padding:0 18px;cursor:pointer;display:flex;align-items:center}
.mtr-herosearch button:hover{background:var(--accent-hover)}
.mtr-quicklinks{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;margin:22px 0 0;font-size:13.5px}
.mtr-quicklinks a{color:var(--body);text-decoration:none;font-weight:600}
/* V26 lead: copy left, stat rail right */
.mtr-leadgrid{display:flex;flex-wrap:wrap;gap:clamp(32px,5vw,72px);align-items:flex-end;padding-top:clamp(48px,7vw,88px);padding-bottom:clamp(40px,5vw,64px)}
.mtr-leadgrid>.copy{flex:2 1 480px;min-width:300px}
.mtr-leadgrid h1{margin:0;font-size:clamp(34px,6vw,64px);letter-spacing:-.045em;line-height:1;max-width:19ch;text-wrap:balance}
.mtr-leadgrid .sub{margin:22px 0 0;font-size:clamp(16px,1.9vw,19px);line-height:1.6;color:var(--body);max-width:48ch;text-wrap:pretty}
.mtr-leadgrid .k{font:700 10.5px var(--ui);letter-spacing:.1em;color:var(--accent);margin-bottom:20px;text-transform:uppercase}
.mtr-popular{margin-top:14px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;color:var(--muted)}
.mtr-popular a{font-size:13px;font-weight:600;color:var(--ink);background:var(--surface);border:1px solid var(--hairline);border-radius:5px;padding:5px 11px;text-decoration:none}
.mtr-popular a:hover{border-color:var(--accent);color:var(--accent)}
.mtr-popular a.plain{background:none;border:0;color:var(--muted);padding:5px 0}
.mtr-statrail{flex:0 1 250px;min-width:200px;display:flex;flex-direction:column;gap:20px}
.mtr-statrail>div{border-top:1px solid var(--hairline);padding-top:20px}
.mtr-statrail>div:first-child{border-top:0;padding-top:0}
.mtr-statrail .n{font-size:38px;font-weight:800;letter-spacing:-.04em;color:var(--ink);line-height:1}
.mtr-statrail .n--accent{color:var(--accent)}
.mtr-statrail .l{font:700 10.5px var(--ui);letter-spacing:.1em;color:var(--muted);margin-top:4px;text-transform:uppercase}
/* V26 how-we-score: light numeral tiles */
.mtr-howgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0;border-top:1px solid var(--hairline);margin-top:26px}
.mtr-howgrid>div{padding:20px 22px 22px 0;border-bottom:1px solid var(--hairline)}
.mtr-howgrid .pc{font-size:34px;font-weight:800;letter-spacing:-.04em;color:var(--green-dark);line-height:1}
.mtr-howgrid .t{font-size:15px;font-weight:700;color:var(--ink);margin-top:10px}
.mtr-howgrid .d{font-size:13.5px;line-height:1.55;color:var(--muted);margin-top:4px;max-width:26ch}
/* V26 featured latest review */
.mtr-featreview{display:flex;flex-wrap:wrap;gap:clamp(28px,4vw,52px);align-items:flex-start}
.mtr-featreview .card{flex:0 1 340px;min-width:280px}
.mtr-featreview .txt{flex:1 1 380px;min-width:280px}
.mtr-featreview h2{margin:6px 0 0;font-size:clamp(24px,3vw,32px);letter-spacing:-.035em;line-height:1.15}
.mtr-featreview .txt p{font-size:15.5px;line-height:1.7;color:var(--body);max-width:58ch}
/* V26 why-different dark band stats */
.mtr-whystats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px;margin-top:34px}
.mtr-whystats .n{font-size:44px;font-weight:800;letter-spacing:-.045em;color:#fff;line-height:1}
.mtr-whystats .n em{font-style:normal;color:var(--green-bright)}
.mtr-whystats p{margin:10px 0 0;font-size:13.5px;line-height:1.6;color:#8A9BB5;max-width:30ch}
.mtr-whystats p b{color:#C3CEDE}
.mtr-quicklinks a:hover{color:var(--accent)}
.mtr-quicklinks .all{color:var(--accent);font-weight:700}
.mtr-band-dark{background:var(--dark-band);color:#C3CEDE}
.mtr-band-dark h2,.mtr-band-dark h3{color:#fff}
.mtr-band-dark .mtr-eyebrow{color:var(--label-on-dark)}
.mtr-band-dark .mtr-eyebrow--accent{color:var(--violet)}
.mtr-band-dark a{color:#fff}
.mtr-band-accent{background:var(--surface);color:var(--ink);border-top:1px solid var(--hairline)}
.mtr-statusstrip{background:var(--surface);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.mtr-statusstrip .mtr-wrap{padding-top:14px;padding-bottom:14px}
.mtr-statusstrip p{margin:4px 0 0;font-size:14px;max-width:900px;line-height:1.6}

/* Rubric band tiles */
.mtr-rubricband{display:grid;grid-template-columns:280px 1fr;gap:32px;align-items:center}
@media (max-width:820px){.mtr-rubricband{grid-template-columns:1fr;gap:20px}}
.mtr-axis-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
@media (max-width:560px){.mtr-axis-grid{grid-template-columns:1fr 1fr}}
@media (max-width:400px){.mtr-axis-grid{grid-template-columns:1fr}}
.mtr-axis-tile{border:1px solid var(--dark-line);border-radius:var(--r-card);padding:14px;display:flex;flex-direction:column;gap:6px;background:rgba(255,255,255,.03)}
.mtr-axis-tile .lbl{font-weight:700;color:#fff;font-size:14px;letter-spacing:-.01em}
.mtr-axis-tile .wt{font-size:12px;color:var(--label-on-dark)}
.mtr-axis-tile .tag{font:700 10px var(--ui);letter-spacing:.08em;color:var(--green-bright);text-transform:uppercase}
.mtr-axis-tile--lead{border-color:var(--green-bright)}
.mtr-axis-tile--mid{opacity:.92}
.mtr-axis-tile--base{opacity:.84}

/* ---------- Category cards / grids ---------- */
.mtr-cat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.mtr-cat-card{background:#fff;border:1px solid var(--hairline);border-radius:var(--r-card);padding:18px;text-decoration:none;display:flex;flex-direction:column;gap:8px}
.mtr-cat-card:hover{border-color:#C6D0DD}
.mtr-cat-card .top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.mtr-cat-card .t{font-weight:800;color:var(--ink);font-size:16.5px;letter-spacing:-.02em}
.mtr-cat-card .d{font-size:13.5px;color:var(--muted);line-height:1.55}
.mtr-cat-card .inc{display:block;margin-top:4px;font:600 12px var(--ui);color:var(--muted)}
.mtr-count{font:600 12px var(--ui);color:var(--muted)}
.mtr-count-row{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:baseline}
.mtr-inline-count{margin-left:auto;padding-left:12px}
@media (max-width:760px){.mtr-inline-count{margin-left:0;padding-left:0;flex:1 1 100%}}

/* Numbered category index (homepage) */
.mtr-catindex{margin-top:10px}
.mtr-catindex a{display:flex;align-items:baseline;gap:18px;padding:15px 4px;border-bottom:1px solid var(--hairline-soft);text-decoration:none}
.mtr-catindex a:hover .t{color:var(--accent)}
.mtr-catindex .i{font:800 13px var(--ui);color:#B9C4D4;flex:none;width:26px}
.mtr-catindex .t{font:800 clamp(17px,2.2vw,21px) var(--ui);letter-spacing:-.025em;color:var(--ink)}
.mtr-catindex .m{margin-left:auto;font:600 12.5px var(--ui);color:var(--muted);white-space:nowrap}
@media (max-width:640px){.mtr-catindex .m{display:none}}

/* ---------- Directory ---------- */
.mtr-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}
.mtr-toolbar input[type="search"]{flex:1 1 280px;min-width:0;font:14.5px var(--ui);border:1px solid var(--hairline);background:#FAFBFD;border-radius:7px;padding:11px 13px;color:var(--ink)}
.mtr-toolbar select{font:14px var(--ui);border:1px solid var(--hairline);border-radius:7px;padding:10px 12px;background:#fff;color:var(--ink)}
/* Filter bar wraps; no permanent mask clipping the last chip. */
.mtr-filterbar{display:flex;flex-wrap:wrap;gap:8px;padding:10px 0}
.mtr-filterbar a,.mtr-filterbar button{appearance:none;cursor:pointer;font:600 13px var(--ui);color:var(--ink);background:#fff;border:1px solid var(--hairline);border-radius:999px;padding:7px 14px;white-space:nowrap;text-decoration:none}
.mtr-filterbar a.active,.mtr-filterbar button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.mtr-filterbar a:hover,.mtr-filterbar button:hover{border-color:var(--ink)}
.mtr-rows{list-style:none;margin:10px 0 0;padding:0}
/* Fixed columns so rank, chip and score align down the whole list. */
.mtr-row{display:grid;grid-template-columns:24px 34px minmax(0,1fr) 48px 104px 96px 14px;gap:0 14px;align-items:center;padding:13px 4px;border-bottom:1px solid var(--hairline-soft);position:relative}
.mtr-row .name{font-weight:700;color:var(--ink);text-decoration:none;font-size:15px;letter-spacing:-.01em}
.mtr-row .name::after{content:"";position:absolute;inset:0}
.mtr-row .co{color:var(--muted);font-size:13px}
.mtr-row .desc{font-size:13px;color:var(--muted);line-height:1.5}
.mtr-row .rk{justify-self:end}
.mtr-row .cc,.mtr-row .sc{justify-self:start}
.mtr-row .cat-chip{position:relative;z-index:2}
.mtr-row .chev{color:#B9C4D4;justify-self:end}
@media (max-width:760px){
  .mtr-row{grid-template-columns:24px 34px minmax(0,1fr) 96px 14px}
  .mtr-row .rk,.mtr-row .cc{display:none}
}
.mtr-row:hover{background:#FAFBFD}
.mtr-row .cmp{position:relative;z-index:2}
.mtr-row .cmp input{width:16px;height:16px;accent-color:var(--accent)}
.mtr-rows .mtr-row{content-visibility:auto;contain-intrinsic-size:auto 58px}
.mtr-rows--plain{list-style:none;padding:0;columns:2;font-size:14px}
.mtr-rowgroup{display:flex;align-items:baseline;gap:10px;position:sticky;top:0;z-index:2;background:var(--ink);color:#fff;border-radius:var(--r-btn);padding:11px 14px;margin-top:18px;font:800 14.5px var(--ui);letter-spacing:-.01em}
.mtr-rowgroup .n{font:700 10.5px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--label-on-dark)}
.mtr-rowgroup a{margin-left:auto;font:600 12.5px var(--ui);color:var(--accent-light);text-decoration:none}
.mtr-rowgroup a:hover{color:#fff}
.mtr-rowgroup:first-child{margin-top:0}
.mtr-comparebar{position:fixed;left:50%;transform:translate(-50%,140%);bottom:18px;z-index:55;display:flex;gap:14px;align-items:center;background:var(--ink);color:#fff;border-radius:999px;padding:10px 12px 10px 20px;transition:transform .25s ease;max-width:92vw;visibility:hidden}
.mtr-comparebar.show{transform:translate(-50%,0);visibility:visible}
.mtr-comparebar span{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mtr-comparebar a{flex:none;background:var(--accent);color:#fff;font:700 13px var(--ui);border-radius:999px;padding:8px 16px;text-decoration:none}
.mtr-comparebar a:hover{background:var(--accent-hover)}

/* ---------- Vendor page ---------- */
.mtr-vendor-head{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-end;justify-content:space-between;padding:8px 0 4px}
.mtr-vendor-head>div:first-of-type{flex:1 1 420px;min-width:280px}
.mtr-vendor-head .meta{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-top:10px}
/* The old score block beside the h1 is replaced by the score card in the rail. */
.mtr-vendor-overall{display:none !important}
.mtr-monogram{display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:800;border-radius:var(--r-card);flex:none;font-family:var(--ui)}
img.mtr-logo{background:#fff;border:1px solid var(--hairline);padding:3px;object-fit:contain;border-radius:var(--r-card)}
.mtr-byline{display:flex;flex-wrap:wrap;align-items:center;gap:8px;row-gap:6px;font-size:12.5px;color:var(--muted);padding:10px 0 2px}
.mtr-byline-tail{margin-left:auto}
@media (max-width:760px){.mtr-byline-tail{margin-left:0;flex:1 1 100%}}
.mtr-deskline{font-size:13px;color:var(--muted);padding:10px 0 2px}
.mtr-verified-inline{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--green-dark)}

/* Legacy weighted bars (stub weight profile + anywhere mtr_score_bars remains) */
.mtr-bars{display:flex;flex-direction:column;gap:12px}
.mtr-bar-row{display:grid;grid-template-columns:minmax(120px,210px) 34px 1fr;gap:10px;align-items:center}
.mtr-bar-label{font-weight:700;font-size:13.5px;color:var(--ink)}
.mtr-bar-weight{font:600 10.5px var(--ui);color:var(--muted);margin-left:6px}
.mtr-bar-num{font:700 13px var(--ui);color:var(--ink);text-align:right}
.mtr-bar-track{position:relative;height:3px;background:var(--hairline);overflow:hidden}
.mtr-bar-ticks{display:none}
.mtr-bar-fill{position:absolute;inset:0 auto 0 0;background:var(--green-bright)}
.mtr-bar-fill--whi{background:var(--green-bright)}
.mtr-bar-fill--wmid{background:var(--green-bright);opacity:.72}
.mtr-bar-fill--wlo{background:var(--green-bright);opacity:.5}
.mtr-bar-fill--weight{background:var(--accent-light);opacity:.6;border:0}
.mtr-weights-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:14px;font-size:12.5px;color:var(--muted)}
.mtr-weights-legend b{color:var(--ink)}

/* Benchmark module */
.mtr-incumbent{padding:40px 0 32px;border-bottom:1px solid var(--hairline)}
.mtr-incumbent-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px}
.mtr-incumbent-head h2{margin:0}
.mtr-noincumbent{border-left:2px solid var(--accent);padding-left:20px}

/* Pros / cons */
.mtr-list{list-style:none;margin:0;padding:0}
.mtr-list li{position:relative;padding:9px 0 9px 30px;border-bottom:1px solid var(--hairline-soft);font-size:14.5px;line-height:1.6}
.mtr-list li:last-child{border-bottom:0}
.mtr-list li::before{content:"";position:absolute;left:0;top:11px;width:17px;height:17px;border-radius:99px;background-repeat:no-repeat;background-position:center;background-size:17px}
.mtr-list--pro li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='%23E3F5F1'/%3E%3Cpath d='M6.2 10.3l2.5 2.5 5.1-5.4' stroke='%230A7A62' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.mtr-list--con li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='%23FBEDE9'/%3E%3Cpath d='M6.5 6.5l7 7M13.5 6.5l-7 7' stroke='%23A33B22' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}
.mtr-yes{color:var(--green-dark);font-weight:800}
.mtr-no{color:#8C9BAF}

/* ---------- FAQ ---------- */
.mtr-faq-list{margin-top:16px}
.mtr-faq-item{padding:16px 0;border-bottom:1px solid var(--hairline-soft)}
.mtr-faq-item h3{margin:0;font-size:16px;font-weight:700;color:var(--ink);line-height:1.4}
.mtr-faq-item p{margin:7px 0 0;font-size:14.5px;line-height:1.65;color:var(--muted);max-width:70ch}

/* ---------- Forms ---------- */
.mtr-notify{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.mtr-notify input[type="email"],.mtr-notify input[type="text"]{flex:1 1 220px;min-width:0;font:14.5px var(--ui);border:1px solid var(--hairline);background:#fff;border-radius:var(--r-btn);padding:11px 13px;color:var(--ink)}
.mtr-newsband{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-card);padding:20px 22px}
.mtr-steps{margin:10px 0 0;padding-left:20px;font-size:14px;line-height:1.65}
.mtr-steps li{margin-bottom:7px}

/* ---------- Badges ---------- */
.mtr-badges{display:inline-flex;flex-wrap:wrap;gap:6px;align-items:center;vertical-align:middle}
.mtr-badge{display:inline-flex;align-items:center;gap:6px;font:600 12px var(--ui);padding:4px 11px 4px 8px;border-radius:999px;border:1px solid;text-decoration:none;white-space:nowrap;line-height:1.4}
.mtr-badge:hover{filter:brightness(.97);text-decoration:none}
.mtr-badge .mtr-badge-i{flex:none;margin-top:-1px}
.mtr-badge--sm{font-size:11px;padding:3px 9px 3px 7px;gap:5px}
.mtr-badge--lead{background:var(--green-cell);color:var(--green-dark);border-color:#BDE6DB}
.mtr-badge--trust{background:var(--green-tint);color:var(--green-dark);border-color:#BDE6DB}
.mtr-badge--neutral{background:var(--surface);color:var(--body);border-color:var(--hairline)}
.mtr-badge--agent{background:#EFF3FE;color:var(--accent);border-color:#C9D6F9}
.mtr-badge--open{background:var(--green-tint);color:var(--green-dark);border-color:#BDE6DB}
.mtr-seal{display:flex;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-card);padding:14px 16px;margin:0 0 14px}
.mtr-seal-mark{flex:none;display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:999px;background:#fff;border:1px solid var(--hairline);color:var(--green-dark)}
.mtr-seal-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.mtr-seal-txt strong{color:var(--ink);font-size:15.5px;line-height:1.3}
.mtr-badge-card{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;border:1px solid var(--hairline);border-radius:var(--r-card);background:#fff;padding:16px 18px;margin:0 0 12px}
.mtr-badge-card .hold{font:700 11px var(--ui);color:var(--muted);white-space:nowrap}
.mtr-badge-card h3{margin:0 0 4px}
.mtr-badge-rule{color:var(--ink);font-weight:600;margin:0 0 6px}
@media (max-width:640px){.mtr-badge-card{grid-template-columns:1fr}.mtr-seal{flex-direction:column;align-items:flex-start}}

/* ---------- Verification band / stats ---------- */
.mtr-verifband{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--hairline);border:1px solid var(--hairline);border-radius:var(--r-card);overflow:hidden;margin-top:18px}
.mtr-verifband>div{background:#fff;padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.mtr-verifband strong{font:800 26px var(--ui);letter-spacing:-.03em;color:var(--ink);line-height:1}
.mtr-verifband span{font-size:12.5px;line-height:1.4;color:var(--muted)}
@media (max-width:560px){.mtr-verifband{grid-template-columns:repeat(2,1fr)}.mtr-verifband strong{font-size:21px}}
.mtr-statline{display:flex;flex-wrap:wrap;gap:10px 28px;margin:18px 0}
.mtr-statline span{font-size:13.5px;color:var(--muted)}
.mtr-statline strong{display:block;font:800 24px var(--ui);letter-spacing:-.03em;color:var(--ink)}

/* ---------- TOC / rails ---------- */
.mtr-toc{position:sticky;top:16px;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 40px);overflow-x:hidden;overflow-y:auto}
/* The label used to lose its top row of pixels and sit 10px left of the links
   beneath it. Two causes, both here. The eyebrow's font shorthand resets
   line-height to normal, which leaves a 12px box for uppercase glyphs that need
   more, and the scroll container clips whatever pokes out of it. And the links
   carry 8px of padding plus a 2px indicator border that the label did not, so
   nothing lined up. It now gets its own line-height, the matching 10px of left
   inset, and room to breathe before the first link. */
.mtr-toc>.mtr-eyebrow{line-height:1.7;padding:1px 8px 5px 10px;flex:none}
.mtr-toc a{display:block;font-size:13.5px;line-height:1.4;padding:6px 8px;border-radius:var(--r-btn);color:var(--body);text-decoration:none;border-left:2px solid transparent}
.mtr-toc a:hover{background:var(--surface);color:var(--ink)}
.mtr-toc a[aria-current="true"]{background:#EFF3FE;color:var(--accent);border-left-color:var(--accent);font-weight:700}
.mtr-anchor{opacity:0;margin-left:6px;font:600 15px var(--ui);color:#B9C4D4;text-decoration:none}
h2:hover .mtr-anchor,.mtr-anchor:focus{opacity:1}
.mtr-methodology h2{scroll-margin-top:18px;padding-top:14px;border-top:1px solid var(--hairline);margin-top:30px}
.mtr-methodology h2:first-child{border-top:0;margin-top:0;padding-top:0}
.mtr-methodology h3{scroll-margin-top:18px;margin-top:22px}
@media (max-width:960px){.mtr-toc{position:static;max-height:none}}

/* ---------- Misc ---------- */
.mtr-empty{border:1px dashed #C6D0DD;border-radius:var(--r-card);padding:22px;color:var(--muted);background:#FAFBFD}
.mtr-glance dt{font:700 10.5px var(--ui);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.mtr-glance dd{margin:2px 0 12px;color:var(--ink);font-size:14px}
.mtr-pricing-note{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-card);padding:18px 20px}
.mtr-agentpromo{display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;margin-top:22px;padding:20px 22px;border:1px solid var(--hairline);border-radius:var(--r-card);background:var(--surface)}
.mtr-crumbs{font-size:13px;color:var(--muted);padding:18px 0 6px;display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.mtr-crumbs a{color:var(--muted);text-decoration:none}
.mtr-crumbs a:hover{color:var(--accent)}
.mtr-crumbs-sep{margin:0 5px;color:#B9C4D4}
.mtr-crumbs span[aria-current]{color:var(--ink)}
.mtr-mockbar{background:var(--ink);color:#E6EEF5;font:600 12px var(--ui);text-align:center;padding:8px 16px;letter-spacing:.02em;border-bottom:2px solid var(--accent)}
.mtr-mockbar code{font-family:inherit;font-weight:700;color:var(--accent-light)}
.mtr-cmp-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:8px 0 18px}
@media (max-width:560px){.mtr-cmp-cards{grid-template-columns:1fr}}
.mtr-404{padding-top:clamp(40px,8vw,90px);padding-bottom:clamp(40px,8vw,90px)}
.mtr-404 .code{font:800 clamp(60px,10vw,110px)/1 var(--ui);letter-spacing:-.05em;color:var(--hairline)}
.mtr-404-search{display:flex;gap:10px;flex-wrap:wrap;max-width:600px;margin-top:20px}
.mtr-404-search input{flex:1 1 260px;font:15px var(--ui);border:1px solid var(--hairline);background:#fff;border-radius:var(--r-btn);padding:12px 14px}
.mtr-disclosure-line{font-size:12.5px;color:var(--muted)}
/* Head-to-head links on a product page. */
.mtr-h2h-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px}
.mtr-h2h{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid var(--hairline);border-radius:var(--r-btn);text-decoration:none;font-size:14px;color:var(--body)}
.mtr-h2h b{color:var(--ink);font-weight:700}
.mtr-h2h:hover{border-color:var(--accent)}
.mtr-h2h .mtr-sc-compact{margin-left:auto}
.mtr-h2h .mtr-spark{width:30px}
/* Cross-listed products under a category table: listed, never ranked here. */
.mtr-alsoserves{margin-top:22px;padding-top:16px;border-top:1px solid var(--hairline)}
.mtr-alsoserves-row{display:flex;align-items:center;gap:12px;padding:9px 2px;text-decoration:none;border-bottom:1px solid var(--hairline-soft)}
.mtr-alsoserves-row b{font-size:14.5px;color:var(--ink)}
.mtr-alsoserves-row:hover b{color:var(--accent)}

/* ---------- Footer ---------- */
.mtr-footer{background:#fff}
.mtr-footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:40px;padding:56px 0 40px}
.mtr-footer h3{font:700 10.5px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}
.mtr-footer ul{list-style:none;margin:0;padding:0}
.mtr-footer li a{display:block;font-size:14px;color:var(--body);text-decoration:none;padding:5px 0}
.mtr-footer li a:hover{color:var(--accent)}
.mtr-footer .mtr-eyebrow{color:var(--muted)}
.mtr-footer p{font-size:13.5px;line-height:1.65;color:var(--muted);max-width:280px}
.mtr-foot-col2{margin-top:30px}
@media (max-width:900px){.mtr-foot-col2{margin-top:0}}
.mtr-footer-legal{border-top:1px solid var(--hairline);padding:18px 0 34px;display:flex;flex-wrap:wrap;gap:8px 22px;align-items:baseline;font-size:12.5px;color:var(--muted)}
.mtr-footer-legal a{color:var(--muted);text-decoration:none}
.mtr-footer-legal a:hover{color:var(--accent)}
/* Pre-footer CTA band: light on purpose. Never two dark bands adjacent. */
.mtr-prefooter{background:var(--surface);border-top:1px solid var(--hairline)}
.mtr-prefooter .in{max-width:var(--maxw);margin:0 auto;padding:clamp(44px,6vw,72px) var(--pad);display:flex;flex-wrap:wrap;gap:36px;align-items:center;justify-content:space-between}
.mtr-prefooter h2{margin:0;font-size:clamp(24px,3.2vw,34px);letter-spacing:-.035em;line-height:1.15;max-width:20ch}
.mtr-prefooter p{margin:14px 0 0;font-size:15.5px;line-height:1.65;color:var(--body);max-width:52ch}
.mtr-prefooter .k{font:700 10.5px var(--ui);letter-spacing:.13em;color:var(--accent);margin-bottom:14px;text-transform:uppercase}
.mtr-prefooter .k{margin-top:0}
.mtr-prefooter-actions{flex:none;display:flex;flex-wrap:wrap;gap:10px}
.mtr-footer-legal .sp{flex:1 1 auto}
/* Sitewide newsletter band: light surface, stacked form on the right. */
.mtr-newsband-full{background:var(--surface);border-top:1px solid var(--hairline)}
.mtr-newsband-full .in{display:flex;flex-wrap:wrap;gap:clamp(28px,4vw,56px);align-items:center;justify-content:space-between;padding-top:clamp(40px,5vw,60px);padding-bottom:clamp(40px,5vw,60px)}
.mtr-newsband-copy{flex:1 1 420px;min-width:290px}
.mtr-newsband-full .k{font:700 10.5px var(--ui);letter-spacing:.11em;color:var(--accent);margin:0 0 14px;text-transform:uppercase}
.mtr-newsband-full h2{margin:0;font-size:clamp(23px,3vw,30px);letter-spacing:-.035em;line-height:1.18;max-width:20ch}
.mtr-newsband-full .sub{margin:12px 0 0;font-size:15.5px;line-height:1.65;color:var(--body);max-width:52ch}
.mtr-newsband-trust{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px;color:var(--muted)}
.mtr-newsband-full form{flex:0 1 380px;min-width:280px;display:flex;flex-direction:column;gap:10px}
.mtr-newsband-full input[type=email]{padding:14px 16px;border-radius:var(--r-btn);border:1px solid var(--hairline);background:#fff;font:15.5px var(--ui);color:var(--ink)}
.mtr-newsband-full input[type=email]:focus{outline:2px solid var(--accent);outline-offset:0}
.mtr-newsband-full .mtr-btn{justify-content:center}
.mtr-newsband-full .alt{margin:2px 0 0;font-size:13px;color:var(--muted)}
.mtr-newsband-full .alt a{color:var(--accent);font-weight:600;text-decoration:none}

/* ---------- mtr-rail sticky fix ----------
   .mtr-toc used to be sticky on its own, so the panels below it in the
   rail scrolled underneath and their text printed on top of the nav.
   Panels are transparent, so the two collided. Stick the rail instead. */
@media (min-width:961px){
  .mtr-rail{position:sticky;top:16px;align-self:start}
  .mtr-toc{position:static;max-height:none;overflow:visible}
}