.page.branch-rank[data-v-4645a2d4] {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.07291667rem;
  min-height: 0;
}
.branch-rank__head[data-v-4645a2d4] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 0.08333333rem;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.branch-rank__title h2[data-v-4645a2d4] {
  margin: 0;
  color: #00c3ff;
  font-size: 0.11458333rem;
  letter-spacing: 0.04em;
}
.branch-rank__title p[data-v-4645a2d4] {
  margin: 0.03125rem 0 0;
  color: rgba(255, 255, 255, 0.45);
  font-size: 0.06770833rem;
}
.metric-tabs[data-v-4645a2d4] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.04166667rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.metric-tabs__btn[data-v-4645a2d4] {
  border: 0.00520833rem solid rgba(166, 191, 255, 0.35);
  background: rgba(8, 28, 64, 0.65);
  color: #9eb6dc;
  padding: 0.04166667rem 0.08333333rem;
  border-radius: 0.02083333rem;
  font-size: 0.07291667rem;
  cursor: pointer;
  -webkit-transition: color 0.2s, border-color 0.2s, background 0.2s, -webkit-box-shadow 0.2s;
  transition: color 0.2s, border-color 0.2s, background 0.2s, -webkit-box-shadow 0.2s;
  transition: color 0.2s, border-color 0.2s, background 0.2s, box-shadow 0.2s;
  transition: color 0.2s, border-color 0.2s, background 0.2s, box-shadow 0.2s, -webkit-box-shadow 0.2s;
}
.metric-tabs__btn[data-v-4645a2d4]:hover {
  color: #fff;
  border-color: rgba(0, 195, 255, 0.55);
}
.metric-tabs__btn.active[data-v-4645a2d4] {
  color: #041428;
  font-weight: 600;
  border-color: #5ad6ff;
  background: -webkit-gradient(linear, left top, left bottom, from(#7ee7ff), to(#2aa8e8));
  background: linear-gradient(180deg, #7ee7ff 0%, #2aa8e8 100%);
  -webkit-box-shadow: 0 0 0.07291667rem rgba(90, 214, 255, 0.35);
          box-shadow: 0 0 0.07291667rem rgba(90, 214, 255, 0.35);
}
.branch-rank__body[data-v-4645a2d4] {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-height: 0;
  padding: 0.08333333rem 0.09375rem;
  border: 0.00520833rem solid rgba(166, 191, 255, 0.25);
  border-radius: 0.04166667rem;
  background: rgba(6, 22, 52, 0.55);
  overflow: auto;
}
.empty[data-v-4645a2d4] {
  margin: 0.20833333rem auto;
  text-align: center;
  color: rgba(255, 255, 255, 0.45);
  font-size: 0.07291667rem;
}
.bars[data-v-4645a2d4] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.05208333rem;
  padding-top: 0.21875rem;
}
.bar-row[data-v-4645a2d4] {
  --fill: #1a6dff;
  --fill2: #00c3ff;
  display: grid;
  grid-template-columns: 0.1875rem minmax(0, 1fr) minmax(0.9375rem, 32%);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.0625rem;
  width: 100%;
  padding: 0.04166667rem 0.0625rem;
  border: 0.00520833rem solid rgba(166, 191, 255, 0.18);
  border-radius: 0.03125rem;
  background: rgba(255, 255, 255, 0.03);
  color: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-transition: border-color 0.2s, background 0.2s, -webkit-transform 0.2s;
  transition: border-color 0.2s, background 0.2s, -webkit-transform 0.2s;
  transition: border-color 0.2s, background 0.2s, transform 0.2s;
  transition: border-color 0.2s, background 0.2s, transform 0.2s, -webkit-transform 0.2s;
  -webkit-animation: barIn-4645a2d4 0.45s ease both;
          animation: barIn-4645a2d4 0.45s ease both;
  -webkit-animation-delay: calc(var(--i, 0) * 0.035s);
          animation-delay: calc(var(--i, 0) * 0.035s);
}
.bar-row[data-v-4645a2d4]:hover {
  border-color: rgba(0, 195, 255, 0.55);
  background: rgba(0, 195, 255, 0.08);
  -webkit-transform: translateX(0.02083333rem);
          transform: translateX(0.02083333rem);
  z-index: 2;
}
.bar-row:hover .bar-row__tip[data-v-4645a2d4] {
  opacity: 1;
  -webkit-transform: translateX(-50%) translateY(0);
          transform: translateX(-50%) translateY(0);
}
.bar-row:hover .bar-row__fill[data-v-4645a2d4] {
  -webkit-filter: brightness(1.12);
          filter: brightness(1.12);
}
.bar-row[data-v-4645a2d4]:focus {
  outline: none;
}
.bar-row[data-v-4645a2d4]:focus-visible {
  border-color: #00c3ff;
  -webkit-box-shadow: 0 0 0 0.01041667rem rgba(0, 195, 255, 0.35);
          box-shadow: 0 0 0 0.01041667rem rgba(0, 195, 255, 0.35);
}
.bar-row__rank[data-v-4645a2d4] {
  width: 0.14583333rem;
  height: 0.14583333rem;
  line-height: 0.14583333rem;
  text-align: center;
  border-radius: 50%;
  font-size: 0.06770833rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.08);
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.bar-row__rank.is-medal[data-v-4645a2d4] {
  color: #1a2438;
}
.bar-row__track[data-v-4645a2d4] {
  position: relative;
  height: 0.14583333rem;
  border-radius: 0.02083333rem;
  background: rgba(8, 30, 70, 0.75);
  overflow: visible;
}
.bar-row__fill[data-v-4645a2d4] {
  position: relative;
  height: 100%;
  min-width: 0.04166667rem;
  border-radius: 0.02083333rem;
  background: -webkit-gradient(linear, left top, right top, from(var(--fill)), to(var(--fill2)));
  background: linear-gradient(90deg, var(--fill), var(--fill2));
  -webkit-box-shadow: 0 0 0.0625rem rgba(0, 195, 255, 0.25);
          box-shadow: 0 0 0.0625rem rgba(0, 195, 255, 0.25);
  -webkit-transition: width 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  transition: width 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  overflow: hidden;
}
.bar-row__shine[data-v-4645a2d4] {
  position: absolute;
  inset: 0 auto 0 0;
  width: 40%;
  background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(rgba(255, 255, 255, 0.28)), to(transparent));
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.28), transparent);
  -webkit-transform: translateX(-120%);
          transform: translateX(-120%);
  -webkit-animation: shine-4645a2d4 2.8s ease-in-out infinite;
          animation: shine-4645a2d4 2.8s ease-in-out infinite;
}
.bar-row__tip[data-v-4645a2d4] {
  position: absolute;
  left: 50%;
  bottom: calc(100% + (8 / 192rem));
  -webkit-transform: translateX(-50%) translateY(0.03125rem);
          transform: translateX(-50%) translateY(0.03125rem);
  z-index: 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.01041667rem;
  min-width: 0.6875rem;
  padding: 0.04166667rem 0.0625rem;
  border-radius: 0.02083333rem;
  border: 0.00520833rem solid rgba(166, 191, 255, 0.4);
  background: rgba(4, 18, 42, 0.96);
  -webkit-box-shadow: 0 0.04166667rem 0.125rem rgba(0, 0, 0, 0.4);
          box-shadow: 0 0.04166667rem 0.125rem rgba(0, 0, 0, 0.4);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
  transition: opacity 0.2s, -webkit-transform 0.2s;
  transition: opacity 0.2s, transform 0.2s;
  transition: opacity 0.2s, transform 0.2s, -webkit-transform 0.2s;
  white-space: nowrap;
}
.bar-row__tip strong[data-v-4645a2d4] {
  color: #fff;
  font-size: 0.06770833rem;
}
.bar-row__tip em[data-v-4645a2d4] {
  font-style: normal;
  font-size: 0.0625rem;
}
.bar-row__tip em.up[data-v-4645a2d4] {
  color: #36d7b7;
}
.bar-row__tip em.down[data-v-4645a2d4] {
  color: #ff8a3d;
}
.bar-row__tip em.flat[data-v-4645a2d4] {
  color: rgba(255, 255, 255, 0.55);
}
.bar-row__label[data-v-4645a2d4] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 0.04166667rem;
  min-width: 0;
}
.bar-row__label strong[data-v-4645a2d4] {
  color: #e8f4ff;
  font-size: 0.078125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bar-row__label span[data-v-4645a2d4] {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  color: #00c3ff;
  font-size: 0.078125rem;
  font-weight: 600;
}
.medal-1[data-v-4645a2d4] {
  --fill: #c9921a;
  --fill2: #ffe9a0;
  border-color: rgba(245, 197, 66, 0.55);
  background: -webkit-gradient(linear, left top, right top, from(rgba(200, 150, 40, 0.28)), to(rgba(255, 255, 255, 0.03)));
  background: linear-gradient(90deg, rgba(200, 150, 40, 0.28), rgba(255, 255, 255, 0.03));
}
.medal-1 .bar-row__rank[data-v-4645a2d4] {
  background: linear-gradient(145deg, #ffe9a0 0%, #f5c542 42%, #c9921a 100%);
  -webkit-box-shadow: 0 0 0.05208333rem rgba(245, 197, 66, 0.45);
          box-shadow: 0 0 0.05208333rem rgba(245, 197, 66, 0.45);
}
.medal-1 .bar-row__label span[data-v-4645a2d4] {
  color: #f5c542;
}
.medal-2[data-v-4645a2d4] {
  --fill: #8e99ad;
  --fill2: #f2f5fa;
  border-color: rgba(200, 208, 224, 0.5);
  background: -webkit-gradient(linear, left top, right top, from(rgba(160, 170, 190, 0.24)), to(rgba(255, 255, 255, 0.03)));
  background: linear-gradient(90deg, rgba(160, 170, 190, 0.24), rgba(255, 255, 255, 0.03));
}
.medal-2 .bar-row__rank[data-v-4645a2d4] {
  background: linear-gradient(145deg, #f2f5fa 0%, #c0c8d8 45%, #8e99ad 100%);
  -webkit-box-shadow: 0 0 0.05208333rem rgba(192, 200, 216, 0.4);
          box-shadow: 0 0 0.05208333rem rgba(192, 200, 216, 0.4);
}
.medal-2 .bar-row__label span[data-v-4645a2d4] {
  color: #d0d8e8;
}
.medal-3[data-v-4645a2d4] {
  --fill: #9a5a30;
  --fill2: #f0c49a;
  border-color: rgba(208, 138, 85, 0.5);
  background: -webkit-gradient(linear, left top, right top, from(rgba(160, 100, 50, 0.26)), to(rgba(255, 255, 255, 0.03)));
  background: linear-gradient(90deg, rgba(160, 100, 50, 0.26), rgba(255, 255, 255, 0.03));
}
.medal-3 .bar-row__rank[data-v-4645a2d4] {
  background: linear-gradient(145deg, #f0c49a 0%, #d08a55 45%, #9a5a30 100%);
  -webkit-box-shadow: 0 0 0.05208333rem rgba(208, 138, 85, 0.4);
          box-shadow: 0 0 0.05208333rem rgba(208, 138, 85, 0.4);
}
.medal-3 .bar-row__label span[data-v-4645a2d4] {
  color: #e0a070;
}
@-webkit-keyframes barIn-4645a2d4 {
from {
    opacity: 0;
    -webkit-transform: translateY(0.04166667rem);
            transform: translateY(0.04166667rem);
}
to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
}
}
@keyframes barIn-4645a2d4 {
from {
    opacity: 0;
    -webkit-transform: translateY(0.04166667rem);
            transform: translateY(0.04166667rem);
}
to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
}
}
@-webkit-keyframes shine-4645a2d4 {
0%,
  40% {
    -webkit-transform: translateX(-120%);
            transform: translateX(-120%);
}
70%,
  100% {
    -webkit-transform: translateX(280%);
            transform: translateX(280%);
}
}
@keyframes shine-4645a2d4 {
0%,
  40% {
    -webkit-transform: translateX(-120%);
            transform: translateX(-120%);
}
70%,
  100% {
    -webkit-transform: translateX(280%);
            transform: translateX(280%);
}
}


/*# sourceMappingURL=chunk-681bbfcc.ffa92598.css.map*/