/* v0.10.8 – rebuilt wide leaderboard */
.va-leaderboard {
  --vl-bg: var(--va-bg, #08111f);
  --vl-surface: var(--va-surface, rgba(15,25,45,.68));
  --vl-surface-2: var(--va-surface-alt, rgba(21,35,58,.82));
  --vl-border: var(--va-border, rgba(255,255,255,.08));
  --vl-text: var(--va-text, #eef4fb);
  --vl-muted: var(--va-text-muted, #9fb0c3);
  --vl-primary: var(--va-primary, #2fb486);
  --vl-primary-dark: var(--va-primary-dark, #218763);
  --vl-accent: var(--va-accent, #69aee6);
  --vl-warning: var(--va-warning, #d7a94a);
  --vl-radius-lg: var(--va-radius-lg, 22px);
  --vl-radius-md: var(--va-radius-md, 16px);
  --vl-gap: var(--va-grid-gap, 24px);
  color: var(--vl-text);
  width: min(100%, calc(100vw - 56px));
  max-width: 1720px;
  margin: 32px auto 64px;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.va-leaderboard *, .va-leaderboard *::before, .va-leaderboard *::after { box-sizing: border-box; }
.va-leaderboard a { color: inherit; text-decoration: none; }
.va-leaderboard-shell { display: grid; gap: var(--vl-gap); width: 100%; }
.va-leaderboard-hero,
.va-leaderboard-controls,
.va-podium-card,
.va-ranking-list,
.va-empty-pilots {
  border: 1px solid var(--vl-border);
  background:
    radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--vl-primary) 24%, transparent), transparent 34%),
    radial-gradient(circle at 86% 8%, color-mix(in srgb, var(--vl-accent) 16%, transparent), transparent 34%),
    linear-gradient(180deg, rgba(13,25,46,.84), rgba(7,15,29,.96));
  box-shadow: var(--va-shadow-lg, 0 28px 70px rgba(0,0,0,.38));
}
.va-leaderboard-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(480px, .9fr);
  gap: clamp(28px, 5vw, 86px);
  align-items: center;
  min-height: 310px;
  padding: clamp(30px, 4vw, 54px);
  border-radius: var(--vl-radius-lg);
  overflow: hidden;
}
.va-leaderboard-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(8,17,31,.10), rgba(8,17,31,.46));
  pointer-events: none;
}
.va-leaderboard-hero > * { position: relative; z-index: 1; }
.va-leaderboard-hero__content { display: grid; gap: 15px; max-width: 720px; }
.va-pill-kicker {
  display: inline-flex;
  width: fit-content;
  padding: 8px 16px;
  border-radius: 999px;
  color: var(--vl-primary);
  background: color-mix(in srgb, var(--vl-primary) 13%, transparent);
  border: 1px solid color-mix(in srgb, var(--vl-primary) 24%, transparent);
  letter-spacing: .18em;
}
.va-leaderboard-hero h1 {
  margin: 0;
  font-size: clamp(3rem, 5.2vw, 5.4rem);
  line-height: .92;
  letter-spacing: -.065em;
  font-weight: 950;
}
.va-leaderboard-hero p {
  margin: 0;
  max-width: 76ch;
  color: color-mix(in srgb, var(--vl-text) 78%, transparent);
  font-size: clamp(1rem, 1.18vw, 1.16rem);
  line-height: 1.6;
}
.va-leaderboard-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-self: stretch;
}
.va-leaderboard-summary__item {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  gap: 5px 18px;
  align-content: center;
  min-height: 106px;
  padding: 20px;
  border-radius: var(--vl-radius-md);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(8,17,31,.55);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.va-leaderboard-summary__item i {
  grid-row: 1 / 3;
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--vl-primary) 16%, transparent);
  border: 1px solid color-mix(in srgb, var(--vl-primary) 30%, transparent);
  box-shadow: 0 12px 30px color-mix(in srgb, var(--vl-primary) 16%, transparent);
}
.va-leaderboard-summary__item--pilots i::before { content: "👥"; font-size: 1.25rem; }
.va-leaderboard-summary__item--hours i::before { content: "◷"; font-size: 1.55rem; color: var(--vl-primary); }
.va-leaderboard-summary__item--flights i::before { content: "✈"; font-size: 1.35rem; color: var(--vl-primary); }
.va-leaderboard-summary__item--active i::before { content: "◉"; font-size: 1.25rem; color: var(--vl-primary); }
.va-leaderboard-summary strong { display: block; font-size: clamp(1.8rem, 3vw, 2.65rem); line-height: 1; letter-spacing: -.055em; }
.va-leaderboard-summary small { color: var(--vl-muted); font-size: .78rem; font-weight: 850; text-transform: uppercase; letter-spacing: .1em; }
.va-leaderboard-controls {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto;
  gap: 16px;
  align-items: end;
  padding: 22px 28px;
  border-radius: var(--vl-radius-lg);
}
.va-leaderboard-controls .va-field { display: grid; gap: 9px; }
.va-leaderboard-controls .va-label { color: var(--vl-muted); font-size: .8rem; font-weight: 850; }
.va-leaderboard-controls .va-select {
  min-height: 54px;
  border-radius: var(--vl-radius-md);
  border: 1px solid rgba(255,255,255,.09);
  background: rgba(8,17,31,.72);
  color: var(--vl-text);
  padding-inline: 16px;
}
.va-leaderboard-controls__actions { display: flex; gap: 12px; justify-content: flex-end; align-items: center; }
.va-leaderboard-controls .va-btn { min-height: 54px; padding-inline: 26px; }
.va-leaderboard-board {
  display: grid;
  grid-template-columns: minmax(420px, .9fr) minmax(640px, 1.35fr);
  gap: var(--vl-gap);
  align-items: stretch;
}
.va-podium { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--vl-gap); }
.va-podium-card {
  position: relative;
  min-height: 270px;
  padding: 26px 22px;
  border-radius: var(--vl-radius-md);
  overflow: hidden;
  display: grid;
  align-content: center;
  justify-items: center;
  text-align: center;
  gap: 12px;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.va-podium-card:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--vl-warning) 44%, var(--vl-border)); }
.va-podium-card--1 { border-color: color-mix(in srgb, var(--vl-warning) 62%, var(--vl-border)); box-shadow: 0 22px 54px rgba(0,0,0,.34), inset 0 -4px 0 color-mix(in srgb, var(--vl-warning) 88%, transparent); }
.va-podium-card--2 { box-shadow: 0 22px 54px rgba(0,0,0,.30), inset 0 -4px 0 rgba(190,206,225,.82); }
.va-podium-card--3 { box-shadow: 0 22px 54px rgba(0,0,0,.30), inset 0 -4px 0 rgba(202,118,56,.82); }
.va-rank-medal {
  position: absolute; top: 18px; right: 18px; min-width: 46px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px; font-weight: 950;
  background: color-mix(in srgb, var(--vl-warning) 20%, transparent);
  border: 1px solid color-mix(in srgb, var(--vl-warning) 36%, transparent);
}
.va-avatar {
  position: relative;
  width: 84px; height: 84px; border-radius: 999px;
  display: grid; place-items: center;
  background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.08), rgba(6,13,26,.98));
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03), 0 14px 36px rgba(0,0,0,.32);
  font-weight: 950;
  letter-spacing: .04em;
}
.va-status-dot, .va-live-dot {
  display: inline-block;
  width: 10px; height: 10px; border-radius: 999px;
  background: #8190a8;
  box-shadow: 0 0 0 3px rgba(129,144,168,.12);
}
.va-status-dot { margin-top: -25px; margin-left: 58px; }
.va-status-dot.is-live, .va-live-dot.is-live { background: var(--vl-primary); box-shadow: 0 0 0 4px color-mix(in srgb, var(--vl-primary) 15%, transparent); }
.va-podium-card__body strong { display: block; font-size: clamp(1.35rem, 2vw, 1.7rem); letter-spacing: -.03em; }
.va-podium-card__body small { display: block; margin-top: 4px; color: var(--vl-muted); font-weight: 750; }
.va-podium-score { font-size: clamp(2.1rem, 4vw, 3rem); line-height: 1; font-weight: 950; letter-spacing: -.06em; }
.va-podium-caption { color: var(--vl-muted); font-size: .78rem; font-weight: 900; text-transform: uppercase; letter-spacing: .12em; }
.va-ranking-list { padding: 0; overflow: hidden; border-radius: var(--vl-radius-lg); align-self: stretch; }
.va-ranking-list__head, .va-ranking-row {
  display: grid;
  grid-template-columns: 52px minmax(120px,.85fr) minmax(150px,.85fr) minmax(90px,.55fr) minmax(90px,.5fr) minmax(100px,.55fr) minmax(130px,.7fr);
  gap: 14px;
  align-items: center;
}
.va-ranking-list__head {
  padding: 16px 22px;
  color: var(--vl-muted);
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .74rem;
  background: rgba(255,255,255,.035);
  border-bottom: 1px solid var(--vl-border);
}
.va-ranking-row { padding: 16px 22px; border-bottom: 1px solid var(--vl-border); transition: background .18s ease; }
.va-ranking-row:hover { background: rgba(255,255,255,.035); }
.va-ranking-row:last-child { border-bottom: 0; }
.va-ranking-place, .va-ranking-score { font-weight: 900; }
.va-ranking-pilot > span { display: inline-flex; align-items: center; gap: 8px; }
.va-empty-pilots { padding: clamp(34px,6vw,72px); border-radius: var(--vl-radius-lg); text-align: center; display: grid; gap: 12px; }
@media (max-width: 1280px) {
  .va-leaderboard-board { grid-template-columns: 1fr; }
  .va-podium { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 1120px) {
  .va-leaderboard { width: min(100%, calc(100vw - 32px)); }
  .va-leaderboard-hero, .va-leaderboard-controls { grid-template-columns: 1fr; }
  .va-leaderboard-summary { grid-template-columns: 1fr 1fr; }
  .va-leaderboard-controls__actions { justify-content: flex-start; flex-wrap: wrap; }
  .va-ranking-list__head { display: none; }
  .va-ranking-row { grid-template-columns: 54px 1fr; gap: 9px 14px; }
  .va-ranking-row > span:nth-child(n+3) { grid-column: 2; color: var(--vl-muted); }
}
@media (max-width: 760px) {
  .va-leaderboard { width: min(100%, calc(100vw - 24px)); margin-top: 22px; }
  .va-leaderboard-hero, .va-leaderboard-controls { padding-inline: 18px; }
  .va-leaderboard-summary, .va-podium { grid-template-columns: 1fr; }
  .va-leaderboard-hero h1 { font-size: clamp(2.55rem, 17vw, 4.1rem); }
}

/* v0.10.9 layout reset: component must not fight the template container */
.va-leaderboard,
.va-leaderboard-shell,
.va-leaderboard > .va-stack,
.va-leaderboard-hero,
.va-leaderboard-controls,
.va-leaderboard-board,
.va-ranking-table,
.va-empty-pilots {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}