.world-rank{margin:40px 0;border:1px solid #3e5275;background:linear-gradient(140deg,#172743,#101a32);border-radius:26px;padding:clamp(20px,4vw,40px);box-shadow:0 7px #050b1d}.world-rank-top{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}.world-rank h2{font-size:clamp(26px,4vw,38px);letter-spacing:-1px;margin:8px 0}.world-rank p{font-size:14px;line-height:1.6;color:#b8c9e6}.world-rank .rank-kind{display:inline-block;border:1px solid #6b83ab;border-radius:20px;font-size:10px;font-weight:bold;padding:6px 10px;color:#c4fa72;letter-spacing:1px}.rank-mode-label{display:flex;flex-direction:column;gap:6px;color:#bdcbea;font-size:12px}.rank-mode-label select{background:#24395b;color:#fff;border:1px solid #7493bd;border-radius:12px;padding:12px;font:inherit;min-height:44px}.home-ranks{padding:0;list-style:none;margin:24px 0;min-height:70px}.home-ranks li{display:grid;grid-template-columns:32px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:16px 4px;border-top:1px solid #344867}.rank-place{color:#ac91fb;font-size:12px;font-weight:800}.rank-name{color:#fff;font-size:15px;overflow-wrap:anywhere}.home-ranks small{font-size:9px;color:#aab7d1;border:1px solid #4b607e;padding:4px 6px;border-radius:6px}.home-ranks strong{font-variant-numeric:tabular-nums;color:#c4fa72}.world-rank-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}.world-rank-bottom .cta{margin:0;font-size:14px}.world-rank-bottom p{max-width:430px;margin:0;font-size:12px}@media(prefers-reduced-motion:no-preference){.rank-moved{animation:rank-pop .7s ease}@keyframes rank-pop{from{background:#65874966;transform:translateY(-6px)}to{background:transparent;transform:none}}}@media(max-width:400px){.home-ranks li{gap:8px;grid-template-columns:22px minmax(0,1fr) auto}.home-ranks small{grid-column:2;grid-row:auto;justify-self:start}.home-ranks strong{grid-column:3;grid-row:span 2}.rank-name{font-size:13px}}

/* Approved three-color tile combo while ranking data is in flight. */
#home-rank-status.rank-loading{overflow:visible;min-height:28px}
.rank-loading-tiles{display:inline-flex;align-items:center;gap:5px;direction:ltr;vertical-align:middle;padding:4px 8px}
 .rank-loading .combo-tile{position:relative;display:block;width:24px;height:24px;border-radius:6px;background:var(--tile);box-shadow:inset 0 3px #ffffff70,inset 0 -4px #0002;animation:rank-tile-combo 2.88s infinite both}
 .rank-loading .combo-tile::before{content:'';position:absolute;inset:10px;border-radius:50%;background:#ffffff80}
 .rank-loading .combo-tile:nth-of-type(1){--tile:#c4fa72;animation-delay:0s}
 .rank-loading .combo-tile:nth-of-type(2){--tile:#56c8f2;animation-delay:.12s}
 .rank-loading .combo-tile:nth-of-type(3){--tile:#ff8275;animation-delay:.24s}
 .rank-loading .combo-spark{position:absolute;left:10px;top:10px;width:4px;height:4px;border-radius:2px;background:var(--tile);animation:rank-combo-spark 2.88s infinite both;animation-delay:inherit}
 .rank-loading .combo-spark:nth-child(1){--x:-21px;--y:-21px}.rank-loading .combo-spark:nth-child(2){--x:21px;--y:-21px}.rank-loading .combo-spark:nth-child(3){--x:-19px;--y:20px}.rank-loading .combo-spark:nth-child(4){--x:19px;--y:20px}
 @keyframes rank-tile-combo{0%,3%{opacity:0;transform:translateY(-20px) scale(.8)}16%,56%{opacity:1;transform:translateY(0) scale(1);background:var(--tile);box-shadow:inset 0 3px #ffffff70,inset 0 -4px #0002}63%{opacity:1;transform:scale(1.12)}72%,100%{opacity:0;transform:scale(.8)}}
 @keyframes rank-combo-spark{0%,58%{opacity:0;transform:translate(0,0) scale(.4)}64%{opacity:1}80%,100%{opacity:0;transform:translate(var(--x),var(--y)) scale(.2)}}
 @media(prefers-reduced-motion:reduce){.rank-loading .combo-tile{animation:none}.rank-loading .combo-spark{display:none}}
