/* Final catalogue polish. Loaded after the legacy bundle to keep the card UI cohesive. */

.simulator-international-section,
.simulator-club-section {
  padding: 4px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.simulator-catalog-section > h2 {
  margin-bottom: 10px;
  font-size: 22px;
  line-height: 1.12;
}

.simulator-group-stack,
.simulator-mode-card.simulator-mode-card-club-hub {
  gap: 11px;
}

.simulator-mode-card.simulator-mode-card-club-hub {
  min-height: 0 !important;
  padding: 10px;
  border: 1px solid rgba(199, 239, 255, .14);
  border-radius: 14px;
  background: rgba(2, 70, 98, .18);
  box-shadow: none;
}

.simulator-catalog-group > h3 {
  margin-bottom: 5px;
  color: rgba(225, 247, 255, .82);
  font-size: 10px;
  letter-spacing: .01em;
}

.simulator-world-cup-grid { gap: 8px; }
.simulator-euros-grid,
.simulator-domestic-grid,
.simulator-uefa-grid { gap: 8px; }
.simulator-international-choices { gap: 8px; }

@media (min-width: 900px) {
  .simulator-world-cup-grid,
  .simulator-euros-grid,
  .simulator-domestic-grid,
  .simulator-uefa-grid,
  .simulator-international-choices {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1200px) {
  .simulator-world-cup-grid,
  .simulator-euros-grid,
  .simulator-domestic-grid,
  .simulator-uefa-grid,
  .simulator-international-choices,
  .simulator-more-grid,
  .simulator-coming-soon {
    grid-template-columns: repeat(4, minmax(0, 230px));
    justify-content: start;
  }
}

.simulator-choice-grid > .simulator-visual-card,
.simulator-international-choices > .simulator-visual-card {
  grid-template-columns: 40px minmax(0, 1fr) 14px;
  grid-template-rows: auto auto;
  min-height: 78px;
  align-content: center;
  align-items: center;
  justify-items: stretch;
  column-gap: 7px;
  row-gap: 2px;
  padding: 8px 10px;
  border-color: rgba(221, 247, 255, .27);
  border-radius: 12px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .08), 0 10px 22px rgba(0, 43, 61, .12);
  transition: transform 180ms cubic-bezier(.23, 1, .32, 1), border-color 160ms ease, box-shadow 180ms ease;
}

.simulator-choice-grid > .simulator-visual-card::before,
.simulator-international-choices > .simulator-visual-card::before {
  z-index: 0;
  inset: -8px;
  background:
    radial-gradient(circle at 78% 18%, rgba(255, 255, 255, .12), transparent 32%),
    linear-gradient(180deg, rgba(0, 24, 36, .01) 10%, rgba(0, 29, 43, .7) 100%);
  transform: translate3d(0, 0, 0) scale(1);
  transition: transform 240ms cubic-bezier(.23, 1, .32, 1), opacity 180ms ease;
}

.simulator-visual-card > img {
  position: relative;
  z-index: 1;
  top: auto;
  right: auto;
  display: block;
  width: 40px;
  height: 40px;
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: center;
  justify-self: center;
  margin: 0;
  padding: 4px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 10px;
  background: rgba(2, 35, 52, .22);
  object-fit: contain;
  opacity: 1;
  filter: drop-shadow(0 7px 12px rgba(0, 24, 36, .2));
  transform: translate3d(0, 0, 0) scale(1);
  transition: transform 220ms cubic-bezier(.23, 1, .32, 1), background-color 160ms ease;
}

.simulator-card-ligue-1 > img,
.simulator-card-super-lig > img {
  filter: brightness(0) invert(1) drop-shadow(0 7px 12px rgba(0, 24, 36, .2));
}

.simulator-visual-card > strong {
  position: relative;
  z-index: 1;
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  max-width: 100%;
  color: #fff;
  font: 850 clamp(12px, .95vw, 13.5px)/1.12 "Manrope", sans-serif;
  letter-spacing: -.035em;
}

.simulator-visual-card > small {
  position: relative;
  z-index: 1;
  display: block;
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  overflow: hidden;
  color: rgba(229, 248, 255, .7);
  font: 650 8.5px/1.2 "Manrope", sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.simulator-choice-grid > .simulator-visual-card > .simulator-card-chevron,
.simulator-international-choices > .simulator-visual-card > .simulator-card-chevron {
  position: relative;
  z-index: 1;
  display: grid;
  width: 14px;
  min-height: 0;
  height: 20px;
  grid-column: 3;
  grid-row: 1 / 3;
  align-self: center;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  opacity: .62;
  color: #fff;
  background: transparent;
  font: 800 15px/1 "Manrope", sans-serif;
  transform: translate3d(-2px, 0, 0);
  transition: transform 170ms cubic-bezier(.23, 1, .32, 1), opacity 150ms ease;
}

.simulator-world-cup-grid > .simulator-visual-card {
  min-height: 88px;
  border-color: rgba(229, 249, 255, .34);
  box-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 13px 27px rgba(0, 35, 52, .19);
}

.simulator-world-cup-grid .simulator-visual-card > img {
  width: 44px;
  height: 44px;
  padding: 5px;
  border-radius: 11px;
  background: rgba(2, 27, 42, .3);
}

.simulator-world-cup-grid .simulator-visual-card > strong {
  font-size: clamp(12.5px, 1vw, 14px);
}

.simulator-euros-grid > .simulator-visual-card,
.simulator-international-choices > .simulator-visual-card { min-height: 76px; }
.simulator-domestic-grid > .simulator-visual-card { min-height: 78px; }
.simulator-uefa-grid > .simulator-visual-card { min-height: 80px; }

.simulator-international-choices {
  grid-auto-rows: 76px;
}

.simulator-more-grid > button.simulator-mode-card {
  width: 100%;
  min-width: 0;
  min-height: 84px;
  align-items: flex-start;
  padding: 11px 38px 11px 12px;
  border-color: rgba(199, 239, 255, .24);
  color: #fff;
  text-align: left;
  cursor: pointer;
}

.simulator-more-grid > button.simulator-mode-card .simulator-mode-copy {
  max-width: 100%;
}

.simulator-more-grid > button.simulator-mode-card .simulator-mode-mark {
  width: 40px;
  height: 40px;
}

.simulator-more-grid > button.simulator-mode-card .simulator-mode-copy h3 {
  font-size: 15px;
  line-height: 1.12;
}

.simulator-more-grid > button.simulator-mode-card .simulator-mode-copy p {
  margin-top: 3px;
  font-size: 9.5px;
  line-height: 1.3;
}

.simulator-more-grid > button.simulator-mode-card .simulator-card-chevron {
  position: absolute;
  z-index: 2;
  right: 13px;
  bottom: 13px;
  opacity: .62;
  color: #fff;
  font: 800 16px/1 "Manrope", sans-serif;
  transform: translate3d(-2px, 0, 0);
  transition: transform 170ms cubic-bezier(.23, 1, .32, 1), opacity 150ms ease;
}

.simulator-coming-soon {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 8px;
}

.simulator-coming-soon > .simulator-coming-soon-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 48px;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px dashed rgba(199, 239, 255, .28);
  border-radius: 11px;
  color: #fff;
  text-align: left;
  background: linear-gradient(145deg, rgba(8, 126, 167, .42), rgba(3, 75, 105, .48));
  box-shadow: inset 0 1px rgba(255, 255, 255, .06);
  cursor: not-allowed;
  opacity: 1;
}

.simulator-coming-soon > .simulator-community-builder-card {
  border-style: solid;
  border-color: rgba(124, 175, 255, .55);
  background: linear-gradient(145deg, rgba(40, 91, 179, .68), rgba(26, 54, 112, .72));
  cursor: pointer;
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  .simulator-coming-soon > .simulator-community-builder-card:hover {
    border-color: rgba(202, 222, 255, .86);
    transform: translateY(-1px);
  }
}

.simulator-coming-soon > .simulator-coming-soon-card > strong {
  overflow: hidden;
  font: 800 11px/1.15 "Manrope", sans-serif;
  letter-spacing: -.025em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.simulator-coming-soon > .simulator-coming-soon-card > span {
  display: block;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: rgba(220, 246, 255, .68);
  background: transparent;
  font: 700 8.5px/1.2 "Manrope", sans-serif;
  white-space: nowrap;
}

@media (hover: hover) and (pointer: fine) {
  .simulator-choice-grid > .simulator-visual-card:hover,
  .simulator-international-choices > .simulator-visual-card:hover {
    border-color: rgba(238, 252, 255, .66);
    box-shadow: inset 0 1px rgba(255, 255, 255, .16), 0 19px 35px rgba(0, 34, 50, .28), 0 0 24px rgba(76, 201, 240, .09);
    transform: translate3d(0, -3px, 0);
  }

  .simulator-choice-grid > .simulator-visual-card:hover::before,
  .simulator-international-choices > .simulator-visual-card:hover::before {
    opacity: .92;
    transform: translate3d(-3px, 2px, 0) scale(1.045);
  }

  .simulator-visual-card:hover > img {
    background: rgba(2, 35, 52, .34);
    transform: translate3d(0, -1px, 0) scale(1.055);
  }

  .simulator-visual-card:hover > .simulator-card-chevron,
  .simulator-more-grid > button.simulator-mode-card:hover .simulator-card-chevron {
    opacity: 1;
    transform: translate3d(3px, 0, 0);
  }
}

@media (max-width: 700px) {
  .simulator-international-section,
  .simulator-club-section { padding: 2px 0; }

  .simulator-catalog-section > h2 {
    margin-bottom: 8px;
    font-size: 20px;
  }

  .simulator-mode-card.simulator-mode-card-club-hub {
    padding: 8px;
    border-radius: 12px;
  }

  .simulator-choice-grid > .simulator-visual-card,
  .simulator-international-choices > .simulator-visual-card {
    grid-template-columns: 36px minmax(0, 1fr) 12px;
    min-height: 74px;
    column-gap: 6px;
    padding: 7px 8px;
  }

  .simulator-world-cup-grid > .simulator-visual-card { min-height: 82px; }

  .simulator-international-choices {
    grid-auto-rows: 74px;
  }

  .simulator-visual-card > img,
  .simulator-world-cup-grid .simulator-visual-card > img {
    width: 36px;
    height: 36px;
    padding: 3px;
    border-radius: 9px;
  }

  .simulator-visual-card > strong,
  .simulator-world-cup-grid .simulator-visual-card > strong { font-size: 11.5px; }
  .simulator-visual-card > small { font-size: 7.75px; }

  .simulator-choice-grid > .simulator-visual-card > .simulator-card-chevron,
  .simulator-international-choices > .simulator-visual-card > .simulator-card-chevron {
    width: 12px;
    font-size: 14px;
  }

  .simulator-more-grid > button.simulator-mode-card {
    min-height: 70px;
    padding: 9px 30px 9px 9px;
  }

  .simulator-more-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .simulator-more-grid > button.simulator-mode-card .simulator-mode-mark {
    width: 34px;
    height: 34px;
  }

  .simulator-more-grid > button.simulator-mode-card .simulator-mode-copy h3 {
    font-size: 12.5px;
  }

  .simulator-more-grid > button.simulator-mode-card .simulator-mode-copy p {
    display: none;
  }

  .simulator-coming-soon {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .simulator-coming-soon > .simulator-coming-soon-card {
    grid-template-columns: minmax(0, 1fr);
    min-height: 52px;
    gap: 3px;
    padding: 7px 9px;
  }
}

@media (min-width: 1200px) {
  .simulator-coming-soon {
    grid-template-columns: repeat(4, minmax(0, 230px));
    justify-content: start;
  }
}

/* Game-launcher refinement: airy tiles, restrained chrome and clearer competition hierarchy. */
body.before-start:not([data-desktop-mode-setup]) .simulator-catalog {
  gap: 34px;
}

.simulator-catalog-section > h2 {
  margin-bottom: 16px;
}

.simulator-group-stack,
.simulator-mode-card.simulator-mode-card-club-hub {
  gap: 23px;
}

.simulator-catalog-group > h3 {
  margin-bottom: 10px;
  font-size: 11px;
}

.simulator-mode-card.simulator-mode-card-club-hub {
  overflow: visible;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.simulator-world-cup-grid,
.simulator-euros-grid,
.simulator-domestic-grid,
.simulator-uefa-grid,
.simulator-international-choices {
  gap: 12px;
}

.simulator-international-choices {
  grid-auto-rows: auto;
}

.simulator-choice-grid > .simulator-visual-card,
.simulator-international-choices > .simulator-visual-card {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 54px auto auto;
  min-height: 120px;
  align-content: end;
  align-items: end;
  justify-items: start;
  column-gap: 0;
  row-gap: 5px;
  padding: 14px;
  border-color: rgba(220, 247, 255, .16);
  border-radius: 15px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .07), 0 10px 24px rgba(0, 36, 52, .14);
  transition: transform 190ms cubic-bezier(.23, 1, .32, 1), border-color 170ms ease, box-shadow 190ms ease;
}

.simulator-choice-grid > .simulator-visual-card::before,
.simulator-international-choices > .simulator-visual-card::before {
  inset: -12px;
  background:
    radial-gradient(circle at 78% 13%, rgba(255, 255, 255, .11), transparent 34%),
    linear-gradient(180deg, rgba(0, 24, 36, .02) 0%, rgba(0, 29, 43, .68) 100%);
}

.simulator-domestic-grid > .simulator-visual-card::after {
  position: absolute;
  z-index: 0;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(4, 94, 119, .08), rgba(0, 48, 65, .24));
  content: "";
  pointer-events: none;
}

.simulator-visual-card > img,
.simulator-world-cup-grid .simulator-visual-card > img {
  position: relative;
  z-index: 1;
  width: 56px;
  height: 56px;
  grid-column: 1;
  grid-row: 1;
  align-self: end;
  justify-self: start;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  filter: drop-shadow(0 8px 14px rgba(0, 24, 36, .28));
}

.simulator-card-ligue-1 > img,
.simulator-card-super-lig > img {
  filter: brightness(0) invert(1) drop-shadow(0 8px 14px rgba(0, 24, 36, .28));
}

.simulator-visual-card > strong,
.simulator-world-cup-grid .simulator-visual-card > strong {
  grid-column: 1;
  grid-row: 2;
  align-self: end;
  font-size: 14px;
  line-height: 1.12;
}

.simulator-visual-card > small {
  grid-column: 1;
  grid-row: 3;
  align-self: start;
  font-size: 9px;
  line-height: 1.25;
}

.simulator-choice-grid > .simulator-visual-card > .simulator-card-chevron,
.simulator-international-choices > .simulator-visual-card > .simulator-card-chevron {
  position: absolute;
  z-index: 2;
  right: 13px;
  bottom: 13px;
  width: auto;
  height: auto;
  min-height: 0;
  grid-column: auto;
  grid-row: auto;
  opacity: 0;
  font-size: 16px;
  pointer-events: none;
  transform: translate3d(-4px, 0, 0);
}

.simulator-world-cup-grid > .simulator-visual-card {
  min-height: 140px;
  grid-template-rows: 66px auto auto;
  padding: 15px;
  border-color: rgba(231, 250, 255, .27);
  box-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 16px 31px rgba(0, 31, 46, .22);
}

.simulator-world-cup-grid .simulator-visual-card > img {
  width: 66px;
  height: 66px;
}

.simulator-world-cup-grid .simulator-visual-card > strong {
  font-size: 15px;
}

.simulator-euros-grid > .simulator-visual-card,
.simulator-international-choices > .simulator-visual-card,
.simulator-uefa-grid > .simulator-visual-card {
  min-height: 126px;
}

.simulator-domestic-grid > .simulator-visual-card {
  min-height: 122px;
}

.simulator-more-grid > button.simulator-mode-card {
  min-height: 98px;
  padding: 14px 40px 14px 14px;
  border-color: rgba(220, 247, 255, .17);
  box-shadow: inset 0 1px rgba(255, 255, 255, .07), 0 10px 24px rgba(0, 36, 52, .14);
}

.simulator-more-grid > button.simulator-mode-card .simulator-mode-mark {
  width: 46px;
  height: 46px;
}

.simulator-more-grid > button.simulator-mode-card .simulator-mode-copy h3 {
  font-size: 16px;
}

.simulator-more-grid > button.simulator-mode-card .simulator-mode-copy p {
  display: block;
  margin-top: 5px;
  font-size: 10px;
  line-height: 1.35;
}

.simulator-more-grid > button.simulator-mode-card .simulator-card-chevron {
  opacity: 0;
}

.simulator-visual-card:focus-visible > .simulator-card-chevron,
.simulator-more-grid > button.simulator-mode-card:focus-visible .simulator-card-chevron {
  opacity: .68;
  transform: translate3d(0, 0, 0);
}

@media (min-width: 900px) {
  .simulator-world-cup-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .simulator-euros-grid,
  .simulator-domestic-grid,
  .simulator-uefa-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .simulator-international-choices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .simulator-more-grid,
  .simulator-coming-soon {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (hover: hover) and (pointer: fine) {
  .simulator-choice-grid > .simulator-visual-card:hover,
  .simulator-international-choices > .simulator-visual-card:hover,
  .simulator-more-grid > button.simulator-mode-card:hover {
    border-color: rgba(234, 251, 255, .38);
    box-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 18px 34px rgba(0, 33, 49, .25), 0 0 22px rgba(92, 205, 239, .08);
    transform: translate3d(0, -4px, 0);
  }

  .simulator-choice-grid > .simulator-visual-card:hover::before,
  .simulator-international-choices > .simulator-visual-card:hover::before {
    opacity: .96;
    transform: translate3d(-3px, 2px, 0) scale(1.035);
  }

  .simulator-visual-card:hover > img {
    background: transparent;
    transform: translate3d(1px, -2px, 0) scale(1.045);
  }

  .simulator-visual-card:hover > .simulator-card-chevron,
  .simulator-more-grid > button.simulator-mode-card:hover .simulator-card-chevron {
    opacity: .72;
    transform: translate3d(0, 0, 0);
  }
}

@media (max-width: 700px) {
  body.before-start:not([data-desktop-mode-setup]) .simulator-catalog {
    gap: 27px;
  }

  .simulator-catalog-section > h2 {
    margin-bottom: 12px;
  }

  .simulator-group-stack,
  .simulator-mode-card.simulator-mode-card-club-hub {
    gap: 18px;
  }

  .simulator-catalog-group > h3 {
    margin-bottom: 8px;
  }

  .simulator-world-cup-grid,
  .simulator-euros-grid,
  .simulator-domestic-grid,
  .simulator-uefa-grid,
  .simulator-international-choices {
    gap: 9px;
  }

  .simulator-choice-grid > .simulator-visual-card,
  .simulator-international-choices > .simulator-visual-card {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 44px auto auto;
    min-height: 112px;
    row-gap: 4px;
    padding: 11px;
  }

  .simulator-visual-card > img,
  .simulator-world-cup-grid .simulator-visual-card > img {
    width: 46px;
    height: 46px;
    padding: 0;
    border-radius: 0;
  }

  .simulator-visual-card > strong,
  .simulator-world-cup-grid .simulator-visual-card > strong {
    font-size: 12px;
  }

  .simulator-visual-card > small {
    font-size: 8px;
  }

  .simulator-world-cup-grid > .simulator-visual-card {
    min-height: 126px;
    grid-template-rows: 54px auto auto;
    padding: 12px;
  }

  .simulator-world-cup-grid .simulator-visual-card > img {
    width: 56px;
    height: 56px;
  }

  .simulator-euros-grid > .simulator-visual-card,
  .simulator-international-choices > .simulator-visual-card,
  .simulator-uefa-grid > .simulator-visual-card,
  .simulator-domestic-grid > .simulator-visual-card {
    min-height: 112px;
  }

  .simulator-international-choices {
    grid-auto-rows: auto;
  }

  .simulator-more-grid > button.simulator-mode-card {
    min-height: 88px;
    padding: 11px 32px 11px 11px;
  }

  .simulator-more-grid > button.simulator-mode-card .simulator-mode-mark {
    width: 38px;
    height: 38px;
  }

  .simulator-more-grid > button.simulator-mode-card .simulator-mode-copy h3 {
    font-size: 13px;
  }

  .simulator-more-grid > button.simulator-mode-card .simulator-mode-copy p {
    display: none;
  }
}

/* Square competition launcher */
.simulator-catalog-group > h3 {
  margin: 0 0 11px;
  color: rgba(240, 252, 255, .96);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .01em;
  text-transform: none;
}

.simulator-choice-grid,
.simulator-international-choices {
  justify-content: start;
  align-items: start;
}

.simulator-choice-grid > .simulator-visual-card,
.simulator-international-choices > .simulator-visual-card,
.simulator-world-cup-grid > .simulator-visual-card,
.simulator-euros-grid > .simulator-visual-card,
.simulator-domestic-grid > .simulator-visual-card,
.simulator-uefa-grid > .simulator-visual-card {
  width: 100%;
  aspect-ratio: 1;
  min-height: 0;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  place-content: center;
  place-items: center;
  row-gap: 10px;
  padding: 16px;
  text-align: center;
}

.simulator-visual-card > img,
.simulator-world-cup-grid .simulator-visual-card > img {
  position: relative;
  z-index: 1;
  width: 76px;
  height: 76px;
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  justify-self: center;
  object-fit: contain;
}

.simulator-world-cup-grid .simulator-visual-card > img {
  width: 84px;
  height: 84px;
}

.simulator-domestic-grid .simulator-visual-card > img {
  width: 88px;
  height: 88px;
  grid-row: 1 / -1;
}

.simulator-visual-card > strong,
.simulator-world-cup-grid .simulator-visual-card > strong {
  position: relative;
  z-index: 1;
  grid-column: 1;
  grid-row: 2;
  align-self: center;
  justify-self: center;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.1;
  text-align: center;
}

.simulator-uefa-grid .simulator-visual-card > strong {
  max-width: 120px;
  font-size: 12px;
  line-height: 1.2;
}

.simulator-visual-card > small,
.simulator-visual-card > .simulator-card-chevron {
  display: none;
}

.simulator-international-secondary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 170px));
  gap: 24px;
  align-items: start;
}

.simulator-international-secondary .simulator-international-choices {
  grid-template-columns: minmax(0, 170px);
}

@media (min-width: 900px) {
  .simulator-world-cup-grid {
    grid-template-columns: repeat(4, minmax(0, 170px));
  }

  .simulator-euros-grid,
  .simulator-domestic-grid,
  .simulator-uefa-grid {
    grid-template-columns: repeat(3, minmax(0, 170px));
  }
}

@media (min-width: 701px) and (max-width: 899px) {
  .simulator-world-cup-grid,
  .simulator-euros-grid,
  .simulator-domestic-grid,
  .simulator-uefa-grid {
    grid-template-columns: repeat(3, minmax(0, 160px));
  }

  .simulator-international-secondary {
    grid-template-columns: repeat(2, minmax(0, 160px));
  }

  .simulator-international-secondary .simulator-international-choices {
    grid-template-columns: minmax(0, 160px);
  }
}

@media (max-width: 700px) {
  .simulator-world-cup-grid,
  .simulator-euros-grid,
  .simulator-domestic-grid,
  .simulator-uefa-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .simulator-international-secondary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .simulator-international-secondary .simulator-international-choices {
    grid-template-columns: minmax(0, 1fr);
  }

  .simulator-choice-grid > .simulator-visual-card,
  .simulator-international-choices > .simulator-visual-card,
  .simulator-world-cup-grid > .simulator-visual-card,
  .simulator-euros-grid > .simulator-visual-card,
  .simulator-domestic-grid > .simulator-visual-card,
  .simulator-uefa-grid > .simulator-visual-card {
    min-height: 0;
    grid-template-rows: auto auto;
    row-gap: 8px;
    padding: 12px;
  }

  .simulator-visual-card > img,
  .simulator-world-cup-grid .simulator-visual-card > img {
    width: 66px;
    height: 66px;
  }

  .simulator-world-cup-grid .simulator-visual-card > img,
  .simulator-domestic-grid .simulator-visual-card > img {
    width: 72px;
    height: 72px;
  }

  .simulator-visual-card > strong,
  .simulator-world-cup-grid .simulator-visual-card > strong {
    font-size: 13px;
  }

  .simulator-uefa-grid .simulator-visual-card > strong {
    font-size: 11px;
  }
}

/* Premium competition folders and archive view. */
.competition-folder-home {
  display: grid;
  gap: 32px;
  transition: opacity 180ms ease, filter 180ms ease, transform 220ms cubic-bezier(.23, 1, .32, 1);
}

.competition-folder-home .simulator-catalog-section > h2 {
  margin-bottom: 16px;
  font-size: clamp(22px, 2vw, 25px);
  letter-spacing: -.035em;
}

.competition-folder-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.competition-folder-card {
  --folder-glow: rgba(114, 222, 255, .25);
  position: relative;
  isolation: isolate;
  display: grid;
  min-width: 0;
  min-height: 122px;
  grid-template-columns: 64px minmax(0, 1fr);
  grid-template-rows: 1fr;
  align-items: center;
  gap: 10px;
  overflow: hidden;
  padding: 12px 13px;
  border: 1px solid rgba(208, 244, 255, .24);
  border-radius: 20px;
  color: #fff;
  text-align: left;
  background:
    radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 34%),
    linear-gradient(145deg, rgba(7, 115, 151, .92), rgba(3, 67, 93, .97));
  box-shadow: inset 0 1px rgba(255, 255, 255, .11), inset 0 -1px rgba(0, 24, 38, .16), 0 14px 30px rgba(0, 34, 50, .2);
  cursor: pointer;
  transform: translate3d(0, 0, 0);
  transition: transform 180ms cubic-bezier(.23, 1, .32, 1), border-color 160ms ease, box-shadow 180ms ease;
}

.competition-folder-card::before,
.competition-folder-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
}

.competition-folder-card::before {
  inset: -18%;
  background:
    linear-gradient(118deg, transparent 18%, rgba(255, 255, 255, .1) 43%, transparent 64%),
    radial-gradient(circle at 14% 104%, rgba(43, 204, 239, .2), transparent 44%);
  opacity: .78;
  transform: translate3d(-4px, 3px, 0) scale(1);
  transition: opacity 180ms ease, transform 240ms cubic-bezier(.23, 1, .32, 1);
}

.competition-folder-card::after {
  top: 0;
  right: 18px;
  left: 18px;
  width: auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .34), transparent);
  opacity: .9;
}

.competition-folder-card-featured {
  border-color: rgba(222, 249, 255, .4);
  box-shadow: inset 0 1px rgba(255, 255, 255, .16), inset 0 -1px rgba(0, 22, 43, .18), 0 20px 42px rgba(0, 31, 49, .28), 0 0 34px rgba(49, 191, 234, .09);
}

.competition-folder-art {
  position: relative;
  z-index: 1;
  display: grid;
  width: 64px;
  height: 64px;
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  place-items: center;
  padding: 4px;
  border: 1px solid rgba(226, 249, 255, .13);
  border-radius: 14px;
  background: radial-gradient(circle at 32% 22%, rgba(255, 255, 255, .16), transparent 46%), linear-gradient(145deg, rgba(255, 255, 255, .1), rgba(0, 33, 51, .24));
  box-shadow: inset 0 1px rgba(255, 255, 255, .13), 0 10px 24px rgba(0, 24, 38, .13);
  transform: translate3d(0, 0, 0) scale(1);
  transition: transform 220ms cubic-bezier(.23, 1, .32, 1);
}

.competition-folder-art img {
  display: block;
  width: 58px;
  height: 58px;
  object-fit: contain;
  filter: drop-shadow(0 10px 14px rgba(0, 24, 38, .25));
}

.competition-folder-ligue-1 .competition-folder-art img,
.competition-folder-super-lig .competition-folder-art img {
  filter: brightness(0) invert(1) drop-shadow(0 10px 14px rgba(0, 24, 38, .25));
}

.competition-folder-copy {
  position: relative;
  z-index: 1;
  display: grid;
  grid-column: 2;
  grid-row: 1;
  gap: 5px;
  min-width: 0;
  align-self: center;
}

.competition-folder-copy strong {
  display: block;
  min-width: 0;
  overflow: visible;
  color: #fff;
  font: 850 clamp(14px, 1.12vw, 17px)/1.08 "Manrope", sans-serif;
  letter-spacing: -.035em;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

.competition-folder-copy small {
  color: rgba(226, 248, 255, .68);
  font: 700 10px/1.2 "Manrope", sans-serif;
}

.competition-folder-grid-competitions .competition-folder-card {
  border-color: rgba(226, 249, 255, .32);
  box-shadow: inset 0 1px rgba(255, 255, 255, .14), inset 0 -1px rgba(0, 25, 47, .17), 0 18px 36px rgba(0, 31, 49, .24), 0 0 30px rgba(63, 202, 239, .07);
}

.competition-folder-grid-competitions .competition-folder-art {
  border-color: rgba(235, 252, 255, .2);
  background: radial-gradient(circle at 32% 22%, rgba(255, 255, 255, .23), transparent 46%), linear-gradient(145deg, rgba(255, 255, 255, .14), rgba(0, 33, 51, .22));
}

.competition-folder-grid-competitions .competition-folder-copy small {
  color: rgba(235, 251, 255, .8);
}

.competition-folder-grid-leagues .competition-folder-card {
  border-color: rgba(207, 242, 252, .16);
  box-shadow: inset 0 1px rgba(255, 255, 255, .09), inset 0 -1px rgba(0, 23, 36, .18), 0 12px 25px rgba(0, 31, 46, .17);
}

.competition-folder-grid-leagues .competition-folder-copy small {
  color: rgba(221, 244, 250, .6);
}

.competition-folder-belgian .competition-folder-copy strong,
.competition-folder-ucl .competition-folder-copy strong,
.competition-folder-conference .competition-folder-copy strong,
.competition-folder-championship .competition-folder-copy strong {
  font-size: clamp(13px, 1vw, 15px);
  line-height: 1.06;
}

.competition-folder-hint {
  position: absolute;
  z-index: 2;
  top: 16px;
  right: 14px;
  left: auto;
  color: rgba(232, 249, 255, .62);
  font: 750 9px/1 "Manrope", sans-serif;
  letter-spacing: .03em;
  opacity: 0;
  transform: translate3d(-5px, 0, 0);
  transition: opacity 150ms ease, transform 170ms cubic-bezier(.23, 1, .32, 1);
}

.competition-folder-wc { --folder-glow: rgba(58, 255, 218, .28); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 34%), linear-gradient(145deg, #0b55d3, #063b94 58%, #05245d); }
.competition-folder-euros { --folder-glow: rgba(255, 82, 154, .25); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 34%), linear-gradient(145deg, #174ab6, #132d80 62%, #0a1948); }
.competition-folder-copa { --folder-glow: rgba(120, 194, 255, .28); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 34%), linear-gradient(145deg, #1262aa, #08477e 62%, #062b53); }
.competition-folder-afcon { --folder-glow: rgba(0, 222, 105, .24); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #7a2433, #4a1522 62%, #260a12); }
.competition-folder-premier-league { --folder-glow: rgba(191, 145, 212, .16); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #4c315f, #2f1e43 64%, #1a1027); }
.competition-folder-la-liga { --folder-glow: rgba(219, 176, 94, .14); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #7e3447, #5c2637 65%, #371722); }
.competition-folder-la-liga-2 { --folder-glow: rgba(0, 221, 229, .28); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #0b91a8, #08667f 65%, #063b54); }
.competition-folder-serie-a { --folder-glow: rgba(102, 164, 199, .16); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #285b7a, #1a3f5b 64%, #10283b); }
.competition-folder-serie-b { --folder-glow: rgba(148, 233, 185, .28); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 38%), linear-gradient(145deg, #57a978, #347a56 60%, #1c5038); }
.competition-folder-bundesliga { --folder-glow: rgba(215, 159, 163, .14); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #7d3038, #582129 64%, #35141b); }
.competition-folder-ligue-1 { --folder-glow: rgba(183, 207, 107, .14); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #2b456f, #1d304f 64%, #111e32); }
.competition-folder-championship { --folder-glow: rgba(194, 159, 52, .23); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #17287d, #0c1856 64%, #060c32); }
.competition-folder-super-lig { --folder-glow: rgba(216, 116, 255, .24); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #6f3078, #472052 64%, #28122f); }
.competition-folder-eredivisie { --folder-glow: rgba(255, 49, 95, .24); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #342b82, #211a63 64%, #120c4a); }
.competition-folder-belgian { --folder-glow: rgba(255, 23, 79, .27); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #510e25, #2e0817 64%, #16030b); }
.competition-folder-liga-portugal { --folder-glow: rgba(127, 176, 255, .24); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #0b3777, #06265a 64%, #031b40); }
.competition-folder-saudi-pro-league { --folder-glow: rgba(148, 233, 185, .24); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #086842, #005430 62%, #001d12); }
.competition-folder-mls { --folder-glow: rgba(255, 116, 121, .27); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #e2232a, #a81019 62%, #001735); }
.competition-folder-ucl { --folder-glow: rgba(119, 153, 204, .2); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #2a3f70, #1b2d54 64%, #101b34); box-shadow: inset 0 1px rgba(255, 255, 255, .12), inset 0 -1px rgba(0, 17, 39, .22), 0 16px 32px rgba(0, 27, 51, .21); }
.competition-folder-europa { --folder-glow: rgba(209, 135, 77, .16); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #38312d, #25211f 64%, #151312); }
.competition-folder-conference { --folder-glow: rgba(108, 194, 165, .16); background: radial-gradient(circle at 83% 16%, var(--folder-glow), transparent 36%), linear-gradient(145deg, #246352, #17483d 64%, #0d2c26); }

.competition-folder-serie-b .competition-folder-copy strong {
  color: #f6fff9;
}

.competition-folder-grid-leagues .competition-folder-serie-b .competition-folder-copy small,
.competition-folder-serie-b .competition-folder-hint {
  color: rgba(232, 255, 242, .68);
}

.competition-folder-serie-b .competition-folder-art {
  border-color: rgba(201, 246, 220, .28);
  background: rgba(232, 255, 242, .14);
  box-shadow: inset 0 1px rgba(255, 255, 255, .2), 0 10px 24px rgba(0, 43, 25, .2);
}

.competition-folder-afcon .competition-folder-art img {
  transform: scale(1.06);
}

.competition-folder-belgian .competition-folder-art img,
.competition-folder-conference .competition-folder-art img {
  max-width: 64px;
  max-height: 64px;
}

.competition-folder-liga-portugal .competition-folder-art {
  box-sizing: border-box;
  padding: 2px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
}

.competition-folder-liga-portugal .competition-folder-art img {
  width: 42px;
  height: 50px;
  object-fit: contain;
  transform: translate3d(0, -1px, 0);
  filter: brightness(0) invert(1) drop-shadow(0 7px 10px rgba(0, 26, 39, .32));
}

.edition-liga-portugal .competition-edition-art {
  box-sizing: border-box;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  transform: translate3d(0, -4px, 0);
}

.edition-liga-portugal .competition-edition-art img {
  width: 31px;
  height: 40px;
  object-fit: contain;
  filter: brightness(0) invert(1) drop-shadow(0 7px 10px rgba(0, 26, 39, .32));
}

.competition-folder-saudi-pro-league .competition-folder-art,
.edition-saudi-pro-league .competition-edition-art {
  box-sizing: border-box;
  padding: 2px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
}

.competition-folder-saudi-pro-league .competition-folder-art img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  content: url("./assets/saudi-pro-league-2026-27/saudi-pro-league-logo-white.png");
  filter: drop-shadow(0 8px 12px rgba(0, 24, 14, .42));
}

.edition-saudi-pro-league .competition-edition-art {
  width: 46px;
  height: 46px;
  transform: translate3d(0, -2px, 0);
}

.edition-saudi-pro-league .competition-edition-art img {
  width: 44px;
  height: 44px;
  object-fit: contain;
  content: url("./assets/saudi-pro-league-2026-27/saudi-pro-league-logo-white.png");
  filter: drop-shadow(0 7px 10px rgba(0, 24, 14, .4));
}

.competition-folder-mls .competition-folder-art,
.edition-mls .competition-edition-art {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.competition-folder-mls .competition-folder-art img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  filter: drop-shadow(0 7px 10px rgba(0, 23, 53, .28));
}

.edition-mls .competition-edition-art {
  width: 48px;
  height: 48px;
  transform: translate3d(0, -2px, 0);
}

.edition-mls .competition-edition-art img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  filter: drop-shadow(0 6px 9px rgba(0, 23, 53, .26));
}

.competition-folder-card:focus-visible,
.competition-edition-tile:focus-visible,
.competition-archive-back:focus-visible {
  outline: 3px solid #9de8ff;
  outline-offset: 3px;
}

.competition-folder-card:active,
.competition-edition-tile:active,
.competition-archive-back:active {
  transform: scale(.97);
}

.competition-archive-layer[hidden] {
  display: none;
}

.competition-archive-layer {
  position: fixed;
  z-index: 2400;
  inset: 0;
  display: grid;
  place-items: center;
  padding: clamp(10px, 3vw, 34px);
}

.competition-archive-scrim {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  background: rgba(0, 34, 48, .76);
  backdrop-filter: blur(6px);
  cursor: default;
  opacity: 0;
  transition: opacity 170ms ease;
}

.competition-archive-panel {
  --archive-shift-x: 0px;
  --archive-shift-y: 0px;
  position: relative;
  z-index: 1;
  width: min(1040px, 100%);
  max-height: min(760px, calc(100dvh - 40px));
  overflow: auto;
  overscroll-behavior: contain;
  padding: clamp(13px, 1.5vw, 16px);
  border: 1px solid rgba(207, 245, 255, .2);
  border-radius: 22px;
  color: #fff;
  background:
    radial-gradient(circle at 90% 4%, rgba(66, 194, 235, .11), transparent 32%),
    linear-gradient(145deg, #08728f, #075b75 56%, #06465c);
  box-shadow: inset 0 1px rgba(255, 255, 255, .08), 0 28px 70px rgba(0, 20, 31, .42);
  opacity: 0;
  transform: translate3d(var(--archive-shift-x), var(--archive-shift-y), 0) scale(.94);
  transform-origin: center;
  transition: opacity 170ms ease, transform 230ms cubic-bezier(.23, 1, .32, 1);
}

.competition-archive-layer.is-open .competition-archive-scrim,
.competition-archive-layer.is-open .competition-archive-panel {
  opacity: 1;
}

.competition-archive-layer.is-open .competition-archive-panel {
  transform: translate3d(0, 0, 0) scale(1);
}

.competition-archive-layer.is-instant .competition-archive-scrim,
.competition-archive-layer.is-instant .competition-archive-panel,
.competition-archive-layer.is-instant .competition-edition-tile {
  transition-duration: 0ms !important;
  transition-delay: 0ms !important;
}

body.competition-archive-open {
  overflow: hidden;
}

body.competition-archive-open .competition-folder-home {
  opacity: .24;
  filter: blur(5px);
  transform: scale(.988);
}

.competition-archive-header {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  margin-bottom: 8px;
}

.competition-archive-back {
  grid-column: 1 / -1;
  justify-self: start;
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 9px;
  margin: 0;
  padding: 6px 9px;
  border: 1px solid rgba(220, 248, 255, .16);
  border-radius: 10px;
  color: #fff;
  background: rgba(0, 43, 61, .26);
  font: 800 11px/1 "Manrope", sans-serif;
  cursor: pointer;
  transition: transform 140ms cubic-bezier(.23, 1, .32, 1), border-color 150ms ease, background-color 150ms ease;
}

.competition-archive-back span {
  font-size: 17px;
}

.competition-archive-mark {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  padding: 4px;
  border: 1px solid rgba(224, 249, 255, .13);
  border-radius: 14px;
  background: rgba(0, 40, 56, .2);
  box-shadow: inset 0 1px rgba(255, 255, 255, .06);
}

.competition-archive-mark img {
  display: block;
  width: 44px;
  height: 44px;
  object-fit: contain;
  filter: drop-shadow(0 7px 10px rgba(0, 26, 39, .22));
}

.competition-archive-mark:has(#competitionArchiveLogo[src*="liga-portugal"]) {
  border-color: transparent;
  background: transparent;
}

.competition-archive-mark:has(#competitionArchiveLogo[src*="liga-portugal"]) img {
  filter: brightness(0) invert(1) drop-shadow(0 7px 10px rgba(0, 26, 39, .32));
}

.competition-archive-mark:has(#competitionArchiveLogo[src*="saudi-pro-league"]) {
  border-color: rgba(201, 246, 220, .24);
  background: #005430;
}

.competition-archive-mark:has(#competitionArchiveLogo[src*="saudi-pro-league"]) img {
  content: url("./assets/saudi-pro-league-2026-27/saudi-pro-league-logo-white.png");
  filter: drop-shadow(0 7px 10px rgba(0, 24, 14, .42));
}

.competition-archive-mark:has(#competitionArchiveLogo[src*="major-league-soccer"]) {
  border-color: rgba(255, 255, 255, .62);
  background: #fff;
}

.competition-archive-mark:has(#competitionArchiveLogo[src*="major-league-soccer"]) img {
  filter: drop-shadow(0 7px 10px rgba(0, 23, 53, .28));
}

.competition-archive-heading h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(23px, 2.4vw, 32px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.competition-archive-collection {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.competition-archive-collection[hidden] {
  display: none;
}

.competition-edition-tile {
  position: relative;
  isolation: isolate;
  display: grid;
  min-width: 0;
  min-height: 112px;
  grid-template-columns: 1fr auto;
  grid-template-rows: 1fr auto;
  align-items: end;
  gap: 5px;
  overflow: hidden;
  padding: 10px;
  border: 1px solid rgba(220, 248, 255, .23);
  border-radius: 16px;
  color: #fff;
  text-align: left;
  background: linear-gradient(145deg, rgba(9, 108, 143, .86), rgba(2, 56, 79, .94));
  box-shadow: inset 0 1px rgba(255, 255, 255, .08), 0 9px 20px rgba(0, 31, 45, .14);
  cursor: pointer;
  opacity: 0;
  transform: translate3d(0, 9px, 0);
  transition:
    opacity 190ms ease calc(var(--edition-index, 0) * 28ms),
    transform 210ms cubic-bezier(.23, 1, .32, 1) calc(var(--edition-index, 0) * 28ms),
    border-color 150ms ease,
    box-shadow 180ms ease;
}

.competition-archive-collection[data-ready="true"] .competition-edition-tile {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.competition-edition-tile::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, transparent 22%, rgba(0, 25, 39, .65) 100%);
  opacity: .75;
  transition: opacity 180ms ease;
}

.competition-edition-tile.edition-liga-portugal {
  border-color: rgba(127, 176, 255, .48);
  background:
    radial-gradient(circle at 84% 10%, rgba(127, 176, 255, .2), transparent 35%),
    linear-gradient(145deg, #0b3777, #06265a 62%, #031b40);
  box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 12px 26px rgba(0, 10, 30, .28);
}

.competition-edition-tile.edition-liga-portugal::before {
  background: linear-gradient(180deg, transparent 24%, rgba(2, 19, 47, .72) 100%);
}

.competition-edition-tile.edition-saudi-pro-league {
  border-color: rgba(201, 246, 220, .48);
  background:
    radial-gradient(circle at 84% 10%, rgba(148, 233, 185, .2), transparent 35%),
    linear-gradient(145deg, #086842, #005430 62%, #001d12);
  box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 12px 26px rgba(0, 24, 14, .3);
}

.competition-edition-tile.edition-saudi-pro-league::before {
  background: linear-gradient(180deg, transparent 24%, rgba(0, 29, 18, .74) 100%);
}

.competition-edition-tile.edition-mls {
  border-color: rgba(255, 220, 222, .5);
  background:
    radial-gradient(circle at 84% 10%, rgba(255, 116, 121, .22), transparent 35%),
    linear-gradient(145deg, #e2232a, #a81019 62%, #001735);
  box-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 12px 26px rgba(60, 2, 8, .32);
}

.competition-edition-tile.edition-mls::before {
  background: linear-gradient(180deg, transparent 24%, rgba(0, 23, 53, .78) 100%);
}

.competition-folder-saudi-pro-league:focus-visible,
.competition-edition-tile.edition-saudi-pro-league:focus-visible {
  outline-color: #94e9b9;
}

.competition-folder-mls:focus-visible,
.competition-edition-tile.edition-mls:focus-visible {
  outline-color: #ff969a;
}

.competition-edition-art {
  display: grid;
  width: 50px;
  height: 50px;
  grid-column: 1 / -1;
  grid-row: 1;
  align-self: center;
  justify-self: center;
  place-items: center;
  transform: translate3d(0, 0, 0) scale(1);
  transition: transform 220ms cubic-bezier(.23, 1, .32, 1);
}

.competition-edition-art img {
  display: block;
  width: 48px;
  height: 48px;
  object-fit: contain;
  filter: drop-shadow(0 7px 11px rgba(0, 19, 32, .24));
}

.edition-ligue-1 .competition-edition-art img,
.edition-super-lig .competition-edition-art img {
  filter: brightness(0) invert(1) drop-shadow(0 9px 14px rgba(0, 19, 32, .3));
}

.competition-edition-copy {
  display: grid;
  grid-column: 1;
  grid-row: 2;
  gap: 2px;
  min-width: 0;
  min-height: 30px;
  align-content: end;
}

.competition-edition-copy strong {
  display: flex;
  align-items: flex-end;
  color: #fff;
  font: 850 16px/1.05 "Manrope", sans-serif;
  letter-spacing: -.035em;
}

.competition-edition-copy small {
  display: block;
  overflow: hidden;
  color: rgba(230, 249, 255, .68);
  font: 700 8.5px/1.25 "Manrope", sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.edition-serie-b .competition-edition-copy strong {
  color: #f6fff9;
}

.edition-serie-b .competition-edition-copy small,
.edition-serie-b .competition-edition-arrow {
  color: rgba(232, 255, 242, .7);
}

.edition-serie-b::before {
  background: linear-gradient(180deg, transparent 24%, rgba(0, 43, 25, .56) 100%);
}

.edition-wc-1998 .competition-edition-art img { transform: scale(1.16); }
.edition-wc-2002 .competition-edition-art img { transform: scale(.94); }
.edition-wc-2006 .competition-edition-art img { transform: scale(1.12); }
.edition-wc-2010 .competition-edition-art img { transform: scale(1.05); }
.edition-wc-2014 .competition-edition-art img { transform: scale(1.08); }
.edition-wc-2018 .competition-edition-art img { transform: scale(1.03); }
.edition-wc-2022 .competition-edition-art img { transform: scale(.95); }

.competition-edition-arrow {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  color: rgba(239, 251, 255, .7);
  font: 800 17px/1 "Manrope", sans-serif;
  opacity: 0;
  transform: translate3d(-5px, 0, 0);
  transition: opacity 140ms ease, transform 170ms cubic-bezier(.23, 1, .32, 1);
}

.competition-edition-tile.is-coming-soon {
  border-style: dashed;
  cursor: not-allowed;
  filter: saturate(.58);
}

.competition-edition-status {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  padding: 5px 7px;
  border: 1px solid rgba(221, 246, 255, .22);
  border-radius: 999px;
  color: rgba(238, 250, 255, .78);
  background: rgba(1, 29, 45, .58);
  font: 800 7.5px/1 "Manrope", sans-serif;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.edition-wc-1998 { background: linear-gradient(145deg, rgba(15, 45, 91, .7), rgba(19, 49, 99, .9)), url("./assets/ui/archive/france-1998.webp") center / cover no-repeat; }
.edition-wc-2002 { background: linear-gradient(145deg, rgba(0, 66, 98, .55), rgba(1, 38, 67, .9)), url("./assets/ui/archive/korea-japan-2002.webp") center / cover no-repeat; }
.edition-wc-2006 { background: linear-gradient(145deg, rgba(0, 67, 98, .45), rgba(4, 43, 70, .88)), url("./assets/ui/archive/germany-2006.webp") center / cover no-repeat; }
.edition-wc-2010 { background: linear-gradient(145deg, rgba(70, 27, 9, .38), rgba(44, 18, 8, .84)), url("./assets/ui/archive/south-africa-2010.webp") center / cover no-repeat; }
.edition-wc-2014 { background: linear-gradient(145deg, rgba(0, 87, 89, .42), rgba(0, 49, 59, .86)), url("./assets/ui/archive/brazil-2014.webp") center / cover no-repeat; }
.edition-wc-2018 { background: radial-gradient(circle at 82% 12%, rgba(255, 255, 255, .22), transparent 34%), linear-gradient(145deg, #bd352e, #70151b 68%, #3d0c14); }
.edition-wc-2022 { background: linear-gradient(145deg, rgba(87, 2, 37, .45), rgba(38, 1, 22, .88)), url("./assets/ui/archive/qatar-2022.webp") center / cover no-repeat; }
.edition-wc-2026 { background: radial-gradient(circle at 86% 12%, rgba(50, 255, 215, .26), transparent 34%), linear-gradient(145deg, #0a45e8, #07308f 64%, #03175b); }
.edition-euro-2016 { background: radial-gradient(circle at 84% 8%, rgba(255, 222, 122, .24), transparent 31%), linear-gradient(145deg, #123a90, #0c2263 66%, #07133c); }
.edition-euro-2020 { background: radial-gradient(circle at 84% 8%, rgba(204, 255, 0, .22), transparent 32%), linear-gradient(145deg, #0993a2, #055b6c 66%, #033844); }
.edition-euro-2024 { background: radial-gradient(circle at 85% 10%, rgba(255, 65, 116, .26), transparent 32%), linear-gradient(145deg, #113fa7, #0d2371 64%, #091349); }
.edition-copa-2024 { background: linear-gradient(145deg, rgba(5, 62, 137, .58), rgba(4, 27, 84, .9)), url("./assets/copa-america-2024-bg-desktop.svg") center / cover no-repeat; }
.edition-afcon-2025 { background: radial-gradient(circle at 85% 8%, rgba(0, 222, 105, .25), transparent 33%), linear-gradient(145deg, #8a2938, #531724 66%, #2b0b14); }
.edition-premier-league { background: radial-gradient(circle at 84% 8%, rgba(255, 255, 255, .16), transparent 32%), linear-gradient(145deg, #5a2979, #35104c 70%, #1f082d); }
.edition-la-liga { background: radial-gradient(circle at 84% 8%, rgba(255, 220, 71, .23), transparent 32%), linear-gradient(145deg, #cc2946, #910d2c 68%, #580b24); }
.edition-la-liga-2 { background: radial-gradient(circle at 84% 8%, rgba(0, 221, 229, .3), transparent 34%), linear-gradient(145deg, #0b91a8, #08667f 68%, #063b54); }
.edition-serie-a { background: linear-gradient(145deg, rgba(12, 102, 178, .6), rgba(4, 47, 92, .9)), url("./assets/ui/archive/serie-a.webp") center / cover no-repeat; }
.edition-serie-b { background: radial-gradient(circle at 84% 8%, rgba(148, 233, 185, .34), transparent 34%), linear-gradient(145deg, #5caf7c, #347b56 62%, #1a4c35); }
.edition-bundesliga { background: radial-gradient(circle at 84% 8%, rgba(255, 255, 255, .18), transparent 31%), linear-gradient(145deg, #c8242d, #8b111c 68%, #500910); }
.edition-ligue-1 { background: radial-gradient(circle at 84% 8%, rgba(217, 255, 56, .22), transparent 32%), linear-gradient(145deg, #17439b, #102359 68%, #09153a); }
.edition-championship { background: radial-gradient(circle at 84% 8%, rgba(194, 159, 52, .25), transparent 33%), linear-gradient(145deg, #1b2f8d, #0d1a5b 68%, #070d33); }
.edition-super-lig { background: radial-gradient(circle at 84% 8%, rgba(216, 116, 255, .26), transparent 34%), linear-gradient(145deg, #793783, #4b2158 68%, #291330); }
.edition-eredivisie { background: radial-gradient(circle at 84% 8%, rgba(255, 49, 95, .28), transparent 34%), linear-gradient(145deg, #3a308d, #211a63 68%, #120c4a); }
.edition-belgian { background: radial-gradient(circle at 84% 8%, rgba(255, 23, 79, .28), transparent 33%), linear-gradient(145deg, #5c1029, #33091a 68%, #18040c); }
.edition-ucl { background: radial-gradient(circle at 84% 8%, rgba(113, 163, 255, .26), transparent 34%), linear-gradient(145deg, #183991, #0d1e5e 68%, #070f36); }
.edition-europa { background: radial-gradient(circle at 84% 8%, rgba(255, 146, 54, .28), transparent 34%), linear-gradient(145deg, #2b2b2b, #171717 66%, #080808); }
.edition-conference { background: radial-gradient(circle at 84% 8%, rgba(109, 255, 205, .24), transparent 34%), linear-gradient(145deg, #0a8469, #075546 68%, #03332b); }

@media (hover: hover) and (pointer: fine) {
  .competition-folder-card:hover {
    border-color: rgba(231, 251, 255, .4);
    box-shadow: inset 0 1px rgba(255, 255, 255, .13), 0 19px 36px rgba(0, 29, 44, .27), 0 0 18px rgba(83, 210, 246, .05);
    transform: translate3d(0, -3px, 0);
  }

  .competition-folder-card:hover::before {
    opacity: .94;
    transform: translate3d(1px, -1px, 0) scale(1.018);
  }

  .competition-folder-card:hover .competition-folder-art {
    transform: translate3d(0, -1px, 0) scale(1.02);
  }

  .competition-folder-card:hover .competition-folder-hint {
    opacity: .86;
    transform: translate3d(0, 0, 0);
  }

  .competition-edition-tile:not(:disabled):hover {
    border-color: rgba(238, 252, 255, .4);
    box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 12px 22px rgba(0, 29, 43, .2);
    transform: translate3d(0, -2px, 0);
    transition-delay: 0ms;
  }

  .competition-edition-tile:not(:disabled):hover::before {
    opacity: .58;
  }

  .competition-edition-tile:not(:disabled):hover .competition-edition-art {
    transform: translate3d(0, -1px, 0) scale(1.02);
  }

  .competition-edition-tile.edition-liga-portugal:hover .competition-edition-art {
    transform: translate3d(0, -5px, 0) scale(1.02);
  }

  .competition-edition-tile.edition-saudi-pro-league:hover {
    border-color: rgba(232, 255, 242, .72);
    box-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 15px 28px rgba(0, 24, 14, .36);
  }

  .competition-edition-tile.edition-saudi-pro-league:hover .competition-edition-art {
    transform: translate3d(0, -3px, 0) scale(1.03);
  }

  .competition-edition-tile.edition-mls:hover {
    border-color: rgba(255, 238, 239, .78);
    box-shadow: inset 0 1px rgba(255, 255, 255, .16), 0 15px 28px rgba(60, 2, 8, .4);
  }

  .competition-edition-tile.edition-mls:hover .competition-edition-art {
    transform: translate3d(0, -3px, 0) scale(1.03);
  }

  .competition-edition-tile:not(:disabled):hover .competition-edition-arrow {
    opacity: .9;
    transform: translate3d(0, 0, 0);
  }

  .competition-archive-back:hover {
    border-color: rgba(226, 249, 255, .3);
    background: rgba(0, 43, 63, .38);
  }
}

.competition-edition-tile:not(:disabled):active {
  transform: scale(.98);
  transition-delay: 0ms !important;
  transition-duration: 100ms !important;
}

@media (max-width: 980px) {
  .competition-folder-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .competition-archive-collection {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 721px) and (max-width: 1180px) {
  body.before-start:not([data-desktop-mode-setup]) .field-overview,
  body.before-start:not([data-desktop-mode-setup]) .leaderboard-screen {
    width: min(720px, calc(100% - clamp(120px, 24vw, 320px)));
  }

  .competition-folder-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 11px;
  }

  .competition-folder-card {
    min-height: 108px;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 8px;
    padding: 10px;
    border-radius: 17px;
  }

  .competition-folder-art {
    width: 52px;
    height: 52px;
    padding: 2px;
    border-radius: 12px;
  }

  .competition-folder-art img {
    width: 48px;
    height: 48px;
  }

  .competition-folder-copy {
    gap: 4px;
  }

  .competition-folder-copy strong {
    font-size: 13px;
    line-height: 1.1;
  }

  .competition-folder-belgian .competition-folder-copy strong,
  .competition-folder-ucl .competition-folder-copy strong,
  .competition-folder-conference .competition-folder-copy strong,
  .competition-folder-championship .competition-folder-copy strong {
    font-size: 12px;
  }

  .competition-folder-copy small {
    font-size: 8.5px;
  }
}

@media (max-width: 820px) {
  .competition-archive-layer {
    align-items: center;
    padding: 24px;
  }

  .competition-archive-panel {
    width: min(560px, calc(100vw - 48px));
    max-height: min(740px, calc(100dvh - 48px));
  }

  .competition-archive-collection:has(> .competition-edition-tile:only-child) {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 700px) {
  .competition-folder-home {
    gap: 26px;
  }

  .competition-folder-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .competition-folder-card {
    min-height: 106px;
    grid-template-columns: 48px minmax(0, 1fr);
    grid-template-rows: 1fr;
    gap: 8px;
    padding: 9px;
    border-radius: 15px;
  }

  .competition-folder-art {
    width: 48px;
    height: 48px;
    grid-column: 1;
    grid-row: 1;
    padding: 2px;
    border-radius: 11px;
  }

  .competition-folder-art img {
    width: 44px;
    height: 44px;
  }

  .competition-folder-copy {
    grid-column: 2;
    grid-row: 1;
  }

  .competition-folder-copy strong {
    font-size: 12.5px;
    line-height: 1.1;
  }

  .competition-folder-championship .competition-folder-copy strong {
    font-size: 10.75px;
  }

  .competition-folder-copy small {
    font-size: 8px;
  }

  .competition-folder-hint {
    display: none;
  }

  .competition-archive-layer {
    align-items: center;
    padding: 16px 14px;
  }

  .competition-archive-panel {
    width: min(430px, calc(100vw - 28px));
    max-height: min(680px, calc(100dvh - 32px));
    padding: 14px;
    border-radius: 24px;
    box-shadow: inset 0 1px rgba(255, 255, 255, .1), 0 24px 64px rgba(0, 20, 31, .52);
  }

  .competition-archive-header {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 7px;
    margin-bottom: 8px;
  }

  .competition-archive-back {
    min-height: 38px;
    margin-bottom: 0;
  }

  .competition-archive-mark {
    width: 46px;
    height: 46px;
    padding: 4px;
    border-radius: 13px;
  }

  .competition-archive-mark img {
    width: 36px;
    height: 36px;
  }

  .competition-archive-heading h2 {
    font-size: 22px;
  }

  .competition-archive-collection {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .competition-archive-collection:has(> .competition-edition-tile:only-child) {
    grid-template-columns: minmax(0, 1fr);
  }

  .competition-edition-tile {
    min-height: 112px;
    padding: 8px;
    border-radius: 15px;
  }

  .competition-edition-art,
  .competition-edition-art img {
    width: 46px;
    height: 46px;
  }

  .competition-edition-copy strong {
    font-size: 14px;
  }

  .competition-edition-copy small {
    font-size: 7.75px;
  }
}

@media (max-width: 430px) {
  .competition-folder-card {
    min-height: 102px;
  }

  .competition-archive-panel {
    width: min(360px, calc(100vw - 32px));
    max-height: min(680px, calc(100dvh - 24px));
    padding: 12px;
  }

  .competition-edition-tile {
    min-height: 108px;
    padding: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .simulator-visual-card,
  .simulator-visual-card::before,
  .simulator-visual-card > img,
  .simulator-card-chevron,
  .competition-folder-home,
  .competition-folder-card,
  .competition-folder-card::before,
  .competition-folder-art,
  .competition-folder-hint,
  .competition-archive-scrim,
  .competition-archive-panel,
  .competition-edition-tile,
  .competition-edition-art,
  .competition-edition-arrow { transition-duration: 1ms !important; transition-delay: 0ms !important; }
}

/* Shared cyan mode surfaces
   The setup and custom-competition routes use the homepage shell and one
   consistent cyan surface scale. This deliberately leaves every other
   competition and the standard playable tournament untouched. */
:is(
  body[data-desktop-mode-setup="standard"],
  body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])),
  body.custom-tournament-mode-active
) {
  --shared-mode-canvas: #08779a;
  --shared-mode-canvas-deep: #04536f;
  --shared-mode-panel: #086988;
  --shared-mode-panel-raised: #0a7899;
  --shared-mode-panel-deep: #054c68;
  --shared-mode-control: #043e57;
  --shared-mode-line: rgba(190, 237, 255, .28);
  --shared-mode-line-strong: rgba(190, 237, 255, .46);
  --shared-mode-text: #f7fcff;
  --shared-mode-muted: #c9eaf5;
  --shared-mode-faint: #add7e6;
  --shared-mode-accent: #66cef0;
  --shared-mode-accent-ink: #04364a;
}

:is(
  body[data-desktop-mode-setup="standard"],
  body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])),
  body.custom-tournament-mode-active,
  body.standard-mode-active
) #newsButton {
  display: inline-flex !important;
}

body[data-desktop-mode-setup="standard"],
body[data-desktop-mode-setup="standard"] .main {
  color: var(--shared-mode-text) !important;
  background:
    radial-gradient(circle at 13% 14%, rgba(103, 214, 244, .2), transparent 31%),
    radial-gradient(circle at 88% 82%, rgba(0, 55, 77, .24), transparent 36%),
    linear-gradient(150deg, var(--shared-mode-canvas), var(--shared-mode-canvas-deep)) !important;
}

body[data-desktop-mode-setup="standard"] .mode-card-default {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: linear-gradient(155deg, rgba(8, 105, 136, .96), rgba(5, 76, 104, .96)) !important;
  box-shadow: 0 24px 70px rgba(0, 46, 65, .3) !important;
}

body[data-desktop-mode-setup="standard"] :is(
  .mode-card-copy h3,
  .spectate-picker-copy strong
) {
  color: var(--shared-mode-text) !important;
}

body[data-desktop-mode-setup="standard"] :is(
  .landing-setting-heading,
  .landing-team-setting > span,
  .spectate-picker-copy small
) {
  color: var(--shared-mode-muted) !important;
}

body[data-desktop-mode-setup="standard"] :is(
  .landing-setting .segmented,
  .spectate-picker
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-control) !important;
}

body[data-desktop-mode-setup="standard"] .landing-setting .segmented button {
  color: var(--shared-mode-muted) !important;
}

body[data-desktop-mode-setup="standard"] .landing-setting .segmented button.active {
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
  box-shadow: none !important;
}

body[data-desktop-mode-setup="standard"] :is(
  .landing-setting-info summary,
  .standard-route-back
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: rgba(4, 76, 104, .86) !important;
}

body[data-desktop-mode-setup="standard"] .mode-card-actions .start-tournament {
  border-color: transparent !important;
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) #legacySetupModal {
  position: fixed !important;
  inset: 60px 0 0 !important;
  height: calc(100dvh - 60px) !important;
  color: var(--shared-mode-text) !important;
  background:
    radial-gradient(circle at 18% 14%, rgba(103, 214, 244, .2), transparent 34%),
    radial-gradient(circle at 84% 82%, rgba(0, 53, 75, .28), transparent 36%),
    linear-gradient(145deg, var(--shared-mode-canvas), var(--shared-mode-canvas-deep)) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) #legacySetupModal::backdrop {
  background: var(--shared-mode-canvas-deep) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) #legacySetupModal .legacy-setup-modal-card {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: linear-gradient(155deg, rgba(8, 105, 136, .96), rgba(5, 76, 104, .96)) !important;
  box-shadow: 0 28px 80px rgba(0, 45, 63, .34) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) .legacy-setup-modal-card > header {
  border-color: var(--shared-mode-line) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) .legacy-setup-modal-card > header h2 {
  margin-top: 0;
  color: var(--shared-mode-text) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) .legacy-setup-modal-card > header p,
body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) :is(
  .legacy-landing-settings label > span,
  .legacy-landing-settings small
) {
  color: var(--shared-mode-muted) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) :is(
  .legacy-landing-mode,
  .legacy-landing-segmented,
  .legacy-landing-picker
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-control) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) :is(
  .legacy-landing-mode button,
  .legacy-landing-segmented button,
  .legacy-landing-picker select
) {
  color: var(--shared-mode-muted) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) :is(
  .legacy-landing-mode button.active,
  .legacy-landing-segmented button.active
) {
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) .legacy-setup-modal-card > footer {
  border-color: var(--shared-mode-line) !important;
  background: rgba(4, 76, 104, .88) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) :is(
  .legacy-setup-back,
  .legacy-landing-picker > button,
  .legacy-setup-modal-card > footer .secondary-button
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-control) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) .legacy-setup-modal-card > footer .primary-button {
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
}

body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) .legacy-setup-back {
  top: 84px !important;
}

body.custom-tournament-mode-active {
  color: var(--shared-mode-text);
  background:
    radial-gradient(circle at 14% 12%, rgba(102, 206, 240, .16), transparent 32%),
    linear-gradient(150deg, var(--shared-mode-canvas), var(--shared-mode-canvas-deep)) fixed !important;
}

body.custom-tournament-mode-active :is(.main, #appShell) {
  background-color: transparent !important;
}

body.custom-tournament-mode-active :is(
  .custom-workspace-panel,
  .custom-match-teams,
  .custom-match-team-card,
  .custom-match-script,
  .custom-team-library,
  .custom-builder-group,
  .custom-live-group
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: rgba(7, 94, 123, .9) !important;
}

body.custom-tournament-mode-active :is(
  .custom-match-team-selectors select,
  .custom-rating-grid input,
  .custom-score-script input,
  .custom-winner-select select,
  .custom-goal-row input,
  .custom-goal-row select,
  .custom-match-goal-row input,
  .custom-match-goal-row select,
  .custom-segmented,
  .custom-search,
  .custom-source-select select
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-control) !important;
}

body.custom-tournament-mode-active :is(
  .custom-match-team-card header,
  .custom-match-team-selectors label,
  .custom-rating-grid label,
  .custom-config-group > span,
  .custom-score-script label > span,
  .custom-winner-select > span,
  .custom-library-heading span,
  .custom-library-team small,
  .custom-panel-heading > span,
  .custom-script-help,
  .custom-goal-empty
) {
  color: var(--shared-mode-muted) !important;
  opacity: 1;
}

body.custom-tournament-mode-active :is(
  .custom-match-team-name strong,
  .custom-panel-heading h2,
  .custom-library-heading strong,
  .custom-library-team strong,
  .custom-live-group strong
) {
  color: var(--shared-mode-text) !important;
}

body.custom-tournament-mode-active :is(
  .custom-search input,
  .custom-picker-search input
)::placeholder {
  color: var(--shared-mode-faint) !important;
  opacity: 1 !important;
}

body.custom-tournament-mode-active .custom-segmented button {
  color: var(--shared-mode-muted) !important;
}

body.custom-tournament-mode-active .custom-segmented button.active,
body.custom-tournament-mode-active .custom-header-start {
  border-color: transparent !important;
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
}

body.custom-tournament-mode-active :is(
  .custom-back-button,
  .custom-preset-actions > button:not(.custom-header-start),
  .custom-library-heading > button,
  .custom-library-team > button,
  .custom-match-reset-ratings
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-panel-deep) !important;
}

body.custom-tournament-mode-active:not(.before-start) #mainContent :is(
  .match-stage,
  .round-board,
  .panel,
  .match-analysis,
  .standard-match-tactics,
  .story-card,
  .custom-live-group
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: rgba(6, 87, 115, .92) !important;
  box-shadow: 0 16px 44px rgba(0, 45, 63, .22) !important;
}

body.custom-tournament-mode-active:not(.before-start) #mainContent :is(
  .team,
  .fixture,
  .live-feed-item,
  .queue-item,
  .plot-item,
  .match-stat-row,
  .custom-live-group > div
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: rgba(4, 75, 101, .78) !important;
}

body.custom-tournament-mode-active:not(.before-start) #mainContent :is(
  .team-name,
  .match-score,
  .fixture-team,
  .fixture-team .name,
  .fixture-team b,
  .panel-heading strong,
  .match-analysis-heading strong,
  #stageRoundLabel,
  #boardTitle,
  .custom-live-group > div > span
) {
  color: var(--shared-mode-text) !important;
}

body.custom-tournament-mode-active:not(.before-start) #mainContent :is(
  .fixture-meta,
  .team .seed,
  .venue,
  .result-note,
  .match-stat-row span,
  .plot-item p,
  .empty-story p,
  .golden-boot-empty,
  .custom-live-group > header
) {
  color: var(--shared-mode-muted) !important;
  opacity: 1 !important;
}

body.custom-tournament-mode-active:not(.before-start) #mainContent :is(
  .legacy-topbar-back,
  .team-filter-search,
  .history-round-button,
  #unresolvedFilter,
  #simulateRoundButton,
  .play-button,
  .primary-button
) {
  border-color: var(--shared-mode-line) !important;
}

body.custom-tournament-mode-active:not(.before-start) #mainContent :is(
  .play-button.primary-button,
  #playButton
) {
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
}

body.custom-tournament-mode-active:not(.before-start) #legacyDraftBackButton {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-panel-deep) !important;
}

@media (hover: hover) and (pointer: fine) {
  body.custom-tournament-mode-active :is(
    .custom-back-button,
    .custom-preset-actions > button,
    .custom-library-heading > button,
    .custom-library-team > button
  ):hover {
    border-color: var(--shared-mode-line-strong) !important;
    color: var(--shared-mode-text) !important;
    background: var(--shared-mode-panel-raised) !important;
  }
}

@media (min-width: 721px) {
  body[data-desktop-mode-setup="standard"] .mode-select {
    min-height: calc(100dvh - 60px) !important;
  }

  body[data-desktop-mode-setup="standard"] .standard-route-back {
    top: 84px !important;
  }
}

@media (max-width: 720px) {
  body.custom-tournament-mode-active:not(.before-start) #mainContent .match-stage .team-name {
    overflow: visible !important;
    font-size: clamp(.95rem, 5vw, 1.2rem) !important;
    line-height: 1.12 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  body[data-desktop-mode-setup="standard"] .mode-select {
    min-height: calc(100dvh - 120px) !important;
    padding-top: 78px !important;
  }

  body[data-desktop-mode-setup="standard"] .standard-route-back {
    position: fixed !important;
    top: 132px !important;
    left: 12px !important;
    z-index: 4;
    width: max-content !important;
    min-width: 0 !important;
    min-height: 44px;
    padding: 0 14px !important;
    font-size: .78rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) #legacySetupModal {
    inset: 120px 0 0 !important;
    height: calc(100dvh - 120px) !important;
    padding: 66px 12px 24px !important;
  }

  body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) .legacy-setup-back {
    position: fixed !important;
    top: 132px !important;
    left: 12px !important;
    z-index: 4;
    width: max-content !important;
    min-width: 0 !important;
    min-height: 44px;
    padding: 0 14px !important;
    font-size: .78rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  body:is(.legacy-route-setup-active, :has(#legacySetupModal[open])) #legacySetupModal .legacy-setup-modal-card {
    max-height: calc(100dvh - 206px) !important;
  }

  body.custom-tournament-mode-active .custom-match-builder {
    width: calc(100% - 24px);
    padding: 12px;
  }
}

/* Custom Match, Custom Tournament and Legacy Draft completion polish.
   These selectors are intentionally mode-scoped so standard and retro
   tournament presentations keep their own identities. */
body:is(.legacy-mode-active, .legacy-tournament-mode-active) {
  --shared-mode-canvas: #08779a;
  --shared-mode-canvas-deep: #04536f;
  --shared-mode-panel: #086988;
  --shared-mode-panel-raised: #0a7899;
  --shared-mode-panel-deep: #054c68;
  --shared-mode-control: #043e57;
  --shared-mode-line: rgba(190, 237, 255, .28);
  --shared-mode-line-strong: rgba(190, 237, 255, .46);
  --shared-mode-text: #f7fcff;
  --shared-mode-muted: #c9eaf5;
  --shared-mode-faint: #add7e6;
  --shared-mode-accent: #66cef0;
  --shared-mode-accent-ink: #04364a;
}

body:is(.legacy-mode-active, .legacy-tournament-mode-active),
body:is(.legacy-mode-active, .legacy-tournament-mode-active) :is(.main, #appShell) {
  color: var(--shared-mode-text) !important;
  background:
    radial-gradient(circle at 14% 12%, rgba(102, 206, 240, .16), transparent 32%),
    linear-gradient(150deg, var(--shared-mode-canvas), var(--shared-mode-canvas-deep)) fixed !important;
}

/* The live matchup should read as one scoreboard, not three nested cards. */
body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .matchup > .team,
body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .flag-orb,
body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .flag-orb .country-flag {
  border: 0 !important;
  color: var(--shared-mode-text) !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .matchup > .team {
  padding-inline: clamp(10px, 2vw, 28px) !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .team-match-events,
body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .event-side {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .team-match-events :is(.timeline-event, .event) {
  width: fit-content;
  max-width: 100%;
  min-height: 30px;
  margin-block: 4px;
  padding: 6px 10px;
  border: 1px solid rgba(190, 237, 255, .2) !important;
  border-radius: 999px;
  color: var(--shared-mode-text) !important;
  background: rgba(4, 76, 104, .48) !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .team-match-events.away :is(.timeline-event, .event) {
  margin-left: auto;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .team-match-events :is(b, strong) {
  color: var(--shared-mode-accent) !important;
}

/* Match tactics now use the cyan control language instead of the old navy rail. */
body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #mainContent .standard-match-tactics {
  overflow: hidden;
  padding: 0 !important;
  border: 1px solid var(--shared-mode-line) !important;
  border-radius: 14px !important;
  background: rgba(6, 94, 123, .9) !important;
  box-shadow: 0 14px 38px rgba(0, 45, 63, .2) !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #mainContent .standard-match-tactics > span {
  margin: 0 !important;
  padding: 12px 14px 9px;
  color: var(--shared-mode-muted) !important;
  background: rgba(4, 76, 104, .36) !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #mainContent .standard-tactic-buttons {
  gap: 6px !important;
  padding: 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #mainContent .standard-tactic-buttons button {
  min-height: 42px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  color: var(--shared-mode-muted) !important;
  background: rgba(4, 76, 104, .62) !important;
  box-shadow: none !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #mainContent .standard-tactic-buttons button:is(:hover, :focus-visible):not(:disabled):not(.active) {
  border-color: var(--shared-mode-line-strong) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-panel-raised) !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #mainContent .standard-tactic-buttons button.active {
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
}

body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #mainContent .standard-match-tactics > small {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-muted) !important;
  background: rgba(4, 76, 104, .36) !important;
}

/* Modern result scripting: clear score composer, compact event rows and actions. */
body.custom-tournament-mode-active .custom-match-script {
  overflow: hidden;
  padding: clamp(18px, 2.5vw, 30px) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 88% 0%, rgba(102, 206, 240, .14), transparent 32%),
    rgba(7, 94, 123, .94) !important;
  box-shadow: 0 18px 48px rgba(0, 45, 63, .2) !important;
}

body.custom-tournament-mode-active .custom-match-script .custom-panel-heading {
  margin-bottom: 6px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--shared-mode-line);
}

body.custom-tournament-mode-active .custom-script-count {
  padding: 6px 10px;
  border: 1px solid var(--shared-mode-line);
  border-radius: 999px;
  color: var(--shared-mode-muted) !important;
  background: rgba(4, 76, 104, .52);
}

body.custom-tournament-mode-active .custom-match-script .custom-script-help {
  max-width: 680px;
  margin: 14px 0 20px;
  line-height: 1.55;
}

body.custom-tournament-mode-active :is(.custom-match-score-script, .custom-fixed-result-fields .custom-score-script) {
  align-items: center;
  gap: 16px;
  margin-top: 0;
  padding: 16px;
  border: 1px solid var(--shared-mode-line);
  border-radius: 16px;
  background: rgba(4, 76, 104, .46);
}

body.custom-tournament-mode-active :is(.custom-match-score-script, .custom-fixed-result-fields .custom-score-script) > span {
  padding: 24px 0 0;
  color: var(--shared-mode-accent) !important;
  font-size: 24px;
}

body.custom-tournament-mode-active :is(.custom-match-score-script, .custom-fixed-result-fields .custom-score-script) input {
  height: 62px !important;
  border-radius: 12px !important;
  text-align: center;
  font-size: 26px !important;
  font-weight: 900 !important;
}

body.custom-tournament-mode-active .custom-match-script .custom-winner-select {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--shared-mode-line);
  border-radius: 12px;
  background: rgba(4, 76, 104, .3);
}

body.custom-tournament-mode-active :is(.custom-match-script, .custom-match-rule-editor) .custom-goal-script-heading {
  margin-top: 18px;
  padding-top: 16px;
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
}

body.custom-tournament-mode-active :is(.custom-match-script, .custom-match-rule-editor) .custom-goal-script-heading button {
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid var(--shared-mode-line);
  border-radius: 9px;
  color: var(--shared-mode-text);
  background: var(--shared-mode-panel-deep);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

body.custom-tournament-mode-active .custom-match-goal-rows,
body.custom-tournament-mode-active .custom-goal-rows {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

body.custom-tournament-mode-active .custom-match-goal-row,
body.custom-tournament-mode-active .custom-goal-row {
  display: grid;
  grid-template-columns: minmax(90px, .45fr) 82px minmax(180px, 1fr) 38px;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--shared-mode-line);
  border-radius: 12px;
  background: rgba(4, 76, 104, .36);
}

body.custom-tournament-mode-active :is(.custom-match-goal-row, .custom-goal-row) > button {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 174, 174, .3);
  border-radius: 9px;
  color: #ffe6e6;
  background: rgba(131, 36, 45, .48);
  font-size: 20px;
  cursor: pointer;
}

body.custom-tournament-mode-active :is(.custom-match-script, .custom-match-rule-editor) .custom-script-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--shared-mode-line);
}

body.custom-tournament-mode-active :is(.custom-match-script, .custom-match-rule-editor) .custom-script-actions button {
  min-height: 46px;
  padding-inline: 18px;
  border-radius: 11px;
}

body.custom-tournament-mode-active :is(.custom-match-script, .custom-match-rule-editor) .custom-script-actions .secondary-button {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-panel-deep) !important;
}

body.custom-tournament-mode-active :is(.custom-match-script, .custom-match-rule-editor) .custom-script-actions .primary-button {
  border-color: transparent !important;
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
}

/* Bracket cards and the rule editor no longer fall back to the navy skin. */
body.custom-tournament-mode-active .custom-bracket-edit-round > header {
  border-color: var(--shared-mode-line) !important;
}

body.custom-tournament-mode-active .custom-bracket-edit-round > header strong,
body.custom-tournament-mode-active .custom-bracket-edit-round > header span {
  color: var(--shared-mode-text) !important;
  opacity: 1;
}

body.custom-tournament-mode-active .custom-bracket-edit-match {
  border: 1px solid var(--shared-mode-line) !important;
  border-radius: 12px !important;
  color: var(--shared-mode-text) !important;
  background: rgba(6, 94, 123, .86) !important;
  box-shadow: 0 10px 28px rgba(0, 45, 63, .14);
}

body.custom-tournament-mode-active .custom-bracket-edit-match > header,
body.custom-tournament-mode-active .custom-direct-match-slot,
body.custom-tournament-mode-active .custom-future-team {
  border-color: var(--shared-mode-line) !important;
}

body.custom-tournament-mode-active .custom-bracket-edit-match > header {
  min-height: 42px;
  background: rgba(4, 76, 104, .4);
}

body.custom-tournament-mode-active .custom-bracket-edit-match > header :is(span, small),
body.custom-tournament-mode-active .custom-future-team {
  color: var(--shared-mode-muted) !important;
  opacity: 1;
}

body.custom-tournament-mode-active .custom-bracket-edit-match > header button {
  min-height: 30px;
  border: 1px solid var(--shared-mode-line) !important;
  border-radius: 8px;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-panel-deep) !important;
}

body.custom-tournament-mode-active .custom-bracket-edit-match > footer {
  padding: 10px;
  color: var(--shared-mode-accent) !important;
  background: rgba(4, 76, 104, .3);
}

body.custom-tournament-mode-active .custom-editor-backdrop {
  background: rgba(1, 42, 57, .78) !important;
  backdrop-filter: blur(6px);
}

body.custom-tournament-mode-active .custom-editor-modal .custom-match-rule-editor {
  width: min(650px, 100%) !important;
  padding: 0 !important;
  overflow: hidden auto;
  border: 1px solid var(--shared-mode-line) !important;
  border-radius: 18px !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-panel) !important;
}

body.custom-tournament-mode-active .custom-match-rule-editor > header {
  min-height: 68px;
  margin: 0;
  padding: 14px 18px;
  border-bottom: 1px solid var(--shared-mode-line);
  background: rgba(4, 76, 104, .42);
}

body.custom-tournament-mode-active .custom-match-rule-editor > header h3 {
  margin: 0;
  color: var(--shared-mode-text) !important;
}

body.custom-tournament-mode-active .custom-match-rule-editor > header button {
  border: 1px solid var(--shared-mode-line) !important;
  border-radius: 9px;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-panel-deep) !important;
}

body.custom-tournament-mode-active .custom-match-rule-editor > .custom-match-teams {
  margin: 14px 18px 0;
  padding: 12px;
  border: 1px solid var(--shared-mode-line) !important;
  border-radius: 12px;
  background: rgba(4, 76, 104, .34) !important;
}

body.custom-tournament-mode-active .custom-match-rule-editor form {
  padding: 16px 18px 18px;
}

body.custom-tournament-mode-active .custom-rule-fields label > span,
body.custom-tournament-mode-active .custom-fixed-toggle {
  color: var(--shared-mode-muted) !important;
}

body.custom-tournament-mode-active .custom-rule-fields input[type="number"],
body.custom-tournament-mode-active .custom-fixed-result-fields :is(input, select) {
  border: 1px solid var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-control) !important;
}

body.custom-tournament-mode-active .custom-fixed-toggle {
  min-height: 50px;
  padding: 10px 12px;
  border: 1px solid var(--shared-mode-line);
  border-radius: 12px;
  background: rgba(4, 76, 104, .34);
}

body.custom-tournament-mode-active .custom-fixed-toggle input {
  accent-color: var(--shared-mode-accent);
}

body.custom-tournament-mode-active .custom-fixed-result-fields {
  padding: 14px !important;
  border: 1px solid var(--shared-mode-line) !important;
  border-radius: 14px;
  background: rgba(4, 76, 104, .28) !important;
}

/* The draft selectors use the same cyan surfaces while the pitch stays green. */
body.legacy-mode-active .legacy-left-panel {
  border-color: var(--shared-mode-line) !important;
  background: rgba(5, 82, 108, .94) !important;
  box-shadow: 0 20px 54px rgba(0, 45, 63, .24) !important;
}

body.legacy-mode-active :is(.legacy-left-panel .legacy-draft-status, .legacy-left-panel .legacy-randomiser) {
  border-color: var(--shared-mode-line) !important;
  background: rgba(6, 105, 136, .86) !important;
}

body.legacy-mode-active .legacy-left-panel .legacy-draft-status > div {
  color: var(--shared-mode-text) !important;
  background: rgba(4, 76, 104, .34) !important;
}

body.legacy-mode-active .legacy-left-panel .legacy-draft-status :is(span, strong) {
  color: var(--shared-mode-text) !important;
}

body.legacy-mode-active .legacy-left-panel .legacy-draft-status span {
  color: var(--shared-mode-muted) !important;
}

body.legacy-mode-active .legacy-randomiser .primary-button,
body.legacy-mode-active .legacy-actions .primary-button {
  border-color: transparent !important;
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
}

body.legacy-mode-active .legacy-randomiser .secondary-button,
body.legacy-mode-active .legacy-actions .secondary-button {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: var(--shared-mode-panel-deep) !important;
}

body.legacy-mode-active .legacy-player-card {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: rgba(4, 76, 104, .5) !important;
}

body.legacy-mode-active .legacy-player-card:is(:hover, :focus-visible, .is-selected) {
  border-color: var(--shared-mode-line-strong) !important;
  background: var(--shared-mode-panel-raised) !important;
}

body.legacy-mode-active .legacy-player-card :is(strong, b) {
  color: var(--shared-mode-text) !important;
}

body.legacy-mode-active .legacy-player-card :is(span, small) {
  color: var(--shared-mode-muted) !important;
}

body.legacy-tournament-mode-active:not(.before-start) #mainContent :is(
  .match-stage,
  .round-board,
  .panel,
  .match-analysis,
  .story-card
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: rgba(6, 87, 115, .92) !important;
  box-shadow: 0 16px 44px rgba(0, 45, 63, .22) !important;
}

body.legacy-tournament-mode-active:not(.before-start) #mainContent :is(
  .fixture,
  .live-feed-item,
  .queue-item,
  .plot-item,
  .match-stat-row
) {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-text) !important;
  background: rgba(4, 75, 101, .68) !important;
}

body.legacy-tournament-mode-active:not(.before-start) #mainContent :is(
  .team-name,
  .match-score,
  .fixture-team,
  .fixture-team .name,
  .panel-heading strong,
  .match-analysis-heading strong,
  #stageRoundLabel,
  #boardTitle
) {
  color: var(--shared-mode-text) !important;
}

/* The standard-route tournament theme carries several :not() clauses, so the
   completed Legacy tournament needs an equally explicit final override. */
body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .matchup > .team,
body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .flag-orb,
body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .flag-orb .country-flag,
body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .team-match-events {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .result-note:not([hidden]) {
  color: var(--shared-mode-text) !important;
  opacity: 1 !important;
  font-weight: 800;
}

body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent .standard-match-tactics {
  border-color: var(--shared-mode-line) !important;
  background-color: rgba(6, 94, 123, .9) !important;
  background-image: none !important;
}

body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent .standard-match-tactics .standard-tactic-buttons {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent .standard-match-tactics .standard-tactic-buttons button {
  border-color: transparent !important;
  color: var(--shared-mode-muted) !important;
  background: rgba(4, 76, 104, .62) !important;
}

body.standard-mode-active.legacy-tournament-mode-active:not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent .standard-match-tactics .standard-tactic-buttons button.active {
  color: var(--shared-mode-accent-ink) !important;
  background: var(--shared-mode-accent) !important;
}

body.standard-mode-active.legacy-tournament-mode-active:not(.before-start) #roundBoard .bracket-heads {
  border-color: var(--shared-mode-line) !important;
  color: var(--shared-mode-muted) !important;
  background: rgba(4, 76, 104, .58) !important;
}

@media (max-width: 720px) {
  body.custom-tournament-mode-active .custom-match-script {
    width: calc(100% - 24px);
    padding: 16px 12px !important;
    border-radius: 16px !important;
  }

  body.custom-tournament-mode-active :is(.custom-match-score-script, .custom-fixed-result-fields .custom-score-script) {
    gap: 8px;
    padding: 10px;
  }

  body.custom-tournament-mode-active :is(.custom-match-score-script, .custom-fixed-result-fields .custom-score-script) input {
    height: 54px !important;
    font-size: 22px !important;
  }

  body.custom-tournament-mode-active .custom-match-goal-row,
  body.custom-tournament-mode-active .custom-goal-row {
    grid-template-columns: minmax(0, 1fr) 72px 38px;
  }

  body.custom-tournament-mode-active :is(.custom-match-goal-row, .custom-goal-row) > :nth-child(3) {
    grid-column: 1 / 3;
    grid-row: 2;
  }

  body.custom-tournament-mode-active :is(.custom-match-goal-row, .custom-goal-row) > button {
    grid-column: 3;
    grid-row: 1 / 3;
  }

  body.custom-tournament-mode-active :is(.custom-match-script, .custom-match-rule-editor) .custom-script-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.custom-tournament-mode-active :is(.custom-match-script, .custom-match-rule-editor) .custom-script-actions button {
    min-width: 0;
    padding-inline: 10px;
  }

  body.custom-tournament-mode-active .custom-editor-modal {
    padding: 10px;
  }

  body.custom-tournament-mode-active .custom-match-rule-editor > .custom-match-teams {
    margin-inline: 12px;
  }

  body.custom-tournament-mode-active .custom-match-rule-editor form {
    padding-inline: 12px;
  }

  body.custom-tournament-mode-active .custom-rule-fields {
    grid-template-columns: minmax(0, 1fr);
  }

  body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #matchStage .matchup > .team {
    padding-inline: 4px !important;
  }

  body.legacy-tournament-mode-active:not(.before-start) #matchStage .team-name {
    overflow: visible !important;
    font-size: clamp(.82rem, 4.4vw, 1.08rem) !important;
    line-height: 1.08 !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  body.legacy-tournament-mode-active:not(.before-start) #matchStage .team-name > span {
    width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
    animation: none !important;
    transform: none !important;
  }

  body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #mainContent .standard-tactic-buttons {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body:is(.custom-tournament-mode-active, .legacy-tournament-mode-active):not(.before-start) #mainContent .standard-tactic-buttons button:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

/* Final shared national-team match surface. Retro editions are deliberately
   excluded so their native match-card and shootout skins remain intact. */
body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage {
  border: 1px solid rgba(164, 232, 255, .28) !important;
  border-radius: 28px !important;
  background-color: rgba(3, 73, 101, .3) !important;
  background-image: linear-gradient(145deg, rgba(255, 255, 255, .045), transparent 48%) !important;
  box-shadow: 0 18px 50px rgba(0, 45, 63, .18) !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .matchup > .team {
  border-color: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .result-note:not([hidden]) {
  color: #fff !important;
  opacity: 1 !important;
  font-weight: 800;
  text-shadow: none !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-stage {
  width: min(720px, calc(100% - 24px)) !important;
  margin: 0 auto 24px !important;
  padding: 16px 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #fff !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-stage-head {
  padding: 0 4px 12px;
  color: #c9eaf5 !important;
  font-size: 9px !important;
  text-shadow: none !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-stage-head strong,
body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-stage-head strong i {
  color: #fff !important;
  text-shadow: none !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-scene {
  margin-top: 0 !important;
  border: 1px solid rgba(190, 237, 255, .28) !important;
  border-radius: 16px !important;
  background:
    linear-gradient(180deg, rgba(4, 93, 128, .2), rgba(2, 62, 86, .72)),
    repeating-linear-gradient(90deg, rgba(190, 237, 255, .035) 0 42px, transparent 42px 84px),
    #075f7f !important;
  box-shadow: none !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-call strong,
body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-ledgers span {
  color: #fff !important;
  text-shadow: none !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-call span {
  color: #c9eaf5 !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-mark {
  border-color: rgba(190, 237, 255, .38) !important;
  background: rgba(2, 62, 86, .7) !important;
  box-shadow: none !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-mark.goal {
  border-color: #5ed6a0 !important;
  background: #5ed6a0 !important;
}

body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-mark.miss {
  border-color: #ff7474 !important;
  background: #ff7474 !important;
}

@media (max-width: 640px) {
  body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage {
    border-radius: 20px !important;
  }

  body:is(.standard-mode-active, .custom-tournament-mode-active, .legacy-tournament-mode-active):not(.retro-mode-active):not(.before-start):not(.custom-match-mode-active):not(.pl-match-mode-active):not(.ucl-match-mode-active) #mainContent #matchStage .penalty-stage {
    width: calc(100% - 12px) !important;
    padding-top: 12px !important;
  }
}

@media (min-width: 721px) and (max-width: 1180px) {
  .competition-folder-saudi-pro-league .competition-folder-art img {
    width: 48px;
    height: 48px;
  }
}

@media (max-width: 700px) {
  .competition-folder-saudi-pro-league .competition-folder-art img {
    width: 44px;
    height: 44px;
  }
}

@media (max-width: 430px) {
  .competition-folder-saudi-pro-league .competition-folder-art img {
    width: 40px;
    height: 40px;
  }
}