/* LAB only: presentation guard for the copied legacy interface. */
html,
body {
  background: #063c4a !important;
}

/* The legacy snapshot begins with a white full-screen loader. Keep the LAB
   in the Ella Invierte palette while its copied application is booting. */
body > div[class*="fixed"][class*="inset-0"] {
  background: radial-gradient(circle at 20% 15%, #167f8a 0, #0c5664 38%, #0b2741 100%) !important;
}

/* The old header combines a rank link followed by the legacy coin wallet.
   Points remain in the activity/ranking API; this only hides the old wallet. */
[class~="flexCenter"][class~="gap-3"][class~="sm:gap-6"] > a + div.primaryBg {
  display: none !important;
}

/* The legacy three-filter leaderboard must never flash while real event
   ranking data is loading. The shell reveals only the controlled event view. */
html.ella-event-leaderboard-shell main {
  visibility: hidden;
}
html.ella-event-leaderboard-shell[data-ella-leaderboard="loading"] main,
html.ella-event-leaderboard-shell[data-ella-leaderboard="ready"] main,
html.ella-event-leaderboard-shell[data-ella-leaderboard="error"] main {
  visibility: visible;
}

.ei-leaderboard {
  min-height: 100dvh;
  padding: 7rem clamp(1rem, 5vw, 4rem) 4rem;
  color: #fff;
  background: radial-gradient(circle at 20% 10%, #16828b 0, #075364 38%, #092542 100%);
}
.ei-leaderboard-header { max-width: 62rem; margin: 0 auto 2rem; }
.ei-leaderboard-header p { margin: 0 0 .5rem; color: #f3a5d1; font-weight: 800; letter-spacing: .14em; font-size: .8rem; }
.ei-leaderboard-header h1 { margin: 0; font-size: clamp(2rem, 7vw, 4rem); line-height: 1; }
.ei-leaderboard-header span { display: block; margin-top: .8rem; color: #dbeff1; }
.ei-podium-grid { max-width: 62rem; margin: 0 auto 2.5rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; align-items: end; }
.ei-rank-card { display: flex; gap: .8rem; align-items: center; padding: .85rem 1rem; border: 1px solid rgba(255,255,255,.22); border-radius: 1rem; background: rgba(4,32,54,.38); }
.ei-podium { min-height: 11rem; flex-direction: column; justify-content: center; text-align: center; background: rgba(255,255,255,.13); }
.ei-podium-1 { min-height: 14rem; border-color: #f5c558; background: linear-gradient(160deg, rgba(245,197,88,.27), rgba(255,255,255,.1)); }
.ei-avatar-wrap { flex: 0 0 auto; width: 3.4rem; height: 3.4rem; padding: .15rem; overflow: hidden; border-radius: 50%; background: #fff; }
.ei-podium .ei-avatar-wrap { width: 5rem; height: 5rem; }
.ei-rank-avatar { width: 100%; height: 100%; display: block; object-fit: cover; border-radius: 50%; }
.ei-rank-info { min-width: 0; display: grid; gap: .1rem; }
.ei-podium .ei-rank-info { justify-items: center; }
.ei-rank-info strong { overflow: hidden; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; font-size: 1rem; }
.ei-rank-info span:last-child { color: #d6f8f4; font-weight: 700; font-size: .9rem; }
.ei-rank-position { color: #f7c454; font-size: .78rem; font-weight: 900; }
.ei-top-fifteen { max-width: 62rem; margin: 0 auto; }
.ei-top-fifteen h2 { margin: 0 0 1rem; font-size: 1.35rem; }
.ei-top-fifteen .ei-rank-card { margin-bottom: .65rem; }
.ei-empty { color: #d6f8f4; }

/* Event activity entry: the copied app supplied a large generic silhouette.
   Keep the useful text and CTA, but make its visual area an Ella Invierte
   green field instead of pretending it is a participant image. */
.ei-activity-card {
  background: linear-gradient(145deg, #e7f5f1 0%, #f8fffd 58%, #d9eeea 100%) !important;
  border-color: #8fcfc5 !important;
}
.ei-activity-card > div:first-child {
  min-height: 10rem;
  border-radius: 1.5rem;
  /* This is a neutral event panel, not a missing participant avatar. */
  background: linear-gradient(135deg, #37a866 0%, #1f8e55 52%, #126c40 100%);
}
.ei-activity-card .ei-activity-hero-image {
  display: none !important;
}

/* The copied mobile cards were designed for very short English labels.
   Let long Spanish activity/question labels grow vertically instead of
   truncating the words. This is visual only; it does not alter quiz data. */
.ella-event-shell [class*="truncate"],
.ella-event-shell [class*="line-clamp"],
.ella-event-shell h1,
.ella-event-shell h2,
.ella-event-shell h3,
.ella-event-shell h4,
.ella-event-shell h5,
.ella-event-shell h6 {
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: normal;
}
.ella-event-shell [class*="truncate"],
.ella-event-shell [class*="line-clamp"] {
  -webkit-line-clamp: unset !important;
  display: block !important;
  height: auto !important;
  max-height: none !important;
}
@media (max-width: 620px) {
  .ei-leaderboard { padding-top: 5.5rem; }
  .ei-podium-grid { grid-template-columns: 1fr; }
  .ei-podium, .ei-podium-1 { min-height: auto; flex-direction: row; text-align: left; justify-content: flex-start; }
  .ei-podium .ei-rank-info { justify-items: start; }
  .ei-podium .ei-avatar-wrap { width: 3.4rem; height: 3.4rem; }
}
.ei-qr-status{min-height:70vh;display:grid;place-content:center;gap:12px;padding:32px;text-align:center;background:#f4fafa;color:#102947;font:600 18px/1.45 Nunito,system-ui}.ei-qr-status a{color:#087d88;font-weight:800}.ei-qr-status h1{font-size:28px;margin:0}.ei-qr-status p{margin:0}.ei-qr-status a{margin-top:12px}
#ei-profile-onboarding{position:fixed;inset:0;z-index:2147483647;overflow:auto;padding:24px;background:rgba(6,39,62,.72);font-family:Nunito,system-ui;color:#132844}#ei-profile-onboarding form{max-width:620px;margin:24px auto;padding:28px;border-radius:28px;background:#fff;box-shadow:0 20px 80px #0005;display:grid;gap:14px}#ei-profile-onboarding h1{margin:0;font-size:30px}#ei-profile-onboarding p{margin:0;color:#516579}#ei-profile-onboarding label{display:grid;gap:6px;font-weight:800}#ei-profile-onboarding select{min-height:42px;border:1px solid #b8d8d6;border-radius:10px;padding:8px;background:#fff;font:inherit}#ei-profile-onboarding fieldset{display:flex;flex-wrap:wrap;gap:10px;border:1px solid #b8d8d6;border-radius:12px;padding:12px}#ei-profile-onboarding legend{font-weight:800}.ei-check{display:flex!important;grid-template-columns:auto 1fr;align-items:center;gap:8px!important;font-weight:600!important}#ei-profile-onboarding button{border:0;border-radius:999px;padding:13px 20px;background:#087d88;color:white;font:800 17px Nunito,system-ui;cursor:pointer}.ei-profile-error{color:#b91c1c!important;font-weight:800}