.related{grid-column:2;min-width:0;border:1px solid var(--line);border-radius:12px;background:var(--paper);overflow:hidden}
.related-viewport{overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.related-track{display:flex;width:max-content}
.related-caption{font-size:13px;color:var(--muted);margin:0 0 16px}
.related-group{display:flex;gap:16px;padding-right:16px}
.related-product{display:flex;flex-direction:column;gap:8px;width:220px;flex:none;padding:14px;border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--ink);background:var(--paper)}
.related-product img{width:100%;height:112px;object-fit:contain;background:#fff;border-radius:4px}
.related-product small{color:var(--muted);font-size:12px}
.related-product strong{font-size:14px;font-weight:500}
.related:focus-within .related-track{animation-play-state:paused}
.visual .ph[hidden]{display:none}
.brandline{align-items:center;flex-wrap:wrap;gap:8px}
.brandline .brand-logo{display:block;width:88px;height:30px;max-width:88px;max-height:30px;flex:0 0 88px;object-fit:contain;background:#fff;padding:2px;border-radius:2px}
@keyframes related-scroll{to{transform:translateX(-50%)}}
@media(hover:hover) and (pointer:fine){.related:hover .related-track{animation-play-state:paused}.related-product:hover{border-color:var(--accent)}}
@media(max-width:1100px){.related-product{width:190px;padding:12px}.related-product img{height:96px}.related-product strong{font-size:13px}}
@media(max-width:900px){.related{grid-column:1}.related-product{width:180px}.related-product img{height:90px}}
@media(prefers-reduced-motion:reduce){.related-track{animation:none}.related-copy{display:none}}
