/* Additions for the generator: answer-first block, profile pages, tables, skip link. Uses the tokens in style.css. */
.skip-link{position:absolute;left:12px;top:-60px;z-index:100;background:var(--paper);color:var(--ink);padding:10px 14px;border-radius:10px;font-weight:900;text-decoration:none}
.skip-link:focus{top:12px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--felt-soft);outline-offset:3px}
.article-main .short-answer{border:1px solid var(--line-dark);border-left:4px solid #a85f3f;border-radius:22px;background:#fffaf0;padding:22px 24px;margin-bottom:44px}
.article-main .short-answer-title{font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:900;color:#7a5521;margin:0 0 8px;line-height:1.3}
.article-main .short-answer p{margin:0;font-size:19px;color:#1d2a22}
.article-main .short-answer .updated-line{margin-top:12px;font-size:14px;color:#4f5a52}
.profile-note{border:1px dashed rgba(36,72,61,.35);border-radius:16px;padding:14px 16px;background:#fffaf0;font-size:16px!important}
.table-wrap{overflow-x:auto;margin:18px 0 30px;border:1px solid var(--line-dark);border-radius:18px;background:#fffaf0}
.spec-table,.compare-table{width:100%;border-collapse:collapse;font-size:16px;color:#243126}
.spec-table caption,.compare-table caption{text-align:left;font-weight:900;padding:14px 16px 6px;color:#24483d}
.spec-table th,.spec-table td,.compare-table th,.compare-table td{text-align:left;vertical-align:top;padding:12px 16px;border-top:1px solid var(--line-dark)}
.spec-table th{width:34%;font-weight:900}
.compare-table thead th{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#4f5a52}
.compare-table{min-width:560px}
.source-list ul{padding-left:20px}.source-list li{font-size:16px;margin:6px 0}
.article-main a{color:#24483d}
.article-main .related-card,.article-main .button{color:inherit}
/* Layout: let the article column shrink so wide tables scroll inside .table-wrap instead of widening the page. */
.article-main,.article-body-grid>*{min-width:0}
/* Contrast fixes (WCAG 2.2 AA) for labels inherited from the original design. */
.article-premium .section-label{color:#7a5521}
.method-card .section-label,.image-cta-inline .section-label{color:var(--felt-soft)}
.skill-meta span{color:rgba(23,34,28,.82)}
.archetype-card>span{color:var(--felt-soft)}.test-grid span{color:#7a5521}
.image-cta-inline .eyebrow{color:var(--felt-soft)}

/* Long URLs, model names and spec values wrap instead of widening the page on phones. */
.article-main p,.article-main li,.article-main td,.article-main th,.source-list a{overflow-wrap:anywhere}

/* Valor Score badge, review list, affiliate label, Google map card. */
.valor-score{border:2px solid #24483d;border-radius:22px;background:#fff0dc;padding:16px 20px;margin:0 0 22px}
.valor-score-num{font-weight:900;font-size:26px;color:#24483d;letter-spacing:-.02em}
.valor-score-basis{font-size:15px;color:#344037;margin-top:4px}.valor-score-basis a{color:#24483d;font-weight:800}
.score-flag{margin:10px 0 0;font-size:15px!important;color:#6b3f17!important;font-weight:700}
.review-list{list-style:none;padding:0}.review-list li{border-top:1px solid var(--line-dark);padding:14px 0}
.review-head{font-weight:800;color:#243126}.review-head a{color:#24483d}.review-score{color:#243126}.review-date{color:#4a554c;font-weight:600}
.aff-badge{display:inline-block;border:1px solid #7a5521;color:#5c3d14;border-radius:999px;padding:2px 9px;font-size:13px;font-weight:800}
.review-list p{margin:6px 0 0;font-size:16px}
.review-quote{margin:8px 0 0;padding-left:14px;border-left:3px solid var(--felt)}.review-quote footer{font-size:14px;color:#4a554c}
.article-main iframe{display:block;border-radius:18px;margin:8px 0 10px;max-width:100%}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Pro Desk (/pro/) */
.pro-byline{display:flex;align-items:center;gap:12px;margin-top:22px}.pro-byline img{width:44px;height:44px;border-radius:50%;flex:none}
.pro-byline>div{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}.pro-byline-name{font-weight:900;color:#16251f}.pro-byline-name a{color:#16251f;text-underline-offset:3px}
.pro-pill{display:inline-flex;align-items:center;border:1px solid #24483d;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#24483d}
.pro-date{font-size:13px;color:#3d4a40}
.pro-graphic{margin:22px 0}.pro-graphic svg{display:block;width:100%;max-width:420px;height:auto}.pro-graphic figcaption{font-size:14px;color:#3d4a40;margin-top:8px}
.pro-sources ul{padding-left:18px}.pro-sources li{font-size:15px;overflow-wrap:anywhere}.source-date{color:#4f5b52;font-size:13px}
.pro-disclosure{font-size:12px;line-height:1.5;color:#4f5b52;border-top:1px solid rgba(36,72,61,.18);padding-top:12px;margin-top:28px}
.category-page .pro-disclosure{color:#3d4a40}
.pro-about{display:grid;grid-template-columns:96px 1fr;gap:22px;align-items:start;margin-top:18px}.pro-about img{border-radius:50%}
.pro-about h2{font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:clamp(28px,3.4vw,44px);margin:26px 0 10px}
.pro-about li,.pro-about p{font-size:17px;color:#344037}
@media (max-width:600px){.pro-about{grid-template-columns:1fr}}
/* Internal-link blocks: similar rackets, nearby clubs, similar gear, browse-by-brand, nearby cities */
.article-main .link-list{list-style:none;padding:0;margin:8px 0 20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:2px 20px}
.article-main .link-list li{margin:0}
.article-main .link-list a{display:inline-block;padding:10px 0;min-height:44px;line-height:1.4;text-decoration:underline;text-underline-offset:3px}
.section-hub-link{margin-top:22px;font-size:16px}
.mega-verts-more{margin-top:18px;font-size:16px}
.mega-verts-more a{text-decoration:underline;text-underline-offset:3px}
/* Club badges (/for-clubs/) and club-confirmed profiles */
.club-confirmed{border:1px solid rgba(36,72,61,.28);border-radius:20px;background:#eef3ec;padding:16px 18px;font-size:16px!important}.club-confirmed a{color:#24483d;font-weight:800}
.confirmed-mark{display:inline-flex;align-items:center;gap:7px;margin-right:6px;border-radius:999px;background:#24483d;color:#fff6e6;padding:4px 11px 4px 9px;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;vertical-align:1px}.confirmed-mark:before{content:"";width:11px;height:6px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translateY(-2px)}
.badge-showcase{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:22px 0}.badge-showcase .on-dark{background:#16251f;border-radius:20px;padding:12px}.badge-showcase .on-light{background:#fffaf0;border:1px solid var(--line-dark);border-radius:20px;padding:12px}.badge-showcase img{height:64px;width:auto}
.badge-builder{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:22px;border:1px solid var(--line-dark);border-radius:28px;background:#fffaf0;padding:24px;margin:24px 0}
.badge-field{border:0;margin:0 0 18px;padding:0;min-width:0}.badge-field>label,.badge-field legend,.badge-builder-output>label{display:block;font-weight:900;color:#101613;margin-bottom:8px;font-size:15px;padding:0}
.badge-field fieldset label,.badge-field>label:not(:first-child),fieldset.badge-field label{display:flex;align-items:center;gap:9px;font-weight:600;font-size:15px;color:#243126;margin:6px 0;min-height:32px}
.badge-builder select,.badge-builder textarea{width:100%;box-sizing:border-box;border:1px solid rgba(16,22,19,.32);border-radius:14px;background:#fff;color:#101613;font:500 15px/1.4 Inter,ui-sans-serif,system-ui,sans-serif;padding:11px 12px}.badge-builder select{min-height:46px}
.badge-builder textarea{font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;resize:vertical;margin-bottom:12px}.badge-builder input[type=radio]{width:18px;height:18px;accent-color:#24483d}
.badge-builder label:has(input:disabled){opacity:.55}.badge-hint{font-size:14px!important;color:#4a564d!important;margin:4px 0 0}
.badge-preview{display:grid;place-items:center;min-height:118px;border-radius:20px;margin-bottom:16px;border:1px solid var(--line-dark);background:#fff}.badge-preview[data-theme=dark]{background:#16251f;border-color:#16251f}.badge-preview img{height:64px;width:auto}
.badge-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:16px}.badge-builder .badge-actions .button{border:0;cursor:pointer;font:inherit;font-weight:900;background:#c9824a;color:#1f160f}.badge-actions .button:disabled{opacity:.45;cursor:not-allowed}#badge-status{font-size:14px;color:#24483d;font-weight:700}
@media (max-width:900px){.badge-builder{grid-template-columns:1fr;padding:18px}}

/* Research reports: key findings list, accessible bar charts (a data table with decorative bars), citation block. */
.key-findings{padding-left:1.4em;margin:12px 0 24px}
.key-findings li{margin:0 0 12px;line-height:1.55}
.bar-chart{margin:18px 0 30px}
.bar-table{width:100%;border-collapse:collapse;font-size:15px;color:#243126}
.bar-table caption{text-align:left;font-weight:900;padding:14px 16px 6px;color:#24483d}
.bar-table thead th{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#4f5a52;text-align:left;padding:8px 16px}
.bar-table th[scope=row]{text-align:left;font-weight:700;padding:10px 16px;width:38%;vertical-align:middle;border-top:1px solid var(--line-dark)}
.bar-table td{padding:10px 16px;border-top:1px solid var(--line-dark);vertical-align:middle}
.bar-table .bar{display:block;height:12px;width:var(--w);min-width:4px;border-radius:6px;background:#24483d;margin-bottom:6px}
.bar-table .bar-value{font-weight:700;color:#243126}
.chart-note{font-size:14px;color:#4f5a52;margin:6px 4px 0}
.cite-block{padding:14px 18px;border-left:4px solid #24483d;background:#fffaf0;border-radius:8px;overflow-wrap:anywhere}
@media (max-width:600px){.bar-table th[scope=row]{width:44%;padding:10px 10px}.bar-table td{padding:10px 10px}}

/* Racket Finder (/rackets/ and the level guides): filter form + sortable spec table. */
.racket-finder{border:1px solid var(--line-dark);border-radius:28px;background:#fffaf0;padding:22px 22px 14px;margin:0 0 28px}
.finder-head h2{margin:0 0 4px}.finder-head p{margin:0 0 16px;color:#3c463f}
.finder-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 16px;margin:0 0 10px}
.finder-field{min-width:0}.finder-field label{display:block;font-weight:900;color:#101613;font-size:14px;margin-bottom:6px}
.finder-field select{width:100%;min-height:46px;box-sizing:border-box;border:1px solid rgba(16,22,19,.42);border-radius:14px;background:#fff;color:#101613;font:500 15px/1.3 Inter,ui-sans-serif,system-ui,sans-serif;padding:10px 12px}
.finder-checks{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px}
.finder-check{display:inline-flex!important;align-items:center;gap:9px;font-weight:700!important;font-size:15px!important;min-height:32px;margin:0!important}
.finder-check input{width:20px;height:20px;accent-color:#24483d}
.finder-reset,.finder-more{border:1px solid #24483d;border-radius:999px;background:#fff;color:#24483d;font:800 14px/1 Inter,ui-sans-serif,system-ui,sans-serif;padding:11px 16px;cursor:pointer;min-height:44px}
.finder-reset{margin-left:auto}.finder-more{display:block;margin:12px auto 4px}
.finder-count{font-weight:800;color:#24483d;margin:6px 0 10px}
.finder-table{min-width:880px}.finder-table td,.finder-table th{font-size:15px}
.finder-sort{all:unset;cursor:pointer;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;display:inline-flex;align-items:center;gap:6px}
.finder-sort:focus-visible{outline:3px solid #c9824a;outline-offset:3px;border-radius:4px}
th[aria-sort=ascending] .finder-sort span:after{content:"▲"}th[aria-sort=descending] .finder-sort span:after{content:"▼"}th[aria-sort=none] .finder-sort span:after{content:"↕";opacity:.6}
.finder-cta{border-left:4px solid #24483d;background:#eef3ec;border-radius:10px;padding:14px 18px;margin:22px 0;font-size:16px}
.finder-cta a{color:#24483d;font-weight:800}
@media (max-width:900px){.finder-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.racket-finder{padding:16px 14px 10px;border-radius:20px}.finder-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 10px}.finder-field select{font-size:14px;padding:9px 8px}.finder-reset{margin-left:0}}
