/* Genre-agnostic design token layer, intentionally loaded after legacy styles. */
body{font-family:var(--bb-body-font);color:var(--bb-text);background:var(--bb-background)}
h1,h2,h3,h4,h5,h6,.brand>a,.bb-slide-text h2{font-family:var(--bb-heading-font)}
a:hover,.text-link,.bb-center-heading span,.bb-label,.section-heading span,.widget-title a{color:var(--bb-primary)}
.top-strip{background:var(--bb-surface);color:var(--bb-muted);border-color:var(--bb-border)}
.header-main{background:var(--bb-header)}
.main-nav{background:var(--bb-nav);color:#fff;border-color:var(--bb-nav)}
.main-nav .sub-menu{background:var(--bb-nav)}
.main-nav li a:hover{background:var(--bb-primary);color:#fff}
.section.alt,.entry-content h2,.spec-table th{background:var(--bb-surface)}
.section-heading,.widget-title,.entry-content h3{border-color:var(--bb-border)}
.section-heading span,.bb-center-heading span,.point-grid b{color:var(--bb-primary)}
.bb-center-heading:after,.widget-title,.entry-content h3{border-color:var(--bb-primary)}
.bb-center-heading:after{background:var(--bb-primary)}
.point-grid>div{border-color:var(--bb-primary)}
.product-card,.widget,.point-grid>div,.bb-feature-row,.empty-state,.spec-table th,.spec-table td{border-color:var(--bb-border)}
.product-card,.point-grid>div{border-radius:var(--bb-radius);overflow:hidden}
.product-body p,.bb-feature-text p{color:var(--bb-muted)}
.button,.search-form button{background:var(--bb-primary);border-radius:var(--bb-radius)}
.bb-slide-cta{border-radius:var(--bb-radius)}
.site-footer{background:var(--bb-nav)}
.copyright{background:color-mix(in srgb,var(--bb-nav) 85%,black)}
.rank-number,.bb-rank-circle{background:var(--bb-accent)}
.entry-content h2{border-left-color:var(--bb-primary)}
.sticky-ad{background:var(--bb-nav)}.sticky-ad a{background:var(--bb-primary)}
:where(input,textarea,select){font-family:var(--bb-body-font)}
@media(max-width:850px){.main-nav,.main-nav .sub-menu{background:var(--bb-nav);color:#fff}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Semantic contrasts are computed from the three selected brand colors. */
.button,.search-form button,.main-nav li a:hover,.sticky-ad a{color:var(--bb-on-primary)}
.rank-number,.bb-rank-circle{color:var(--bb-on-accent)}
.section.alt,.entry-content h2,.spec-table th{background:var(--bb-surface)}
.point-grid>div{background:var(--bb-background)}