/* Meu Espaço · Gestão — camada de movimento isolada do site público.
   Apenas apresentação. Nunca substitui eventos, rotas ou fluxos do app. */
:root {
  --me-ease-out: cubic-bezier(.16,1,.3,1);
  --me-ease-smooth: cubic-bezier(.65,0,.35,1);
  --me-motion-border: rgba(180,180,190,.22);
}
.me-motion .main-enter { animation: none; }

/* A splash continua vinculada ao carregamento real. Nenhum delay de autenticação. */
.me-motion .boot .spinner { filter: drop-shadow(0 0 10px rgba(245,245,250,.2)); }
.me-motion .boot p { animation: me-breath 2.2s ease-in-out infinite; }
@keyframes me-breath { 50% { opacity: .64; } }

/* Efeitos de interface não escondem conteúdo antes do JavaScript iniciar. */
.me-motion .card,
.me-motion .callout,
.me-motion .round,
.me-motion .btn,
.me-motion .nav-links button,
.me-motion .mobile-menu button,
.me-motion .mobile-more summary {
  transition-property: transform, background-color, border-color, box-shadow, opacity;
  transition-duration: 200ms;
  transition-timing-function: var(--me-ease-out);
}
@media (hover: hover) and (pointer: fine) {
  .me-motion .card:hover { box-shadow: 0 18px 48px -20px rgba(0,0,0,.35); border-color: var(--control-border, var(--border)); }
  .me-motion .card.nucleus:hover { transform: translateY(-3px); }
  .me-motion .btn:not(:disabled):hover { transform: translateY(-2px); }
  .me-motion .nav-links button:not(.active):hover { transform: translateX(2px); }
}
.me-motion .btn:not(:disabled):active,
.me-motion .round:not(:disabled):active,
.me-motion .mobile-menu button:not(:disabled):active { transform: scale(.97); }
.me-motion .btn:disabled { cursor: progress; }
.me-motion .auth-card button[type="submit"]:disabled::after {
  content: ""; width: 14px; height: 14px; display: inline-block;
  border: 2px solid currentColor; border-right-color: transparent;
  border-radius: 50%; animation: me-spin .8s linear infinite;
}
@keyframes me-spin { to { transform: rotate(360deg); } }

/* Indicador de navegação que acompanha a mudança de seção sem mover os botões. */
.me-motion .nav-links.me-has-pill { position: relative; isolation: isolate; }
.me-motion .nav-links.me-has-pill > button { position: relative; z-index: 1; }
.me-motion .nav-links.me-has-pill > button.active { background: transparent; }
.me-motion .me-nav-indicator {
  position: absolute; z-index: 0; left: 0; right: 0;
  border-radius: 11px; pointer-events: none; background: #27272c;
  border: 1px solid rgba(255,255,255,.07);
}
.me-motion .nav-links button:focus-visible,
.me-motion .mobile-menu button:focus-visible,
.me-motion .mobile-more summary:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: -3px; }

.me-motion .stat .number { font-variant-numeric: tabular-nums; }
.me-motion .me-sr-only {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden; white-space: nowrap;
  clip-path: inset(50%); border: 0;
}
.me-motion .list-row { transition: background-color .2s ease; border-radius: 8px; }
@media (hover: hover) and (pointer: fine) {
  .me-motion .list-row:hover { background: color-mix(in srgb, var(--text) 3%, transparent); }
}
.me-motion .date-chip,
.me-motion .pill { transition: transform 200ms var(--me-ease-out), background-color 200ms ease; }
.me-motion .list-row:focus-within .date-chip { transform: scale(1.035); }

/* Folhas e caixas existentes permanecem acessíveis com o foco original. */
.me-motion dialog[open] { transform-origin: 50% 45%; }
.me-motion #announce:not([hidden]) { transform-origin: 100% 100%; }

/* Mobile: barra flutuante; o menu Mais continua aberto fora da barra. */
@media (max-width: 710px) {
  .me-motion .app { padding-bottom: calc(98px + env(safe-area-inset-bottom)); }
  .me-motion .mobile-menu {
    left: 12px; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom));
    width: auto; height: 62px; padding-bottom: 0;
    border: 1px solid var(--border); border-radius: 20px;
    background: var(--surface);
    background: color-mix(in srgb, var(--surface) 88%, transparent);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    backdrop-filter: blur(18px) saturate(140%);
    box-shadow: 0 14px 35px -12px rgba(0,0,0,.52);
  }
  .me-motion .mobile-menu > button,
  .me-motion .mobile-more > summary { min-height: 44px; }
  .me-motion .mobile-menu > button.active { position: relative; isolation: isolate; }
  .me-motion .mobile-menu > button.active::before {
    content: ""; position: absolute; inset: 5px 3px;
    border: 1px solid var(--border); border-radius: 13px;
    background: var(--soft); z-index: -1; pointer-events: none;
  }
}

/* Economia de movimento — suporte à troca da preferência durante a sessão. */
@media (prefers-reduced-motion: reduce) {
  .me-motion .boot p,
  .me-motion .auth-card button[type="submit"]:disabled::after { animation: none !important; }
  .me-motion .card, .me-motion .callout, .me-motion .round, .me-motion .btn,
  .me-motion .nav-links button, .me-motion .mobile-menu button,
  .me-motion .list-row, .me-motion .date-chip, .me-motion .pill {
    transition: none !important; transform: none !important;
  }
}
.me-motion.me-motion-paused .boot p { animation-play-state: paused; }