/* Learn by Playing — microinterações globais (controle interno 10.4.4) */
:root{--lbp-ease:cubic-bezier(.2,.8,.2,1);--lbp-press:.975}

/* Botões e controles acionáveis — resposta visual consistente */
button,.btn,.option,.quick-action,.entry-role-card,.google-auth-btn,.result-home-btn,.result-send-btn,.result-back-btn,.result-exit-btn,.review-icon-btn,.course-card button,.teacher-nav .tab{
  -webkit-tap-highlight-color:transparent;
}
.btn,.option,.quick-action,.entry-role-card,.google-auth-btn,.result-home-btn,.result-send-btn,.result-back-btn,.result-exit-btn,.review-icon-btn,.teacher-nav .tab,.lbp-mini-toggle{
  position:relative;
  overflow:hidden;
  transform:translateZ(0);
  transition:transform .16s var(--lbp-ease),box-shadow .2s var(--lbp-ease),filter .2s var(--lbp-ease),background-color .2s ease,border-color .2s ease,color .2s ease!important;
  will-change:transform;
}
@media(hover:hover) and (pointer:fine){
  .btn:hover,.google-auth-btn:hover,.result-home-btn:hover,.result-send-btn:hover,.result-back-btn:hover,.result-exit-btn:hover,.review-icon-btn:hover{
    transform:translateY(-2px)!important;
    filter:saturate(1.06) brightness(1.025);
    box-shadow:0 10px 24px rgba(15,23,42,.13)!important;
  }
  .option:hover{transform:translateY(-2px) scale(1.008);border-color:color-mix(in srgb,var(--primary) 58%,#cbd5e1)!important;box-shadow:0 9px 22px rgba(15,23,42,.10)!important}
  .quick-action:hover,.entry-role-card:hover{transform:translateY(-3px)!important;box-shadow:0 13px 28px rgba(15,23,42,.11)!important}
  #screen-teacher .teacher-nav .tab:hover{transform:translateX(3px)!important}
}
.btn:active,.option:active,.quick-action:active,.entry-role-card:active,.google-auth-btn:active,.result-home-btn:active,.result-send-btn:active,.result-back-btn:active,.result-exit-btn:active,.review-icon-btn:active,.teacher-nav .tab:active,.lbp-mini-toggle:active{
  transform:scale(var(--lbp-press))!important;
  filter:brightness(.97) saturate(1.08)!important;
  transition-duration:.07s!important;
}
button:focus-visible,.btn:focus-visible,.option:focus-visible,.quick-action:focus-visible,.entry-role-card:focus-visible,.google-auth-btn:focus-visible,.review-icon-btn:focus-visible{
  outline:3px solid color-mix(in srgb,var(--primary) 46%,transparent)!important;
  outline-offset:3px!important;
}

/* Feedback de clique via delegação JS */
.lbp-clicked{animation:lbpClickPulse .26s var(--lbp-ease)!important}
.lbp-clicked::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;animation:lbpActionGlow .35s ease-out}
@keyframes lbpClickPulse{0%{transform:scale(1)}42%{transform:scale(.965)}100%{transform:scale(1)}}
@keyframes lbpActionGlow{0%{box-shadow:inset 0 0 0 0 rgba(255,255,255,.0)}35%{box-shadow:inset 0 0 0 999px rgba(255,255,255,.14)}100%{box-shadow:inset 0 0 0 999px rgba(255,255,255,0)}}

/* Professor — navegação, atalhos e CTA */
#screen-teacher .teacher-nav .tab.active{transform:translateX(2px);box-shadow:inset 3px 0 0 #38bdf8,0 6px 18px rgba(37,99,235,.12)!important}
#screen-teacher .quick-action i{transition:transform .2s var(--lbp-ease),filter .2s ease}
@media(hover:hover) and (pointer:fine){#screen-teacher .quick-action:hover i{transform:scale(1.12) rotate(-3deg);filter:saturate(1.2)}}
#screen-teacher .btn.primary,#screen-teacher .btn.green{box-shadow:0 5px 14px rgba(37,99,235,.12)}
#screen-teacher .btn.green{box-shadow:0 5px 14px rgba(22,163,74,.13)}
#screen-teacher .review-icon-btn[data-action="validate"],#screen-teacher .question-review-actions .green{transition:all .18s var(--lbp-ease)!important}

/* Aluno — opções com mais “vida” e seleção inequívoca */
#screen-game .option{border:1px solid color-mix(in srgb,var(--primary) 24%,var(--border));box-shadow:0 3px 10px rgba(0,0,0,.045)}
#screen-game .option b{display:inline-block;transition:transform .18s var(--lbp-ease),color .18s ease}
@media(hover:hover) and (pointer:fine){#screen-game .option:hover b{transform:translateX(2px) scale(1.04);color:var(--primary)}}
#screen-game .option.selected,#screen-game .order-choice.selected,#screen-game .order-choice[disabled]{border-color:var(--primary)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 20%,transparent)!important}
#screen-game .btn.green,#screen-game .btn.primary,#screen-game .btn.danger{box-shadow:0 6px 16px rgba(0,0,0,.12)}

/* Cards acionáveis da entrada */
.entry-role-card .entry-role-icon{transition:transform .22s var(--lbp-ease),box-shadow .22s ease}
.entry-role-card>i:last-child{transition:transform .2s var(--lbp-ease)}
@media(hover:hover) and (pointer:fine){.entry-role-card:hover .entry-role-icon{transform:scale(1.07)}.entry-role-card:hover>i:last-child{transform:translateX(4px)}}

/* Ações de resultado/certificado */
.result-send-btn i,.result-home-btn i,.btn i{transition:transform .18s var(--lbp-ease)}
@media(hover:hover) and (pointer:fine){.result-send-btn:hover i,.btn:hover i{transform:translateY(-1px) scale(1.06)}}

/* Sem animações = interface estática, mas estados permanecem claros */
body.low-motion *,body.low-motion *::before,body.low-motion *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
