/* Login: cartão de vidro sobre névoa; formulário à esquerda, gravura em pontilhado à direita. */
.entry-wrap { position: relative; z-index: 1; min-height: 100dvh; display: grid; place-items: center; padding: clamp(14px, 4vw, 48px); }
.frame { width: min(1040px, 100%); padding: 8px; }
.entry-card { display: grid; grid-template-columns: minmax(300px, 420px) 1fr; min-height: min(640px, calc(100dvh - 64px)); overflow: hidden; }

.entry-form { display: flex; flex-direction: column; justify-content: center; gap: 18px; padding: clamp(28px, 5vw, 64px) clamp(24px, 4.5vw, 56px); }
.entry-form .mark { margin-bottom: clamp(14px, 4vh, 40px); }
.entry-head { display: grid; gap: 8px; margin-bottom: 6px; }
.entry-head p { margin: 0; }
.entry-form .btn { margin-top: 2px; }
.entry-foot { margin: 6px 0 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; }
.live { display: inline-flex; align-items: center; gap: 7px; }
.live i { width: 6px; height: 6px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 0 rgba(47, 107, 79, .5); animation: pulse 2.4s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 7px rgba(47, 107, 79, 0); } 100% { box-shadow: 0 0 0 0 rgba(47, 107, 79, 0); } }

.entry-art { position: relative; background: var(--card); overflow: hidden; }
.entry-art .scene { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 22%); mask-image: linear-gradient(90deg, transparent 0, #000 22%); }
.entry-caption { position: absolute; left: 28px; bottom: 24px; margin: 0; font: 400 20px/1.15 var(--serif); letter-spacing: -.02em; color: var(--ink); background: color-mix(in srgb, var(--card) 82%, transparent); padding: 10px 14px; border-radius: var(--r-md); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.entry-caption em { font: italic 400 1.12em/1 var(--italic); }

/* acesso liberado: a cena "engole" o cartão */
body.leaving .frame { transition: transform .7s var(--ease), opacity .7s var(--ease), filter .7s; transform: scale(.97); opacity: 0; filter: blur(6px); }

@media (max-width: 760px) {
  .entry-card { grid-template-columns: 1fr; min-height: 0; }
  .entry-art { order: -1; height: 170px; }
  .entry-art .scene { -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent); }
  .entry-caption { display: none; }
  .entry-form { padding: 8px 24px 30px; }
  .entry-form .mark { margin: 0 0 6px; }
}

/* cofre do Finanças: só o formulário, cartão estreito */
.cofre-frame { width: min(460px, 100%); }
.cofre-back { align-self: center; margin-top: 4px; }

/* convite: quatro campos, sem apertar */
.invite-fields { display: grid; gap: 14px; }
.invite-fields[hidden] { display: none; }