/* Entrada Ágape: estilos isolados do painel autenticado. */
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 400; font-display: swap; src: url("assets/manrope-regular.ttf") format("truetype"); }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 600; font-display: swap; src: url("assets/manrope-semibold.ttf") format("truetype"); }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 700 900; font-display: swap; src: url("assets/manrope-bold.ttf") format("truetype"); }
.login-scene {
  font-family: "Manrope", "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  isolation: isolate;
  grid-template-columns: minmax(320px, 560px) minmax(0, 1fr);
  gap: clamp(40px, 5vw, 96px);
  padding: 40px clamp(28px, 5vw, 96px);
  background: #010f20;
}
.login-scene::before {
  content: ""; position: absolute; z-index: 1; pointer-events: none;
  inset: 0 60% 0 0;
  background: radial-gradient(circle, #1676b878 1.3px, transparent 1.8px) 0 0 / 13px 13px;
  mask-image: linear-gradient(90deg, #000, transparent 32%);
}
.login-scene::after {
  content: ""; position: absolute; z-index: 1; pointer-events: none;
  inset: 0;
  background: radial-gradient(ellipse at 3% 18%,#07416a55,transparent 38%),radial-gradient(ellipse at 50% 98%,#e2ae501c,transparent 18%);
}
.login-ribbons { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }
.login-art {
  inset: 0 0 0 38%;
  background: url("assets/login-congregation.png") center 65% / cover no-repeat;
  filter: saturate(.9) contrast(1.13) brightness(.82);
  mask-image: linear-gradient(90deg,transparent,#000 18%);
}
.login-veil {
  inset: 0; pointer-events: none;
  background: linear-gradient(90deg,#010f20 0%,#010f20f5 30%,#010f2055 58%,#010f2020),linear-gradient(0deg,#010f20 0%,#010f20fa 13%,#010f20b8 38%,#031b3645 75%);
}
.login-entry { position: relative; z-index: 2; min-width: 0; width: 100%; }
.login-official-brand { display: block; width: min(100%, 450px); height: auto; margin: 0 auto 30px; object-fit: contain; }
.login-scene .login-card {
  width: 100%; margin: 0; padding: 32px 34px 25px;
  border-radius: 28px; border: 1px solid transparent;
  background: radial-gradient(ellipse at 0 0,#124674db,transparent 48%) padding-box,linear-gradient(125deg,#05243cea,#010f20f7 58%,#161b25ed) padding-box,linear-gradient(135deg,#8fd4ff,#284b65 25%,#3e454a 70%,#d6b7758c) border-box;
  box-shadow: 0 24px 64px #0007, inset 0 1px #c8e8ff2b, inset 1px 0 #70c6ff25;
  backdrop-filter: blur(18px);
}
.login-card h1 { font-size: clamp(34px,3.3vw,48px); font-weight: 700; letter-spacing: -.045em; line-height: 1.18; }
.login-card h1 span, .login-story h2 span { color: #f2c367; background: linear-gradient(180deg,#ffe0a0,#e7ae4a); background-clip: text; -webkit-text-fill-color: transparent; }
.login-card .eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .2em; margin-bottom: 12px; }
.login-card .version-label { font-size: 12px; font-weight: 600; line-height: 1.5; letter-spacing: .1em; }
.login-card .login-copy { font-size: 16px; line-height: 1.55; margin: 18px 0 24px; }
.login-card .area-card { min-height: 100px; border-radius: 16px; padding: 16px; }
.login-card .area-card small { font-size: 14px; }
.login-card .area-cta { font-size: 14px; }
.login-card .operator-stage { margin-top: 20px; }
.login-card .picker-label { font-size: 14px; line-height: 1.5; }
.login-card label { font-size: 14px; line-height: 1.5; }
.login-card input { min-height: 54px; border-radius: 14px; background: linear-gradient(110deg,#163b5be0,#0b1c2dda); border-color: #81abc34d; font-size: 16px; font-weight: 400; box-shadow: inset 0 1px #bedfff0f; }
.login-card label { font-weight: 600; }
.login-card .password-field input { padding-right: 84px; }
.login-card .password-field button { min-height: 44px; bottom: 5px; font-size: 14px; }
.login-card #loginButton { min-height: 58px; margin-top: 24px; border-radius: 17px; background: linear-gradient(110deg,#efc875,#dca74c 60%,#f2d48b); box-shadow: inset 0 1px #fff8,0 6px 24px #dca74c17; font-size: 19px; }
.login-card #loginButton:disabled { opacity: 1; color: #4d3c21; background: linear-gradient(115deg,#dabb7e,#c49a51 60%,#e2c58b); box-shadow: inset 0 1px #fff5; }
.login-card .login-footer { flex-wrap: wrap; gap: 12px; border-top: 1px solid #9bbacf32; padding-top: 20px; margin-top: 24px; }
.login-card .login-actions { justify-content: center; gap: 12px; }
.login-card .text-button { font-size: 14px; min-height: 44px; }
.login-card .connection-badge { font-size: 12px; }
.login-card .status-message { font-size: 13px; line-height: 1.5; }
.login-story { position: relative; z-index: 2; align-self: end; padding-bottom: 18px; max-width: 760px; min-width: 0; }
.login-kicker { color: #efc164; font-size: 14px; font-weight: 700; letter-spacing: .18em; margin: 0 0 16px; }
.login-kicker::before { content: ""; display: block; width: 44px; height: 2px; background: #ddb04f; margin-bottom: 16px; }
.login-story h2 { font-size: clamp(36px,3.7vw,60px); font-weight: 700; line-height: 1.1; letter-spacing: -.045em; margin: 0; text-wrap: balance; }
.login-story-copy { font-size: 19px; line-height: 1.5; margin: 22px 0 32px; color: #e0e8ed; }
.login-highlights { list-style: none; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; padding: 0; margin: 0; text-align: center; }
.login-highlights li { min-width: 0; }
.login-feature-icon { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 50%; border: 1px solid #d8ac56; margin: 0 auto 12px; background: radial-gradient(circle at 40% 22%,#ddad4e26,#05182ac7 55%,#010c19); box-shadow: 0 0 25px #e3b45118,inset 0 1px 3px #ffdf962e; color: #f3c56e; }
.login-feature-icon svg { filter: drop-shadow(0 1px 3px #e8af3540); }
.login-feature-icon svg { width: 30px; height: 30px; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.login-highlights strong { display: block; font-size: 16px; margin-bottom: 8px; }
.login-highlights small { font-size: 14px; line-height: 1.45; color: #d3dce5; }
.login-story blockquote { margin: 36px auto 0; text-align: center; max-width: 540px; font-size: 16px; line-height: 1.6; font-style: italic; color: #e3e7eb; }
.login-story cite { display: block; margin-top: 12px; font-size: 12px; letter-spacing: .18em; font-style: normal; color: #efc164; }
@media (max-width: 1100px) and (min-width: 761px) {
  .login-scene { grid-template-columns: minmax(320px,1fr) minmax(0,1fr); gap: 32px; padding: 30px; }
  .login-highlights { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
  .login-story h2 { font-size: 40px; }
}
@media (max-width: 760px) {
  .login-scene { display: block; padding: 28px 16px 32px; overflow: hidden; }
  .login-art { position: absolute; inset: 0 0 auto; height: 440px; background-position: center bottom; background-size: cover; mask-image: none; }
  .login-veil { inset: 0; height: auto; width: auto; background: linear-gradient(180deg,#010f2030 0,#010f2070 190px,#010f20f0 440px,#010f20 600px); }
  .login-ribbons { width: 200%; height: 700px; left: -35%; }
  .login-official-brand { width: min(100%,360px); margin: 0 auto 120px; filter: drop-shadow(0 3px 8px #0009); }
  .login-scene .login-card { padding: 27px 20px 20px; border-radius: 22px; }
  .login-card h1 { font-size: clamp(32px,9vw,42px); }
  .login-card .login-copy { font-size: 16px; }
  .login-card .area-card { flex-wrap: wrap; gap: 10px; padding: 14px; }
  .login-card .area-copy { flex: 1; }
  .login-card .area-cta { width: 100%; text-align: center; padding: 10px; }
  .login-story { padding: 38px 8px 0; margin: 0 auto; }
  .login-story h2 { font-size: 38px; }
  .login-story-copy { font-size: 17px; }
  .login-highlights { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px 12px; }
  .login-story blockquote { font-size: 15px; margin-top: 30px; }
}