/* Tema auth: obsidiana + âmbar (sem imagem de stock) */
html.auth-html{
  background:#f6f7fb !important;
  background-image:none !important;
}
body.auth{
  font-family:"Plus Jakarta Sans",ui-sans-serif,system-ui,sans-serif !important;
  -webkit-font-smoothing:antialiased;
  background-color:#f6f7fb !important;
  background-image:
    radial-gradient(ellipse 140% 90% at 50% -30%,rgba(245,158,11,.12),transparent 52%),
    radial-gradient(ellipse 90% 70% at 110% 60%,rgba(99,102,241,.07),transparent 48%),
    radial-gradient(ellipse 70% 50% at -10% 80%,rgba(16,185,129,.05),transparent 45%),
    linear-gradient(180deg,#f6f7fb 0%,#eef1f7 55%,#f6f7fb 100%) !important;
  background-size:auto !important;
  background-attachment:scroll !important;
  min-height:100dvh !important;
}
body.auth::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.35;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E");
}
body.auth::after{
  content:"";
  position:fixed;
  width:min(520px,90vw);
  height:min(520px,90vw);
  left:50%;
  top:18%;
  transform:translate(-50%,-50%);
  z-index:0;
  pointer-events:none;
  border-radius:50%;
  background:radial-gradient(circle,rgba(245,158,11,.08) 0%,transparent 68%);
  filter:blur(40px);
}
.auth-page{
  position:relative;
  z-index:1;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
}
/* Banner GIF 100% largura, faixa horizontal; vinheta leve em cima + fade para o fundo embaixo */
.auth-banner{
  width:100%;
  flex-shrink:0;
  margin:0;
  padding:0;
  padding-top:env(safe-area-inset-top);
  box-sizing:border-box;
  height:clamp(112px,32vw,200px);
  min-height:112px;
  overflow:hidden;
  position:relative;
  background-color:#eef1f7;
  background-image:
    linear-gradient(180deg,rgba(246,247,251,.72) 0%,rgba(246,247,251,.22) 38%,transparent 62%),
    linear-gradient(180deg,transparent 0%,transparent 42%,rgba(246,247,251,.65) 78%,rgba(246,247,251,.92) 92%,#f6f7fb 100%),
    url("https://wallpapers.com/images/hd/the-wolf-of-wall-street-1920-x-1080-a2u9cdtb28wuk7xy.jpg");
  background-size:100% 100%,100% 100%,100% auto;
  background-position:center,center bottom,center top;
  background-repeat:no-repeat;
}
.auth-shell{
  width:100%;
  max-width:380px;
  margin:0 auto;
  padding:12px 20px calc(20px + env(safe-area-inset-bottom));
  display:flex;
  flex-direction:column;
  align-items:stretch;
  flex:1;
  justify-content:flex-start;
}
.auth-shell-tall{max-width:400px}
.auth-flash{
  margin:0 0 12px !important;
  padding:10px 14px !important;
  border-radius:14px !important;
  font-size:13px !important;
  line-height:1.4 !important;
  font-weight:600 !important;
  font-family:"Plus Jakarta Sans",sans-serif !important;
  border-width:1px !important;
}
.auth-flash.flash.error{
  background:rgba(127,29,29,.35) !important;
  border-color:rgba(248,113,113,.35) !important;
  color:#fecaca !important;
}
.auth-flash.flash.success{
  background:rgba(6,78,59,.4) !important;
  border-color:rgba(52,211,153,.35) !important;
  color:#a7f3d0 !important;
}
.auth-brand{
  margin:0 0 28px;
  text-align:center;
}
.auth-brand-link{
  display:inline-flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  padding:4px;
}
.auth-mark{
  width:36px;
  height:36px;
  border-radius:12px;
  flex-shrink:0;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 30% 25%,rgba(255,255,255,.18),transparent 55%),
    linear-gradient(145deg,rgba(245,158,11,.85),rgba(180,83,9,.5));
  box-shadow:0 8px 24px rgba(245,158,11,.12);
}
.auth-brand-name{
  font-size:14px;
  font-weight:700;
  letter-spacing:-.01em;
  color:rgba(10,12,16,.90);
  text-align:left;
}
/* Sem card: só o formulário sobre o fundo */
.auth-panel{
  margin:0;
  padding:0 !important;
  border:none !important;
  border-radius:0 !important;
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:none !important;
  position:relative;
  overflow:visible;
}
.auth-h1{
  margin:0 0 8px !important;
  font-size:clamp(26px,6.5vw,32px) !important;
  font-weight:800 !important;
  letter-spacing:-.045em !important;
  line-height:1.15 !important;
  font-family:"Plus Jakarta Sans",sans-serif !important;
  color:rgba(10,12,16,.94) !important;
  font-feature-settings:"ss01" on;
}
.auth-h1::after{
  content:"";
  display:block;
  width:36px;
  height:2px;
  margin-top:14px;
  border-radius:2px;
  background:linear-gradient(90deg,rgba(251,191,36,.85),rgba(245,158,11,.2),transparent);
  opacity:.9;
}
.auth-lead{
  margin:0 0 26px !important;
  font-size:14px !important;
  font-weight:500 !important;
  line-height:1.5 !important;
  color:rgba(10,12,16,.60) !important;
  font-family:"Plus Jakarta Sans",sans-serif !important;
  max-width:32ch;
}
.auth-form{display:flex;flex-direction:column;gap:0}
.auth-field{margin-bottom:18px}
.auth-field:last-of-type{margin-bottom:22px}
.auth-field label{
  display:block;
  margin-bottom:7px;
  font-family:"Plus Jakarta Sans",sans-serif !important;
  font-size:11px !important;
  font-weight:600 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:rgba(10,12,16,.55) !important;
}
.auth-label-soft{
  text-transform:none !important;
  letter-spacing:.02em !important;
  font-weight:500 !important;
  color:rgba(10,12,16,.52) !important;
  font-size:11px !important;
}
/* Campos vidro mínimo — fundo transparente */
.auth-field input{
  width:100% !important;
  padding:14px 16px !important;
  border-radius:16px !important;
  border:1px solid rgba(10,12,16,.10) !important;
  background:rgba(255,255,255,.86) !important;
  color:rgba(10,12,16,.92) !important;
  font-size:16px !important;
  font-family:"Plus Jakarta Sans",sans-serif !important;
  font-weight:500 !important;
  outline:none !important;
  -webkit-appearance:none !important;
  appearance:none !important;
  backdrop-filter:blur(12px) saturate(1.08) !important;
  -webkit-backdrop-filter:blur(12px) saturate(1.08) !important;
  transition:border-color .22s ease, background .22s ease, box-shadow .22s ease !important;
}
.auth-field input::placeholder{
  color:rgba(10,12,16,.45) !important;
  font-weight:400 !important;
}
.auth-field input:hover{
  border-color:rgba(10,12,16,.14) !important;
  background:rgba(255,255,255,.92) !important;
}
.auth-field input:focus{
  border-color:rgba(251,191,36,.35) !important;
  background:rgba(255,255,255,.96) !important;
  box-shadow:0 0 0 2px rgba(245,158,11,.16),0 12px 40px rgba(15,23,42,.12) !important;
}
/* CTA elegante: contorno + preenchimento suave */
body.auth .btn.primary.auth-btn,
body.auth .auth-btn.btn.primary{
  width:100% !important;
  margin-top:6px !important;
  padding:15px 20px !important;
  border-radius:16px !important;
  font-size:15px !important;
  font-weight:700 !important;
  font-family:"Plus Jakarta Sans",sans-serif !important;
  letter-spacing:.03em !important;
  color:#0c0a09 !important;
  border:1px solid rgba(251,191,36,.42) !important;
  background:linear-gradient(180deg,#fcd34d 0%,#f59e0b 48%,#d97706 100%) !important;
  box-shadow:0 12px 36px rgba(245,158,11,.18),inset 0 1px 0 rgba(255,255,255,.28) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
}
body.auth .btn.primary.auth-btn:hover,
body.auth .auth-btn.btn.primary:hover{
  filter:brightness(1.02);
  border-color:rgba(253,230,138,.5) !important;
  color:#0c0a09 !important;
}
body.auth .btn.primary.auth-btn:active,
body.auth .auth-btn.btn.primary:active{
  transform:translateY(1px);
}
.auth-foot{
  margin:28px 0 0 !important;
  text-align:center !important;
  font-size:13px !important;
  font-weight:500 !important;
  color:rgba(10,12,16,.60) !important;
  font-family:"Plus Jakarta Sans",sans-serif !important;
}
.auth-foot a{
  margin-left:4px;
  font-weight:600 !important;
  color:rgba(180,83,9,.92) !important;
  text-decoration:none !important;
  border-bottom:1px solid rgba(251,191,36,.35);
  padding-bottom:1px;
  transition:color .15s ease,border-color .15s ease;
}
.auth-foot a:hover{
  color:rgba(10,12,16,.92) !important;
  border-bottom-color:rgba(253,230,138,.5);
}

.auth-flash.flash.error{
  background:rgba(127,29,29,.22) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
  border-color:rgba(248,113,113,.22) !important;
}
.auth-flash.flash.success{
  background:rgba(6,78,59,.22) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
  border-color:rgba(52,211,153,.22) !important;
}

@media (max-height:620px){
  .auth-banner{height:clamp(96px,28vw,160px);min-height:96px}
  .auth-shell{padding-top:8px}
  .auth-brand{margin-bottom:18px}
}
@media (min-width:480px){
  .auth-banner{
    height:clamp(128px,22vw,200px);
    background-size:100% 100%,100% 100%,100% auto;
  }
}