body.loading > *:not(#global-loading) {
  filter: blur(4px);
  pointer-events: none;
  user-select: none;
}

#global-loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.6);
  display: none;
  align-items: center;
  justify-content: center;
  text-align: center;
  z-index: 10000;
}

body.loading #global-loading {
  display: flex;
}

.loading-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 18px 24px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

.loading-top {
  display: flex;
  align-items: center;
  gap: 12px;
}

.soccer-loader svg {
  height: 48px;
  display: block;
}

.soccer-loader path {
  fill: url(#ballGradient);
  animation: pulse 1s infinite;
}

.soccer-loader .path-7 { animation-delay: -1s; }
.soccer-loader .path-6 { animation-delay: -0.875s; }
.soccer-loader .path-5 { animation-delay: -0.75s; }
.soccer-loader .path-4 { animation-delay: -0.625s; }
.soccer-loader .path-3 { animation-delay: -0.5s; }
.soccer-loader .path-2 { animation-delay: -0.375s; }
.soccer-loader .path-1 { animation-delay: -0.25s; }
.soccer-loader .path-0 { animation-delay: -0.125s; }

.loading-text {
  font-size: 18px;
  font-weight: 500;
  color: #2b2b2b;
}

.loading-fact {
  font-size: 14px;
  color: #2b2b2b;
  text-align: center;
}

@keyframes pulse {
  0% { opacity: .1; }
  30% { opacity: .8; }
  100% { opacity: .1; }
}