/* Загрузка списка турниров: логотип StepChess (app/game/TournamentsLoader.jsx) */
.sc-loader { display: flex; flex-direction: column; align-items: center; gap: .55rem; padding: 2.2rem 1rem 2.4rem; opacity: 0; animation: sc-fade .3s ease .15s forwards; }
.sc-loader-logo { position: relative; display: grid; place-items: center; width: 88px; height: 88px; }
.sc-loader-ring { position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(48, 89, 150, 0) 0deg, rgba(48, 89, 150, .35) 120deg, #305996 280deg, #7aa7ea 360deg);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
  animation: sc-spin 1.1s linear infinite; }
.sc-loader-core { display: grid; place-items: center; width: 66px; height: 66px; border-radius: 50%; color: #fff; font-size: 30px;
  background: linear-gradient(145deg, #4373bd 0%, #305996 55%, #22437a 100%); box-shadow: 0 6px 18px rgba(48, 89, 150, .35), inset 0 1px 0 rgba(255, 255, 255, .18); }
.sc-loader-core i { display: block; transform-origin: 50% 100%; animation: sc-hop 1.1s cubic-bezier(.4, 0, .2, 1) infinite; }
.sc-loader-word { font-size: 1.3rem; font-weight: 700; letter-spacing: .02em; color: transparent;
  background: linear-gradient(90deg, #305996 0%, #305996 40%, #9cc0f5 50%, #305996 60%, #305996 100%); background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text; animation: sc-shine 2.2s linear infinite; }
.sc-loader-steps { display: flex; align-items: flex-end; gap: 4px; height: 24px; }
.sc-loader-steps span { width: 10px; border-radius: 2px; background: #cbd9ee; animation: sc-step 1.1s ease-in-out infinite; }
.sc-loader-steps span:nth-child(1) { height: 6px; }
.sc-loader-steps span:nth-child(2) { height: 10px; animation-delay: .12s; }
.sc-loader-steps span:nth-child(3) { height: 14px; animation-delay: .24s; }
.sc-loader-steps span:nth-child(4) { height: 19px; animation-delay: .36s; }
.sc-loader-steps span:nth-child(5) { height: 24px; animation-delay: .48s; }
.sc-loader-text { color: var(--text-2, #6b7280); font-size: .9rem; }
html[data-theme="dark"] .sc-loader-ring { background: conic-gradient(from 0deg, rgba(122, 167, 234, 0) 0deg, rgba(122, 167, 234, .3) 120deg, #5b8ad4 280deg, #a9c8f7 360deg); }
html[data-theme="dark"] .sc-loader-core { box-shadow: 0 6px 20px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .15); }
html[data-theme="dark"] .sc-loader-word { background-image: linear-gradient(90deg, #8fb3ea 0%, #8fb3ea 40%, #ffffff 50%, #8fb3ea 60%, #8fb3ea 100%); }
html[data-theme="dark"] .sc-loader-steps span { background: rgba(143, 179, 234, .22); }
@keyframes sc-fade { to { opacity: 1; } }
@keyframes sc-spin { to { transform: rotate(360deg); } }
@keyframes sc-hop {
  0%, 100% { transform: translateY(0) scale(1); }
  30% { transform: translateY(-7px) scale(1.06); }
  55% { transform: translateY(0) scale(1.06, .94); }
  70% { transform: translateY(0) scale(.98, 1.02); }
}
@keyframes sc-shine { from { background-position: 100% 0; } to { background-position: -150% 0; } }
@keyframes sc-step {
  0%, 100% { background: #cbd9ee; transform: none; }
  40% { background: #305996; transform: translateY(-3px); }
}
html[data-theme="dark"] .sc-loader-steps span { animation-name: sc-step-dark; }
@keyframes sc-step-dark {
  0%, 100% { background: rgba(143, 179, 234, .22); transform: none; }
  40% { background: #7aa7ea; transform: translateY(-3px); }
}
@media (prefers-reduced-motion: reduce) {
  .sc-loader { opacity: 1; animation: none; }
  .sc-loader-ring, .sc-loader-core i, .sc-loader-word, .sc-loader-steps span { animation: none; }
}