.rankings-page{background:#050709 url('../images/hero.png') center top/cover fixed no-repeat}.rankings-page .account-main{min-height:900px;padding:52px 0 38px;background:linear-gradient(180deg,rgba(3,5,8,.08),rgba(3,5,8,.72))}.ranking-scene{position:relative;width:min(1500px,calc(100% - 50px));margin:auto;padding-bottom:20px;background:linear-gradient(135deg,rgba(3,5,7,.93),rgba(7,8,10,.82));border:1px solid rgba(221,170,91,.36);box-shadow:0 32px 90px rgba(0,0,0,.7)}.ranking-scene:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(214,157,76,.08),transparent 16%,transparent 84%,rgba(214,157,76,.07));mix-blend-mode:screen}.ranking-shell{position:relative;z-index:1}.ranking-breadcrumb{height:42px;padding:0 18px;display:flex;align-items:center;gap:10px;color:#c5c5c5;border-bottom:1px solid rgba(217,166,89,.28);background:rgba(3,5,7,.88);font-size:12px}.ranking-breadcrumb>span:first-child{color:#efbd71}.ranking-breadcrumb b{color:#7c7f84}.ranking-breadcrumb a:hover{color:#efbd71}
.ranking-hero{height:185px;position:relative;overflow:hidden;border-bottom:1px solid rgba(220,168,91,.46);background-image:linear-gradient(90deg,rgba(2,4,7,.98),rgba(2,4,7,.82) 34%,rgba(3,5,8,.08) 67%,rgba(3,5,7,.42)),url('../images/download-hero-v2.webp');background-size:cover;background-position:center 43%;isolation:isolate}.ranking-hero:after{content:"";position:absolute;inset:auto 0 0;height:45px;background:linear-gradient(transparent,rgba(5,7,9,.7));z-index:-1}.ranking-hero-copy{padding:28px 35px;text-shadow:0 3px 11px #000}.ranking-hero-copy small{color:#dfaa5f;font:700 9px Georgia,serif;letter-spacing:3px}.ranking-hero h1{margin:7px 0 0;color:#f1ce93;font:54px/1 Georgia,serif;letter-spacing:8px}.ranking-hero h2{margin:3px 0 10px;color:#f2ede5;font:22px Georgia,serif;letter-spacing:6px}.ranking-hero p{margin:0;color:#c2c3c4;font-size:12px;line-height:1.5}.ranking-hero blockquote{position:absolute;right:77px;top:65px;margin:0;text-align:center;color:#efe3d1;font:700 12px/1.65 Georgia,serif;letter-spacing:1.6px;text-shadow:0 2px 7px #000}.ranking-hero-glyph{position:absolute;right:20px;top:52px;color:#e52c31;font:900 56px Georgia,serif;text-shadow:0 0 19px rgba(229,44,49,.35)}
.ranking-content{padding:10px 12px 0;margin-left:0;margin-right:0}.ranking-tabs{height:48px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}.ranking-tabs .nav-link{position:relative;display:flex;align-items:center;justify-content:center;gap:16px;border:1px solid rgba(211,162,87,.27);border-radius:2px;background:linear-gradient(180deg,#11151a,#090c0f);color:#d9d6cf;font:700 11px Georgia,serif;letter-spacing:1px;overflow:hidden;transition:border-color .22s,filter .22s,transform .22s}.ranking-tabs .nav-link:before{content:"";position:absolute;inset:0;transform:translateX(-110%);background:linear-gradient(105deg,transparent,rgba(255,216,151,.13),transparent);transition:transform .48s}.ranking-tabs .nav-link:hover{border-color:#bd8744;filter:brightness(1.15);transform:translateY(-1px)}.ranking-tabs .nav-link:hover:before{transform:translateX(110%)}.ranking-tabs .nav-link span{color:#efbe70;font-size:22px}.ranking-tabs .nav-link.active{color:#21180d;border-color:#f3ca7e;background:linear-gradient(110deg,#f5d99f,#d8a657 58%,#f2d18e);box-shadow:inset 0 0 20px rgba(255,255,255,.4),0 0 18px rgba(227,167,69,.25)}.ranking-tabs .nav-link.active span{color:#17110b}
.ranking-board{border:1px solid rgba(221,169,89,.53);border-radius:0;background:linear-gradient(145deg,rgba(9,12,15,.97),rgba(3,6,8,.98));box-shadow:inset 0 0 38px rgba(208,153,71,.025)}.ranking-board-head,.ranking-entry{display:grid;grid-template-columns:68px minmax(210px,1.25fr) minmax(110px,.62fr) minmax(190px,1fr) minmax(125px,.65fr);align-items:center}.ranking-board-head{height:44px;padding:0 14px;color:#a8adb5;background:linear-gradient(90deg,rgba(16,20,24,.95),rgba(7,10,13,.95));border-bottom:1px solid rgba(255,255,255,.08);font:700 9px Arial,sans-serif;letter-spacing:1.1px}.ranking-board-head span:not(:nth-child(2)){text-align:center}.ranking-entry{position:relative;min-height:58px;padding:5px 14px;color:#e9e8e5;border-bottom:1px solid rgba(255,255,255,.065);background:rgba(255,255,255,.008);transition:background .2s,box-shadow .2s}.ranking-entry:nth-child(even){background:rgba(255,255,255,.019)}.ranking-entry:hover{z-index:2;background:linear-gradient(90deg,rgba(189,134,61,.11),rgba(255,255,255,.025));box-shadow:inset 3px 0 #dba85f}.ranking-entry.podium{min-height:64px}.ranking-entry.podium-1{background:linear-gradient(90deg,rgba(149,103,39,.38),rgba(69,45,18,.2),rgba(255,255,255,.015));box-shadow:inset 5px 0 #f4c66d}.ranking-entry.podium-2{background:linear-gradient(90deg,rgba(112,133,151,.28),rgba(43,56,66,.15),rgba(255,255,255,.015));box-shadow:inset 5px 0 #a9cadf}.ranking-entry.podium-3{background:linear-gradient(90deg,rgba(153,72,37,.31),rgba(72,34,23,.17),rgba(255,255,255,.015));box-shadow:inset 5px 0 #e88753}.ranking-position{display:flex;align-items:center;gap:10px;justify-content:center}.ranking-position b{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;color:#ddd;font:700 12px Georgia,serif}.podium .ranking-position b{color:#1d150c;background:linear-gradient(145deg,#f9e1a5,#c99442);border:1px solid #ffe09a;box-shadow:0 0 16px rgba(239,183,86,.35)}.podium-2 .ranking-position b{background:linear-gradient(145deg,#e4edf2,#869cab;border-color:#d5e5ed}.podium-3 .ranking-position b{background:linear-gradient(145deg,#ffc294,#b5582d);border-color:#f4a06e}.ranking-position i{color:#d4a35d;font:normal 17px Georgia,serif}.ranking-character,.ranking-faction{display:flex;align-items:center;gap:12px;min-width:0}.ranking-avatar{width:43px;height:43px;flex:none;border:1px solid rgba(222,174,103,.55);background-size:205px auto;background-position:50% 13%;box-shadow:0 3px 10px #000}.ranking-character>span,.ranking-faction>span,.ranking-level{display:flex;flex-direction:column;gap:4px;min-width:0}.ranking-character strong{overflow:hidden;text-overflow:ellipsis;color:#f3f0ea;font-size:12px}.ranking-character small,.ranking-faction small,.ranking-level small{color:#747e89;font:700 7px Arial,sans-serif;letter-spacing:1px;text-transform:uppercase}.ranking-level{text-align:center}.ranking-level strong{color:#efca87;font:700 15px Georgia,serif}.ranking-level.level-master strong{color:#54c8ff}.ranking-level.level-god strong{color:#d38cff}.ranking-level.level-rebirth strong{color:#ff6360;text-shadow:0 0 9px rgba(255,70,65,.32)}.ranking-faction img{width:37px;height:37px;object-fit:contain;filter:drop-shadow(0 0 6px rgba(228,177,99,.2));transition:transform .25s,filter .25s}.ranking-entry:hover .ranking-faction img{transform:scale(1.12);filter:drop-shadow(0 0 8px rgba(228,177,99,.5))}.ranking-faction strong{color:#efc575;font:700 12px Georgia,serif}.faction-entry-snake .ranking-faction strong{color:#e97462}.faction-entry-dragon .ranking-faction strong{color:#72c7ff}.faction-entry-leopard .ranking-faction strong{color:#e7b95e}.faction-entry-sky .ranking-faction strong{color:#b690ff}.ranking-points{text-align:center}.ranking-points strong{color:#f3c879;font:700 14px Georgia,serif}.ranking-points i{color:#747a82;font-style:normal}.ranking-state{min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#767e87;text-align:center}.ranking-state:before{content:"✦";width:60px;height:60px;margin-bottom:18px;display:grid;place-items:center;border:1px solid rgba(208,155,78,.3);border-radius:50%;color:#d5a255;font-size:25px;box-shadow:0 0 24px rgba(196,134,52,.08)}.ranking-state strong{color:#dcb577;font:700 14px Georgia,serif;letter-spacing:2px}.ranking-state p{font-size:11px}.ranking-pagination{min-height:58px;padding:8px 18px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(223,170,91,.24);background:rgba(2,4,6,.64)}.ranking-pagination p{margin:0;color:#77808a;font-size:9px;letter-spacing:.7px}.ranking-pagination p strong{color:#d7b16f}.ranking-pagination .page-link{width:29px;height:29px;padding:0;display:grid;place-items:center}.ranking-pagination .page-arrow{color:#efbd6f;font-size:19px;background:transparent}
.ranking-side{display:flex;flex-direction:column;gap:10px}.ranking-search-panel,.ranking-promo{border:1px solid rgba(222,170,92,.52);border-radius:0;background:linear-gradient(145deg,rgba(12,15,18,.98),rgba(4,6,8,.98));box-shadow:inset 0 0 30px rgba(211,154,74,.025)}.ranking-search-panel{padding:14px 12px 12px}.ranking-search-panel h2{margin:0 0 13px;color:#e3bb79;font:700 14px Georgia,serif;letter-spacing:1.5px}.ranking-search-panel h2 span{font-size:21px}.ranking-search-panel form{display:grid;gap:9px}.ranking-search-panel .input-group{height:43px}.ranking-search-panel .input-group-text{color:#edbc70}.ranking-search-panel form>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ranking-search-panel .form-control,.ranking-search-panel .form-select{font-size:11px}.ranking-search-panel button{height:45px;font:700 12px Georgia,serif;letter-spacing:1.5px}.ranking-search-panel button span{margin-right:9px;font-size:20px}.ranking-promo{min-height:165px;padding:17px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;isolation:isolate}.ranking-promo:before{content:"";position:absolute;inset:0;z-index:-2;background-position:center;background-size:cover;transition:transform .6s ease}.ranking-promo:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,7,9,.98),rgba(5,7,9,.65) 62%,rgba(5,7,9,.2))}.ranking-promo:hover:before{transform:scale(1.035)}.account-promo:before{background-image:url('../images/auth-register-bg.webp');background-position:60% 44%}.download-promo:before{background-image:url('../images/download-hero-v2.webp');background-position:72% 50%}.ranking-promo small{color:#c98f4f;font:700 7px Arial,sans-serif;letter-spacing:2px}.ranking-promo h2{margin:5px 0;color:#f1cb8b;font:22px/1.05 Georgia,serif;letter-spacing:1px}.ranking-promo p{width:62%;margin:0 0 12px;color:#c6c3be;font-size:10px;line-height:1.45}.ranking-promo a{height:42px;padding:0 12px;display:grid;grid-template-columns:30px 1fr 20px;align-items:center;text-align:left;font:700 10px Georgia,serif;letter-spacing:1px}.ranking-promo a span{font-size:21px}.ranking-promo a b{text-align:right;font-size:18px;transition:transform .2s}.ranking-promo a:hover b{transform:translateX(4px)}
.podium-2 .ranking-position b{background:linear-gradient(145deg,#e4edf2,#869cab);border-color:#d5e5ed}
.podium-3 .ranking-position b{background:linear-gradient(145deg,#ffc294,#b5582d);border-color:#f4a06e}
.ranking-position i{color:#d4a35d;font:normal 17px Georgia,serif}
.ranking-character,.ranking-faction{display:flex;align-items:center;gap:12px;min-width:0}
.ranking-avatar{display:block;width:43px;height:43px;flex:0 0 43px;border:1px solid rgba(222,174,103,.55);background-repeat:no-repeat;background-size:205px auto;background-position:50% 13%;box-shadow:0 3px 10px #000}
.ranking-character>span,.ranking-faction>span,.ranking-level{display:flex;flex-direction:column;gap:4px;min-width:0}
.ranking-character strong{overflow:hidden;text-overflow:ellipsis;color:#f3f0ea;font-size:12px}.ranking-character small,.ranking-faction small,.ranking-level small{color:#747e89;font:700 7px Arial,sans-serif;letter-spacing:1px;text-transform:uppercase}
.ranking-level{text-align:center}.ranking-level strong{color:#efca87;font:700 15px Georgia,serif}.ranking-level.level-master strong{color:#54c8ff}.ranking-level.level-god strong{color:#d38cff}.ranking-level.level-rebirth strong{color:#ff6360;text-shadow:0 0 9px rgba(255,70,65,.32)}
.ranking-faction img{width:37px;height:37px;object-fit:contain;filter:drop-shadow(0 0 6px rgba(228,177,99,.2));transition:transform .25s,filter .25s}.ranking-entry:hover .ranking-faction img{transform:scale(1.12);filter:drop-shadow(0 0 8px rgba(228,177,99,.5))}.ranking-faction strong{color:#efc575;font:700 12px Georgia,serif}.faction-entry-snake .ranking-faction strong{color:#e97462}.faction-entry-dragon .ranking-faction strong{color:#72c7ff}.faction-entry-leopard .ranking-faction strong{color:#e7b95e}.faction-entry-sky .ranking-faction strong{color:#b690ff}
.ranking-points{text-align:center}.ranking-points strong{color:#f3c879;font:700 14px Georgia,serif}.ranking-points i{color:#747a82;font-style:normal}
.ranking-state{min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#767e87;text-align:center}.ranking-state:before{content:"✦";width:60px;height:60px;margin-bottom:18px;display:grid;place-items:center;border:1px solid rgba(208,155,78,.3);border-radius:50%;color:#d5a255;font-size:25px;box-shadow:0 0 24px rgba(196,134,52,.08)}.ranking-state strong{color:#dcb577;font:700 14px Georgia,serif;letter-spacing:2px}.ranking-state p{font-size:11px}
.ranking-pagination{min-height:58px;padding:8px 18px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(223,170,91,.24);background:rgba(2,4,6,.64)}.ranking-pagination p{margin:0;color:#77808a;font-size:9px;letter-spacing:.7px}.ranking-pagination p strong{color:#d7b16f}.ranking-pagination .page-link{width:29px;height:29px;padding:0;display:grid;place-items:center}.ranking-pagination .page-arrow{color:#efbd6f;font-size:19px;background:transparent}
@media(max-width:1199px){.ranking-scene{width:min(1100px,calc(100% - 32px))}.ranking-side{display:grid;grid-template-columns:1.15fr 1fr 1fr}.ranking-promo{min-height:190px}}
@media(max-width:820px){.rankings-page .account-main{padding:25px 0}.ranking-scene{width:calc(100% - 20px)}.ranking-hero{height:210px;background-position:62% center}.ranking-hero-copy{padding:28px 22px}.ranking-hero h1{font-size:43px}.ranking-hero h2{font-size:15px;letter-spacing:4px}.ranking-hero blockquote,.ranking-hero-glyph{display:none}.ranking-tabs{height:auto;grid-template-columns:1fr}.ranking-tabs .nav-link{min-height:45px}.ranking-board-head{display:none}.ranking-entry{grid-template-columns:45px 1fr 80px;padding:8px 9px}.ranking-entry .ranking-faction{grid-column:2;margin-top:5px}.ranking-points{grid-column:3;grid-row:1/3}.ranking-side{display:grid;grid-template-columns:1fr}.ranking-promo{min-height:175px}.ranking-pagination{align-items:flex-start;gap:12px;flex-direction:column}}
@media(max-width:520px){.ranking-content{padding-left:5px;padding-right:5px}.ranking-hero{height:190px}.ranking-hero-copy{padding:22px 18px}.ranking-hero h1{font-size:35px;letter-spacing:5px}.ranking-hero h2{font-size:12px}.ranking-avatar{width:38px;height:38px}.ranking-character{gap:8px}.ranking-faction img{width:28px;height:28px}.ranking-level strong{font-size:13px}.ranking-search-panel form>div{grid-template-columns:1fr}.ranking-promo p{width:70%}}

/* Keep every ranking column on the same visual axis. Level ranking has no redundant points column. */
@media(min-width:821px){
  .ranking-board.ranking-board-level>.ranking-board-head,
  .ranking-board.ranking-board-level>.ranking-board-body>.ranking-entry{
    grid-template-columns:68px minmax(260px,1.3fr) minmax(150px,.72fr) minmax(270px,1fr)!important;
  }
  .ranking-board.ranking-board-courage>.ranking-board-head,
  .ranking-board.ranking-board-courage>.ranking-board-body>.ranking-entry,
  .ranking-board.ranking-board-war>.ranking-board-head,
  .ranking-board.ranking-board-war>.ranking-board-body>.ranking-entry{
    grid-template-columns:68px minmax(220px,1.15fr) minmax(120px,.65fr) minmax(210px,.95fr) minmax(145px,.7fr)!important;
  }
  .ranking-board-head>span:nth-child(n+3),
  .ranking-entry>.ranking-level,
  .ranking-entry>.ranking-points{
    justify-self:stretch;
    text-align:center;
  }
  .ranking-entry>.ranking-faction{
    width:min(150px,100%);
    display:grid;
    grid-template-columns:37px minmax(0,1fr);
    align-items:center;
    column-gap:12px;
    justify-self:center!important;
  }
}
@media(max-width:820px){.ranking-board .ranking-entry{grid-template-columns:45px 1fr 80px!important}.ranking-board-level .ranking-entry .ranking-faction{grid-column:2;margin-top:5px}}

/* Compact ranking rows: keep every value inside the board on narrow screens. */
@media(max-width:820px){
  .rankings-page .ranking-content>.col-xl-9,
  .rankings-page .ranking-board,
  .rankings-page .ranking-board-body{min-width:0;max-width:100%}
  .rankings-page .ranking-board .ranking-entry{
    grid-template-columns:42px minmax(0,1fr) 66px!important;
    grid-template-rows:auto auto;
    column-gap:5px;
    row-gap:3px;
    width:100%;
    min-width:0;
    padding:7px 8px;
  }
  .rankings-page .ranking-entry>.ranking-position{grid-column:1;grid-row:1/3;gap:2px;min-width:0}
  .rankings-page .ranking-position i svg{width:10px;height:10px}
  .rankings-page .ranking-entry>.ranking-character{grid-column:2;grid-row:1;min-width:0;gap:7px}
  .rankings-page .ranking-entry>.ranking-character>span{min-width:0;overflow:hidden}
  .rankings-page .ranking-entry>.ranking-character strong{display:block;white-space:nowrap;text-overflow:ellipsis}
  .rankings-page .ranking-entry>.ranking-level{grid-column:3;grid-row:1;min-width:0;overflow:hidden;text-align:center}
  .rankings-page .ranking-entry>.ranking-level strong{font-size:13px;line-height:1.1}
  .rankings-page .ranking-entry>.ranking-level small{font-size:6px;letter-spacing:.25px;line-height:1.15;white-space:normal}
  .rankings-page .ranking-entry>.ranking-faction{grid-column:2!important;grid-row:2!important;min-width:0;margin:0;gap:5px}
  .rankings-page .ranking-entry>.ranking-faction img{width:38px;height:38px;flex:none;object-fit:contain;filter:brightness(1.35) saturate(1.2) drop-shadow(0 0 7px rgba(225,180,111,.48))}
  .rankings-page .ranking-entry>.ranking-faction>span{min-width:0;overflow:hidden}
  .rankings-page .ranking-entry>.ranking-faction strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .rankings-page .ranking-entry>.ranking-faction small{font-size:6px;letter-spacing:.4px}
  .rankings-page .ranking-entry>.ranking-points{grid-column:3!important;grid-row:2!important;min-width:0;overflow-wrap:anywhere;text-align:center}
  .rankings-page .ranking-entry>.ranking-points strong{font-size:12px}
}

/* Crisp, consistent SVG icon system for the ranking page. */
.ranking-ui-icon,.rank-tab-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:currentColor}
.ranking-ui-icon svg,.rank-tab-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ranking-breadcrumb .ranking-ui-icon{width:15px;height:15px;color:#efbd71}
.ranking-tabs .nav-link .rank-tab-icon{width:24px;height:24px;color:#efbe70;font-size:0;filter:drop-shadow(0 0 5px rgba(239,190,112,.2));transition:transform .22s,filter .22s}
.ranking-tabs .nav-link.ranking-tab-courage .rank-tab-icon,.ranking-tabs .nav-link.ranking-tab-war .rank-tab-icon{width:29px;height:29px}
.ranking-tabs .nav-link:hover .rank-tab-icon{transform:translateY(-1px);filter:drop-shadow(0 0 7px rgba(239,190,112,.48))}
.ranking-tabs .nav-link.active .rank-tab-icon{color:#17110b;filter:none}
.ranking-search-panel h2{display:flex;align-items:center;gap:8px}.ranking-search-panel h2 .ranking-ui-icon{width:18px;height:18px}
.ranking-search-panel .input-group-text.ranking-ui-icon{width:42px;height:43px;padding:12px}
.ranking-search-panel button{display:flex;align-items:center;justify-content:center;gap:9px}.ranking-search-panel button .ranking-ui-icon{width:18px;height:18px;margin:0}
.ranking-promo a .ranking-ui-icon{width:22px;height:22px;font-size:0}
