/* "Rewards" lockup: the glossy emerald orb (cut out, transparent: auth/orb-256.webp, see scripts/make-icons.mjs) + the word, styled as one logo. */
.logo {
  display: inline-flex; align-items: center; gap: .16em;
  font-family: "Exo 2", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  font-weight: 800; font-style: italic; text-transform: uppercase; line-height: 1; letter-spacing: .01em;
  text-decoration: none; color: #fff;
}
.logo .orb-mark {
  flex: none; width: 1.08em; height: 1.08em;
  background: url("orb-256.webp") center / contain no-repeat;
  filter: drop-shadow(0 0 .12em rgba(70, 230, 120, .4));
}
.logo .word {
  /* glossy emerald: bright highlight on top, deep green below, soft glow like the orb's X */
  background: linear-gradient(180deg, #f2fff0 0%, #a8f7b0 30%, #3fd06a 52%, #138a3c 70%, #0b5a28 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 .1em rgba(70, 230, 120, .45)) drop-shadow(0 .03em 0 rgba(0, 0, 0, .6));
  padding: .04em .06em .04em 0; /* keeps the italic tail inside the clipped box */
}
.logo.small { font-size: 22px; }