/* Only the game and score panels use Carnival colors; the surrounding page uses the selected theme. */
.wto-carnival-page,
.wto-carnival-page .wto-site-header,
.wto-carnival-page .wto-learning-footer {
  background: var(--wto-bg) !important;
}

.wto-carnival-game .wto-game-help,
.wto-carnival-page .wto-game-help,
.wto-carnival-page .wto-game-sound,
.wto-carnival-page .wto-game-hud {
  color: #ffe8b5 !important;
}
.wto-carnival-game .wto-game-toolbar-link{color:white !important;}

.wto-carnival-game .wto-game-toolbar,
.wto-carnival-page .wto-game-leaderboard h2,
.wto-carnival-page .wto-game-leaderboard li,
.wto-carnival-page .wto-game-leaderboard small {
  color: #fff7df !important;
}

.wto-carnival-stage {
  background: linear-gradient(180deg, #6b1740 0 17%, #a52135 17% 31%, #78182a 31% 100%) !important;
  box-shadow: inset 0 0 0 5px #ffe48e, inset 0 -35px 0 #212842 !important;
}

.wto-carnival-stage::before {
  inset: 19% 0 auto !important;
  height: .8rem !important;
  background: repeating-linear-gradient(90deg, #fff0b5 0 3rem, #f84463 3rem 6rem, #4dbbd1 6rem 9rem) !important;
  box-shadow: 0 9px 0 #7a1538, 0 19px 0 #4b1c4d, 0 70px 0 #7c1730, 0 80px 0 #4c1c4a, 0 140px 0 #72152b, 0 150px 0 #482044 !important;
}

.wto-carnival-tracks {
  z-index: 3 !important;
  inset: 29% 8% 12% !important;
  gap: 1.2rem !important;
}

.wto-carnival-tracks i {
  border-color: rgb(255 213 90 / 82%) !important;
  background: rgb(38 19 64 / 30%) !important;
  box-shadow: 0 4px 0 rgb(54 11 38 / 50%) !important;
}

.wto-carnival-curtain {
  z-index: 8 !important;
  width: 9% !important;
  background: repeating-linear-gradient(90deg, #8d1236 0 12px, #e33355 12px 24px, #b81942 24px 36px, #651029 36px 48px) !important;
}

.wto-carnival-target {
  z-index: 5 !important;
  display: block !important;
  width: 8rem !important;
  min-width: 0 !important;
  height: 5.55rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.wto-carnival-target.is-number-target::before {
  position: absolute;
  top: .15rem;
  right: .05rem;
  display: grid;
  width: 2.55rem;
  height: 2.55rem;
  place-items: center;
  border: 3px solid #451625;
  border-radius: 50%;
  color: #31313c;
  background: repeating-radial-gradient(circle, #fff 0 .32rem, #e83a45 .34rem .64rem, #fff .66rem .93rem, #e83a45 .95rem 1.2rem);
  box-shadow: 0 4px 0 #d5a260;
  content: attr(data-number);
  font-size: 1.1rem;
  font-weight: 900;
}

.wto-carnival-target-duck {
  position: absolute !important;
  bottom: .8rem;
  left: .35rem;
  display: block !important;
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 2.8rem !important;
  line-height: 1 !important;
}

.wto-carnival-target:not(.is-number-target) strong {
  position: absolute;
  bottom: 0;
  left: .15rem;
  min-width: 3.2rem;
  padding: .16rem .35rem;
  border: 2px solid #454553;
  border-radius: .3rem;
  color: #2b2940;
  background: #fff7e5;
  box-shadow: 0 3px 0 #b88450;
  font-size: .98rem;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

.wto-carnival-page .wto-game-leaderboard {
  border-color: #d95c78 !important;
  background: #281641 !important;
  margin-top: 1.25rem !important;
}

.wto-carnival-game .wto-game-levels button,
.wto-carnival-game .wto-game-controls button,
.wto-carnival-game .wto-game-sound button,
.wto-carnival-page .wto-game-board-tabs button,
.wto-carnival-page .wto-game-leaderboard > button {
  border-color: #ffd36d !important;
  color: #fff9df !important;
  background: transparent !important;
  text-shadow: none !important;
}

.wto-carnival-game .wto-game-levels button.is-active,
.wto-carnival-page .wto-game-board-tabs button.is-active,
.wto-carnival-game .wto-game-controls button:first-child {
  background: #ff5572 !important;
  color: #fff !important;
}

.wto-carnival-page .wto-game-leaderboard li,
.wto-carnival-page .wto-game-leaderboard li strong,
.wto-carnival-page .wto-game-leaderboard li small,
.wto-carnival-page .wto-game-leaderboard > button {
  color: #fff7df !important;
}

.wto-carnival-target-duck {
  color: #fff4a3 !important;
  filter: drop-shadow(0 2px 1px #491233) drop-shadow(0 0 5px #ffdf61) !important;
}

.wto-carnival-target.is-number-target::before {
  font-size: 1.5rem !important;
  font-weight: 900 !important;
}

.wto-carnival-target.is-number-target {
  width: 3.2rem !important;
  height: 4.2rem !important;
}

.wto-carnival-target.is-number-target strong {
  display: none !important;
}

/* Keep every score value legible against the dark Carnival toolbar. */
.wto-carnival-game .wto-game-hud span {
  color: #fff1c6 !important;
  font-weight: 700;
}

.wto-carnival-game .wto-game-hud b {
  color: #ffffff !important;
  font-weight: 900;
  text-shadow: 0 1px 2px #210d2c;
}

/* Larger bullseyes use a white center so typed numbers are clear at a glance. */
.wto-carnival-target.is-number-target {
  width: 4.5rem !important;
  height: 4.6rem !important;
}

.wto-carnival-target.is-number-target::before {
  top: .2rem !important;
  right: .2rem !important;
  width: 3.45rem !important;
  height: 3.45rem !important;
  border: 3px solid #3b1426 !important;
  color: #17233b !important;
  background: radial-gradient(circle, #ffffff 0 31%, #ed3f4d 32% 46%, #fffdf3 47% 61%, #ed3f4d 62% 76%, #ffe8a0 77% 100%) !important;
  box-shadow: 0 4px 0 #c58d58, 0 0 0 2px #fff5d1 !important;
  font-size: 2rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-shadow: 0 1px 0 #ffffff;
}

/* A representative Carnival gallery scene appears before play and on Games. */
.wto-carnival-preview-target,
.wto-carnival-tile .wto-carnival-tile-target {
  display: grid !important;
  place-items: center;
  width: 3.25rem;
  height: 3.25rem;
  padding: 0 !important;
  border: 3px solid #3b1426 !important;
  border-radius: 50% !important;
  color: #17233b !important;
  background: radial-gradient(circle, #ffffff 0 31%, #ed3f4d 32% 46%, #fffdf3 47% 61%, #ed3f4d 62% 76%, #ffe8a0 77% 100%) !important;
  box-shadow: 0 4px 0 #c58d58, 0 0 0 2px #fff5d1 !important;
  font-size: 1.75rem !important;
  font-weight: 900 !important;
  line-height: 1;
}

.wto-carnival-preview-duck,
.wto-carnival-tile .wto-carnival-tile-duck {
  display: grid;
  justify-items: center;
  color: #fff6ac;
  text-align: center;
}

.wto-carnival-preview-duck b,
.wto-carnival-tile .wto-carnival-tile-duck b {
  display: block;
  margin-top: -.2rem;
  padding: .08rem .3rem;
  border: 2px solid #47364b;
  border-radius: .25rem;
  color: #20233a;
  background: #fff8dd;
  box-shadow: 0 2px 0 #b88450;
  font-size: .68rem;
  line-height: 1.15;
}

@media (max-width: 680px) {
  .wto-carnival-target { transform: scale(.82); transform-origin: center; }
  .wto-carnival-curtain { width: 11% !important; }
  .wto-carnival-tracks { right: 10%; left: 10%; gap: .75rem !important; }
}