:root { --dark:#0b0d0c; --lime:#c9f31d; --paper:#f3f5f0; --line:#dfe3dc; --muted:#737872; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; background:radial-gradient(circle at 50% 0,rgba(201,243,29,.22),transparent 30%),var(--paper); color:#111411; font-family:"Archivo",sans-serif; }
button,input { font:inherit; }
.login-page { min-height:100vh; display:grid; place-items:center; padding:25px; }
.login-card { width:min(440px,100%); border:1px solid rgba(221,225,218,.9); border-radius:25px; background:rgba(255,255,255,.94); padding:42px; box-shadow:0 25px 70px rgba(20,25,17,.12); }
.brand { display:flex; align-items:center; justify-content:center; gap:9px; color:var(--dark); text-decoration:none; font:800 21px "Poppins",sans-serif; letter-spacing:-1px; }
.brand > span { display:grid; place-items:center; width:37px; height:37px; border-radius:9px; background:var(--lime); font-family:"Poppins",sans-serif; }
.brand strong { color:#8aa900; }
.login-heading { margin:43px 0 28px; text-align:center; }
.login-heading p { margin:0 0 8px; color:#8a9088; font-size:9px; font-weight:800; letter-spacing:1.7px; }
.login-heading h1 { margin:0 0 8px; font:800 38px "Poppins",sans-serif; letter-spacing:-2px; }
.login-heading span { color:var(--muted); font-size:12px; }
form { display:grid; gap:17px; }
label { display:grid; gap:7px; }
label > span { font-size:11px; font-weight:700; }
input { width:100%; border:1px solid var(--line); border-radius:11px; background:white; padding:13px; outline:none; }
input:focus { border-color:#9ebf14; box-shadow:0 0 0 3px #edf6c9; }
.password-field { position:relative; }
.password-field input { padding-right:54px; }
.password-field button { position:absolute; right:7px; top:50%; transform:translateY(-50%); border:0; border-radius:7px; background:#f0f2ed; padding:6px 8px; font-size:9px; font-weight:800; }
.login-button { border:0; border-radius:11px; background:var(--dark); color:white; padding:14px; font-weight:800; margin-top:5px; }
.forgot-link { justify-self:end; margin-top:-8px; color:#555b55; font-size:11px; font-weight:700; text-decoration:none; }
.forgot-link:hover { color:#111411; text-decoration:underline; }
.message.success { color:#557000; }
.back-login { display:block; margin-top:18px; color:var(--dark); text-align:center; font-size:12px; font-weight:800; }
.login-button:hover { background:#252925; }
.login-button:disabled { opacity:.65; }
.message { min-height:18px; margin:13px 0 0; color:#a03535; text-align:center; font-size:11px; }
.create-account { margin:22px 0 0; border-top:1px solid var(--line); padding-top:22px; color:var(--muted); text-align:center; font-size:12px; }
.create-account a { color:var(--dark); font-weight:800; }
@media(max-width:480px) {
  .login-page { display:block; padding:0; background:white; }
  .login-card { min-height:100dvh; width:100%; border:0; border-radius:0; padding:32px 22px calc(35px + env(safe-area-inset-bottom)); box-shadow:none; display:flex; flex-direction:column; justify-content:center; }
  .login-heading { margin:38px 0 26px; }
  .login-heading h1 { font-size:34px; }
  input { min-height:48px; font-size:16px; }
  .login-button { min-height:49px; }
  .password-field button { min-height:35px; min-width:44px; }
}

/* Login principal - aplicação integral da identidade GymSmart */
.login-screen {
  background:#1b241b;
}
.login-screen .login-page { position:relative; isolation:isolate; overflow:hidden; }
.login-screen .login-page::before { content:none; }
.login-screen .login-card {
  border:1px solid var(--lime);
  background:var(--dark);
  box-shadow:none;
  backdrop-filter:none;
}
.login-screen .brand { color:#fff; }
.login-screen .brand strong { color:var(--lime); }
.login-screen .brand > span { color:var(--dark); }
.login-screen .brand-lockup img { display:block; width:220px; max-width:72vw; height:auto; }
.login-screen .login-heading p { color:var(--lime); }
.login-screen .login-heading h1 { color:#fff; }
.login-screen .login-heading > span { color:#a4aaa4; }
.login-screen form > label > span { color:#e8ebe7; }
.login-screen input { border-color:#343934; color:#fff; background:#171a17; }
.login-screen input::placeholder { color:#737973; }
.login-screen input:focus { border-color:var(--lime); box-shadow:0 0 0 3px rgba(201,243,29,.13); }
.login-screen .password-field button { color:#dfe3dd; background:#292d29; }
.login-screen .forgot-link { color:#b8bdb7; }
.login-screen .forgot-link:hover { color:var(--lime); }
.login-screen .login-button { color:var(--dark); background:var(--lime); box-shadow:none; }
.login-screen .login-button:hover { background:#d5ff25; transform:translateY(-1px); }
.login-screen .create-account { border-top-color:#292d29; color:#8d938d; }
.login-screen .create-account a { color:var(--lime); }

@media(max-width:480px) {
  .login-screen .login-page {
    min-height:100dvh;
    display:grid;
    place-items:center;
    padding:24px 22px calc(24px + env(safe-area-inset-bottom));
    background:transparent;
  }
  .login-screen .login-card {
    min-height:auto;
    width:min(380px,100%);
    border:1px solid var(--lime);
    border-radius:22px;
    padding:24px 18px;
    background:var(--dark);
  }
  .login-screen .brand-lockup img { width:190px; }
  .login-screen .login-heading { margin:28px 0 22px; }
  .login-screen form { gap:14px; }
  .login-screen .create-account { margin-top:18px; padding-top:18px; }
}