/* Adapted from the approved rankings-2026-10-12 prototype. */
#scarlet-bag-v30 .overlay:has(.rankings-view){overflow:hidden}
#scarlet-bag-v30 .overlay.fullscreen .rankings-sheet{display:flex;flex-direction:column;height:100%;min-height:0;max-height:100%;overflow:hidden;box-sizing:border-box}
#scarlet-bag-v30 .rankings-sheet .sheet-head{display:none}
#scarlet-bag-v30 .rankings-sheet #sheet-content{flex:1;height:100%;min-height:0;overflow:hidden}
#scarlet-bag-v30 .rankings-view{height:100%;min-height:0;display:flex;flex-direction:column;color:#dcc8a6}
#scarlet-bag-v30 .rankings-view button{border:0;background:none;color:inherit;padding:0;font:inherit;cursor:pointer}
#scarlet-bag-v30 .ranking-heading{display:flex;align-items:center;gap:10px;flex:none;padding:0 0 5px}
#scarlet-bag-v30 .ranking-heading h2{font:24px var(--sc-font-display);margin:0;flex:1}
#scarlet-bag-v30 .ranking-heading button{width:44px;height:44px;display:grid;place-items:center}
#scarlet-bag-v30 .ranking-back img{width:25px;height:25px}
#scarlet-bag-v30 .ranking-tabs{display:flex;margin-bottom:8px;flex:none}
#scarlet-bag-v30 .ranking-tabs button{flex:1;font:17px var(--sc-font-display);min-height:38px;border-bottom:1px solid #80673f55;color:#a79276}
#scarlet-bag-v30 .ranking-tabs [aria-pressed=true]{background:linear-gradient(0deg,#a67e3825,transparent);border-color:#c09a55;color:#edce98}
#scarlet-bag-v30 .ranking-categories{display:flex;gap:5px;flex:none;margin-bottom:9px}
#scarlet-bag-v30 .ranking-categories button{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 2px 7px;min-height:66px;border-bottom:1px solid #886c3938;color:#a99780}
#scarlet-bag-v30 .ranking-categories img{width:33px;height:33px;object-fit:contain;filter:brightness(.7)}
#scarlet-bag-v30 .ranking-categories span{font:11px/1.2 var(--sc-font-display);text-align:center}
#scarlet-bag-v30 .ranking-categories [aria-pressed=true]{color:#ecd4a1;border-color:#c2a060;background:linear-gradient(0deg,#a4793022,transparent)}
#scarlet-bag-v30 .ranking-categories [aria-pressed=true] img{filter:none}
#scarlet-bag-v30 .ranking-periods{display:flex;gap:12px;justify-content:center;flex:none}
#scarlet-bag-v30 .ranking-periods button{padding:5px 7px;min-height:32px;font:12px var(--sc-font-ui);color:#9c8972}
#scarlet-bag-v30 .ranking-periods [aria-pressed=true]{color:#e3c38a;box-shadow:inset 0 -1px #a58653}
#scarlet-bag-v30 .ranking-tools{display:flex;gap:14px;align-items:center;flex:none;border-bottom:1px solid #80673f55}
#scarlet-bag-v30 .ranking-tools button{min-height:38px;font:11px var(--sc-font-ui);color:#aa9373}
#scarlet-bag-v30 .ranking-tools .selected{color:#e3c38a}
#scarlet-bag-v30 .ranking-search-toggle{margin-left:auto;font-size:25px!important;width:32px}
#scarlet-bag-v30 .ranking-refresh{width:32px;margin-left:auto}#scarlet-bag-v30 .ranking-refresh img{width:19px;height:19px}
#scarlet-bag-v30 .ranking-search{padding:6px 2px;flex:none}
#scarlet-bag-v30 .ranking-search input{width:100%;height:36px;user-select:text;background:#120e13;border:1px solid #80673f;color:#dcc8a6;padding:5px 8px}
#scarlet-bag-v30 .ranking-clan-filters{display:flex;justify-content:space-between;align-items:center;margin-top:5px}
#scarlet-bag-v30 .ranking-clan-filters button{width:38px;height:38px;display:grid;place-items:center;border:1px solid transparent;border-radius:50%;font:11px var(--sc-font-ui)}
#scarlet-bag-v30 .ranking-clan-filters [aria-pressed=true]{border-color:#a88b53;background:#ac854318}
#scarlet-bag-v30 .ranking-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
#scarlet-bag-v30 .ranking-podium{display:grid;grid-template-columns:1fr 1.18fr 1fr;align-items:start;gap:4px;padding:14px 0 17px;min-height:222px;background:radial-gradient(ellipse at 50% 34%,#966b331b,transparent 65%);border-bottom:1px solid #886c3938}
#scarlet-bag-v30 .ranking-leader{display:flex;align-items:center;flex-direction:column;min-width:0;padding-top:27px!important}
#scarlet-bag-v30 .ranking-leader.place-1{padding-top:0!important}
#scarlet-bag-v30 .ranking-leader-name{font:13px/1.25 var(--sc-font-display);text-align:center;overflow-wrap:anywhere;min-height:32px}
#scarlet-bag-v30 .ranking-leader strong{font:14px var(--sc-font-display);margin-top:5px;color:#e4c891}
#scarlet-bag-v30 .ranking-seal{position:relative;isolation:isolate;width:100px;max-width:100%;aspect-ratio:1;display:block;margin-bottom:7px}
#scarlet-bag-v30 .ranking-seal.place-1{width:120px}
#scarlet-bag-v30 .ranking-seal-opening{position:absolute;left:19.2%;top:13.8%;width:61.7%;height:61.1%;border-radius:50%;overflow:hidden;background:#15171a}
#scarlet-bag-v30 .ranking-face{width:100%;height:100%;object-fit:cover;object-position:center 40%}
#scarlet-bag-v30 .ranking-seal-art{position:absolute;inset:0;width:100%;height:100%;z-index:1;object-fit:contain}
#scarlet-bag-v30 .ranking-seal-number{position:absolute;left:50%;top:78.6%;transform:translate(-50%,-50%);z-index:2;font:12px var(--sc-font-display);color:#efd9ae;text-shadow:0 1px 2px #120b03}
#scarlet-bag-v30 .ranking-crest{position:relative;display:block;width:31px;height:36px;flex:none}
#scarlet-bag-v30 .ranking-cloth{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;filter:brightness(.75)}
#scarlet-bag-v30 .ranking-emblem{position:absolute;left:20%;top:12%;width:60%;height:57%;object-fit:contain}
#scarlet-bag-v30 .ranking-seal-opening .ranking-crest{width:100%;height:100%}
#scarlet-bag-v30 .ranking-seal-opening .ranking-cloth{transform:scale(2.5);filter:brightness(.55)}
#scarlet-bag-v30 .ranking-seal-opening .ranking-emblem{inset:9%;width:82%;height:82%}
#scarlet-bag-v30 .ranking-columns{display:flex;justify-content:space-between;padding:9px 7px;font:10px var(--sc-font-ui);color:#aa9373}
#scarlet-bag-v30 .ranking-row{display:flex;align-items:center;width:100%;gap:8px;min-height:62px;padding:8px 6px!important;border-bottom:1px solid #8c714b33!important;text-align:left}
#scarlet-bag-v30 .ranking-row.is-self{background:linear-gradient(90deg,transparent,#a8803b22,transparent)}
#scarlet-bag-v30 .ranking-position{font:15px var(--sc-font-display);color:#ac9068;min-width:18px}
#scarlet-bag-v30 .ranking-portrait{position:relative;display:block;flex:none;width:35px;height:35px}
#scarlet-bag-v30 .ranking-portrait .ranking-face{position:absolute;inset:7%;width:86%;height:86%;border-radius:50%}
#scarlet-bag-v30 .ranking-portrait-frame{position:absolute;inset:0;width:100%;height:100%}
#scarlet-bag-v30 .ranking-copy{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
#scarlet-bag-v30 .ranking-player-title{display:block;max-width:100%;font:11px/1.3 var(--sc-font-display);color:#b79a68;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#scarlet-bag-v30 .ranking-leader .ranking-player-title{width:100%;margin-bottom:3px;font-size:10px}
#scarlet-bag-v30 .ranking-name{font:15px var(--sc-font-display);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#scarlet-bag-v30 .ranking-copy small{font:10px var(--sc-font-ui);color:#aa9373}
#scarlet-bag-v30 .ranking-score{font:15px var(--sc-font-display);color:#d6bd8f;white-space:nowrap}
#scarlet-bag-v30 .ranking-chevron{color:#a28a62}
#scarlet-bag-v30 .ranking-own{flex:none;border-top:1px solid #8c714b55;padding:7px 2px 0;position:relative}
#scarlet-bag-v30 .ranking-own>small{font:10px var(--sc-font-ui);color:#aa9373}
#scarlet-bag-v30 .ranking-own .ranking-row{min-height:55px;border:0!important;padding-bottom:4px!important}
#scarlet-bag-v30 .ranking-find{position:absolute;right:4px;top:3px;min-height:24px;font:11px var(--sc-font-ui)!important;color:#d6bd8f!important}
#scarlet-bag-v30 .ranking-empty{text-align:center;font:13px var(--sc-font-ui);padding:22px 5px;color:#aa9373}
#scarlet-bag-v30 .ranking-more{display:block;margin:12px auto;padding:10px 18px!important;border:1px solid #80673f!important;min-height:40px}
#scarlet-bag-v30 .ranking-detail{padding:10px;text-align:center}
#scarlet-bag-v30 .ranking-detail p{font:13px/1.5 var(--sc-font-ui);color:#c6b392}
#scarlet-bag-v30 .ranking-detail>.ranking-portrait{width:110px;height:110px;margin:15px auto 8px}
#scarlet-bag-v30 .ranking-detail>.ranking-crest{margin:auto;width:42px;height:50px}
#scarlet-bag-v30 .ranking-stats{display:grid;grid-template-columns:1fr auto;gap:10px;text-align:left;font:13px var(--sc-font-ui)}
#scarlet-bag-v30 .ranking-stats dd{margin:0}
#scarlet-bag-v30 .ranking-equipment{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}
#scarlet-bag-v30 .ranking-equipment button{width:55px;height:55px;background:url('./assets/slot.webp') center/100% 100%}
#scarlet-bag-v30 .ranking-equipment img{width:100%;height:100%;object-fit:contain}
#scarlet-bag-v30 .ranking-item-art{width:120px;height:120px;object-fit:contain}
#scarlet-bag-v30 .profile-toolbar{display:flex;gap:8px}
#scarlet-bag-v30 .profile-toolbar .achievements-button{flex:1;min-width:0;font-size:14px;gap:5px}
@media(max-width:360px){#scarlet-bag-v30 .ranking-seal{width:87px}#scarlet-bag-v30 .ranking-seal.place-1{width:104px}#scarlet-bag-v30 .ranking-podium{min-height:205px}#scarlet-bag-v30 .ranking-name{font-size:13px}#scarlet-bag-v30 .ranking-categories span{font-size:10px}}
@media(max-height:650px){#scarlet-bag-v30 .ranking-categories{margin-bottom:5px}#scarlet-bag-v30 .ranking-categories button{min-height:54px;padding:1px 2px 5px}#scarlet-bag-v30 .ranking-categories img{width:25px;height:25px}#scarlet-bag-v30 .ranking-heading h2{font-size:21px}}

#scarlet-bag-v30 .ranking-prizes table{width:100%;border-collapse:collapse;font:13px var(--sc-font-ui);font-variant-numeric:tabular-nums lining-nums}
#scarlet-bag-v30 .ranking-prizes th,#scarlet-bag-v30 .ranking-prizes td{padding:8px;text-align:left;border-bottom:1px solid #66503666}
#scarlet-bag-v30 .ranking-prize-amount{display:inline-flex;gap:5px;align-items:center}
#scarlet-bag-v30 .ranking-prize-amount .art-icon{width:20px;height:20px;object-fit:contain}

#scarlet-bag-v30 .rankings-view .ranking-prizes-link{flex:none;align-self:center;min-height:32px;padding:3px 12px;margin:0 0 6px;color:#dec18a;font:13px var(--sc-font-ui);border-bottom:1px solid #98764870}
#scarlet-bag-v30 .rankings-view .ranking-prizes-link:hover{color:#ffe0a3;border-color:#dec18a}
#scarlet-bag-v30 .ranking-prizes th,#scarlet-bag-v30 .ranking-prizes td{padding:7px 5px}
#scarlet-bag-v30 .ranking-prizes td:first-child{white-space:nowrap}