/* Social puzzle rankings: clear hierarchy; glass surrounds readable content. */
body.v2 #a11y-dialog[data-kind="leaderboard"]{width:min(640px,calc(100vw - 24px))}
body.v2 #a11y-dialog[data-kind="leaderboard"] .v2-dialog-content{padding:0 20px 18px}
.v22-rank-top{position:sticky;top:0;z-index:1;background:rgba(253,251,255,.98);padding:16px 0 10px}
.v22-rank-slogan{font-size:20px;line-height:1.3;letter-spacing:-.02em;font-weight:850;color:#2e2546;margin:0 0 14px}
.v22-rank-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:4px;gap:4px;border:1px solid #e4dbef;border-radius:18px;background:#eee7f5a1}
body.v2 .v22-rank-tabs button{min-width:0;border:0;background:transparent;border-radius:13px;color:#58466d;min-height:44px;font-size:14px;font-weight:800;padding:10px 5px}
body.v2 .v22-rank-tabs [aria-selected="true"]{background:linear-gradient(135deg,#8b55ef,#7041df);color:white;box-shadow:0 3px 8px #7848cf22}
.v22-rank-basis{font-size:13px;line-height:1.5;color:#70617f;margin:12px 0 5px}
.v22-rank-meta-row{display:flex;gap:12px;align-items:center;justify-content:space-between}
.v22-rank-meta{font-size:11px;color:#7a6c87;margin:0;line-height:1.4}
body.v2 .v22-rank-refresh{font-size:12px;font-weight:750;min-height:44px;padding:8px;border:0;background:none;color:#7249b1;border-radius:10px}
.v22-rank-group{margin:6px 0 22px}.v22-rank-group-title{display:flex;align-items:center;justify-content:space-between;color:#7848bc;font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.065em;margin:0 0 10px}.v22-rank-count{text-transform:none;letter-spacing:0;font-size:11px;font-weight:650;color:#81738d}
.v22-rank-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.v22-rank-card{display:flex;align-items:center;gap:12px;padding:13px 14px;background:#f1ecf8c7;border:1px solid #e6def17a;border-radius:17px;min-height:83px}
.v22-rank-number{flex:0 0 24px;text-align:center;color:#756981;font-weight:850;font-size:21px;font-variant-numeric:tabular-nums}
.v22-rank-copy{display:flex;flex-direction:column;min-width:0;gap:3px;flex:1}
.v22-rank-name{font-size:16px;font-weight:850;color:#302641;line-height:1.25;overflow-wrap:anywhere}
.v22-rank-metric{font-size:15px;color:#7848d1;font-weight:850;font-variant-numeric:tabular-nums;line-height:1.3}
.v22-rank-id{font-size:10px;color:#81748b;font-weight:650}
.v22-rank-result{font-size:12px;font-weight:800;color:#665277;text-align:right;max-width:76px;flex:none}
.v22-rank-you{background:#eee3fe;border-color:#c5a4ef}.v22-you-badge{display:inline-block;border-radius:6px;background:#7648c7;color:white;font-size:10px;margin-left:6px;padding:2px 5px;vertical-align:middle}
.v22-own-rank{margin-top:10px;border-top:1px solid #dcd1e9;padding-top:10px}
.v22-rank-empty,.v22-rank-loading{padding:22px 16px;border-radius:17px;background:#f2edf69c;color:#776784;font-size:14px;line-height:1.5;text-align:center;margin:0}
.v22-rank-error{font-size:13px;line-height:1.5;color:#884a45;background:#fff0e9;padding:14px;border-radius:13px}
body.v2 .v22-rank-more{width:100%;border:1px solid #ddd0ec;background:#ffffffc9;color:#694a85;border-radius:13px;padding:10px 16px;font-size:13px;font-weight:750;min-height:44px;margin-top:10px}
.v22-rank-options{border-top:1px solid #e1d8eb;margin-top:4px;padding-top:6px}.v22-rank-options summary{padding:12px 0;min-height:44px;color:#6c577f;font-size:13px;font-weight:700;cursor:pointer}.v22-rank-options #dialog-body{font-size:13px!important}
@media(max-width:520px){body.v2 #a11y-dialog[data-kind="leaderboard"] .v2-dialog-content{padding:0 14px 14px}.v22-rank-top{padding-top:12px}.v22-rank-slogan{font-size:19px}.v22-rank-card{padding:12px 10px;gap:9px}.v22-rank-number{flex-basis:22px;font-size:20px}.v22-rank-name{font-size:15px}.v22-rank-result{font-size:11px;max-width:58px}.v22-rank-basis{font-size:12px}.v22-rank-meta{font-size:10px}}
body.v2.larger-text .v22-rank-name{font-size:19px}body.v2.larger-text .v22-rank-metric,body.v2.larger-text .v22-rank-tabs button{font-size:18px}body.v2.larger-text .v22-rank-basis,body.v2.larger-text .v22-rank-empty{font-size:16px}body.v2.larger-text .v22-rank-result{max-width:80px;font-size:14px}
@media(max-height:500px){.v22-rank-top{position:static}.v22-rank-slogan{margin-bottom:8px}}


/* v3.2 default-view leaderboard: compact hierarchy; scoring detail stays in the expandable rules. */
body.v3 #a11y-dialog[data-kind="leaderboard"]{width:min(600px,calc(100vw - 24px))}
body.v3 #a11y-dialog[data-kind="leaderboard"] .v2-dialog-content{padding:0 18px 16px}
body.v3 .v22-rank-top{padding:10px 0 8px}
body.v3 .v22-rank-slogan{font-size:17px;line-height:1.3;margin:0 0 9px;font-weight:800}
body.v3 .v22-rank-tabs{border-radius:15px;padding:3px;gap:3px}
body.v3 .v22-rank-tabs button{border-radius:12px!important}
body.v3 .v22-rank-basis[hidden]{display:none!important}
body.v3 .v22-rank-meta-row{margin-top:5px}
body.v3 .v22-rank-meta{font-size:11px}
body.v3 .v22-rank-group{margin:8px 0 14px}
body.v3 .v22-rank-group-title{margin-bottom:7px;font-size:11px}
body.v3 .v22-rank-empty,body.v3 .v22-rank-loading{padding:12px 14px;border:1px solid #e8e0ee;border-radius:14px;background:#f7f3f9;font-size:13px;line-height:1.4}
body.v3 .v22-rank-options{margin-top:2px}
body.v3 .v22-rank-options summary{padding:9px 0;font-size:12px}
@media(max-width:520px){body.v3 #a11y-dialog[data-kind="leaderboard"] .v2-dialog-content{padding:0 14px 12px}body.v3 .v22-rank-slogan{font-size:16px}body.v3 .v22-rank-group{margin-bottom:11px}}

/* v3.3 leaderboard hierarchy follows the product type scale. */
body.v3 .v22-rank-slogan{font-size:20px}
body.v3 .v22-rank-tabs button{font-size:16px}
body.v3 .v22-rank-meta{font-size:13px;line-height:1.45}
body.v3 .v22-rank-group-title{margin-bottom:8px;font-size:14px}
body.v3 .v22-rank-count{font-size:13px}
body.v3 .v22-rank-id{font-size:12px}
body.v3 .v22-rank-result{font-size:14px;max-width:86px}
body.v3 .v22-rank-empty,body.v3 .v22-rank-loading{font-size:15px;line-height:1.45}
body.v3 .v22-rank-more{font-size:15px}
body.v3 .v22-rank-options summary{font-size:14px;line-height:1.4}
body.v3 .v22-rank-options #dialog-body{font-size:14px!important}
@media(max-width:520px){body.v3 .v22-rank-slogan{font-size:18px}body.v3 .v22-rank-tabs button{font-size:16px}body.v3 .v22-rank-meta{font-size:13px}}