/* Phase 2: league chip, 🚀 boosts, Turbo look, league-up overlay, the Top tab's segmented control, league and squad
   lists, the squad page. Same app look: deep violet cards, gold numbers, 20-24 px radii. */

/* ---- league + level chip (replaces the plain level chip) ---- */
.tap-level[data-league="silver"] { background: linear-gradient(180deg, #c9d2e3, #8d98b3); color: #12152a; }
.tap-level[data-league="gold"] { background: linear-gradient(180deg, #ffd866, #e09200); color: #241500; }
.tap-level[data-league="platinum"] { background: linear-gradient(180deg, #8ff3ff, #2bb3c7); color: #04232a; }
.tap-level[data-league="diamond"] { background: linear-gradient(180deg, #c6b2ff, #6a3bf0); color: #fff; }
.tap-level[data-league="bronze"] { background: linear-gradient(180deg, #f2b07a, #b8692c); color: #2a1306; }
.tap-boost { width: 34px; padding: 0; }
.tap-boost.is-ready { color: #fff; background: linear-gradient(180deg, #8b5cff, #6a3bf0); box-shadow: 0 6px 18px -6px rgba(139, 92, 255, 0.9); }
.tap-boost.is-ready::after { display: none; }
@media (max-width: 420px) { .tap-top .tap-gift-label { display: none; } .tap-top .tap-gift { width: 34px; padding: 0; } }

/* ---- Turbo: flaming coin, countdown ring, label ---- */
.turbo-ring { position: absolute; inset: -6%; width: 112%; height: 112%; pointer-events: none; opacity: 0; transform: rotate(-90deg); transition: opacity 200ms; }
.turbo-ring circle { fill: none; stroke: #ff8a1f; stroke-width: 2.6; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--turbo-p, 1) * 100);
  filter: drop-shadow(0 0 6px rgba(255, 106, 0, 0.9)); transition: stroke-dashoffset 250ms linear; }
.turbo-label {
  position: absolute; left: 50%; bottom: -6px; z-index: 4; transform: translateX(-50%); padding: 4px 12px; border-radius: 999px; white-space: nowrap;
  font: 900 0.85rem/1 var(--display); color: #fff; background: linear-gradient(180deg, #ff8a1f, #d6281b); box-shadow: 0 6px 20px -6px rgba(255, 106, 0, 0.9);
}
.tap-stage[data-turbo="1"] .turbo-ring { opacity: 1; }
.tap-stage[data-turbo="1"] .tap-glow { background: radial-gradient(circle, rgba(255, 170, 60, 0.7) 0%, rgba(214, 40, 27, 0.35) 40%, transparent 66%); animation: turbo-flame 0.6s ease-in-out infinite; }
.tap-stage[data-turbo="1"] .tap-coin { filter: drop-shadow(0 22px 40px rgba(0, 0, 0, 0.55)) drop-shadow(0 0 40px rgba(255, 106, 0, 0.75)); }
@keyframes turbo-flame { 50% { transform: scale(1.06); opacity: 0.85; } }

/* ---- boosts sheet ---- */
.bs-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.bs-card { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px; border-radius: 18px;
  background: rgba(255, 255, 255, 0.05); box-shadow: inset 0 0 0 1px rgba(177, 140, 255, 0.2); }
.bs-card.is-used { opacity: 0.6; }
.bs-icon { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; font-size: 1.4rem; background: rgba(255, 138, 31, 0.15); }
.bs-text { display: grid; gap: 2px; min-width: 0; }
.bs-left { font-weight: 800; font-size: 0.78rem; color: var(--gold); }

/* ---- league-up celebration ---- */
.lg-up { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 24px; background: rgba(4, 3, 14, 0.75); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.lg-up[hidden] { display: none; }
.lg-up-card { display: grid; justify-items: center; gap: 10px; width: min(340px, 100%); padding: 26px 22px; border-radius: 26px; text-align: center;
  background: linear-gradient(180deg, #2a1f6b, #140e38); box-shadow: inset 0 0 0 1px rgba(255, 201, 64, 0.45), 0 30px 80px -20px rgba(0, 0, 0, 0.9);
  animation: lg-pop 420ms cubic-bezier(0.2, 0.9, 0.3, 1.3); }
.lg-up-badge { font-size: 4.5rem; line-height: 1; filter: drop-shadow(0 8px 24px rgba(255, 201, 64, 0.6)); }
.lg-up-card h2 { font-size: 1.5rem; }
.lg-up-card p { margin: 0; color: var(--mute); font-weight: 700; }
.lg-up-card .btn { min-width: 160px; min-height: 46px; }
@keyframes lg-pop { from { transform: scale(0.7); opacity: 0; } }

/* ---- Top tab: Haftalik | Ligam | Jamoalar ---- */
.top-seg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 4px; margin: 4px 0 12px; border-radius: 16px;
  background: rgba(255, 255, 255, 0.06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08); }
.top-seg button { min-height: 38px; border: 0; border-radius: 12px; cursor: pointer; font: 800 0.82rem/1 var(--font); color: var(--mute); background: none; }
.top-seg button[aria-selected="true"] { color: #fff; background: linear-gradient(180deg, #8b5cff, #6a3bf0); box-shadow: 0 6px 16px -8px rgba(139, 92, 255, 0.9); }
main.page-contest[data-seg="league"] > :not(.top-seg):not(#lg-view):not(.test-note),
main.page-contest[data-seg="squads"] > :not(.top-seg):not(#sq-view):not(.test-note) { display: none !important; }
main.page-contest[data-seg="week"] > #lg-view, main.page-contest[data-seg="week"] > #sq-view,
main.page-contest:not([data-seg]) > #lg-view, main.page-contest:not([data-seg]) > #sq-view { display: none; }
html.app main.page-contest .top-seg { order: -10; }

.g-card { display: grid; gap: 8px; padding: 16px; border-radius: 22px; background: linear-gradient(180deg, rgba(40, 30, 92, 0.72), rgba(20, 15, 50, 0.82));
  box-shadow: inset 0 0 0 1px rgba(177, 140, 255, 0.18); }
.g-head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: center; }
.g-badge { font-size: 2.6rem; line-height: 1; }
.g-big { font: 900 1.6rem/1.1 var(--display); color: #fff; }
.g-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.g-pills button { padding: 6px 10px; border: 0; border-radius: 999px; cursor: pointer; font: 800 0.75rem/1 var(--font); color: var(--mute); background: rgba(255, 255, 255, 0.06); }
.g-pills button[aria-pressed="true"] { color: #fff; background: rgba(139, 92, 255, 0.35); }
.g-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.g-row { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 12px; border-radius: 14px; background: rgba(255, 255, 255, 0.04); }
.g-row.is-me { box-shadow: inset 0 0 0 1px rgba(255, 201, 64, 0.55); background: rgba(255, 201, 64, 0.07); }
.g-rank { font: 900 0.95rem/1 var(--display); color: var(--mute); text-align: center; }
.g-row:nth-child(1) .g-rank { color: #ffd866; } .g-row:nth-child(2) .g-rank { color: #c9d2e3; } .g-row:nth-child(3) .g-rank { color: #f2b07a; }
.g-name { font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-sub { font-size: 0.72rem; color: var(--mute); }
.g-num { font: 900 0.95rem/1 var(--display); color: var(--gold); white-space: nowrap; }
.g-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.g-form { display: flex; gap: 8px; }
.g-form input { flex: 1; min-width: 0; }
.g-note { font-size: 0.75rem; color: var(--mute); margin: 0; }
