/* Pro Wood Bats Pro — components */

/* Buttons */
.pwb-btn {
	display: inline-flex; align-items: center; gap: var(--pwb-sp-2);
	padding: var(--pwb-sp-3) var(--pwb-sp-5);
	font-family: var(--pwb-font-display);
	font-size: var(--pwb-fs-400);
	letter-spacing: 0.04em;
	text-decoration: none;
	border-radius: var(--pwb-radius-md);
	border: 1px solid transparent;
	cursor: pointer;
	transition: transform var(--pwb-transition), background var(--pwb-transition), color var(--pwb-transition), box-shadow var(--pwb-transition);
	line-height: 1.1;
	white-space: nowrap;
}
.pwb-btn--lg { padding: var(--pwb-sp-4) var(--pwb-sp-6); font-size: var(--pwb-fs-500); }
.pwb-btn--sm { padding: var(--pwb-sp-2) var(--pwb-sp-3); font-size: var(--pwb-fs-300); }

.pwb-btn--primary   { background: var(--pwb-red); color: var(--pwb-white); box-shadow: var(--pwb-shadow-1); }
.pwb-btn--primary:hover { background: var(--pwb-red-2); transform: translateY(-1px); box-shadow: var(--pwb-shadow-2); color: var(--pwb-white); }
.pwb-btn--secondary { background: var(--pwb-gold); color: var(--pwb-navy); }
.pwb-btn--secondary:hover { background: var(--pwb-gold-2); color: var(--pwb-navy); transform: translateY(-1px); }
.pwb-btn--ghost     { background: transparent; color: var(--pwb-navy); border-color: var(--pwb-border-strong); }
.pwb-btn--ghost:hover { background: var(--pwb-ash); color: var(--pwb-navy); }
.pwb-bg-dugout .pwb-btn--ghost { color: var(--pwb-ash); border-color: rgba(255,255,255,0.3); }
.pwb-bg-dugout .pwb-btn--ghost:hover { background: rgba(255,255,255,0.05); color: var(--pwb-white); }

.pwb-input {
	width: 100%;
	padding: var(--pwb-sp-3);
	border: 1px solid var(--pwb-border-strong);
	border-radius: var(--pwb-radius-md);
	background: var(--pwb-white);
	color: var(--pwb-ink);
	font: inherit;
}
.pwb-input--lg { padding: var(--pwb-sp-4); font-size: var(--pwb-fs-500); }
label > span { display: block; margin-bottom: var(--pwb-sp-2); font-size: var(--pwb-fs-300); color: var(--pwb-muted); font-weight: 600; }
label { display: block; margin-bottom: var(--pwb-sp-4); }

/* Cards */
.pwb-card {
	display: flex; flex-direction: column;
	background: var(--pwb-white);
	border: 1px solid var(--pwb-border);
	border-radius: var(--pwb-radius-lg);
	overflow: hidden;
	transition: transform var(--pwb-transition), box-shadow var(--pwb-transition);
	box-shadow: var(--pwb-shadow-1);
}
.pwb-card:hover { transform: translateY(-4px); box-shadow: var(--pwb-shadow-2); }
.pwb-card__media { position: relative; aspect-ratio: 16/10; overflow: hidden; background: var(--pwb-ash); }
.pwb-card__img { width: 100%; height: 100%; object-fit: cover; }
.pwb-card__img--placeholder { display: block; background: var(--pwb-maple); }
.pwb-card__placeholder, .pwb-product-box__placeholder { position: absolute; inset: 0; width: 100%; height: 100%; }
.pwb-card__badge {
	position: absolute; top: var(--pwb-sp-3); left: var(--pwb-sp-3);
	background: var(--pwb-navy); color: var(--pwb-gold);
	padding: 4px 10px; border-radius: var(--pwb-radius-pill);
	font-family: var(--pwb-font-mono); font-size: var(--pwb-fs-200);
	letter-spacing: 0.06em; text-transform: uppercase;
}
.pwb-card__body { padding: var(--pwb-sp-5); display: flex; flex-direction: column; gap: var(--pwb-sp-3); flex: 1; }
.pwb-card__title { font-size: var(--pwb-fs-600); margin: 0; }
.pwb-card__title a { color: var(--pwb-navy); text-decoration: none; }
.pwb-card__title a:hover { color: var(--pwb-red); }
.pwb-card__excerpt { color: var(--pwb-muted); font-size: var(--pwb-fs-300); margin: 0; flex: 1; }
.pwb-card__meta { font-size: var(--pwb-fs-200); color: var(--pwb-muted); margin: 0; }
.pwb-card__sep { margin: 0 6px; }

.pwb-card--pick .pwb-card__specs { display: grid; grid-template-columns: max-content 1fr; gap: var(--pwb-sp-2) var(--pwb-sp-4); font-size: var(--pwb-fs-300); margin: 0; }
.pwb-card--pick .pwb-card__specs > div { display: contents; }
.pwb-card--pick .pwb-card__specs dt { font-family: var(--pwb-font-mono); color: var(--pwb-muted); text-transform: uppercase; font-size: var(--pwb-fs-200); letter-spacing: 0.04em; }
.pwb-card--pick .pwb-card__specs dd { margin: 0; }
.pwb-card__ctas { display: flex; flex-wrap: wrap; gap: var(--pwb-sp-3); margin-top: auto; }
.pwb-card__safety { font-size: var(--pwb-fs-300); color: var(--pwb-charcoal); background: rgba(244,185,66,0.10); padding: var(--pwb-sp-3); border-radius: var(--pwb-radius-md); }

/* Spec card */
.pwb-spec-card {
	background: var(--pwb-white);
	border-radius: var(--pwb-radius-lg);
	box-shadow: var(--pwb-shadow-2);
	overflow: hidden;
}
.pwb-spec-card__head { background: var(--pwb-leather); color: var(--pwb-ash); padding: var(--pwb-sp-3) var(--pwb-sp-5); font-family: var(--pwb-font-display); letter-spacing: 0.06em; text-transform: uppercase; }
.pwb-spec-card__body { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 0; padding: 0; }
.pwb-spec-card__body > div { display: flex; flex-direction: column; padding: var(--pwb-sp-3) var(--pwb-sp-5); border-bottom: 1px solid var(--pwb-border); border-right: 1px solid var(--pwb-border); }
.pwb-spec-card__body > div:nth-child(2n) { border-right: 0; }
.pwb-spec-card__body dt { font-family: var(--pwb-font-mono); font-size: var(--pwb-fs-200); color: var(--pwb-muted); letter-spacing: 0.06em; text-transform: uppercase; }
.pwb-spec-card__body dd { margin: 0; font-family: var(--pwb-font-mono); font-size: var(--pwb-fs-500); color: var(--pwb-navy); }

/* Hero */
.pwb-hero { padding: var(--pwb-sp-8) 0; }
body.admin-bar .pwb-hero { padding-top: calc(var(--pwb-sp-8) + 32px); }
@media screen and (max-width: 782px) {
	body.admin-bar .pwb-hero { padding-top: calc(var(--pwb-sp-8) + 46px); }
}
.pwb-hero__row { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--pwb-sp-7); align-items: center; position: relative; z-index: 1; }
@media (max-width: 900px) { .pwb-hero__row { grid-template-columns: 1fr; } }
.pwb-hero__title { font-size: var(--pwb-fs-900); margin: 0 0 var(--pwb-sp-4); color: var(--pwb-ash); }
.pwb-hero__subtitle { font-size: var(--pwb-fs-500); color: rgba(255,255,255,0.84); margin: 0 0 var(--pwb-sp-5); max-width: 56ch; }
.pwb-hero__ctas { display: flex; flex-wrap: wrap; gap: var(--pwb-sp-3); margin-bottom: var(--pwb-sp-5); }
.pwb-hero__ctas .pwb-btn--primary { box-shadow: 0 0 0 0 rgba(244,185,66,0); animation: pwb-glow 3s ease-in-out infinite; }
@keyframes pwb-glow {
	0%, 100% { box-shadow: 0 0 0 0 rgba(244,185,66,0); }
	50%      { box-shadow: 0 0 32px 4px rgba(244,185,66,0.45); }
}
.pwb-hero__quickstart { list-style: none; padding: 0; margin: 0 0 var(--pwb-sp-5); display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--pwb-sp-3); }
@media (max-width: 640px) { .pwb-hero__quickstart { grid-template-columns: repeat(2, 1fr); } }
.pwb-quickstart { display: flex; align-items: center; gap: var(--pwb-sp-2); padding: var(--pwb-sp-3); background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: var(--pwb-radius-md); text-decoration: none; color: var(--pwb-ash); font-size: var(--pwb-fs-300); }
.pwb-quickstart:hover { background: rgba(244,185,66,0.12); border-color: rgba(244,185,66,0.4); color: var(--pwb-white); }
.pwb-quickstart__bat { width: 16px; height: 4px; border-radius: 2px; background: var(--pwb-maple); transform: rotate(-20deg); }

.pwb-hero__trust { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--pwb-sp-3); }
.pwb-trust-badge { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); color: var(--pwb-ash); padding: 4px 10px; border-radius: var(--pwb-radius-pill); font-size: var(--pwb-fs-300); }

.pwb-hero__spec { position: relative; }
.pwb-hero__swing-arc { position: absolute; left: -40px; right: -40px; top: -20px; opacity: 0.5; color: var(--pwb-gold); }
.pwb-hero__swing-arc path { stroke-dasharray: 1000; stroke-dashoffset: 1000; animation: pwb-arc 2.4s ease forwards 0.2s; }
@keyframes pwb-arc { to { stroke-dashoffset: 0; } }

/* Trust strip */
.pwb-trust-card {
	background: var(--pwb-white);
	border: 1px solid var(--pwb-border);
	border-radius: var(--pwb-radius-md);
	padding: var(--pwb-sp-5);
	display: flex; flex-direction: column; gap: var(--pwb-sp-2);
	list-style: none;
}
.pwb-trust-card__icon { width: 28px; height: 28px; background: var(--pwb-gold); border-radius: var(--pwb-radius-pill); }
.pwb-trust-card__title { font-family: var(--pwb-font-display); font-size: var(--pwb-fs-500); color: var(--pwb-navy); }
.pwb-trust-card__text  { font-size: var(--pwb-fs-300); color: var(--pwb-muted); margin: 0; }

/* Archetypes */
.pwb-archetype {
	background: var(--pwb-white);
	border: 1px solid var(--pwb-border);
	border-radius: var(--pwb-radius-lg);
	padding: var(--pwb-sp-5);
	display: flex; flex-direction: column; gap: var(--pwb-sp-3);
	color: var(--pwb-ink);
}
.pwb-archetype__head { display: flex; align-items: center; gap: var(--pwb-sp-3); }
.pwb-archetype__icon { width: 36px; height: 36px; background: linear-gradient(135deg, var(--pwb-maple), var(--pwb-leather)); border-radius: var(--pwb-radius-pill); }
.pwb-archetype__title { font-size: var(--pwb-fs-500); margin: 0; }
.pwb-archetype__specs { display: grid; grid-template-columns: max-content 1fr; gap: 4px var(--pwb-sp-3); font-size: var(--pwb-fs-300); margin: 0; }
.pwb-archetype__specs > div { display: contents; }
.pwb-archetype__specs dt { font-family: var(--pwb-font-mono); color: var(--pwb-muted); font-size: var(--pwb-fs-200); text-transform: uppercase; letter-spacing: 0.04em; }
.pwb-archetype__specs dd { margin: 0; }
.pwb-archetype__note { font-size: var(--pwb-fs-200); color: var(--pwb-charcoal); border-top: 1px dashed var(--pwb-border); padding-top: var(--pwb-sp-2); margin: 0; }
.pwb-archetype__ctas { display: flex; gap: var(--pwb-sp-2); margin-top: auto; }

/* Product box variants */
.pwb-product-box { background: var(--pwb-white); border: 1px solid var(--pwb-border); border-radius: var(--pwb-radius-lg); overflow: hidden; box-shadow: var(--pwb-shadow-1); margin: var(--pwb-sp-5) 0; }
.pwb-product-box--a { display: grid; grid-template-columns: 1fr 2fr; gap: 0; }
@media (max-width: 720px) { .pwb-product-box--a { grid-template-columns: 1fr; } }
.pwb-product-box__media { background: linear-gradient(135deg, var(--pwb-maple), var(--pwb-leather)); min-height: 240px; position: relative; }
.pwb-product-box__media .pwb-product-box__badge { position: absolute; top: var(--pwb-sp-3); left: var(--pwb-sp-3); background: var(--pwb-navy); color: var(--pwb-gold); padding: 4px 10px; border-radius: var(--pwb-radius-pill); font-family: var(--pwb-font-mono); font-size: var(--pwb-fs-200); text-transform: uppercase; letter-spacing: 0.06em; }
.pwb-product-box__body { padding: var(--pwb-sp-5); display: flex; flex-direction: column; gap: var(--pwb-sp-4); }
.pwb-product-box__title { margin: 0; }
.pwb-product-box__subtitle { color: var(--pwb-muted); margin: 0; }
.pwb-product-box__specs { display: grid; grid-template-columns: max-content 1fr; gap: 4px var(--pwb-sp-3); font-size: var(--pwb-fs-300); margin: 0; }
.pwb-product-box__specs > div { display: contents; }
.pwb-product-box__specs dt { font-family: var(--pwb-font-mono); color: var(--pwb-muted); font-size: var(--pwb-fs-200); text-transform: uppercase; }
.pwb-product-box__specs dd { margin: 0; }
.pwb-product-box__prosCons { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pwb-sp-5); }
@media (max-width: 600px) { .pwb-product-box__prosCons { grid-template-columns: 1fr; } }
.pwb-list { list-style: none; padding: 0; margin: 0; }
.pwb-list li { padding-left: 22px; position: relative; margin-bottom: 4px; font-size: var(--pwb-fs-300); }
.pwb-list--good li::before { content: '✓'; position: absolute; left: 0; color: #2f8a3b; font-weight: 700; }
.pwb-list--bad  li::before { content: '×'; position: absolute; left: 0; color: var(--pwb-red); font-weight: 700; }
.pwb-list--check li::before { content: '☑'; position: absolute; left: 0; color: var(--pwb-gold); }
.pwb-product-box__safety { background: #FFF8E5; border-left: 4px solid var(--pwb-red); padding: var(--pwb-sp-3); border-radius: 0 var(--pwb-radius-md) var(--pwb-radius-md) 0; font-size: var(--pwb-fs-300); margin: 0; }
.pwb-product-box__ctas { display: flex; flex-wrap: wrap; gap: var(--pwb-sp-3); }

.pwb-product-box--b { display: grid; grid-template-columns: 88px 1fr; gap: var(--pwb-sp-3); align-items: center; padding: var(--pwb-sp-3); }
.pwb-product-box--b .pwb-product-box__img { width: 88px; height: 88px; border-radius: var(--pwb-radius-md); background: linear-gradient(135deg, var(--pwb-maple), var(--pwb-leather)); }
.pwb-product-box--b .pwb-product-box__title { font-size: var(--pwb-fs-500); }
.pwb-product-box--c, .pwb-product-box--d, .pwb-product-box--e { padding: var(--pwb-sp-5); }
.pwb-product-box__pill { display: inline-block; background: var(--pwb-gold); color: var(--pwb-navy); padding: 4px 10px; border-radius: var(--pwb-radius-pill); font-family: var(--pwb-font-mono); font-size: var(--pwb-fs-200); text-transform: uppercase; margin-bottom: var(--pwb-sp-3); }

/* Wood card */
.pwb-wood-card { background: var(--pwb-white); border: 1px solid var(--pwb-border); border-radius: var(--pwb-radius-lg); padding: var(--pwb-sp-5); display: flex; flex-direction: column; gap: var(--pwb-sp-3); }
.pwb-wood-card__title { margin: 0; }
.pwb-wood-card__feel  { color: var(--pwb-muted); margin: 0; font-size: var(--pwb-fs-300); }
.pwb-wood-card__meters { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; font-size: var(--pwb-fs-300); }
.pwb-wood-card__meters li { display: grid; grid-template-columns: 100px 1fr; gap: var(--pwb-sp-3); align-items: center; }
.pwb-wood-card__meters meter { width: 100%; height: 10px; }
.pwb-wood-card__dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px var(--pwb-sp-3); font-size: var(--pwb-fs-300); margin: 0; }
.pwb-wood-card__dl > div { display: contents; }
.pwb-wood-card__dl dt { font-family: var(--pwb-font-mono); color: var(--pwb-muted); font-size: var(--pwb-fs-200); text-transform: uppercase; }
.pwb-wood-card__dl dd { margin: 0; }
.pwb-wood-card__rule { background: rgba(244,185,66,0.10); padding: var(--pwb-sp-2) var(--pwb-sp-3); border-radius: var(--pwb-radius-md); font-size: var(--pwb-fs-300); margin: 0; }

/* Comparison table */
.pwb-comparison__wrap { overflow: auto; background: var(--pwb-white); border-radius: var(--pwb-radius-lg); border: 1px solid var(--pwb-border); }
.pwb-comparison__table { min-width: 720px; font-size: var(--pwb-fs-300); }
.pwb-comparison__table th, .pwb-comparison__table td { white-space: nowrap; }
.pwb-comparison__table tbody th { background: var(--pwb-ash); }

/* Pagination */
.pwb-pagination .nav-links { display: flex; gap: var(--pwb-sp-2); flex-wrap: wrap; margin-top: var(--pwb-sp-6); justify-content: center; }
.pwb-pagination .page-numbers { padding: var(--pwb-sp-2) var(--pwb-sp-3); border: 1px solid var(--pwb-border-strong); border-radius: var(--pwb-radius-md); text-decoration: none; color: var(--pwb-navy); }
.pwb-pagination .current { background: var(--pwb-navy); color: var(--pwb-white); }

/* Single post */
.pwb-single { padding: var(--pwb-sp-6) var(--pwb-sp-5); }
.pwb-single__header { margin-bottom: var(--pwb-sp-6); }
.pwb-single__title { margin: 0 0 var(--pwb-sp-3); }
.pwb-single__meta { color: var(--pwb-muted); font-size: var(--pwb-fs-300); margin: 0; }
.pwb-single__sep { margin: 0 var(--pwb-sp-2); }
.pwb-single__layout { display: grid; grid-template-columns: 1fr 320px; gap: var(--pwb-sp-7); align-items: start; }
@media (max-width: 960px) { .pwb-single__layout { grid-template-columns: 1fr; } }
.pwb-single__sidebar { position: sticky; top: 80px; display: flex; flex-direction: column; gap: var(--pwb-sp-4); }
.pwb-quick-answer { background: var(--pwb-ash); border-left: 4px solid var(--pwb-gold); border-radius: 0 var(--pwb-radius-md) var(--pwb-radius-md) 0; padding: var(--pwb-sp-4) var(--pwb-sp-5); margin: var(--pwb-sp-4) 0; }
.pwb-quick-answer__label { display: block; font-family: var(--pwb-font-mono); text-transform: uppercase; font-size: var(--pwb-fs-200); color: var(--pwb-leather-2); letter-spacing: 0.08em; }
.pwb-toc { background: var(--pwb-white); border: 1px solid var(--pwb-border); border-radius: var(--pwb-radius-md); padding: var(--pwb-sp-4); margin: var(--pwb-sp-4) 0; }
.pwb-toc__title { display: block; margin-bottom: var(--pwb-sp-2); font-family: var(--pwb-font-display); font-size: var(--pwb-fs-500); }
.pwb-toc__list { list-style: decimal; padding-left: 1.4em; margin: 0; }
.pwb-toc__item--h3 { margin-left: var(--pwb-sp-3); font-size: var(--pwb-fs-300); }

/* Quiz */
.pwb-quiz__card { background: var(--pwb-white); border: 1px solid var(--pwb-border-strong); border-radius: var(--pwb-radius-lg); padding: var(--pwb-sp-7); box-shadow: var(--pwb-shadow-2); }
.pwb-quiz__intro { text-align: center; }
.pwb-quiz__progress { margin-bottom: var(--pwb-sp-5); }
.pwb-quiz__progressBar { height: 8px; background: var(--pwb-ash); border-radius: var(--pwb-radius-pill); overflow: hidden; }
.pwb-quiz__progressBar span { display: block; height: 100%; background: linear-gradient(90deg, var(--pwb-gold), var(--pwb-red)); width: 0%; transition: width var(--pwb-transition-lg); }
.pwb-quiz__progressText { font-family: var(--pwb-font-mono); font-size: var(--pwb-fs-200); margin: var(--pwb-sp-2) 0 0; color: var(--pwb-muted); }
.pwb-quiz__legend { font-family: var(--pwb-font-display); font-size: var(--pwb-fs-600); color: var(--pwb-navy); margin-bottom: var(--pwb-sp-4); }
.pwb-quiz__options { display: grid; gap: var(--pwb-sp-2); margin-bottom: var(--pwb-sp-4); }
.pwb-quiz__option { display: flex; gap: var(--pwb-sp-3); padding: var(--pwb-sp-3) var(--pwb-sp-4); border: 1px solid var(--pwb-border-strong); border-radius: var(--pwb-radius-md); cursor: pointer; margin: 0; transition: background var(--pwb-transition), border-color var(--pwb-transition); }
.pwb-quiz__option:hover { background: var(--pwb-ash); }
.pwb-quiz__option input { margin-top: 4px; }
.pwb-quiz__option input:checked + span { font-weight: 700; }
.pwb-quiz__option:has(input:checked) { background: rgba(244,185,66,0.12); border-color: var(--pwb-gold); }
.pwb-quiz__nav { display: flex; gap: var(--pwb-sp-3); justify-content: space-between; }
.pwb-quiz__result { padding: var(--pwb-sp-5); background: var(--pwb-ash); border-radius: var(--pwb-radius-md); }
.pwb-quiz__disclaimer { font-size: var(--pwb-fs-200); color: var(--pwb-muted); text-align: center; margin-top: var(--pwb-sp-4); }

/* Calc + Viz + Generator + Prioritizer + Tracker + DB */
.pwb-calc, .pwb-viz, .pwb-gen, .pwb-prio, .pwb-track, .pwb-db {
	background: var(--pwb-white);
	border: 1px solid var(--pwb-border);
	border-radius: var(--pwb-radius-lg);
	padding: var(--pwb-sp-6);
	box-shadow: var(--pwb-shadow-1);
}
.pwb-calc__actions, .pwb-viz__actions, .pwb-gen__actions, .pwb-prio__actions, .pwb-track__actions, .pwb-track__bulk { display: flex; flex-wrap: wrap; gap: var(--pwb-sp-3); margin-top: var(--pwb-sp-4); }
.pwb-calc__error { color: var(--pwb-red); font-size: var(--pwb-fs-300); }
/* Result panels — clip the wood-grain so it never leaks a sliver past the rounded edge. */
.pwb-calc__result, .pwb-viz__output, .pwb-gen__result, .pwb-prio__result {
	margin-top: var(--pwb-sp-5);
	padding: var(--pwb-sp-5);
	background: var(--pwb-ash);
	border-radius: var(--pwb-radius-md);
	position: relative;
	isolation: isolate;
	overflow: hidden;
	clip-path: inset(0 round var(--pwb-radius-md));
}
.pwb-calc__disclaimer, .pwb-track__privacy { font-size: var(--pwb-fs-200); color: var(--pwb-muted); margin-top: var(--pwb-sp-3); }

.pwb-prio__pool, .pwb-prio__ranked { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--pwb-sp-2); margin: var(--pwb-sp-3) 0; }
.pwb-prio__ranked { counter-reset: pwb-prio; min-height: 60px; padding: var(--pwb-sp-3); background: var(--pwb-ash); border-radius: var(--pwb-radius-md); border: 1px dashed var(--pwb-border-strong); }
.pwb-prio__ranked li { counter-increment: pwb-prio; }
.pwb-prio__ranked li::before { content: counter(pwb-prio) '. '; font-weight: 700; color: var(--pwb-red); }
.pwb-prio__chip { padding: var(--pwb-sp-2) var(--pwb-sp-3); background: var(--pwb-ash); border: 1px solid var(--pwb-border-strong); border-radius: var(--pwb-radius-pill); cursor: pointer; font-size: var(--pwb-fs-300); transition: background var(--pwb-transition); user-select: none; }
.pwb-prio__chip:hover { background: rgba(244,185,66,0.15); }
.pwb-prio__chip[data-picked="1"] { background: var(--pwb-gold); color: var(--pwb-navy); border-color: var(--pwb-gold-2); }

/* Viz SVG */
.pwb-viz__bat { width: 100%; height: auto; background: linear-gradient(180deg, transparent, rgba(244,185,66,0.05)); border-radius: var(--pwb-radius-md); padding: var(--pwb-sp-4); }
.pwb-viz__bat rect { fill: var(--pwb-maple); transition: fill var(--pwb-transition-lg), x var(--pwb-transition-lg), width var(--pwb-transition-lg); }
.pwb-viz__bat rect[data-pwb-viz-handle] { fill: var(--pwb-leather); }
.pwb-viz__bat polygon[data-pwb-viz-taper] { fill: var(--pwb-leather); }
.pwb-viz__bat .pwb-viz__knob { fill: var(--pwb-charcoal); }
.pwb-viz__bat .pwb-viz__cap  { fill: var(--pwb-leather-2); }
.pwb-viz__bat circle[data-pwb-viz-balance] { fill: var(--pwb-red); stroke: var(--pwb-white); stroke-width: 2; transition: cx var(--pwb-transition-lg); }
.pwb-viz__meters { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pwb-sp-4); margin-top: var(--pwb-sp-4); }
.pwb-viz__meters meter { width: 100%; height: 14px; }
.pwb-viz__dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px var(--pwb-sp-3); margin-top: var(--pwb-sp-3); font-size: var(--pwb-fs-300); }
.pwb-viz__dl > div { display: contents; }
.pwb-viz__dl dt { font-family: var(--pwb-font-mono); color: var(--pwb-muted); font-size: var(--pwb-fs-200); text-transform: uppercase; }
.pwb-viz__dl dd { margin: 0; }

/* Database */
.pwb-db__filters { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr max-content; gap: var(--pwb-sp-3); margin-bottom: var(--pwb-sp-4); }
@media (max-width: 800px) { .pwb-db__filters { grid-template-columns: 1fr 1fr; } }
.pwb-db__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--pwb-sp-4); }
.pwb-db__card { background: var(--pwb-white); border: 1px solid var(--pwb-border); border-radius: var(--pwb-radius-md); padding: var(--pwb-sp-4); }
.pwb-db__card h3 { font-size: var(--pwb-fs-500); margin: 0 0 var(--pwb-sp-2); color: var(--pwb-leather); font-family: var(--pwb-font-mono); }
.pwb-db__card dl { display: grid; grid-template-columns: max-content 1fr; gap: 2px var(--pwb-sp-2); font-size: var(--pwb-fs-300); margin: 0 0 var(--pwb-sp-3); }
.pwb-db__card dl > div { display: contents; }
.pwb-db__card dt { color: var(--pwb-muted); font-family: var(--pwb-font-mono); font-size: var(--pwb-fs-200); text-transform: uppercase; }
.pwb-db__card dd { margin: 0; }

/* Tracker */
.pwb-track__list { display: grid; gap: var(--pwb-sp-3); margin: var(--pwb-sp-5) 0; }
.pwb-track__item { background: var(--pwb-ash); border-radius: var(--pwb-radius-md); padding: var(--pwb-sp-3) var(--pwb-sp-4); display: grid; grid-template-columns: 1fr max-content; gap: var(--pwb-sp-3); align-items: center; }
.pwb-track__item h4 { margin: 0 0 6px; font-size: var(--pwb-fs-500); }
.pwb-track__item small { display: block; color: var(--pwb-muted); margin-top: 4px; font-size: var(--pwb-fs-200); line-height: 1.4; }
.pwb-track__item--retired { background: rgba(185,28,28,0.10); border: 1px solid rgba(185,28,28,0.3); }
.pwb-track__checklist { background: rgba(244,185,66,0.10); padding: var(--pwb-sp-4); border-radius: var(--pwb-radius-md); margin-top: var(--pwb-sp-5); }

/* Newsletter */
.pwb-newsletter__row { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--pwb-sp-7); align-items: center; }
@media (max-width: 900px) { .pwb-newsletter__row { grid-template-columns: 1fr; } }
.pwb-newsletter__bullets { list-style: none; padding: 0; margin: var(--pwb-sp-4) 0 0; display: grid; gap: var(--pwb-sp-2); color: rgba(255,255,255,0.86); font-size: var(--pwb-fs-300); }
.pwb-newsletter__form { background: var(--pwb-white); border-radius: var(--pwb-radius-lg); padding: var(--pwb-sp-5); display: flex; flex-direction: column; gap: var(--pwb-sp-3); }
.pwb-newsletter__gdpr, .pwb-newsletter__thanks { font-size: var(--pwb-fs-200); color: var(--pwb-muted); margin: 0; }
.pwb-newsletter__thanks { color: #2f8a3b; font-weight: 700; }

/* FAQ */
.pwb-faq__list { list-style: none; padding: 0; margin: 0; }
.pwb-faq__item { background: var(--pwb-white); border: 1px solid var(--pwb-border); border-radius: var(--pwb-radius-md); margin-bottom: var(--pwb-sp-3); overflow: hidden; }
.pwb-faq__q { padding: var(--pwb-sp-4) var(--pwb-sp-5); font-family: var(--pwb-font-display); font-size: var(--pwb-fs-500); color: var(--pwb-navy); cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.pwb-faq__q::after { content: '+'; color: var(--pwb-red); font-weight: 700; transition: transform var(--pwb-transition); }
details[open] .pwb-faq__q::after { transform: rotate(45deg); }
.pwb-faq__a { padding: 0 var(--pwb-sp-5) var(--pwb-sp-4); font-size: var(--pwb-fs-300); color: var(--pwb-charcoal); }

/* Trust EEAT */
.pwb-trust__card { background: var(--pwb-white); border: 1px solid var(--pwb-border); border-radius: var(--pwb-radius-md); padding: 0; list-style: none; }
.pwb-trust__link { display: flex; justify-content: space-between; align-items: center; padding: var(--pwb-sp-4) var(--pwb-sp-5); color: var(--pwb-navy); text-decoration: none; font-family: var(--pwb-font-display); font-size: var(--pwb-fs-500); }
.pwb-trust__link:hover { color: var(--pwb-red); background: var(--pwb-ash); }
.pwb-trust__cta { text-align: center; margin-top: var(--pwb-sp-5); }

/* 404 */
.pwb-404 { padding: var(--pwb-sp-7) var(--pwb-sp-5); display: grid; gap: var(--pwb-sp-6); }
.pwb-404__title { margin: 0; }
.pwb-404__lede { color: var(--pwb-muted); }
.pwb-404__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--pwb-sp-5); }
@media (max-width: 800px) { .pwb-404__grid { grid-template-columns: 1fr; } }
.pwb-404__col-title { font-size: var(--pwb-fs-500); margin: 0 0 var(--pwb-sp-3); }
.pwb-404__ctas { display: flex; flex-wrap: wrap; gap: var(--pwb-sp-3); justify-content: center; }

/* Shop / Legal */
.pwb-shop__hero { padding: var(--pwb-sp-7) 0 var(--pwb-sp-5); }
.pwb-shop__title { margin: 0 0 var(--pwb-sp-3); }
.pwb-shop__compare, .pwb-shop__cards, .pwb-shop__checklist, .pwb-shop__faq { margin: var(--pwb-sp-7) 0; }
.pwb-legal__body { background: var(--pwb-white); padding: var(--pwb-sp-6); border-radius: var(--pwb-radius-lg); border: 1px solid var(--pwb-border); margin-top: var(--pwb-sp-5); }
.pwb-legal__body h2 { margin-top: var(--pwb-sp-6); }

/* Home padding */
.pwb-home__disclosure { padding: var(--pwb-sp-5) 0 0; }

/* Empty / messages */
.pwb-empty { text-align: center; padding: var(--pwb-sp-7); color: var(--pwb-muted); background: var(--pwb-white); border-radius: var(--pwb-radius-md); border: 1px dashed var(--pwb-border-strong); }

/* Author box */
.pwb-author-box { display: flex; gap: var(--pwb-sp-4); align-items: flex-start; background: var(--pwb-ash); padding: var(--pwb-sp-5); border-radius: var(--pwb-radius-md); margin: var(--pwb-sp-6) 0; }
.pwb-author-box__avatar { border-radius: var(--pwb-radius-pill); }
.pwb-author-box__name { font-family: var(--pwb-font-display); font-size: var(--pwb-fs-600); color: var(--pwb-navy); }
.pwb-author-box__bio  { color: var(--pwb-charcoal); font-size: var(--pwb-fs-300); margin: 4px 0; }
.pwb-author-box__reviewed { font-family: var(--pwb-font-mono); font-size: var(--pwb-fs-200); color: var(--pwb-muted); text-transform: uppercase; letter-spacing: 0.06em; margin: 0; }

/* Comments */
.pwb-comments { margin-top: var(--pwb-sp-7); }
.pwb-comments__list { list-style: none; padding: 0; margin: 0 0 var(--pwb-sp-5); }
.pwb-comments__list li { background: var(--pwb-white); border: 1px solid var(--pwb-border); border-radius: var(--pwb-radius-md); padding: var(--pwb-sp-4); margin-bottom: var(--pwb-sp-3); }