/* Rankings hub only. Existing page layouts are not targeted. */
.pr-rankings{--pr-ranking-ink:#1f2933;--pr-ranking-muted:#5f6368;--pr-ranking-blue:#245b85;--pr-ranking-line:#e1e4e8;max-width:1120px;margin-inline:auto;padding:28px 0 48px;color:var(--pr-ranking-ink);font-size:16px;line-height:1.75}
.pr-rankings *{box-sizing:border-box}
.pr-rankings h1{margin:0 0 12px;padding:0;border:0;background:none;box-shadow:none;color:var(--pr-ranking-ink);font-size:30px;font-weight:700;line-height:1.45}
.pr-rankings h1:before,.pr-rankings h1:after,.pr-rankings h2:before,.pr-rankings h2:after,.pr-rankings h3:before,.pr-rankings h3:after{display:none}
.pr-rankings h2{margin:0;padding:0;border:0;background:none;box-shadow:none;color:var(--pr-ranking-ink);font-size:21px;font-weight:700;line-height:1.5}
.pr-rankings h3{margin:0;padding:0;border:0;background:none;box-shadow:none;color:var(--pr-ranking-ink);font-size:19px;font-weight:700;line-height:1.5}
.pr-rankings p{margin:8px 0 0}
.pr-rankings .pr-rankings-note{color:var(--pr-ranking-muted);font-size:14px;line-height:1.7}
.pr-rankings a{color:var(--pr-ranking-blue);text-decoration:none}
.pr-rankings a:hover{text-decoration:underline;text-underline-offset:3px}
.pr-rankings a:focus-visible,.pr-rankings summary:focus-visible{outline:3px solid var(--pr-ranking-blue);outline-offset:4px}
.pr-rankings .pr-rankings-jumps{display:flex;flex-wrap:wrap;gap:8px 12px;margin:24px 0 28px;padding:16px;border:1px solid var(--pr-ranking-line);border-radius:4px;background:#f7f9fa}
.pr-rankings .pr-rankings-jumps a{display:flex;align-items:center;min-height:40px;padding:6px 10px;font-size:14px;line-height:1.5}
.pr-rankings .pr-rankings-section{margin-top:28px;scroll-margin-top:24px}
.pr-rankings .pr-rankings-genre{border-top:1px solid var(--pr-ranking-line)}
.pr-rankings .pr-rankings-genre>summary{padding:16px 0;cursor:pointer;color:var(--pr-ranking-blue)}
.pr-rankings .pr-rankings-genre>summary h3{display:inline}
.pr-rankings .pr-rankings-genre[open]>summary{padding-bottom:8px}
.pr-rankings .pr-rankings-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px 20px;margin:18px 0 0;padding:0;list-style:none;counter-reset:pr-hub-ranking}
.pr-rankings .pr-product{display:block;position:relative;min-width:0;margin:0;padding:12px;border:1px solid var(--pr-ranking-line);border-radius:4px;background:#fff;counter-increment:pr-hub-ranking}
.pr-rankings .pr-product:before{display:block;margin:0 0 8px;content:counter(pr-hub-ranking);color:var(--pr-ranking-blue);font-size:18px;font-weight:700;line-height:1.4;font-variant-numeric:tabular-nums}
.pr-rankings .pr-product-link{display:block;height:100%;color:var(--pr-ranking-ink)}
.pr-rankings .pr-product-link:hover{text-decoration:none}
.pr-rankings .pr-product-cover{display:flex;align-items:center;justify-content:center;width:144px;height:144px;max-width:100%;margin:0 auto 12px;background:#fff}
.pr-rankings .pr-product-cover img{display:block;width:100%;height:100%;object-fit:contain}
.pr-rankings .pr-product-cover--missing{border:1px solid var(--pr-ranking-line);background:#f5f6f6;padding:12px;text-align:center;color:var(--pr-ranking-muted);font-size:13px;line-height:1.5}
.pr-rankings .pr-product-title{display:block;color:var(--pr-ranking-blue);font-size:14.5px;font-weight:600;line-height:1.5;line-break:strict;word-break:normal;overflow-wrap:anywhere}
.pr-rankings .pr-product-link:hover .pr-product-title{text-decoration:underline;text-underline-offset:3px}
.pr-rankings .pr-product-artist{display:block;margin-top:5px;color:#3c454d;font-size:14px;font-weight:500;line-height:1.5}
.pr-rankings .pr-product-spec{display:block;margin-top:4px;color:var(--pr-ranking-muted);font-size:13px;line-height:1.5;overflow-wrap:anywhere}
@media(max-width:1100px){.pr-rankings .pr-rankings-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 16px}}
@media(max-width:900px){.pr-rankings .pr-rankings-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){
 .pr-rankings{padding:24px 0 36px;font-size:15px}
 .pr-rankings h1{font-size:25px}
 .pr-rankings h2{font-size:19px}
 .pr-rankings h3{font-size:17px}
 .pr-rankings .pr-rankings-jumps{gap:4px 8px;margin:20px 0 24px;padding:10px}
 .pr-rankings .pr-rankings-jumps a{min-height:44px;padding:6px}
 .pr-rankings .pr-rankings-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}
 .pr-rankings .pr-product{padding:10px}
 .pr-rankings .pr-product-cover{width:100%;height:auto;aspect-ratio:1}
 .pr-rankings .pr-product-title{font-size:14px}
 .pr-rankings .pr-product-spec{font-size:12.5px}
}
