/* Shared Discovery Elo geography ranks: colours and hexagonal emblem. */
/* Loaded by discovery-elo.php, admin/mode_check.php and the home page preview. */

.gt-elo-rank--terra { --gt-geo-rank-color: #58d68d; --gt-geo-rank-rgb: 88, 214, 141; }
.gt-elo-rank--nomad { --gt-geo-rank-color: #21c7a8; --gt-geo-rank-rgb: 33, 199, 168; }
.gt-elo-rank--voyager { --gt-geo-rank-color: #2bb9f1; --gt-geo-rank-rgb: 43, 185, 241; }
.gt-elo-rank--meridian { --gt-geo-rank-color: #5477ff; --gt-geo-rank-rgb: 84, 119, 255; }
.gt-elo-rank--atlas { --gt-geo-rank-color: #8d63ff; --gt-geo-rank-rgb: 141, 99, 255; }
.gt-elo-rank--aurora { --gt-geo-rank-color: #e95fbd; --gt-geo-rank-rgb: 233, 95, 189; }
.gt-elo-rank--zenith { --gt-geo-rank-color: #ff725e; --gt-geo-rank-rgb: 255, 114, 94; }
.gt-elo-rank--olympus { --gt-geo-rank-color: #ffb31f; --gt-geo-rank-rgb: 255, 179, 31; }

.gt-elo-rank-emblem {
  --gt-rank-emblem-size: 62px;
  position: relative;
  isolation: isolate;
  width: var(--gt-rank-emblem-size);
  height: calc(var(--gt-rank-emblem-size) * 1.12);
  display: grid;
  flex: 0 0 var(--gt-rank-emblem-size);
  place-items: center;
  color: #fff;
  filter: drop-shadow(0 10px 16px rgba(var(--gt-geo-rank-rgb), .24));
}

.gt-elo-rank-emblem::before,
.gt-elo-rank-emblem::after {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0;
  clip-path: polygon(50% 0, 91% 17%, 84% 72%, 50% 100%, 16% 72%, 9% 17%);
  background: linear-gradient(145deg, color-mix(in srgb, var(--gt-geo-rank-color) 68%, #fff), var(--gt-geo-rank-color) 48%, color-mix(in srgb, var(--gt-geo-rank-color) 72%, #07152a));
}

.gt-elo-rank-emblem::after {
  z-index: -1;
  inset: 5px;
  background:
    radial-gradient(circle at 50% 34%, rgba(255, 255, 255, .22), transparent 34%),
    linear-gradient(150deg, rgba(7, 21, 42, .58), rgba(7, 21, 42, .9));
}

.gt-elo-rank-emblem > i { font-size: calc(var(--gt-rank-emblem-size) * .31); filter: drop-shadow(0 2px 5px rgba(0, 0, 0, .38)); }
.gt-elo-rank-emblem__orbit { position: absolute; width: 57%; aspect-ratio: 1; border: 1px solid rgba(var(--gt-geo-rank-rgb), .72); border-radius: 50%; transform: rotate(-22deg); }
.gt-elo-rank-emblem__orbit::after { content: ""; position: absolute; top: -2px; left: 44%; width: 4px; height: 4px; border-radius: 50%; background: #fff; box-shadow: 0 0 7px var(--gt-geo-rank-color); }
.gt-elo-rank-emblem--large { --gt-rank-emblem-size: 82px; }