/* Filter Fit visual system: parts-counter clarity, a warm paper background, deep green accents.
   Fonts: self-hosted Newsreader (display) and Manrope (UI), both SIL Open Font License. See docs/design.md. */
@font-face{font-family:'Newsreader FF';src:url('/assets/fonts/newsreader-latin.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope FF';src:url('/assets/fonts/manrope-latin.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
:root{--green:#1F6F5C;--green-hover:#185A4A;--green-deep:#134B3E;--mint:#D6EEE6;--pale:#EDF6F2;--ink:#1B2A24;--muted:#5A6B66;--line:#DCE4E0;--cream:#FBF8F1;--sand:#EFE6D3;--amber:#D98E2B;--amber-pale:#FBEFD9;--red:#B4432F;--white:#fff;--focus:#B45309;--radius:14px;--pill:999px;--header:68px;
 --font-display:'Newsreader FF',Georgia,serif;--font-ui:'Manrope FF',system-ui,-apple-system,'Segoe UI',sans-serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
 font-family:var(--font-ui);color:var(--ink);background:var(--cream);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}body{margin:0}img{max-width:100%;height:auto;display:block}
a{color:var(--green);text-underline-offset:3px;text-decoration-thickness:1px}a:hover{color:var(--green-hover)}
button,input,select,textarea{font:inherit;color:inherit}button,a,input,select,textarea,summary{touch-action:manipulation}button{cursor:pointer}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
html{scroll-padding-top:calc(var(--header) + 16px)}
h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.12;color:var(--ink);font-weight:600;letter-spacing:-.01em}
h1,h2{font-family:var(--font-display);font-weight:500}
h1{font-size:clamp(2rem,4.2vw,3.1rem)}h2{font-size:clamp(1.5rem,2.4vw,1.9rem)}h3{font-size:1.15rem}p{margin-bottom:1rem}
.icon{width:1.2em;height:1.2em;flex-shrink:0;vertical-align:-.22em}
.wrap{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;top:-100px;left:16px;background:var(--white);padding:12px 16px;z-index:50;border-radius:8px}.skip:focus{top:12px}
[hidden]{display:none!important}
.small{font-size:.875rem;color:var(--muted)}.muted{color:var(--muted)}
.eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--green);margin-bottom:10px}
.part{font-family:var(--font-ui);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:0}
.tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--green-deep);background:var(--mint);border-radius:6px;padding:2px 7px;margin-left:6px;vertical-align:middle}

/* Buttons and links */
.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 22px;border-radius:var(--pill);font-weight:700;font-size:.98rem;text-decoration:none;line-height:1.2;transition:background-color .15s,border-color .15s,color .15s;text-align:center}
.primary{background:var(--green);border:1px solid var(--green);color:var(--white)}.primary:hover{background:var(--green-hover);border-color:var(--green-hover);color:var(--white)}
.secondary{background:transparent;border:1.5px solid var(--ink);color:var(--ink)}.secondary:hover{background:var(--ink);color:var(--white)}
.text-link,.card-link{display:inline-flex;align-items:center;gap:6px;font-weight:700;text-decoration:none;min-height:24px}.text-link:hover,.card-link:hover{text-decoration:underline}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.buy-note{margin:8px 0 0}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--white);border-radius:var(--pill);padding:6px 14px;font-size:.9rem;color:var(--ink);text-decoration:none;min-height:32px}.chip:hover{border-color:var(--green);color:var(--green)}.chip .small{font-size:.8rem}

/* Top bar and header */
.top-bar{background:var(--ink);color:#D5DDE8;text-align:center;font-size:.8rem;padding:6px 16px;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-bar a{color:inherit;display:inline-block;padding:6px 2px;margin:-6px 0}
.site-header{position:sticky;top:0;z-index:30;background:rgba(251,248,241,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.header-row{display:flex;align-items:center;gap:12px;min-height:var(--header)}
.brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:600;font-size:1.4rem;color:var(--ink);text-decoration:none;white-space:nowrap;margin-right:auto}.brand img{width:28px;height:28px}.brand:hover{color:var(--ink)}
.nav-search{display:none;flex:1;max-width:420px;position:relative;margin:0 8px}
.nav-search>input{width:100%;border:1px solid var(--line);border-radius:var(--pill);background:var(--white);padding:9px 48px 9px 16px;min-height:42px}.nav-search>input:focus{outline:none;border-color:var(--green)}
.nav-search>button{position:absolute;right:5px;top:5px;border:0;background:var(--green);color:var(--white);width:32px;height:32px;border-radius:50%;display:grid;place-items:center}
.nav-links{display:none;gap:22px}.nav-links a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.95rem;padding:6px 0;min-height:32px;display:inline-flex;align-items:center}.nav-links a:hover{color:var(--green)}
.menu,.search-sheet{position:relative}.menu summary,.search-sheet summary{list-style:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--white);cursor:pointer}.menu summary::-webkit-details-marker,.search-sheet summary::-webkit-details-marker{display:none}
.menu .icon,.search-sheet .icon{width:22px;height:22px}.menu[open] .menu-open,.menu:not([open]) .menu-close,.search-sheet[open] .sheet-open,.search-sheet:not([open]) .sheet-close{display:none}
.menu-panel{position:absolute;right:0;top:calc(100% + 8px);background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 18px 40px rgba(27,42,36,.14);padding:10px;min-width:260px;display:grid;z-index:40}.menu-panel a{padding:10px 12px;border-radius:8px;color:var(--ink);text-decoration:none;font-weight:600}.menu-panel a:hover{background:var(--pale);color:var(--green)}
/* The phone search sheet: full width under the header, the same results list as home. */
.sheet-panel{position:fixed;left:0;right:0;top:var(--header);background:var(--white);border-bottom:1px solid var(--line);box-shadow:0 18px 40px rgba(27,42,36,.14);padding:14px 0 16px;z-index:40}
.sheet-panel .search{max-width:none}.sheet-panel .search-results{position:static;box-shadow:none;border:0;padding:6px 0 0;max-height:min(60vh,520px)}
@media (min-width:900px){.nav-search{display:block}.nav-links{display:flex}.menu,.search-sheet{display:none}}

/* Hero and page headers */
.hero{background:linear-gradient(180deg,var(--pale),var(--cream) 85%);padding:28px 0 36px}
.hero-grid{display:grid;gap:22px;align-items:center}
.hero-photo img{border-radius:20px;width:100%}
.lede{font-size:1.08rem;color:var(--muted);max-width:56ch;margin-bottom:14px}
.hero-hint{margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--muted);font-size:.9rem}
@media (max-width:899px){.hero h1{font-size:1.9rem;margin-bottom:8px}.hero-photo img{aspect-ratio:21/9!important;object-fit:cover;max-height:180px}}
@media (min-width:900px){.hero{padding:56px 0 64px}.hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.page-header{padding:28px 0 20px}
.header-grid{display:grid;gap:20px;align-items:center}
.header-photo img{border-radius:16px;width:100%}
@media (max-width:899px){.header-photo img{aspect-ratio:16/9!important;object-fit:cover;max-height:180px}}
@media (min-width:900px){.has-photo .header-grid{grid-template-columns:minmax(0,1fr) 360px}.page-header{padding:40px 0 24px}}
.answer-header{background:var(--white);border-bottom:1px solid var(--line)}
.answer-header .header-grid{grid-template-columns:1fr}
.intro{font-size:1.1rem;color:var(--muted);max-width:62ch}.intro .part{color:var(--ink);font-weight:700}
.crumbs{font-size:.85rem;color:var(--muted);margin-bottom:10px;display:flex;flex-wrap:wrap;gap:2px 4px;align-items:center}.crumbs a{color:var(--muted);text-decoration:none;display:inline-flex;align-items:center;min-height:28px;padding:0 3px}.crumbs a:hover{color:var(--green);text-decoration:underline}

/* Photos (Unsplash, hotlinked; the credit is part of the figure and check.mjs requires it) */
.photo{margin:0;position:relative}.photo img{object-fit:cover;width:100%}
.photo-credit{font-size:.72rem;color:var(--muted);margin-top:6px}.photo-credit a{color:inherit}
.art-card .photo-credit{position:absolute;right:8px;bottom:6px;margin:0;background:rgba(251,248,241,.9);padding:2px 8px;border-radius:6px}

/* Search */
.search{position:relative;max-width:640px}
.search-row{display:flex;align-items:center;gap:8px;background:var(--white);border:1.5px solid var(--line);border-radius:var(--pill);padding:6px 6px 6px 16px;box-shadow:0 10px 30px rgba(27,42,36,.06)}
.search-row:focus-within{border-color:var(--green);outline:3px solid var(--focus);outline-offset:2px}
.search-row>.icon{color:var(--muted)}
.search-row input{flex:1;border:0;background:none;min-width:0;padding:10px 4px;font-size:1.05rem}.search-row input:focus{outline:none}
.search-row input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;width:24px;height:24px;cursor:pointer;background:var(--muted);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E") center/18px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E") center/18px no-repeat}
.search.large .search-row{padding:8px 8px 8px 18px}
.hero .search{scroll-margin-top:calc(var(--header) + 12px)}
.search-results{position:absolute;left:0;right:0;top:calc(100% + 8px);margin:0;padding:6px;list-style:none;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 18px 40px rgba(27,42,36,.14);z-index:20;max-height:420px;overflow:auto}
.search-results a{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:10px;padding:10px 12px;border-radius:10px;text-decoration:none;color:var(--ink)}.search-results a:hover,.search-results [aria-selected=true] a{background:var(--pale)}
.search-results strong{grid-column:1}.search-results .small{grid-column:1}
.result-kind{grid-column:2;grid-row:1 / span 2;align-self:start;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.search-results .kind-brand .result-kind,.search-results .kind-category .result-kind{color:var(--green)}
.search-results .kind-brand strong,.search-results .kind-category strong{color:var(--green)}
.search-results .empty{padding:12px;color:var(--muted);font-size:.9rem;line-height:1.5}.search-results .empty a{display:inline;padding:0;font-weight:600}
.search-results .more button{width:100%;border:0;background:var(--pale);color:var(--green);font-weight:700;border-radius:10px;padding:10px;margin-top:4px}
@media (max-width:560px){.search-row{flex-wrap:wrap;border-radius:18px}.search-row input{flex:1;order:0;min-width:120px}.search-row .primary{width:100%;order:2}}
.hub-search{padding:4px 0 8px}.hub-search .search{max-width:none}.hub-search [data-filter-count]{margin:8px 0 0}

/* Sections and cards */
.home-section,.section{padding:28px 0}.band{background:var(--white);border-block:1px solid var(--line)}
.section-heading{margin-bottom:22px;max-width:60ch}.section-heading p{color:var(--muted)}
.art-grid,.link-grid,.model-grid{display:grid;gap:18px}
@media (min-width:700px){.art-grid.three,.model-grid,.link-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.art-grid.three,.model-grid{grid-template-columns:repeat(3,1fr)}.link-grid{grid-template-columns:repeat(3,1fr)}}
.art-card,.link-card,.model-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;color:var(--ink);display:flex;flex-direction:column;transition:border-color .15s,transform .15s}
.art-card:hover,.link-card:hover,.model-card:hover{border-color:var(--green);transform:translateY(-2px)}
.art-card-image img{width:100%;border-radius:var(--radius) var(--radius) 0 0;aspect-ratio:16/10!important;max-height:200px}
.art-card-body,.link-card,.model-card{padding:20px}.art-card-body p,.link-card p,.model-card p{color:var(--muted);flex:1}
.model-card h3{font-family:var(--font-display);font-size:1.35rem;font-weight:500}
.model-grid.compact .model-card{padding:16px}.model-grid.compact h3{font-size:1.2rem;margin-bottom:6px}.model-grid.compact p{margin-bottom:8px;font-size:.92rem}
.trust-points{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:14px}.trust-points li{display:flex;gap:12px;align-items:flex-start}.trust-points .icon{color:var(--green);width:1.5em;height:1.5em;margin-top:2px}
@media (min-width:800px){.trust-points{grid-template-columns:repeat(3,1fr)}}

/* Hubs: brand tiles, the A-Z brand list, model rows, filter cards, help card */
.brand-tiles{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}
@media (min-width:700px){.brand-tiles{grid-template-columns:repeat(4,1fr)}}
.brand-tile{display:flex;flex-direction:column;gap:2px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:16px;text-decoration:none;color:var(--ink);min-height:96px}.brand-tile:hover{border-color:var(--green)}.brand-tile strong{font-size:1.1rem}
.brand-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:0 18px}
@media (min-width:800px){.brand-list{grid-template-columns:repeat(4,1fr)}}
.brand-list a{display:flex;justify-content:space-between;align-items:center;min-height:48px;padding:0 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}.brand-list a:hover{color:var(--green)}
.series-head{font-family:var(--font-ui);font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:22px 0 6px}
.model-rows{list-style:none;margin:0;padding:0;background:var(--white);border:1px solid var(--line);border-radius:var(--radius)}
.model-rows li{border-bottom:1px solid var(--line)}.model-rows li:last-child{border-bottom:0}
.model-rows a{display:flex;align-items:center;gap:12px;padding:12px 14px;min-height:56px;text-decoration:none;color:var(--ink)}.model-rows a:hover{background:var(--pale)}
.model-rows .row-main{flex:1;display:flex;flex-direction:column;min-width:0}.model-rows .row-part{font-size:.9rem;color:var(--muted);text-align:right;display:flex;flex-direction:column;align-items:flex-end}.model-rows .row-part .part{color:var(--ink);font-weight:600}.model-rows .icon{color:var(--green)}
@media (max-width:560px){.model-rows a{flex-wrap:wrap}.model-rows .row-main{flex-basis:calc(100% - 36px)}.model-rows .row-part{flex-basis:calc(100% - 36px);text-align:left;align-items:flex-start;flex-direction:row;gap:6px}.model-rows .icon{order:-1;margin-left:auto}}
.filter-cards{display:grid;gap:12px}
@media (min-width:700px){.filter-cards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.filter-cards{grid-template-columns:repeat(3,1fr)}}
.filter-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;display:flex;flex-direction:column;gap:4px}.filter-card>a{text-decoration:none;color:var(--ink);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}.filter-card>a:hover{color:var(--green)}
.filter-card summary{cursor:pointer;color:var(--green);font-weight:600;font-size:.9rem}.filter-card details p{margin:6px 0 0}
.help-card{background:var(--pale);border-radius:var(--radius);padding:22px;display:grid;gap:14px}.help-card h2{font-size:1.35rem;margin-bottom:8px}.help-card p{margin:0}.help-card .actions{margin:0}
@media (min-width:900px){.help-card{grid-template-columns:1fr auto;align-items:center}}

/* Content grid, panels, facts */
.content-grid{display:grid;gap:24px;padding:28px 0 48px}
@media (min-width:1000px){.content-grid{grid-template-columns:minmax(0,1fr) 320px;align-items:start}}
.panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px;margin-bottom:20px}.panel h2{font-size:1.35rem;margin-bottom:12px}.panel .text-link{display:flex;margin-top:8px}
aside .panel{background:var(--pale);border-color:transparent}
.facts,.answer-facts{display:grid;gap:14px;margin:0}.facts dt,.answer-facts dt{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}.facts dd,.answer-facts dd{margin:4px 0 0;font-weight:600}.facts dd .small,.answer-facts dd .small{display:block;font-weight:400}
.answer-facts{grid-template-columns:1fr 1fr}.answer-facts>div:first-child{grid-column:1 / -1}
@media (min-width:560px){.answer-facts{grid-template-columns:repeat(3,1fr)}.answer-facts>div:first-child{grid-column:auto}}
@media (min-width:760px){.answer-facts:has(> div:nth-child(4)){grid-template-columns:repeat(4,1fr)}}
@media (min-width:900px){.answer-header.page-header{padding:28px 0 18px}.answer-header h1{margin-bottom:8px}}
.answer .full-name{margin:-6px 0 14px}
@media (max-width:899px){.answer-header .eyebrow{display:none}.answer-header .intro{font-size:.95rem;margin:4px 0 0}.answer-header{padding:14px 0 12px}.answer-header .crumbs{margin-bottom:6px}.answer-header h1{font-size:1.6rem;margin-bottom:0}.content-grid{padding-top:14px}.answer{padding:16px}.answer h2{font-size:1.3rem;margin-bottom:8px}.answer .actions{margin-top:12px}.answer-facts{gap:10px}}
.answer{background:var(--white);border:1.5px solid var(--green);border-radius:var(--radius);padding:22px;margin-bottom:20px;box-shadow:0 14px 36px rgba(31,111,92,.10)}
.answer.lead{border-width:2px}.answer h2{font-size:1.45rem;margin-bottom:14px}.answer h2 a{color:var(--ink);text-decoration:none}.answer h2 a:hover{color:var(--green)}
.answer .part{font-size:1.25rem;font-weight:700;color:var(--green-deep)}.answer .part .small{font-size:.8rem;font-family:var(--font-ui);color:var(--muted);font-weight:400}
.answer-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:6px}.answer-top .eyebrow{margin-bottom:0}
.answer-foot{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:10px}
.caveat,.note{display:flex;gap:8px;align-items:flex-start;border-radius:10px;padding:8px 12px;font-size:.9rem;margin:12px 0 0}
.caveat{background:var(--amber-pale)}.caveat .icon{color:var(--amber);margin-top:2px}
.note{background:var(--pale)}.note .icon{color:var(--green);margin-top:2px}
.confidence{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:700;border-radius:var(--pill);padding:4px 11px;text-align:left}
.confidence.high{background:var(--mint);color:var(--green-deep)}.confidence.medium{background:#EEF0F3;color:#3B4A55}.confidence.low{background:#F8E3DF;color:var(--red)}
.fit-note{display:inline-block;font-size:.8rem;color:var(--muted);margin-left:4px}.fit-note.low{color:var(--red)}
.source-type{font-size:.75rem;font-weight:700;border-radius:6px;padding:2px 7px;vertical-align:middle}
.source-type.high{background:var(--mint);color:var(--green-deep)}.source-type.medium{background:#EEF0F3;color:#3B4A55}.source-type.low{background:#F8E3DF;color:var(--red)}
.sources{padding-left:1.2rem;margin:0}.sources li{margin-bottom:12px}.sources a,.claims a{font-weight:600;display:inline-flex;align-items:center;min-height:24px}
.claims{list-style:none;margin:0;padding:0}.claims li{padding:10px 0;border-bottom:1px solid var(--line)}.claims li:last-child{border-bottom:0}.claims .claim{display:block;margin-bottom:4px}
.all-sources{margin-top:14px}.all-sources summary{cursor:pointer;color:var(--green);font-weight:700}.all-sources h3{font-size:.95rem;margin:16px 0 6px}
.evidence{margin:6px 0 0;padding:8px 12px;border-left:3px solid var(--line);color:var(--muted);font-size:.88rem;font-style:italic}
.variants,.fits,.plain,.filter-list{list-style:none;margin:0;padding:0}
.variants li{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}.variants li:last-child{border-bottom:0}
.variants .icon{margin-top:3px;flex-shrink:0}.variants .yes .icon{color:var(--green)}.variants .no .icon{color:var(--red)}.variants .maybe .icon{color:var(--muted)}
.fits li,.plain li,.filter-list li{padding:10px 0;border-bottom:1px solid var(--line)}.fits li:last-child,.plain li:last-child,.filter-list li:last-child{border-bottom:0}
.fits li{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline}.fits .small{flex:1}
.filter-list a{text-decoration:none;color:var(--ink);display:block}.filter-list a:hover{color:var(--green)}.filter-list .small{display:block}

/* Tables */
.table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}
.fit-table,.compare{width:100%;border-collapse:collapse;font-size:.95rem}.fit-table th,.fit-table td,.compare th,.compare td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.fit-table th,.compare th{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:var(--pale)}.fit-table tr:last-child td,.compare tr:last-child td{border-bottom:0}.fit-table a{font-weight:600}
.compare td .small{display:block}.compare .lead-row td{background:#F6FBF9}.compare .text-link{min-height:24px}
/* Options comparison on phones: each row becomes a compact card with labels. */
@media (max-width:699px){.compare thead{display:none}.compare tr{display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;padding:12px 14px;border-bottom:1px solid var(--line)}.compare tr:last-child{border-bottom:0}.compare td{border:0;padding:0}.compare td[data-label=Filter]{grid-column:1 / -1}.compare td[data-label=Buy]{grid-column:1 / -1;margin-top:4px}.compare td:not([data-label=Filter]):not([data-label=Buy])::before{content:attr(data-label);display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}}

/* Article and forms */
.article{max-width:72ch;padding:24px 0 56px}.article h2{font-size:1.4rem;margin-top:28px}
/* Guides: a long article with numbered steps, two size tables and the same Sources panel the model pages use. */
.guide .lead{font-size:1.08rem}.guide h3{margin-top:18px;margin-bottom:6px}.guide .steps{padding-left:1.3rem;margin:0 0 1rem}.guide .steps li{margin-bottom:8px}
.guide .table-scroll{margin:14px 0 10px}.guide .fit-table td.part{font-weight:600}.guide .panel{margin-top:32px}.guide .buy-routes li{margin-bottom:12px}.guide ul:not(.plain){padding-left:1.3rem}.guide ul:not(.plain) li{margin-bottom:10px}
.control{display:grid;gap:6px;margin-bottom:16px;font-weight:600}.control select,.control textarea,.control input{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--white);font-weight:400;max-width:100%;width:100%}.control textarea{min-height:120px;resize:vertical}
.control .search{max-width:none;font-weight:400}.control .search-row{box-shadow:none}.picked{margin:0;display:flex;gap:10px;align-items:center;font-weight:400}
.correction-form{max-width:640px;margin:24px auto 56px}.status{margin-top:12px;font-size:.9rem;color:var(--muted)}.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.correction-form button[disabled]{opacity:.55;cursor:not-allowed}
.next-step{margin-top:20px}.next-step .search{max-width:none}

/* Footer */
.site-footer{background:var(--white);border-top:1px solid var(--line);margin-top:40px}
.footer-grid{display:grid;gap:28px;padding:40px 0 24px}.footer-about p{color:var(--muted);margin-top:14px;max-width:38ch}
.site-footer nav{display:grid;gap:4px;align-content:start}.site-footer nav a{color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;min-height:28px}.site-footer nav a:hover{color:var(--green)}
.footer-head{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;margin:0 0 4px}
.footer-base{padding:16px 0 32px;font-size:.82rem;color:var(--muted);border-top:1px solid var(--line)}
@media (min-width:800px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr}}
/* M4b re-review: category card links, hub photo placement, phone compare lead row */
.art-card{position:relative}.art-card h3 a.card-cover{color:inherit;text-decoration:none}.art-card h3 a.card-cover::after{content:"";position:absolute;inset:0;border-radius:var(--radius)}
.art-card .photo-credit{z-index:1}.art-card:focus-within{border-color:var(--green)}.art-card .card-cover:focus-visible{outline:none}.art-card:has(.card-cover:focus-visible){outline:3px solid var(--green);outline-offset:2px}
.photo-narrow{display:none}
@media (max-width:899px){.photo-wide{display:none}.photo-narrow{display:block;margin-top:4px}.photo-narrow .header-photo img{aspect-ratio:16/7!important;max-height:160px}}
@media (max-width:699px){.compare .lead-row{background:#F6FBF9}.compare .lead-row td{background:none}}