.rank-detail-page{width:calc(100% - 80px);max-width:1280px;margin:auto;padding:20px 0 30px}.rank-breadcrumb{color:var(--muted);gap:12px;font-size:12px;display:flex}.rank-breadcrumb a{text-decoration:none}.rank-breadcrumb a:hover{color:var(--accent-light)}.rank-breadcrumb [aria-current]{color:#d4cbdc}.rank-heading{align-items:center;gap:18px;padding:13px 0 18px;display:flex}.rank-heading .hero-medal{width:86px;height:86px}.rank-heading-copy{flex:1}.rank-heading h1{text-transform:uppercase;margin:0 0 7px;font-family:Barlow Condensed,Arial,sans-serif;font-size:40px;font-style:italic;line-height:1.05}.rank-heading p{color:var(--muted);margin:0;font-size:14px;line-height:1.5}.rank-heading-stat{text-align:right;flex-direction:column;gap:3px;display:flex}.rank-heading-stat strong{color:var(--accent-light);font-size:34px;font-weight:600;line-height:1}.rank-heading-stat strong span{font-size:21px}.rank-heading-stat>span{color:var(--muted);font-size:12px}.section-heading{justify-content:space-between;align-items:center;gap:16px;margin:0 0 10px;display:flex}.section-heading h2{margin:0;font-size:17px;font-weight:600;line-height:1.2}.section-heading>span{color:var(--muted);font-size:11px}.detail-tier-grid{background:var(--row);grid-template-columns:repeat(5,minmax(0,1fr));display:grid}.detail-tier{align-items:center;gap:9px;min-width:0;padding:4px 12px;scroll-margin-top:18px;text-decoration:none;display:flex}.detail-tier:nth-child(2n){background:#ffffff03}.detail-tier:hover,.detail-tier:target{box-shadow:inset 0 -2px var(--accent);background:#ad43e81c}.detail-tier .medal{width:57px;height:57px}.detail-tier>span:last-child{flex-direction:column;gap:5px;display:flex}.detail-tier strong{white-space:nowrap;font-size:14px}.detail-tier>span>span{color:var(--muted);white-space:nowrap;font-size:12px}.distribution-section{margin-top:25px}.chart-heading{margin-bottom:18px}.chart-heading p{color:var(--muted);margin:5px 0 0;font-size:12px}.chart-controls{align-items:center;gap:7px;display:flex}.chart-switch{background:#242332;border-radius:5px;padding:3px;display:flex}.chart-view{color:var(--muted);background:0 0;border:0;border-radius:3px;padding:7px 12px;font-size:12px;font-weight:600}.chart-view[aria-pressed=true]{color:#fbf6ff;background:#624178}.chart-view:hover{color:#fff}.chart-replay{width:31px;height:31px;color:var(--muted);background:0 0;border:0;padding:0;font-size:23px}.chart-replay:hover{color:var(--accent-light)}.distribution-layout{grid-template-columns:minmax(0,1fr) 225px;gap:30px;display:grid}.distribution-figure{margin:0}.distribution-plot{padding-left:32px;position:relative}.chart-axis{color:#8f8ca4;flex-direction:column;justify-content:space-between;height:164px;font-size:10px;display:flex;position:absolute;top:0;left:0}.chart-columns{grid-template-columns:repeat(var(--columns),minmax(0,1fr));gap:12px;display:grid}.chart-column{min-width:0}.bar-track{background:linear-gradient(#ffffff0c 1px,#0000 1px) 0 0/100% 50%;border-bottom:1px solid #ffffff16;justify-content:center;align-items:flex-end;height:164px;display:flex}.bar-fill{height:var(--bar-height);transform-origin:bottom;width:65%;max-width:66px;animation:rank-bar-grow .85s cubic-bezier(.18,.7,.2,1) var(--delay) both;background:linear-gradient(#635e7c,#494558);border-radius:3px 3px 0 0;position:relative}.highlighted .bar-fill{background:linear-gradient(#c175f0,#9142bc);box-shadow:0 0 28px #ae43e818}.bar-value{white-space:nowrap;color:#c0bacc;font-variant-numeric:tabular-nums;animation:rank-label-show .25s ease calc(var(--delay) + .6s) both;font-size:11px;position:absolute;bottom:calc(100% + 5px);left:50%;transform:translate(-50%)}.highlighted .bar-value{color:#dfb3fb;font-weight:600}.bar-label{color:var(--muted);flex-direction:column;align-items:center;gap:0;padding-top:4px;font-size:11px;display:flex}.bar-label .medal{width:39px;height:39px}.highlighted .bar-label{color:var(--accent-light);font-weight:600}.distribution-context{border-left:1px solid #ffffff10;padding:0 0 0 24px}.distribution-context .context-label{color:#cfc5da;margin:0 0 9px;font-size:12px}.distribution-context>strong{letter-spacing:-.7px;font-size:35px;font-weight:500;line-height:1}.distribution-context>strong>span{color:var(--muted);font-size:21px}.distribution-context p{color:var(--muted);margin:7px 0;font-size:12px;line-height:1.55}.distribution-context b{color:#dbd4e4;font-weight:600}.context-rule{background:#8d699c77;width:28px;height:1px;margin:17px 0 12px}.chart-table{color:var(--muted);margin:12px 0 0 32px;font-size:11px}.chart-table summary{width:fit-content}.chart-table table{border-collapse:collapse;width:100%;margin:10px 0;font-size:12px}.chart-table caption{text-align:left;padding:8px 0}.chart-table th,.chart-table td{text-align:right;border-bottom:1px solid #ffffff0b;padding:7px 10px}.chart-table th:first-child{text-align:left;font-weight:500}.chart-caption{color:#918b9f;margin:13px 0 0;font-size:11px;line-height:1.5}.chart-caption a{color:#bbb0c7;text-underline-offset:3px}.rank-tips{border-top:1px solid #ffffff0c;margin-top:24px;padding-top:19px}.tips-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;display:grid}.tips-grid article{gap:12px;display:flex}.tip-number{color:#b57bd4;font-size:12px;line-height:1.6}.tips-grid h3{margin:0 0 5px;font-size:14px;font-weight:600;line-height:1.4}.tips-grid p{color:var(--muted);margin:0;font-size:12px;line-height:1.55}.rank-faq{border-top:1px solid #ffffff0c;margin-top:22px}.rank-faq details{border-bottom:1px solid #ffffff0c;padding:12px 0}.rank-faq summary{color:#c7bfd0;justify-content:space-between;gap:15px;font-size:13px;list-style:none;display:flex}.rank-faq summary::-webkit-details-marker{display:none}.rank-faq summary:after{content:"+";color:var(--accent-light)}.rank-faq details[open] summary:after{content:"−"}.rank-faq p{max-width:850px;color:var(--muted);margin:9px 0 2px;font-size:12px;line-height:1.6}.rank-faq a{color:var(--accent-light);text-underline-offset:3px}@keyframes rank-bar-grow{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes rank-label-show{0%{opacity:0}to{opacity:1}}@media (width<=1100px){.rank-detail-page{width:calc(100% - 48px)}.detail-tier{gap:4px;padding:4px 8px}.detail-tier .medal{width:46px;height:46px}.detail-tier>span>span{font-size:11px}.distribution-layout{grid-template-columns:minmax(0,1fr) 195px;gap:22px}.chart-columns{gap:8px}.distribution-context{padding-left:20px}}@media (width<=760px){.rank-detail-page{width:calc(100% - 32px);padding-top:16px}.rank-heading{gap:10px}.rank-heading h1{font-size:32px}.rank-heading .hero-medal{width:68px;height:68px}.rank-heading-stat{display:none}.rank-heading p{font-size:12px}.detail-tier{text-align:center;flex-direction:column;gap:0;padding:4px 2px 9px}.detail-tier strong{font-size:12px}.detail-tier>span>span{font-size:10px}.distribution-layout{grid-template-columns:minmax(0,1fr);gap:18px}.distribution-context{border-top:1px solid #ffffff0c;border-left:0;grid-template-columns:auto 1fr;align-items:center;gap:0 14px;padding:12px 0 0;display:grid}.distribution-context .context-label{grid-column:1/-1;margin-bottom:6px}.distribution-context>strong{grid-row:2/4;font-size:29px}.distribution-context p{margin:0}.distribution-context p:last-child,.context-rule{display:none}.tips-grid{gap:18px}}@media (width<=500px){.rank-detail-page{width:calc(100% - 24px)}.rank-heading h1{font-size:30px}.rank-heading .hero-medal{width:61px;height:61px}.section-heading h2{font-size:16px}.detail-tier-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.detail-tier{padding:3px 4px 9px}.detail-tier .medal{width:47px;height:47px}.detail-tier>span:last-child{gap:3px}.detail-tier>span>span{font-size:11px}.chart-heading{flex-direction:column;align-items:flex-start;gap:11px;margin-bottom:21px}.chart-controls{justify-content:space-between;width:100%}.chart-view{padding:7px 14px}.chart-columns{gap:5px}.distribution-plot{padding-left:25px}.chart-axis,.bar-value{font-size:9px}.bar-fill{width:77%}.bar-label{font-size:9px}.bar-label .medal{width:32px;height:32px}.chart-table{margin-left:25px}.tips-grid{grid-template-columns:1fr;gap:15px}.rank-tips .section-heading>span{display:none}}@media (prefers-reduced-motion:reduce){.bar-fill,.bar-value{animation:none}.chart-replay{display:none}}
