/* Shared real-team artwork, including the home-field markers on the globe. */
.team-badge.has-team-logo {
  background: var(--white);
  border: 1px solid var(--line);
  color: var(--ink);
  padding: 3px;
  overflow: hidden;
}
.team-badge img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}
.team-fallback > svg { width: 70%; height: 70%; }
.team-line > .team-badge { width: 40px; height: 40px; }
@media (max-width: 440px) {
  .game-grid { grid-template-columns: minmax(0, 1fr); }
  .game-card { padding: 18px; }
  .team-line { gap: 12px; font-size: 14px; }
}
.pick-team .team-badge { width: 54px; height: 54px; border-radius: 12px; }
.world-row > .team-badge { width: 46px; height: 46px; border-radius: 12px; }
.bracket-match button { gap: 10px; }
.bracket-match button > span:not(.team-badge) { flex: 1; text-align: left; }
.bracket-match .team-badge { width: 32px; height: 32px; }
.champion > .team-badge { width: 80px; height: 80px; margin-bottom: 18px; }
.comparison-teams b, .leader-team { display: flex; align-items: center; gap: 8px; }
.comparison-teams b:last-child { flex-direction: row-reverse; }
.leader-team .team-badge { width: 25px; height: 25px; }
.schedule-row h3 { display: flex; align-items: center; gap: 10px; }
.schedule-row h3 .team-badge { width: 32px; height: 32px; }
.valpo-teaser > .team-badge, .empty-inline > .team-badge { width: 50px; height: 50px; }
.replay-art > .team-badge { width: 92px; height: 92px; background: transparent; border: 0; }
.valpo-small > .team-badge { width: 70px; height: 70px; margin: 0 auto 15px; }
.valpo-crest { flex: none; }
.valpo-crest > .team-badge { width: 160px; height: 160px; background: transparent; border: 0; }
#earth-host, #earth-host canvas {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  user-select: none;
  -webkit-user-select: none;
}
.earth-connectors {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
.earth-connectors path { stroke: oklch(0.92 0.035 250 / 0.8); stroke-width: 1.25; fill: none; }
.earth-connectors circle { fill: var(--white); stroke: var(--accent); stroke-width: 1.5; }
.earth-marker {
  position: absolute;
  pointer-events: auto;
  width: 154px;
  height: 52px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 9px 6px 6px;
  background: oklch(0.2 0.045 260 / 0.96);
  border: 1px solid oklch(0.68 0.06 250 / 0.7);
  border-radius: 14px;
  color: white;
  text-align: left;
  box-shadow: 0 4px 18px oklch(0.05 0.02 260 / 0.32);
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  user-select: none;
  -webkit-user-select: none;
  transition: border-color 140ms, background 140ms;
}
.earth-marker[hidden] { display: none; }
.earth-marker:hover, .earth-marker:focus-visible, .earth-marker.is-selected {
  background: oklch(0.32 0.08 259);
  border-color: white;
  z-index: 3;
}
.earth-marker:focus-visible { outline: 3px solid var(--white); outline-offset: 3px; }
.earth-marker > .team-badge { width: 36px; height: 36px; border-radius: 10px; }
.earth-marker-copy { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.earth-marker-copy b { font-size: 11px; line-height: 1.2; }
.earth-marker-copy small { font-size: 9px; line-height: 1.2; color: oklch(0.87 0.03 255); }
.earth-tooltip {
  position: absolute;
  z-index: 5;
  width: min(248px, calc(100% - 16px));
  pointer-events: auto;
  padding: 13px 15px;
  background: var(--white);
  color: var(--ink);
  border-radius: 12px;
  box-shadow: 0 5px 25px oklch(0.05 0.02 260 / 0.4);
  font-size: 12px;
  line-height: 1.5;
}
.earth-tooltip strong, .earth-tooltip span, .earth-tooltip small { display: block; }
.earth-tooltip span { margin-top: 4px; }
.earth-tooltip small { color: var(--muted); margin-top: 6px; font-size: 10px; }
@media (max-width: 600px) {
  .valpo-crest > .team-badge { width: 90px; height: 90px; }
  .valpo-crest { position: absolute; right: 18px; bottom: 38px; opacity: 0.3; pointer-events: none; }
  .comparison-teams { gap: 10px; }
}
@media (max-width: 740px) {
  #earth-host { height: 370px; }
}
@container (max-width: 419px) {
  .earth-marker { width: 118px; gap: 6px; padding-right: 5px; }
  .earth-marker > .team-badge { width: 32px; height: 36px; }
  .earth-marker-copy b { font-size: 10px; }
  .earth-marker-copy small { font-size: 8px; }
}
#globe-labels { container-type: inline-size; }
@media (prefers-reduced-motion: reduce) {
  .earth-marker { transition: none; }
}