/* Trusted Adviser identity: white pages, navy Figtree headings, Public Sans body, lawn-green actions; spec data in mono. */
:root {
  --paper: #ffffff; --panel: #ffffff; --ink: #17222b; --muted: #4a5560; --line: #e3e1da; --navy: #17324d;
  --turf: #1f5a3d; --turf-ink: #ffffff; --tint: #f1f5f1; --stripe: #f7f6f2; --signal: #f2b705;
  --ok: #1f6b3f; --warn: #9a5c00; --bad: #b3261e;
  --f-display: "Figtree", "Segoe UI", system-ui, -apple-system, sans-serif;
  --f-body: "Public Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --r: 8px;
  --mow-body: #17324d; --mow-accent: #1f5a3d; --mow-tyre: #1b211d; --mow-hub: #8a968e; --mow-glass: #bfe0f2; --mow-ground: #dfe9da; --mow-ground-2: #d1e0ca;
  --shadow: 0 1px 2px rgba(20,32,25,.06), 0 6px 18px rgba(20,32,25,.06);
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --navy: #dce6ef; --paper: #0f1512; --panel: #161e19; --ink: #e5ece6; --muted: #9ba89f; --line: #2a352e;
  --turf: #7cc48c; --turf-ink: #0f1512; --tint: #1c2b21; --stripe: #131b16; --signal: #f2c230;
  --ok: #7cc48c; --warn: #e3a54a; --bad: #f2877c; --mow-body: #c9d6cd; --mow-accent: #7cc48c; --mow-tyre: #0b0f0c; --mow-hub: #56635b; --mow-glass: #5d8aa3; --mow-ground: #1c2b21; --mow-ground-2: #223428; --shadow: 0 1px 2px rgba(0,0,0,.3); color-scheme: dark; } }
:root[data-theme="dark"] {
  --navy: #dce6ef; --paper: #0f1512; --panel: #161e19; --ink: #e5ece6; --muted: #9ba89f; --line: #2a352e;
  --turf: #7cc48c; --turf-ink: #0f1512; --tint: #1c2b21; --stripe: #131b16; --signal: #f2c230;
  --ok: #7cc48c; --warn: #e3a54a; --bad: #f2877c; --mow-body: #c9d6cd; --mow-accent: #7cc48c; --mow-tyre: #0b0f0c; --mow-hub: #56635b; --mow-glass: #5d8aa3; --mow-ground: #1c2b21; --mow-ground-2: #223428; --shadow: 0 1px 2px rgba(0,0,0,.3); color-scheme: dark; }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { background: var(--paper); color: var(--ink); font-family: var(--f-body); font-size: 17px; line-height: 1.6; margin: 0; }
a { color: var(--turf); text-underline-offset: 2px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid var(--signal); outline-offset: 2px; }
h1, h2, h3 { font-family: var(--f-display); line-height: 1.12; text-wrap: balance; letter-spacing: -0.015em; color: var(--navy); }
h1 { font-size: clamp(2.1rem, 5vw, 3.2rem); margin: 0 0 .4em; font-weight: 800; letter-spacing: -0.022em; }
h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin: 1.8em 0 .5em; font-weight: 800; }
h3 { font-size: 1.2rem; margin: 1.5em 0 .4em; font-weight: 700; }
p, li { max-width: 68ch; }
.mono, .num, td.n, .t td.n { font-family: var(--f-mono); font-variant-numeric: tabular-nums; }
.wrap { max-width: 1120px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }

/* masthead */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 10; background: var(--panel); }
.top { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 5; background: var(--panel); border-bottom: 1px solid var(--line); }
.top .wrap { display: flex; align-items: center; gap: 12px 24px; padding-block: 10px; flex-wrap: wrap; }
.brand { font-family: var(--f-display); font-weight: 800; font-size: 1.15rem; color: var(--ink); text-decoration: none; display: flex; align-items: center; gap: 8px; }
.brand svg { flex: none; }
.nav { display: flex; gap: 4px 18px; flex-wrap: wrap; font-size: .95rem; }
.nav a { color: var(--muted); text-decoration: none; padding: 4px 0; }
.nav a:hover, .nav a[aria-current="page"] { color: var(--ink); box-shadow: inset 0 -2px 0 var(--turf); }

.lawn { background: var(--paper); border-bottom: 1px solid var(--line); }
.lawn .wrap { padding-block: 40px 28px; }
.eyebrow { font-family: var(--f-mono); font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 0 0 10px; }
.dek { font-size: 1.15rem; color: var(--muted); max-width: 62ch; margin: 0; }
.disclose { font-size: .88rem; color: var(--muted); border-left: 3px solid var(--signal); padding: 6px 0 6px 12px; margin: 18px 0 0; max-width: 80ch; }

main .wrap { padding-block: 28px 64px; }
.crumbs { font-size: .9rem; color: var(--muted); margin-bottom: 8px; }
.crumbs a { color: var(--muted); }

/* tables */
.tw { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r); background: var(--panel); margin: 14px 0; }
table.t { border-collapse: collapse; width: 100%; font-size: .93rem; }
.t th, .t td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.t th { font-family: var(--f-mono); font-size: .74rem; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); font-weight: 500; white-space: nowrap; background: var(--panel); }
.t tbody tr:last-child td { border-bottom: 0; }
.t td.n, .t th.n { text-align: right; white-space: nowrap; }
.t th button { all: unset; cursor: pointer; }
.t th button::after { content: " ↕"; opacity: .45; }
.t th[aria-sort="ascending"] button::after { content: " ↑"; opacity: 1; }
.t th[aria-sort="descending"] button::after { content: " ↓"; opacity: 1; }
main > .wrap > table.t, .prose > table.t { display: block; overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r); background: var(--panel); }
.spec th { width: 38%; text-transform: none; font-family: var(--f-body); font-size: .9rem; letter-spacing: 0; white-space: normal; }
.spec td { font-family: var(--f-mono); font-size: .88rem; }

/* chips + score */
.chip { display: inline-block; font-size: .78rem; font-family: var(--f-mono); padding: 1px 8px; border-radius: 99px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; background: var(--panel); }
.chip.ok { color: var(--ok); border-color: currentColor; }
.chip.warn { color: var(--warn); border-color: currentColor; }
.chip.bad { color: var(--bad); border-color: currentColor; }
b.ok { color: var(--ok); } b.warn { color: var(--warn); } b.bad { color: var(--bad); }
.score { font-family: var(--f-mono); font-weight: 600; font-variant-numeric: tabular-nums; }
.scorecard { display: grid; grid-template-columns: auto 1fr; gap: 18px 28px; align-items: start; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 20px; margin: 18px 0; }
.big { font-family: var(--f-mono); font-size: 3.2rem; line-height: 1; font-weight: 600; }
.big small { font-size: 1rem; color: var(--muted); }
.scorecard .lbl { font-size: .82rem; color: var(--muted); margin-top: 6px; max-width: 18ch; }
.bars { display: grid; gap: 8px; min-width: 0; }
.bar { display: grid; grid-template-columns: minmax(0, 15rem) 1fr 2.6rem; gap: 10px; align-items: center; font-size: .88rem; }
.bar .track { display: block; height: 8px; background: var(--tint); border-radius: 4px; overflow: hidden; }
.bar .fill { display: block; height: 100%; background: var(--turf); border-radius: 4px; }
.bar .v { font-family: var(--f-mono); text-align: right; }
.bar .w { color: var(--muted); font-family: var(--f-mono); font-size: .75rem; }

.grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 16px; }
.grid3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 14px; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 16px 18px; min-width: 0; }
.card h3 { margin-top: 0; }
.card p { margin: .4em 0; }
a.card { color: inherit; text-decoration: none; display: block; }
a.card:hover { border-color: var(--turf); }
.card .meta { font-size: .85rem; color: var(--muted); }
.pros, .cons { padding-left: 1.1em; margin: .4em 0; }
.pros li::marker { content: "+  "; color: var(--ok); font-family: var(--f-mono); }
.cons li::marker { content: "–  "; color: var(--bad); font-family: var(--f-mono); }
.note { background: var(--tint); border-radius: var(--r); padding: 12px 16px; margin: 14px 0; font-size: .95rem; }
.note.warn { border-left: 4px solid var(--warn); }
.btn { display: inline-flex; align-items: center; gap: 6px; background: var(--turf); color: var(--turf-ink); border: 0; border-radius: 6px; padding: 10px 18px; font: 600 .95rem var(--f-body); text-decoration: none; cursor: pointer; }
.btn.ghost { background: transparent; color: var(--turf); border: 1px solid var(--turf); }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.small { font-size: .85rem; color: var(--muted); }
.aff { font-size: .72rem; color: var(--muted); font-family: var(--f-mono); }
s { color: var(--muted); }

/* garden-fit tool */
.fit { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: 22px; align-items: start; }
.fit form { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; display: grid; gap: 14px; }
.fit .ex { font-size: .82rem; background: var(--tint); padding: 6px 10px; border-radius: 6px; }
.q label, .q legend { font-weight: 700; font-size: .93rem; display: block; margin-bottom: 4px; }
.q fieldset { border: 0; padding: 0; margin: 0; }
.seg { display: flex; flex-wrap: wrap; gap: 6px; }
.seg label { font-weight: 400; font-size: .88rem; margin: 0; }
.seg input { position: absolute; opacity: 0; pointer-events: none; }
.seg span { display: inline-block; border: 1px solid var(--line); border-radius: 99px; padding: 4px 11px; cursor: pointer; background: var(--paper); }
.seg input:checked + span { background: var(--turf); color: var(--turf-ink); border-color: var(--turf); }
.seg input:focus-visible + span { outline: 3px solid var(--signal); outline-offset: 2px; }
input[type=number], input[type=text], input[type=email], select, textarea { font: inherit; font-size: .95rem; width: 100%; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); color: var(--ink); }
details.more summary { cursor: pointer; font-weight: 700; font-size: .93rem; color: var(--turf); }
details.more[open] summary { margin-bottom: 12px; }
details.more > div { display: grid; gap: 14px; }
.results { display: grid; gap: 12px; min-width: 0; }
.res { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; display: grid; grid-template-columns: 2.2rem 1fr auto; gap: 4px 14px; }
.res .rk { font-family: var(--f-mono); font-size: 1.5rem; color: var(--muted); line-height: 1.1; }
.res h3 { margin: 0; font-size: 1.08rem; }
.res .why { grid-column: 2 / -1; font-size: .9rem; margin: 2px 0 0; padding-left: 1.1em; }
.res .cost { text-align: right; font-family: var(--f-mono); font-size: .9rem; }
.res .cost b { font-size: 1.1rem; display: block; }
.out { font-size: .9rem; color: var(--muted); }
.out summary { cursor: pointer; }

.faqs { display: grid; gap: 10px; }
details.faq summary { cursor: pointer; list-style-position: outside; }
details.faq[open] summary { margin-bottom: 6px; }
details.faq p { margin: 0; }

/* picks, verdict, buy bar */
.picks { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 16px; margin: 14px 0 8px; }
.pick { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 16px; display: grid; gap: 6px; align-content: start; box-shadow: var(--shadow); min-width: 0; }
.pick .eyebrow { margin: 0; color: var(--turf); font-weight: 600; }
.pick-img { display: block; background: var(--stripe); border-radius: 10px; padding: 8px 8px 0; }
.pick-img svg, .v-img svg { width: 100%; height: auto; display: block; }
.illus { display: block; font: .68rem var(--f-mono); color: var(--muted); text-align: right; padding: 3px 4px 4px; letter-spacing: .02em; }
.illus.soon { text-align: center; font: 600 .82rem var(--f-body); letter-spacing: 0; padding: 0 4px 10px; margin-top: -6px; }
.pick-img { text-decoration: none; }
.pick h3 { margin: 4px 0 0; font-size: 1.12rem; }
.pick h3 a { color: var(--ink); text-decoration: none; }
.pick h3 a:hover { text-decoration: underline; }
.pick .why { margin: 0; font-size: .9rem; color: var(--muted); }
.pick .pros { font-size: .9rem; }
.pick-cta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 6px; }
.price { font-family: var(--f-mono); font-variant-numeric: tabular-nums; }
.btn.sm { padding: 5px 10px; font-size: .82rem; white-space: nowrap; }
.btn:hover { filter: brightness(1.08); }
.verdict { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 22px; background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 18px; margin: 4px 0 14px; box-shadow: var(--shadow); }
.v-img { background: var(--stripe); border-radius: 10px; padding: 12px 12px 0; align-self: start; }
.v-body .eyebrow { margin: 0 0 4px; color: var(--turf); font-weight: 600; }
.v-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 6px 20px; }
.v-cols h3 { margin: 0; font-size: 1rem; }
.v-price { margin: 10px 0 0; font-size: 1.05rem; }
.jump { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; }
.jump a { font-size: .86rem; border: 1px solid var(--line); border-radius: 99px; padding: 3px 12px; text-decoration: none; background: var(--panel); }
.buybar { position: sticky; bottom: env(safe-area-inset-bottom, 0px); display: flex; justify-content: space-between; align-items: center; gap: 12px; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; margin-top: 24px; box-shadow: 0 -4px 18px rgba(0,0,0,.08); z-index: 4; }
/* table extras */
td.mcell { display: flex; gap: 10px; align-items: center; min-width: 210px; }
.thumb { flex: none; width: 64px; background: var(--stripe); border-radius: 8px; padding: 2px 2px 0; }
.thumb svg { display: block; width: 100%; height: auto; }
.cmp { font-size: .78rem; color: var(--muted); display: inline-flex; gap: 4px; align-items: center; cursor: pointer; }
.filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0 4px; }
.fchip { font: inherit; font-size: .86rem; border: 1px solid var(--line); background: var(--panel); color: var(--ink); border-radius: 99px; padding: 4px 12px; cursor: pointer; }
.fchip[aria-pressed="true"] { background: var(--turf); color: var(--turf-ink); border-color: var(--turf); }
.cmp-tray { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; background: var(--panel); border-top: 1px solid var(--line); box-shadow: 0 -6px 20px rgba(0,0,0,.12); padding: 10px max(16px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.cmp-tray .chip { font-size: .8rem; }
.cmp-view { position: fixed; inset: 0; z-index: 30; background: var(--paper); overflow: auto; padding: calc(16px + env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) 24px max(16px, env(safe-area-inset-left, 0px)); }
.cmp-view .head { display: flex; justify-content: space-between; align-items: center; gap: 10px; max-width: 1120px; margin: 0 auto 10px; }
.cmp-view .tw { max-width: 1120px; margin: 0 auto; }
.cmp-view table { table-layout: fixed; min-width: 560px; }
.cmp-view .spec th:first-child { width: 22%; }
.cmp-view td { font-family: var(--f-body); font-size: .9rem; }

/* forms */
.form { display: grid; gap: 14px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 20px; max-width: 720px; }
.form .row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 14px; }
.form label { font-weight: 700; font-size: .92rem; display: grid; gap: 4px; }
.form .check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; }
.form .check input { margin-top: 5px; }
.status { font-size: .95rem; padding: 10px 14px; border-radius: 8px; background: var(--tint); }
.status.err { border-left: 4px solid var(--bad); }
.report { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; }
.report .meta { font-size: .85rem; color: var(--muted); font-family: var(--f-mono); }
.mod { border: 2px dashed var(--warn); border-radius: var(--r); padding: 16px; margin: 20px 0; }
.mod img { max-width: 220px; border-radius: 6px; display: block; margin: 8px 0; }

footer { border-top: 1px solid var(--line); background: var(--panel); font-size: .9rem; color: var(--muted); }
footer .wrap { padding-block: 26px; display: grid; gap: 10px; }
footer a { color: var(--muted); }
footer nav { display: flex; flex-wrap: wrap; gap: 6px 18px; }

[data-page] { display: block; }
.spa [data-page][hidden] { display: none !important; }

@media (max-width: 760px) {
  body { font-size: 16px; }
  .verdict { grid-template-columns: 1fr; }
  .v-img { max-width: 320px; }
  .nav { flex-wrap: nowrap; overflow-x: auto; width: 100%; scrollbar-width: none; }
  .nav a { white-space: nowrap; }
  .fit { grid-template-columns: 1fr; }
  .scorecard { grid-template-columns: 1fr; }
  .bar { grid-template-columns: minmax(0, 9.5rem) 1fr 2.4rem; }
  .res { grid-template-columns: 1.6rem 1fr; }
  .res .cost { grid-column: 2; text-align: left; }
  .lawn .wrap { padding-block: 26px 20px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }

/* price alerts and today's price */
.alert-form { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; margin: 16px 0; background: var(--panel); max-width: 720px; }
.alert-form h3 { margin: 0 0 8px; font-size: 1.05rem; }
.af-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.af-row select, .af-row input[type=email] { flex: 1 1 200px; min-width: 0; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; font: inherit; background: var(--paper); color: var(--ink); }
.af-c { display: flex; gap: 6px; align-items: flex-start; margin-top: 8px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.live:not(:empty) { display: block; font-size: .8rem; color: var(--turf-ink); margin-top: 2px; }

/* compare page */
.cmp-add { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 12px 0 16px; }
.cmp-add select { flex: 1 1 240px; min-width: 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; font: inherit; background: var(--paper); color: var(--ink); }
.cmp-table { min-width: 640px; table-layout: fixed; }
.cmp-table th[scope=row] { width: 170px; text-align: left; }
.cmp-table thead th { position: sticky; top: 0; background: var(--panel); vertical-align: top; }
.cmp-table td.best { background: var(--tint); font-weight: 700; }
.cmp-table .cta-row td, .cmp-table .cta-row th { border-bottom: 0; }
.linkish { background: none; border: 0; padding: 0; color: var(--turf-ink); text-decoration: underline; font: inherit; font-size: .8rem; cursor: pointer; }
.res-cta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; grid-column: 1 / -1; }
[hidden] { display: none !important; }
.cmp-table th button.linkish { all: revert; background: none; border: 0; padding: 0; color: var(--muted); text-decoration: underline; font: .78rem var(--f-body); cursor: pointer; }
.cmp-table th button.linkish::after { content: none; }
.cmp-table td { font-family: var(--f-body); font-size: .88rem; }
.wtb td.best { background: var(--tint); font-weight: 700; }
img.photo { width: 100%; height: auto; display: block; border-radius: 8px; background: var(--panel); }
.thumb img.photo { width: 64px; height: 48px; object-fit: contain; }
.nopartner { display: inline-block; font-size: .8rem; color: var(--muted); padding: 6px 0; }
.preview-note { margin: 0; padding: 6px max(16px, env(safe-area-inset-right, 0px)) 6px max(16px, env(safe-area-inset-left, 0px)); background: var(--tint); font-size: .78rem; color: var(--ink); text-align: center; }

/* glossary */
.gl h3 { margin: 0 0 2px; }
.gl > .small:first-of-type { margin-top: 0; }
.gl-dec { display: grid; gap: 6px; margin: 10px 0 4px; }
.gl-dec p { margin: 0; padding: 8px 10px; border-radius: 8px; font-size: .92rem; }
.gl-need { background: var(--tint); border-left: 4px solid var(--ok); }
.gl-skip { background: var(--paper); border-left: 4px solid var(--line); }
.gl-quick li { margin-bottom: 8px; max-width: 80ch; }
.gl-toc { margin: 12px 0 4px; }
.gl-toc .jump { margin-top: 10px; }
.gl { scroll-margin-top: 80px; }

/* conversion layout */
.aff-note { font-size: .9rem; color: var(--muted); margin: 12px 0 0; }
.aff-note a { color: var(--turf); }
.steer { margin: 6px 0 0; font-size: .8rem; }
.hero-cta { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0; }
.vs-buy .v-price { margin: 4px 0 8px; font-size: 1.2rem; }
.vs-buy h3 { margin: 0; }
.strip { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; margin: 28px 0; }
.strip h2 { margin: 0 0 10px; font-size: 1.3rem; }
.strip-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 12px; }
.strip-item { display: grid; gap: 4px; align-content: start; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--paper); }
.strip-item .btn { justify-self: start; margin-top: 4px; }
@media (max-width: 760px) {
  .verdict .v-img { order: 2; max-width: 220px; }
  .pick-img svg { max-height: 120px; }
  .nav { gap: 4px 14px; }
}

/* Trusted Adviser refinements */
.brand { color: var(--navy); font-family: var(--f-display); font-weight: 800; font-size: 1.45rem; letter-spacing: -0.02em; align-items: baseline; gap: 0; white-space: nowrap; }
.brand svg.lens { width: .82em; height: .82em; margin: 0 .02em 0 .03em; position: relative; top: .1em; }
.card, .pick, .verdict, .strip, .tw, .scorecard { box-shadow: none; }
.pick, .verdict { border-radius: 10px; }
.strip { background: var(--stripe); }
.eyebrow { color: var(--muted); }
.pick .eyebrow, .v-body .eyebrow { color: var(--turf); }
.btn.ghost { border-width: 2px; }
.trust-row { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 14px 0 0; font-size: .92rem; color: var(--muted); }
.trust-row span::before { content: "✓ "; color: var(--turf); font-weight: 700; }

.pickhint { display: block; font-size: .8rem; color: var(--muted); margin-top: 4px; flex-basis: 100%; }
.pickhint b { color: var(--ink); }
.fit-jump { display: none; }
@media (max-width: 760px) { .fit-jump { display: flex; justify-content: center; position: sticky; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); z-index: 3; box-shadow: 0 4px 14px rgba(0,0,0,.18); } }
.sizebuttons { display: flex; flex-wrap: wrap; gap: 8px; }
.sizebuttons .btn { white-space: normal; max-width: 100%; text-align: left; }
.byline { font-size: .88rem; color: var(--muted); margin: 6px 0 0; }
.byline a { color: inherit; }