/* Component: related-picks (WB-2026-10-26-05). Semantic --nt- tokens only; lint: scripts/lint-css-values.py --components. */
@layer components {
.nt-related { margin-block: var(--nt-space-xl); }
.nt-related__h { margin: 0 0 var(--nt-space-s); font: 600 var(--nt-step-1) / var(--nt-leading-tight) var(--nt-font-display); color: var(--nt-color-ink); }
.nt-related__list { margin: 0; padding: 0; list-style: none; }
.nt-related__row { display: flex; justify-content: space-between; align-items: start; gap: var(--nt-space-m); padding-block: var(--nt-space-s); border-block-start: var(--nt-rule-hair) solid var(--nt-color-rule); }
.nt-related__title { font: 600 var(--nt-step-0) / var(--nt-leading-snug) var(--nt-font-display); color: var(--nt-color-ink); text-decoration: none; }
.nt-related__title:hover { text-decoration: underline; }
.nt-related__ctx { margin: var(--nt-space-3xs) 0 0; font: 400 var(--nt-step--1) / 1.4 var(--nt-font-ui); color: var(--nt-color-ink-3); }
.nt-related__score { flex: none; text-align: end; font: 600 var(--nt-step-1) / 1 var(--nt-font-display); font-variant-numeric: tabular-nums lining-nums; color: var(--nt-color-ink); }
.nt-related__score small { display: block; margin-block-start: var(--nt-space-3xs); font: 400 var(--nt-step--2) / 1.2 var(--nt-font-ui); color: var(--nt-color-ink-3); }
.nt-related__type { flex: none; font: 500 var(--nt-step--2) / 1.2 var(--nt-font-ui); color: var(--nt-color-ink-3); }
}
