/* Naples Studios 24.2 — NOVA TELA DE LOGIN, SOMENTE VISUAL.
   Não altera rota OAuth /auth/discord, sessões, Pix, Roblox ou downloads.
   Fundo e arte locais; sem bibliotecas, scripts ou conexões externas. */
#loginView.login-page {
  --cosmos-green: #22f89c;
  display: block;
  min-height: 100svh;
  padding: clamp(12px, 3.2vw, 48px);
  color: #f8f6ff;
  background: radial-gradient(circle at 14% 90%, #193d40 0, transparent 34%),
              radial-gradient(circle at 85% 4%, #3e1c64 0, transparent 42%),
              #150c2d;
  overflow: hidden;
  isolation: isolate;
}
#loginView[hidden] { display: none !important; }
#loginView .login-inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  min-height: min(850px, calc(100svh - clamp(24px, 6.4vw, 96px)));
  max-width: 1520px;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid #4d386f;
  border-radius: 25px;
  background: #140727;
  box-shadow: 0 0 0 7px #05070ece, 0 20px 85px #050414ab,
              0 0 65px #8028b742;
}
#loginView .login-story {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 0;
  padding: clamp(27px, 3.4vw, 58px);
  overflow: hidden;
  border: 0;
  background: linear-gradient(180deg, #100e29b0, transparent 35%, #17062d21 64%, #11051dc9),
              url('/static/login_cosmos_v25.svg') 45% 48% / cover no-repeat;
}
#loginView .login-story:before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent 82%, #140727cc),
              radial-gradient(circle at 24% 100%, #592ca33e, transparent 50%);
}
#loginView .login-story:after { display: none; }
#loginView .login-brand { position:relative;z-index:1;align-self:flex-start;gap:13px; }
#loginView .login-brand .mark {
  transform: none;
  width: 46px; height: 46px;
  border-radius: 13px;
  color: #043520;
  background: linear-gradient(145deg,#7fffd0,#08e48e);
  box-shadow: 0 4px 24px #05e8a756;
}
#loginView .login-brand .mark span { transform:none;font-size:26px;padding:0;letter-spacing:0; }
#loginView .login-brand .brand-name strong {
  color: #fff;
  font-size: clamp(17px, 2vw, 23px);
  letter-spacing: -.6px;
}
#loginView .login-brand .brand-name small {
  color: #d6d4ec;
  font-size: 10px;
  letter-spacing: 2.5px;
  margin-top: 7px;
}
#loginView .login-copy {
  z-index: 1;
  max-width: 600px;
  padding: 0 0 4%;
  text-shadow: 0 3px 17px #09061dcc;
}
#loginView .login-kicker {
  font-size: 10px;
  letter-spacing: 2px;
  color: #b7d7d4;
  font-weight: 850;
}
#loginView .login-copy h1 {
  font-size: clamp(30px,3.5vw,60px);
  line-height: 1.04;
  letter-spacing: -1.8px;
  font-weight: 950;
  color:#fff;
  margin: 15px 0;
}
#loginView .login-copy h1 em {
  font-style: normal;
  color: #56fc9b;
  text-shadow: 0 0 25px #22ef8a4d;
}
#loginView .login-copy p {
  max-width: 430px;
  color: #d9d5e9;
  font-size: 14px;
  line-height: 1.6;
}
#loginView .login-aside {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(30px,5vw,80px);
  background: radial-gradient(circle at 58% 33%, #3b0d59a8 0, transparent 58%),
              radial-gradient(circle at 100% 100%, #261054a8 0, transparent 65%),
              #130522;
}
#loginView .login-aside:before {
  content:'';pointer-events:none;position:absolute;inset:0;opacity:.4;
  background-image:radial-gradient(#f6e6ff 0.9px,transparent 1px);
  background-size:73px 79px;
  mask-image:linear-gradient(0deg,transparent,#000 30%,#000 80%,transparent);
}
#loginView .login-card {
  position:relative;z-index:1;width: min(460px,100%);
  background: none; border:0; box-shadow:none;
  border-radius:0;padding:0;
  text-align: left;
}
#loginView .login-card:before { display:none; }
#loginView .auth-mark {
  display:block;margin-bottom:18px;
  font-size:11px;letter-spacing:2.4px;font-weight:800;color:#a9a0bf;
}
#loginView .login-card h2 {
  margin:0;
  font-size: clamp(54px,6.5vw,95px);
  line-height:1.06;
  letter-spacing:-2.5px;
  font-weight:950;
  color:#fff;
  text-shadow:0 10px 35px #05021177;
}
#loginView .login-card > p:not(.login-error) {
  font-size: 16px;
  color: #b4adc9;
  line-height: 1.6;
  margin: 20px 0 0;
}
#loginView .discord-button {
  position: relative;
  width: 100%;
  min-height: 68px;
  display:flex;justify-content:center;align-items:center;gap:16px;
  margin-top:45px;padding:18px 22px;
  background: linear-gradient(180deg,#28fe72,#0ddd56 55%,#057f3a);
  border:1px solid #8effa9;border-radius:999px;
  color:#062611;
  font-size:16px;font-weight:900;
  box-shadow: 0 0 0 3px #13fc6227,0 0 38px #09ef5e80,inset 0 2px 4px #ffffffa0;
  text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
#loginView .discord-button:hover {
  background:linear-gradient(180deg,#70ff9e,#27f272 55%,#0fa84e);
  box-shadow:0 0 0 4px #13fc623b,0 0 50px #0bff70a8;
  transform:translateY(-2px);
}
#loginView .discord-button:focus-visible { outline: 3px solid #c3ffd7; outline-offset: 5px; }
#loginView .discord-button:active { transform:translateY(0); }
#loginView .discord-button svg { width: 28px;height:28px;flex:0 0 auto; }
#loginView .discord-button .login-button-arrow {width:20px;height:20px;margin-left:3px;}
#loginView .auth-note {
  margin-top:30px;display:flex;justify-content:center;align-items:center;
  color:#bbb6d1;font-size:13px;gap:10px;
}
#loginView .lock-dot { width:9px;height:9px;background:#4bffa5;box-shadow:0 0 14px #24fa83; }
#loginView .login-divider {
  margin-top:44px;display:flex;align-items:center;gap:12px;
  color:#8d86a7;font-size:10px;letter-spacing:1.9px;font-weight:800;
}
#loginView .login-divider span {flex:1;height:1px;background:#51426c;}
#loginView .login-bottom-note {
  text-align:center;margin-top:19px;color:#8e87a7;font-size:12px;
}
#loginView .login-error {
  margin-top:25px;padding:14px 16px;
  background:#351530; border:1px solid #96486f;color:#ffbcd5;border-radius:12px;
  text-align:left;font-size:13px;line-height:1.5;
}
#loginView .login-error[hidden] {display:none!important;}
@media (max-width: 1000px) {
  #loginView .login-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  #loginView .login-story{padding:32px;}
  #loginView .login-aside{padding:32px;}
  #loginView .login-card h2{font-size:clamp(52px,7vw,72px);}
  #loginView .login-copy h1{font-size:clamp(30px,4vw,45px);}
}
@media (max-width: 750px) {
  #loginView.login-page{padding:10px;}
  #loginView .login-inner {display:flex;flex-direction:column;min-height:calc(100svh - 20px);border-radius:19px;}
  #loginView .login-story {
    min-height:270px;flex:0 0 270px;padding:21px 24px 19px;
    border:0;
    background-position:52% 27%;
  }
  #loginView .login-brand .mark{width:38px;height:38px;}
  #loginView .login-brand .brand-name strong{font-size:18px;}
  #loginView .login-brand .brand-name small{font-size:8px;}
  #loginView .login-copy{padding:0;}
  #loginView .login-kicker{font-size:8px;}
  #loginView .login-copy h1{font-size:clamp(27px,6vw,35px);margin:8px 0;letter-spacing:-1px;}
  #loginView .login-copy p{display:none;}
  #loginView .login-aside {flex:1;min-height:410px;padding:35px 22px 42px;}
  #loginView .login-card{width:min(420px,100%);}
  #loginView .login-card h2{font-size:clamp(55px,11vw,74px);}
  #loginView .discord-button{margin-top:32px;min-height:60px;}
  #loginView .login-divider{margin-top:34px;}
}
@media(max-width:370px){
  #loginView .login-story {min-height:240px;flex-basis:240px;padding:17px 18px;}
  #loginView .login-aside{padding:28px 17px;}
  #loginView .login-brand .mark{width:32px;height:32px;}
  #loginView .login-brand .brand-name strong{font-size:15px;}
  #loginView .login-copy h1{font-size:27px;}
  #loginView .login-card h2{font-size:52px;}
  #loginView .discord-button{font-size:14px;padding:14px;}
}
@media(prefers-reduced-motion:reduce){#loginView .discord-button{transition:none;}}