/* Correções das telas de menu: legibilidade, hierarquia dos botões e estados bloqueados. */

/* o título da escolha de adversário fica sempre acima das cabeças */
.wizard-heading {
  position: relative;
  z-index: 3;
}
.wizard-cast {
  position: relative;
  z-index: 1;
}
@media (min-width: 651px) {
  .wizard-character svg {
    transform: scale(1.16);
  }
}

/* um único botão principal, sempre verde-limão (antes o "Continuar" lilás parecia desabilitado) */
.wizard-next,
.wizard-step-2 .wizard-next {
  background: #e4ff35;
  border-color: #e4ff35;
  color: #24152f;
  box-shadow: 0 4px 0 #9cae1c;
}

/* capítulos bloqueados: dessaturados, com cadeado, sem destaque de foco/hover */
.campaign-chapter-pick.locked {
  cursor: not-allowed;
}
.campaign-chapter-pick.locked .campaign-hero,
.campaign-chapter-pick.locked .campaign-location {
  filter: grayscale(0.9) brightness(0.55);
}
.campaign-chapter-pick.locked .campaign-card-copy {
  opacity: 0.62;
}
.campaign-chapter-pick.locked,
.campaign-chapter-pick.locked:hover {
  border-color: #5b4868 !important;
  transform: none !important;
}
.campaign-chapter-pick.locked::after {
  content: '';
  position: absolute;
  top: 12px;
  right: 12px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #24152fe6 center/22px no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e4ff35' stroke-width='2.4' stroke-linecap='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E");
  box-shadow: 0 0 0 2px #5b4868;
}
.campaign-chapter-pick.locked .campaign-lock {
  color: #e4ff35;
  font-weight: 800;
  letter-spacing: 0.04em;
}

/* modos com peças de verdade */
.wizard-mode-icon.mode-tiles {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  width: auto;
  min-width: 72px;
  height: auto;
  padding: 8px 12px;
  background: #24152f;
}
.wizard-mode-icon.mode-tiles img {
  height: 56px;
  width: auto;
  filter: drop-shadow(0 3px 0 #14081f80);
}
.mode-tiles-3 img:nth-child(1) {
  rotate: -8deg;
  translate: 0 4px;
}
.mode-tiles-3 img:nth-child(3) {
  rotate: 8deg;
  translate: 0 4px;
}
.wizard-option:hover .mode-tiles img,
.wizard-option.on .mode-tiles img {
  animation: mode-tile-bob 0.9s ease-in-out infinite alternate;
}
.wizard-option .mode-tiles img:nth-child(2) {
  animation-delay: 0.15s;
}
.wizard-option .mode-tiles img:nth-child(3) {
  animation-delay: 0.3s;
}
@keyframes mode-tile-bob {
  to {
    translate: 0 -4px;
  }
}

/* cada lugar tem clima próprio no fundo (o skate de dia, o fliperama à noite) */
.club-layered[data-environment='garden'] .scene-backdrop {
  filter: saturate(1.2) hue-rotate(18deg) brightness(1.06);
  transition: filter 0.4s;
}
.club-layered[data-environment='cafe'] .scene-backdrop {
  filter: brightness(0.48) saturate(1.35) hue-rotate(-28deg) contrast(1.1);
  transition: filter 0.4s;
}
.club-layered[data-environment='atelier'] .scene-backdrop {
  transition: filter 0.4s;
}

/* opções sobre o cenário: atalhos em grade */
.settings-screen {
  background: transparent;
  isolation: isolate;
}
.settings-screen > .scene-backdrop,
.settings-screen > .scene-foreground {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.settings-screen > .scene-backdrop {
  z-index: -3;
}
.settings-screen > .scene-foreground {
  z-index: -2;
  background-position: center bottom;
}
.settings-screen .panel {
  position: relative;
  z-index: 2;
}
.kbd-grid {
  list-style: none;
  margin: 6px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 6px;
}
.kbd-grid li {
  padding: 6px 10px;
  border-radius: 10px;
  background: #ffffff10;
  border: 1px solid #ffffff1f;
  font-size: 13px;
  font-weight: 700;
}

/* resultado: as peças que valeram pontos caem antes da contagem */
.result-paid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 5px;
  margin: 2px 0 -4px;
}
.result-paid img {
  height: 30px;
  width: auto;
  opacity: 0;
  animation: paid-drop 0.42s cubic-bezier(0.3, 1.6, 0.5, 1) forwards;
  filter: drop-shadow(0 3px 0 #14081f66);
}
@keyframes paid-drop {
  from {
    opacity: 0;
    translate: 0 -26px;
    rotate: -12deg;
  }
  to {
    opacity: 1;
    translate: 0 0;
    rotate: 0deg;
  }
}
.reduced .result-paid img {
  animation: none;
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .result-paid img {
    animation: none;
    opacity: 1;
  }
}

/* celular em pé: o elenco da abertura desce um pouco para as orelhas não serem cortadas pelo topo */
@media (max-width: 650px) and (orientation: portrait) {
  #screens .cartoon-title > .title-cast {
    inset: 10% 0 auto;
  }
  #screens .cartoon-title .title-dominoes {
    translate: 0 34px;
    scale: 0.86;
  }
  .title-cast .title-friend svg {
    transform: scale(1.02);
    transform-origin: 50% 60%;
  }
}

/* End of game/assets/screens-fix-B3XmxqJN.css */