.energy-bar{padding:10px 38px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #ffffff09;background:#15141e;flex-wrap:wrap;min-height:51px}.energy-chip{display:flex;align-items:center;gap:9px;border:1px solid #8cae9c29;border-radius:6px;background:#89d4b50a;padding:6px 11px;font-size:11px;color:#a2dcc7}.energy-chip.pvp{color:#d0b4ef;background:#b99ce608;border-color:#b99ce629}.energy-chip .icon{width:16px;height:16px}.energy-chip b{color:#e5e1ed;font-size:12px}.energy-chip small{opacity:.7;font-size:10px}.energy-chip>i{font-style:normal;font-size:16px}.energy-note{margin-left:auto;font-size:10px;color:#8d849e}.energy-note.busy{color:#c8abf0}.story-energy-note{display:flex;gap:8px;align-items:center;font-size:12px;color:#a0cdbc;margin-bottom:19px}.story-energy-note .icon{width:17px}.stage-gems{font-size:11px;color:#c9b0ed;display:flex;gap:5px;align-items:center;margin-top:13px}.stage-gems .icon{width:15px}.rank-hero{display:flex;align-items:center;gap:26px;border:1px solid #c8a78230;border-radius:12px;padding:29px 32px;background:radial-gradient(ellipse at 10% 0,#89634335,transparent 70%),linear-gradient(115deg,#211b27,#171620);overflow:hidden}.rank-emblem{width:88px;height:102px;display:grid;place-items:center;flex-shrink:0;color:var(--rank-color);border:1px solid #c8a78242;clip-path:polygon(50% 0,100% 20%,100% 75%,50% 100%,0 75%,0 20%);background:#c29a7220}.rank-emblem .icon{width:47px;height:47px;stroke-width:1}.rank-copy{flex:1;max-width:420px}.rank-copy h2{font:36px Georgia,serif;color:var(--rank-color);display:flex;align-items:center;gap:28px;margin:8px 0 15px}.rank-copy h2 span{font:25px 'Leelawadee UI',sans-serif;color:#eee7f2}.rank-copy h2 small{font-size:12px;color:#938899}.rank-copy p{font-size:11px}.rank-track{height:4px;background:#ffffff10;border-radius:4px;margin-bottom:10px}.rank-track i{display:block;background:var(--rank-color);height:100%;border-radius:4px}.rank-record{margin-left:auto;display:flex;gap:35px;text-align:center}.rank-record b{display:block;font-size:26px;font-weight:500;color:#e1d5eb}.rank-record b span{color:#7c7286;font-size:20px}.rank-record small{font-size:10px;color:#93889f}.rank-milestones{display:grid;grid-template-columns:repeat(5,1fr);padding:22px 0 28px;gap:12px}.rank-milestones>div{display:flex;align-items:center;justify-content:center;gap:9px;font-size:11px;color:#7e7588;border-bottom:2px solid #ffffff09;padding:8px 0 12px;flex-wrap:wrap}.rank-milestones .reached{color:var(--rank-color);border-color:var(--rank-color)}.rank-milestones span{font-size:9px;color:#938899}.rank-milestones .icon{width:17px;height:17px}.pvp-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,1fr);gap:26px}.pvp-layout .section-title{margin-bottom:17px}.opponent-list{display:grid;gap:13px}.opponent-card{border:1px solid #ffffff0f;border-radius:9px;background:#1b1923;padding:19px 22px}.opponent-card:hover{border-color:#bc97ed44}.opponent-head{display:flex;align-items:center;gap:12px}.opponent-avatar{width:40px;height:40px;border-radius:8px;display:grid;place-items:center;background:#8ed0ba13;color:#99d2bb}.opponent-avatar.bot{background:#9a8fbb13;color:#a49ab8}.opponent-head h3{font-size:14px}.opponent-head p{font-size:10px;margin-top:4px}.opponent-kind{font-size:8px;font-weight:400;display:inline-block;margin-left:7px;padding:2px 6px;border:1px solid #9bdec332;color:#9bdec3;border-radius:3px}.opponent-kind.bot{color:#a79ab9;border-color:#a79ab932}.opponent-power{margin-left:auto;font-size:13px;font-weight:500;color:#ae9bbc;white-space:nowrap}.opponent-power .icon{width:14px;height:14px}.opponent-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:17px}.opponent-team{display:flex;gap:7px}.opponent-team>div{width:42px;height:54px;position:relative;border-radius:4px;overflow:hidden;border:1px solid #ffffff17}.opponent-team .portrait{width:100%;height:100%}.opponent-team small{position:absolute;bottom:0;left:0;right:0;text-align:center;background:#141019bd;font-size:8px;color:#ded5e8}.arena-rules{font-size:11px;margin:16px 0}.leaderboard{align-self:start;padding:23px}.leaderboard h2{font-size:16px}.leaderboard h2 .icon{color:#d8ba87;width:19px;margin-right:6px}.leaderboard>p{font-size:10px;margin-top:-8px;margin-bottom:20px}.leaderboard table{width:100%;border-collapse:collapse;text-align:left;font-size:12px}.leaderboard th{font-size:10px;font-weight:400;color:#81778d;padding:8px 10px;border-bottom:1px solid #ffffff10}.leaderboard td{padding:14px 10px;border-bottom:1px solid #ffffff07}.leaderboard td:first-child{color:#a08aae;width:36px}.leaderboard td:last-child,.leaderboard th:last-child{text-align:right}.leaderboard td strong{font-weight:500;display:block;overflow-wrap:anywhere}.leaderboard td span{font-size:9px;display:block;margin-top:4px}.leaderboard td small{color:#aa8dcc;font-size:8px}.leaderboard tr.you{background:#b98bea0a}.leaderboard tbody tr:first-child td:first-child{color:#dfc285}.leaderboard-scroll{max-height:450px;overflow:auto}.leaderboard-foot{font-size:9px;color:#8c8198;text-align:center;padding:18px 0 0}.arena-empty{padding:45px 20px;text-align:center;font-size:12px;color:#9a90a7;line-height:1.9}.arena-history{margin-top:23px;padding:22px}.arena-history>div:not(.section-title){display:flex;gap:25px;align-items:center;border-top:1px solid #ffffff07;padding:12px 0;font-size:12px}.arena-history b{font-weight:500;color:#d997a4;width:30px}.arena-history b.victory{color:#99d2bb}.arena-history b.draw{color:#cabb99}.arena-history small{font-size:9px;color:#8f829f;margin-left:7px}.arena-history strong{margin-left:auto;font-weight:500;color:#b59acc}.pvp-result-score{font-size:45px;color:#c7a6f3;margin:22px 0 12px}.sidebar{overflow-y:auto}.nav-item:last-child{margin-top:0}
@media(max-width:1100px){.pvp-layout{grid-template-columns:1fr}.rank-record{gap:18px}.energy-bar{padding:10px 24px}.rank-hero{padding:24px;gap:18px}.rank-copy h2{font-size:30px;gap:15px}}
@media(max-width:700px){.energy-bar{padding:8px 16px;gap:8px}.energy-note{display:none}.energy-chip small{display:none}.rank-hero{flex-wrap:wrap}.rank-record{width:100%;justify-content:space-around;margin:0}.rank-copy{min-width:140px}.rank-emblem{width:60px;height:75px}.rank-emblem .icon{width:32px}.rank-copy h2{font-size:24px}.rank-milestones>div{font-size:9px;gap:5px}.rank-milestones span{width:100%;text-align:center}.opponent-card{padding:15px}.opponent-head h3{font-size:12px}.opponent-bottom{gap:8px}.opponent-team>div{width:33px;height:46px}.opponent-bottom .btn{padding:9px;font-size:11px}.opponent-kind{font-size:7px}.opponent-power{font-size:10px}}
