/* Entrada V5 — uma porta serena para a mesma preparação vista no produto. */
html.esp-entrar-v5 {
  --v5-canvas: #f5f5f2;
  --v5-paper: #fffdf8;
  --v5-ink: #171820;
  --v5-muted: #667189;
  --v5-soft: #7d8494;
  --v5-line: #d9dde7;
  --v5-line-soft: #e7e8ed;
  --v5-indigo: #5c69d8;
  --v5-indigo-dark: #3e49b8;
  --v5-indigo-pale: #eceefe;
  --v5-coral: #f45d37;
  --v5-coral-dark: #c84225;
  --v5-coral-pale: #ffe8df;
  --v5-lime: #a5d93f;
  --v5-green: #167a52;
  --v5-green-pale: #e2f3e9;
  --v5-red: #b43145;
  color: var(--v5-ink);
  background: var(--v5-canvas);
}

html.esp-entrar-v5 body.app-body {
  min-width: 0;
  color: var(--v5-ink);
  background: var(--v5-canvas);
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
}

html.esp-entrar-v5 .app-gate {
  width: min(1180px, 100%);
  min-height: 100svh;
  margin: 0 auto;
  padding: 28px;
  grid-template-columns: minmax(0, 1.08fr) minmax(380px, .72fr);
  gap: 22px;
  align-items: stretch;
  align-content: center;
  overflow: visible;
  background: var(--v5-canvas);
}

html.esp-entrar-v5 .app-gate-story,
html.esp-entrar-v5 .app-gate-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--v5-line);
  border-radius: 20px;
  background: var(--v5-paper);
  box-shadow: 0 18px 46px rgba(23, 24, 32, .05);
}

html.esp-entrar-v5 .app-gate-story {
  min-height: 760px;
  padding: clamp(34px, 5vw, 62px);
}

html.esp-entrar-v5 .app-gate-story::before,
html.esp-entrar-v5 .app-gate-card::before {
  content: "";
  position: absolute;
  top: -1px;
  right: 26px;
  left: 26px;
  height: 4px;
  background: var(--v5-coral);
}

html.esp-entrar-v5 .app-gate-story::after {
  content: "";
  position: absolute;
  top: -84px;
  right: -72px;
  width: 230px;
  height: 230px;
  border: 1px solid rgba(196, 66, 37, .22);
  border-radius: 50%;
  pointer-events: none;
}

html.esp-entrar-v5 .app-gate-card::before { background: var(--v5-indigo); }

html.esp-entrar-v5 .app-gate-brand {
  color: var(--v5-ink);
  font-family: Inter, sans-serif;
}
html.esp-entrar-v5 .app-gate-brand b { font: 650 16px/1 Inter, sans-serif; letter-spacing: -.04em; }
html.esp-entrar-v5 .app-gate-brand small { color: var(--v5-soft); font: 650 9px/1 Inter, sans-serif; }
html.esp-entrar-v5 .app-gate-mark {
  width: 24px;
  height: 24px;
  color: var(--v5-indigo);
  border-color: var(--v5-indigo);
}
html.esp-entrar-v5 .app-gate-mark::before { width: 10px; height: 10px; border-color: #9ea7eb; }
html.esp-entrar-v5 .app-gate-mark i { background: var(--v5-lime); }

html.esp-entrar-v5 .app-gate-story-copy {
  width: min(590px, 100%);
  margin: clamp(54px, 10vh, 96px) 0;
}

html.esp-entrar-v5 .app-gate-kicker,
html.esp-entrar-v5 .app-gate-card-kicker,
html.esp-entrar-v5 .app-gate-card-folio {
  color: var(--v5-indigo-dark);
  font: 600 10px/1.35 "IBM Plex Mono", monospace;
  letter-spacing: .13em;
}

html.esp-entrar-v5 .app-gate-story-title {
  max-width: 9ch;
  margin: 14px 0 16px;
  color: var(--v5-ink);
  font: 650 clamp(40px, 5vw, 62px)/.98 Inter, sans-serif;
  letter-spacing: -.065em;
}

html.esp-entrar-v5 .app-gate-story-copy > p:not(.app-gate-story-title) {
  max-width: 54ch;
  color: var(--v5-muted);
  font: 400 14px/1.62 Inter, sans-serif;
}

html.esp-entrar-v5 .app-gate-ledger { margin-top: 32px; border-color: var(--v5-line); }
html.esp-entrar-v5 .app-gate-ledger > div {
  grid-template-columns: 28px minmax(116px, .72fr) minmax(90px, 1fr) 44px;
  min-height: 54px;
  border-color: var(--v5-line-soft);
}
html.esp-entrar-v5 .app-gate-ledger span { color: var(--v5-soft); font-family: "IBM Plex Mono", monospace; }
html.esp-entrar-v5 .app-gate-ledger b,
html.esp-entrar-v5 .app-gate-ledger strong { color: var(--v5-ink); font: 600 12px/1.2 Inter, sans-serif; }
html.esp-entrar-v5 .app-gate-ledger i { background: var(--v5-line); }
html.esp-entrar-v5 .app-gate-ledger em { background: var(--v5-indigo); }
html.esp-entrar-v5 .app-gate-ledger > div:first-child em { background: var(--v5-coral); }
html.esp-entrar-v5 .app-gate-ledger > div:last-child em { background: var(--v5-green); }

html.esp-entrar-v5 .app-gate-story-note { color: var(--v5-muted); font: 500 12px/1.45 Inter, sans-serif; }
html.esp-entrar-v5 .app-gate-story-note span { background: var(--v5-lime); box-shadow: 0 0 0 5px rgba(165,217,63,.17); }

html.esp-entrar-v5 .app-gate-card {
  display: flex;
  align-self: stretch;
  flex-direction: column;
  width: min(438px, 100%);
  margin: 0 auto;
  padding: 36px 36px 28px;
  background: var(--v5-paper);
  text-align: left;
}
html.esp-entrar-v5 .app-gate-card-head { margin-bottom: 20px; }
html.esp-entrar-v5 .app-gate-card-folio { color: var(--v5-soft); letter-spacing: .1em; }

html.esp-entrar-v5 .app-gate-card h1 {
  max-width: 15ch;
  margin-bottom: 10px;
  color: var(--v5-ink);
  font: 650 30px/1.04 Inter, sans-serif;
  letter-spacing: -.055em;
}
html.esp-entrar-v5 .app-gate-card > #ent-sub {
  margin-bottom: 25px;
  color: var(--v5-muted);
  font: 400 12px/1.55 Inter, sans-serif;
}

html.esp-entrar-v5 .app-gate-field { gap: 7px; margin-bottom: 13px; }
html.esp-entrar-v5 .app-gate-field > span,
html.esp-entrar-v5 .app-gate-password-field > label { color: var(--v5-ink); font: 600 12px/1.3 Inter, sans-serif; letter-spacing: 0; }
html.esp-entrar-v5 .app-gate-card .app-input {
  min-height: 50px;
  padding: 0 14px;
  color: var(--v5-ink);
  border: 1px solid var(--v5-line);
  border-radius: 10px;
  background: #fffefa;
  font: 500 14px/1 Inter, sans-serif;
}
html.esp-entrar-v5 .app-gate-card .app-input::placeholder { color: #949aa8; }
html.esp-entrar-v5 .app-gate-card .app-input:hover { border-color: #adb4c4; }
html.esp-entrar-v5 .app-gate-card .app-input:focus {
  border-color: var(--v5-indigo);
  box-shadow: 0 0 0 3px rgba(92,105,216,.12);
}
html.esp-entrar-v5 .app-gate-password-row { position:relative; display:block; color:inherit; font:inherit; }
html.esp-entrar-v5 .app-gate-password-row .app-input { width:100%; padding-right:82px; }
html.esp-entrar-v5 .app-gate-password-row button {
  position:absolute;
  top:3px;
  right:4px;
  min-width:68px;
  min-height:44px;
  padding:0 10px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--v5-indigo-dark);
  font:600 11px/1 Inter,sans-serif;
}
html.esp-entrar-v5 .app-gate-password-row button:hover { background:var(--v5-indigo-pale); }
html.esp-entrar-v5 .app-gate-field-error { margin-top:-1px; color:var(--v5-red); font:500 11px/1.4 Inter,sans-serif; }
html.esp-entrar-v5 .app-input[aria-invalid="true"] { border-color:var(--v5-red); }

html.esp-entrar-v5 .app-gate-btn {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  margin-top: 5px;
  padding: 0 17px;
  color: #fff;
  border: 0;
  border-radius: 12px;
  background: var(--v5-ink);
  font: 650 12px/1 Inter, sans-serif;
  box-shadow: none;
}
html.esp-entrar-v5 .app-gate-btn::after { content: "→"; font-size: 15px; font-weight: 400; }
html.esp-entrar-v5 .app-gate-btn:hover { background: #292b35; transform: none; box-shadow: none; }
html.esp-entrar-v5 .app-gate-btn:disabled { color: #7a7d85; background: #d8d9d7; cursor: wait; }

html.esp-entrar-v5 .app-gate-foot {
  margin-top: 13px !important;
  color: var(--v5-muted);
  font: 400 12px/1.45 Inter, sans-serif;
}
html.esp-entrar-v5 .app-gate-foot a,
html.esp-entrar-v5 .app-gate-foot .ma-linklike,
html.esp-entrar-v5 .app-gate-card .ma-linklike { color: var(--v5-indigo-dark); font-weight: 600; }
html.esp-entrar-v5 .app-gate-foot .ma-linklike:hover,
html.esp-entrar-v5 .app-gate-card .ma-linklike:hover { color: var(--v5-coral-dark); }

html.esp-entrar-v5 .app-gate-err,
html.esp-entrar-v5 .app-gate-ok {
  margin: 0 0 13px;
  padding: 11px 12px;
  border: 1px solid #ecc9cf;
  border-radius: 10px;
  color: var(--v5-red);
  background: #fff2f3;
  font: 500 12px/1.5 Inter, sans-serif;
}
html.esp-entrar-v5 .app-gate-ok { margin-top: 13px; color: var(--v5-green); border-color: #c7e5d5; background: var(--v5-green-pale); }

html.esp-entrar-v5 .app-gate-card .app-gate-secure {
  margin-top: auto;
  padding-top: 15px;
  color: var(--v5-muted);
  border-color: var(--v5-line);
  font: 400 12px/1.45 Inter, sans-serif;
}
html.esp-entrar-v5 .app-gate-secure span { background: var(--v5-green); }

html.esp-entrar-v5 :is(a,button,input):focus-visible { outline: 2px solid var(--v5-indigo); outline-offset: 2px; box-shadow: none; }

@media (max-width: 880px) {
  html.esp-entrar-v5 .app-gate {
    width: min(620px, 100%);
    padding: 18px;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    align-content: start;
  }
  html.esp-entrar-v5 .app-gate-story { min-height: 0; padding: 26px 28px; }
  html.esp-entrar-v5 .app-gate-story-copy { margin: 40px 0 4px; }
  html.esp-entrar-v5 .app-gate-story-title { max-width: none; font-size: 38px; }
  html.esp-entrar-v5 .app-gate-story-note { display: none; }
  html.esp-entrar-v5 .app-gate-card { display: block; align-self: auto; width: 100%; margin: 0; }
  html.esp-entrar-v5 .app-gate-card .app-gate-secure { margin-top: 20px; }
}

@media (max-width: 480px) {
  html.esp-entrar-v5 .app-gate { padding: 0 16px 24px; gap: 16px; }
  html.esp-entrar-v5 .app-gate-story {
    overflow: visible;
    padding: 22px 4px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  html.esp-entrar-v5 .app-gate-story::before,
  html.esp-entrar-v5 .app-gate-story::after,
  html.esp-entrar-v5 .app-gate-story-copy { display: none; }
  html.esp-entrar-v5 .app-gate-card {
    padding: 29px 20px 24px;
    border: 1px solid var(--v5-line);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(23, 24, 32, .045);
  }
  html.esp-entrar-v5 .app-gate-card h1 { font-size: 28px; }
  html.esp-entrar-v5 .app-gate-btn { min-height: 52px; }
}

@media (prefers-reduced-motion: reduce) {
  html.esp-entrar-v5 .app-gate-btn,
  html.esp-entrar-v5 .app-input { transition: none; }
}