/* Pão Duro — ETAPA 12 UX/UI Premium Final */
:root{
  --pd-ease:cubic-bezier(.22,.61,.36,1);
  --pd-shadow-soft:0 14px 34px rgba(15,42,92,.09);
  --pd-shadow-hover:0 18px 42px rgba(15,42,92,.14);
}

/* Entrada das telas e refinamento visual compartilhado Browser/APP */
.screen.active,.desktop-section.active,.content-section.active,.page-section.active{
  animation:pdPremiumEnter .38s var(--pd-ease) both;
}
@keyframes pdPremiumEnter{
  from{opacity:.45;transform:translateY(8px)}
  to{opacity:1;transform:none}
}

/* Cards com elevação discreta e estável */
.card,.summary-card,.metric-card,.report-card,.goal-card,.achievement-card,
.dashboard-card,.premium-card,.settings-panel,.settings-card{
  transition:transform .24s var(--pd-ease),box-shadow .24s var(--pd-ease),border-color .24s ease;
}
@media (hover:hover) and (pointer:fine){
  .card:hover,.summary-card:hover,.metric-card:hover,.report-card:hover,.goal-card:hover,
  .achievement-card:hover,.dashboard-card:hover,.premium-card:hover,.settings-card:hover{
    transform:translateY(-3px);
    box-shadow:var(--pd-shadow-hover);
  }
}

/* Menu mais nítido, sem alterar a navegação */
.sidebar button,.sidebar .menu-item,.desktop-nav button,.nav-item{
  position:relative;
  overflow:hidden;
  transition:background-color .22s ease,color .22s ease,transform .2s var(--pd-ease),box-shadow .22s ease;
}
.sidebar button:active,.sidebar .menu-item:active,.desktop-nav button:active,.nav-item:active{
  transform:scale(.985);
}
.sidebar button.active::before,.sidebar .menu-item.active::before,.desktop-nav button.active::before,.nav-item.active::before{
  content:"";
  position:absolute;
  left:0;top:20%;bottom:20%;width:4px;
  border-radius:0 6px 6px 0;
  background:currentColor;
  opacity:.85;
}

/* Barras de progresso e gráficos */
progress,.progress-bar-fill,.goal-progress-fill,.xp-progress-fill,.report-progress-fill,
[class*="progress"] > [class*="fill"]{
  transition:width .8s var(--pd-ease),transform .8s var(--pd-ease);
}
canvas{transition:opacity .25s ease,filter .25s ease}
.pd-chart-refresh{animation:pdChartRefresh .42s var(--pd-ease)}
@keyframes pdChartRefresh{from{opacity:.35;filter:blur(1px)}to{opacity:1;filter:none}}

/* Números atualizados */
.pd-value-pop{animation:pdValuePop .38s var(--pd-ease)}
@keyframes pdValuePop{0%{transform:translateY(4px);opacity:.45}60%{transform:translateY(-1px)}100%{transform:none;opacity:1}}

/* Medalhas e metas concluídas */
.achievement-unlocked,.badge-unlocked,.medal-unlocked,.goal-completed{
  animation:pdPremiumGlow 1.2s ease both;
}
@keyframes pdPremiumGlow{
  0%{transform:scale(.96);filter:brightness(.92)}
  45%{transform:scale(1.025);filter:brightness(1.12)}
  100%{transform:none;filter:none}
}

/* Botões e foco acessível */
button,.btn,.button,[role="button"]{
  transition:transform .18s var(--pd-ease),box-shadow .22s ease,background-color .22s ease,color .22s ease;
}
button:focus-visible,.btn:focus-visible,.button:focus-visible,[role="button"]:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid rgba(37,99,235,.25);
  outline-offset:2px;
}

/* Responsividade e toque */
@media (max-width:900px){
  .card,.summary-card,.metric-card,.report-card,.goal-card,.achievement-card{
    box-shadow:0 8px 24px rgba(15,42,92,.08);
  }
  button,.btn,.button,.menu-item,.nav-item{min-height:44px}
}

/* Redução de movimento do sistema e da configuração do app */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
html.pd-reduce-motion *,html[data-pd-animations="off"] *{
  animation-duration:.01ms!important;
  animation-iteration-count:1!important;
  transition-duration:.01ms!important;
}