/* SINN Gestão — Login com grid animado de fundo
   Base visual adaptada do hero grid enviado, com paleta SINN e sem depender de build. */
html:has(body.sinn-login-body){
  min-height:100%;
  background:#04182d!important;
}
body.sinn-login-body{
  min-height:100vh!important;
  overflow-x:hidden!important;
  background:#04182d!important;
  color:#061B33!important;
  position:relative!important;
}
body.sinn-login-body::before,
body.sinn-login-body::after{
  content:"";
  position:fixed;
  inset:auto;
  z-index:1;
  pointer-events:none;
  border-radius:999px;
  filter:blur(2px);
}
body.sinn-login-body::before{
  width:min(52vw,680px);
  height:min(52vw,680px);
  left:-14vw;
  top:-18vh;
  background:radial-gradient(circle,rgba(27,154,170,.34),rgba(10,78,138,.14) 42%,transparent 72%);
}
body.sinn-login-body::after{
  width:min(46vw,600px);
  height:min(46vw,600px);
  right:-10vw;
  bottom:-18vh;
  background:radial-gradient(circle,rgba(255,201,40,.24),rgba(249,115,22,.10) 44%,transparent 74%);
}
.sinn-login-grid-canvas{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  z-index:0;
  display:block;
  pointer-events:none;
  background:#04182d;
}
.sinn-login-grid-shade{
  position:fixed;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 18%,rgba(17,103,168,.28),transparent 34rem),
    radial-gradient(circle at 18% 72%,rgba(255,201,40,.12),transparent 25rem),
    linear-gradient(90deg,rgba(4,24,45,.82) 0%,rgba(4,24,45,.36) 48%,rgba(4,24,45,.76) 100%);
}

.sinn-login-motion-lines{
  position:fixed;
  inset:0;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
  mix-blend-mode:screen;
}
.sinn-login-motion-lines span{
  position:absolute;
  display:block;
  opacity:.78;
  border-radius:999px;
  filter:drop-shadow(0 0 10px rgba(27,154,170,.42));
  will-change:transform,opacity;
}
.sinn-login-motion-lines span:nth-child(1),
.sinn-login-motion-lines span:nth-child(2),
.sinn-login-motion-lines span:nth-child(3),
.sinn-login-motion-lines span:nth-child(4){
  width:clamp(180px,26vw,470px);
  height:2px;
  left:-34vw;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),rgba(27,154,170,.92),rgba(255,201,40,.58),transparent);
  animation:sinnLoginMoveLineX 7.5s linear infinite;
}
.sinn-login-motion-lines span:nth-child(1){top:18%;animation-delay:-1.2s;}
.sinn-login-motion-lines span:nth-child(2){top:37%;animation-delay:-4.7s;animation-duration:9.2s;}
.sinn-login-motion-lines span:nth-child(3){top:61%;animation-delay:-2.9s;animation-duration:8.4s;}
.sinn-login-motion-lines span:nth-child(4){top:82%;animation-delay:-6.1s;animation-duration:10.3s;}
.sinn-login-motion-lines span:nth-child(5),
.sinn-login-motion-lines span:nth-child(6),
.sinn-login-motion-lines span:nth-child(7),
.sinn-login-motion-lines span:nth-child(8){
  width:2px;
  height:clamp(160px,28vh,390px);
  top:-32vh;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.10),rgba(116,183,228,.90),rgba(255,201,40,.44),transparent);
  animation:sinnLoginMoveLineY 8.8s linear infinite;
}
.sinn-login-motion-lines span:nth-child(5){left:15%;animation-delay:-3.2s;}
.sinn-login-motion-lines span:nth-child(6){left:38%;animation-delay:-6.5s;animation-duration:10.6s;}
.sinn-login-motion-lines span:nth-child(7){left:67%;animation-delay:-1.7s;animation-duration:9.4s;}
.sinn-login-motion-lines span:nth-child(8){left:88%;animation-delay:-5.3s;animation-duration:11.4s;}
@keyframes sinnLoginMoveLineX{
  0%{transform:translateX(0);opacity:0;}
  8%{opacity:.82;}
  72%{opacity:.82;}
  100%{transform:translateX(150vw);opacity:0;}
}
@keyframes sinnLoginMoveLineY{
  0%{transform:translateY(0);opacity:0;}
  8%{opacity:.68;}
  72%{opacity:.68;}
  100%{transform:translateY(150vh);opacity:0;}
}

.sinn-login-screen{
  position:relative;
  z-index:2;
}
.sinn-login-brand{
  animation:sinnLoginEnter .65s ease both;
}
.sinn-login-logo-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(10,78,138,.20) 38%,rgba(6,27,51,.72))!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:0 28px 70px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.12)!important;
  backdrop-filter:blur(18px);
}
.sinn-login-logo-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.18) 42%,transparent 68%);
  transform:translateX(-120%);
  animation:sinnLoginLogoShine 6.5s ease-in-out infinite;
}
.sinn-login-kicker{
  color:#FFC928!important;
  text-shadow:0 10px 35px rgba(255,201,40,.22);
}
.sinn-login-subtitle{
  color:rgba(232,238,249,.82)!important;
  text-shadow:0 14px 32px rgba(0,0,0,.30);
}
.sinn-login-panel{
  position:relative;
  z-index:2;
  border:1px solid rgba(255,255,255,.22)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(247,250,254,.92))!important;
  border-radius:30px!important;
  box-shadow:0 34px 95px rgba(0,0,0,.36),0 1px 0 rgba(255,255,255,.75) inset!important;
  backdrop-filter:blur(22px);
  animation:sinnLoginEnter .65s ease .08s both;
}
.sinn-login-panel::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:5px;
  background:linear-gradient(90deg,#0A4E8A,#1B9AAA,#FFC928);
}
.sinn-login-panel label,
.sinn-login-panel .text-gray-700,
.sinn-login-panel .text-gray-600{
  color:#0A2747!important;
}
.sinn-login-panel input[type="email"],
.sinn-login-panel input[type="password"],
.sinn-login-panel input[type="text"]{
  min-height:48px!important;
  border-radius:16px!important;
  border-color:rgba(10,78,138,.18)!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 10px 26px rgba(6,27,51,.06)!important;
}
.sinn-login-panel input:focus{
  border-color:#0A4E8A!important;
  --tw-ring-color:rgba(10,78,138,.32)!important;
}
.sinn-login-panel button[type="submit"],
.sinn-login-panel .fit-btn-primary{
  min-height:46px!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,#0A4E8A,#1167A8)!important;
  color:#fff!important;
  box-shadow:0 16px 34px rgba(10,78,138,.26)!important;
}
.sinn-login-panel a{
  color:#0A4E8A!important;
}
.sinn-login-panel a:hover{
  color:#061B33!important;
}
@keyframes sinnLoginEnter{
  from{opacity:0;transform:translateY(18px) scale(.985);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes sinnLoginLogoShine{
  0%,62%{transform:translateX(-120%);}
  78%,100%{transform:translateX(120%);}
}
@media (max-width:640px){
  .sinn-login-motion-lines span{opacity:.46;}
  .sinn-login-motion-lines span:nth-child(n+5){display:none;}
  body.sinn-login-body{overflow-y:auto!important;}
  .sinn-login-screen{padding-top:28px!important;padding-bottom:28px!important;}
  .sinn-login-logo-card{padding:1rem!important;border-radius:24px!important;}
  .sinn-login-logo-card img{height:4.25rem!important;}
  .sinn-login-kicker{letter-spacing:.24em!important;font-size:.74rem!important;}
  .sinn-login-subtitle{font-size:.78rem!important;max-width:21rem!important;}
  .sinn-login-panel{border-radius:24px!important;padding:1.25rem!important;margin-top:1.5rem!important;}
}
@media (prefers-reduced-motion:reduce){
  .sinn-login-motion-lines span{animation:none!important;opacity:.18!important;}
  .sinn-login-brand,
  .sinn-login-panel,
  .sinn-login-logo-card::before{
    animation:none!important;
  }
}