/* The roller-shade guide uses manufacturer photos and unscored, use-case picks. */
html:has(> body.roller-guide) { scroll-behavior: auto; }
.roller-photo { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; border-radius: 14px; }
.roller-figure { margin: 1.25rem 0; }
.roller-figure--hero { margin: 0; }
.roller-figure figcaption { margin-top: .55rem; font-size: .75rem; line-height: 1.5; color: var(--ink-3); }
.roller-figure figcaption a { color: var(--research); text-decoration: underline; text-underline-offset: .15em; }
.roller-figure--hero .roller-photo { max-height: 430px; }
.roller-guide .prose .roller-figure > .roller-photo { max-height: 440px; background: var(--paper-2); }
.roller-shortlist { margin: 1.5rem 0 2rem; padding: 1.25rem; background: var(--sage-soft); border: 1px solid var(--line-2); border-radius: var(--r-lg); }
.prose .roller-shortlist__intro { margin: 0 0 1rem; font-size: .9375rem; }
.roller-shortlist__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.prose .roller-shortlist__link { display: flex; flex-direction: column; gap: .3rem; padding: .85rem; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); color: var(--ink); text-decoration: none; }
.roller-shortlist__link strong { font-size: 1rem; }
.roller-shortlist__link span { color: var(--research); font-size: .8125rem; line-height: 1.45; }
.prose .roller-shortlist__link:hover { border-color: var(--research); background: #fff; }
.roller-shortlist__link:focus-visible { outline: 3px solid var(--research); outline-offset: 3px; }
.prose .roller-pick__award { display: inline-block; margin: .25rem 0 .5rem; padding: .35rem .65rem; border-radius: 6px; background: var(--brass-tint); color: var(--brass-deep); font-size: .8125rem; font-weight: 700; }
.roller-pick__facts { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem 1.2rem; margin: 1rem 0; padding: 1rem; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); }
.roller-pick__facts > div { min-width: 0; }
.roller-pick__facts dt { font-size: .75rem; font-weight: 700; color: var(--research); }
.roller-pick__facts dd { margin: .25rem 0 0; font-size: .875rem; line-height: 1.6; }
.prose .roller-pick__tradeoff { padding: .8rem 1rem; border-left: 3px solid var(--brass); background: var(--brass-tint); font-size: .9375rem; }
.prose .roller-pick__sources { font-size: .8125rem; line-height: 1.7; }
.roller-pick__sources a { overflow-wrap: anywhere; }
.prose .roller-scope { font-size: .875rem; color: var(--ink-3); }
.roller-guide .ctable { display: table; min-width: 650px; }
.roller-guide .ctable thead { display: table-header-group; position: static; width: auto; height: auto; overflow: visible; clip: auto; }
.roller-guide .ctable tbody { display: table-row-group; }
.roller-guide .ctable tr { display: table-row; }
.roller-guide .ctable th, .roller-guide .ctable td { display: table-cell; }
.roller-guide .ctable td::before { display: none; }
.prose .roller-compare-hint { margin-bottom: -.75rem; color: var(--ink-3); font-size: .8125rem; }
.roller-guide .roller-quote-list li { margin: .6rem 0; }
@media (max-width: 599px) {
  .roller-shortlist { padding: .85rem; }
  .roller-shortlist__grid { grid-template-columns: 1fr; }
  .roller-pick__facts { grid-template-columns: 1fr; }
  .roller-guide .prose .roller-figure > .roller-photo { max-height: 340px; }
}
@media print {
  .roller-guide .ctable { min-width: 0; }
  .roller-guide .table-wrap { overflow: visible; }
}