/* Tela de entrada do CuiudoPro (auth-v2.php). Mesmos tokens da casca v2. */
:root{
  --bg:#070A08;--panel:#0C100E;--panel2:#111713;--raise:#182019;--well:#050705;
  --line:#1C241F;--line2:#2A3630;--line-ctl:#4A5E52;
  --txt:#E6ECE8;--dim:#8E9E94;--faint:#65756B;
  --acc:#8FE01F;--acc-2:#A9F53D;--acc-d:#5FA80F;--on-acc:#06120A;
  --acc-bg:rgba(143,224,31,.10);--acc-line:rgba(143,224,31,.35);--glow:rgba(143,224,31,.25);
  --red:#FF5C5C;--red-bg:rgba(255,92,92,.10);--gold:#F2C14E;--gold-bg:rgba(242,193,78,.12);
  --fd:"Sora",system-ui,sans-serif;--fb:"IBM Plex Sans",system-ui,"Segoe UI",sans-serif;
  --t:180ms;--ease:cubic-bezier(.4,0,.2,1);--spring:cubic-bezier(.2,1.2,.3,1);
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--txt);font:14.5px/1.55 var(--fb);-webkit-font-smoothing:antialiased;overflow:hidden}
h1,h2{font-family:var(--fd);letter-spacing:-.02em;margin:0}
p{margin:0}
a{color:var(--acc-2)}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:6px}

.auth{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(420px,.9fr);height:100%}

/* ---------- painel da marca ---------- */
.marca{position:relative;overflow:hidden;background:var(--well);display:flex;flex-direction:column;justify-content:center;padding:56px 64px;user-select:none;-webkit-user-select:none}
html.janela-integrada .marca{cursor:default}
.aurora{position:absolute;inset:0;pointer-events:none;filter:blur(60px);opacity:.8}
.aurora i{position:absolute;border-radius:50%}
.aurora i:nth-child(1){width:60%;height:60%;left:-10%;top:-15%;background:rgba(143,224,31,.22);animation:aur1 18s ease-in-out infinite}
.aurora i:nth-child(2){width:55%;height:55%;right:-15%;bottom:-20%;background:rgba(95,168,15,.20);animation:aur2 22s ease-in-out infinite}
.aurora i:nth-child(3){width:35%;height:35%;left:40%;top:45%;background:rgba(169,245,61,.10);animation:aur1 26s ease-in-out infinite reverse}
@keyframes aur1{0%,100%{transform:translate(0,0)}50%{transform:translate(18%,10%)}}
@keyframes aur2{0%,100%{transform:translate(0,0)}50%{transform:translate(-16%,-10%)}}
/* grade de "slots" ao fundo: a vitrine, em silhueta */
.grade{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:14px;padding:24px;opacity:.38;pointer-events:none;mask-image:linear-gradient(180deg,rgba(0,0,0,.9),transparent 92%);-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.9),transparent 92%)}
.grade span{border:1px solid var(--line);border-radius:10px;background:linear-gradient(180deg,rgba(17,23,19,.6),rgba(7,10,8,.2));position:relative;animation:slotpulse 6s ease-in-out infinite;animation-delay:var(--d)}
.grade span::before{content:"";position:absolute;left:10px;top:10px;width:34%;height:6px;border-radius:3px;background:var(--line2)}
.grade span::after{content:"";position:absolute;left:10px;top:24px;width:6px;height:6px;border-radius:50%;background:#FF4D4D;box-shadow:0 0 8px #FF4D4D;opacity:.7}
@keyframes slotpulse{0%,100%{border-color:var(--line);box-shadow:none}50%{border-color:var(--acc-line);box-shadow:0 0 30px -12px var(--glow)}}
#fx-auth{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.marca-in{position:relative;z-index:1;max-width:520px}
.rodape-marca{z-index:1}
.logo{display:flex;align-items:center;gap:14px;margin-bottom:38px;font:700 20px var(--fd)}
.logo img{width:56px;height:56px;border-radius:16px;box-shadow:0 0 0 1px var(--line2),0 0 40px -8px var(--glow)}
.logo span{font-size:24px;letter-spacing:-.03em}
.logo .pro{font:700 11px/1 var(--fd);letter-spacing:.08em;padding:5px 7px;border-radius:7px;background:var(--acc);color:var(--on-acc);margin-left:-6px;align-self:flex-start;margin-top:4px}
.marca h1{font-size:clamp(40px,4.6vw,64px);line-height:1;font-weight:800}
.marca h1 em{font-style:normal;color:var(--acc);text-shadow:0 0 40px var(--glow)}
.marca p{margin-top:18px;color:var(--dim);font-size:16px;max-width:42ch}
.provas{list-style:none;margin:34px 0 0;padding:0;display:flex;gap:26px;flex-wrap:wrap}
.provas li{display:flex;flex-direction:column;gap:2px}
.provas b{font:700 24px/1 var(--fd);color:var(--acc-2)}
.provas span{font-size:12px;color:var(--faint)}
.rodape-marca{position:absolute;left:64px;bottom:28px;font-size:12px;color:var(--faint)}

/* ---------- lado do formulário ---------- */
.painel{position:relative;display:grid;place-items:center;padding:56px 40px;background:var(--bg);border-left:1px solid var(--line);overflow:auto}
.win{position:absolute;top:8px;right:8px;display:none;gap:2px}
html.janela-integrada .win{display:flex}
.wb{width:38px;height:32px;border-radius:8px;display:grid;place-items:center;color:var(--dim);background:transparent;border:0;cursor:default;transition:background var(--t),color var(--t)}
.wb svg{width:10px;height:10px}
.wb:hover{background:var(--raise);color:var(--txt)}
.wb.fechar:hover{background:rgba(255,92,92,.16);color:var(--red)}

.card{width:100%;max-width:400px;animation:sobe .6s var(--spring)}
@keyframes sobe{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.abas{position:relative;display:grid;grid-template-columns:1fr 1fr;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:4px;margin-bottom:26px}
.abas a{position:relative;z-index:1;text-align:center;padding:9px 0;border-radius:9px;color:var(--dim);text-decoration:none;font:600 13.5px var(--fb);transition:color var(--t)}
.abas a.on{color:var(--on-acc)}
.abas .ind{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:9px;background:linear-gradient(180deg,var(--acc-2),var(--acc));box-shadow:0 6px 20px -8px var(--glow);transition:transform .35s var(--spring)}
.abas a:nth-child(2).on ~ .ind{transform:translateX(100%)}
.card h2{font-size:26px;font-weight:700}
.lembrar{display:flex;align-items:center;gap:14px;margin-bottom:22px}
.lembrar .av{width:56px;height:56px;border-radius:50%;flex:none;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 40% 35%,#3a5a2a,#0C100E);border:2px solid var(--acc);box-shadow:0 0 30px -6px var(--glow);font:700 22px var(--fd);color:var(--acc-2)}
.lembrar .av img{width:100%;height:100%;object-fit:cover}
.lembrar h2{font-size:22px}.lembrar .sub{margin:2px 0 0}.lembrar a{color:var(--acc-2);text-decoration:none}
.card .sub{color:var(--dim);margin:6px 0 22px}
.campo{display:block;margin-bottom:14px}
.campo>span:first-child{display:block;font:600 11.5px var(--fb);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin-bottom:7px}
.campo em{font-style:normal;text-transform:none;letter-spacing:0;color:var(--faint);font-weight:400}
.campo input{width:100%;height:46px;padding:0 14px;border-radius:11px;border:1px solid var(--line2);background:var(--panel);color:var(--txt);font:15px var(--fb);transition:border-color var(--t),box-shadow var(--t),background var(--t)}
.campo input::placeholder{color:var(--faint)}
.campo input:hover{border-color:var(--line-ctl)}
.campo input:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-bg);background:var(--panel2)}
.campo-senha{position:relative;display:block}
.campo-senha input{padding-right:46px}
.btn-olho{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;border-radius:8px;background:transparent;cursor:pointer;color:var(--faint)}
.btn-olho:hover{background:var(--raise);color:var(--txt)}
.btn-olho .ico{display:block;width:18px;height:18px;margin:0 auto;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center/contain no-repeat}
.btn-olho[aria-pressed="true"] .ico{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cpath d='M1 1l22 22'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cpath d='M1 1l22 22'/%3E%3C/svg%3E")}
.btn-primario{width:100%;height:48px;margin-top:8px;border:0;border-radius:12px;background:linear-gradient(180deg,var(--acc-2),var(--acc));color:var(--on-acc);font:700 15px var(--fd);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 10px 30px -10px var(--glow);transition:transform var(--t),box-shadow var(--t),filter var(--t)}
.btn-primario:hover{transform:translateY(-1px);box-shadow:0 14px 36px -10px var(--glow);filter:brightness(1.04)}
.btn-primario:active{transform:translateY(0)}
.btn-primario svg{transition:transform var(--t)}
.btn-primario:hover svg{transform:translateX(3px)}
.alerta{display:flex;gap:10px;align-items:center;padding:11px 14px;border-radius:11px;background:var(--red-bg);border:1px solid rgba(255,92,92,.35);color:#ffb3b3;font-size:13.5px;margin-bottom:16px}
.alerta::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red);flex:0 0 auto}
.promo{display:flex;gap:10px;align-items:flex-start;padding:11px 14px;border-radius:11px;background:var(--gold-bg);border:1px solid rgba(242,193,78,.35);color:var(--gold);font-size:13.5px;margin-bottom:16px}
.promo .ic{width:8px;height:8px;margin-top:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold);flex:0 0 auto}
.promo b{color:#fff}
.nota{font-size:12.5px;color:var(--dim);margin:-6px 0 14px}
.nota b{color:var(--txt)}
.kick-nota{display:flex;gap:8px;align-items:flex-start;margin-top:16px;padding:11px 12px;border-radius:11px;background:var(--panel2);border:1px solid var(--line);color:var(--dim);font-size:12.5px}
.kick-nota svg{flex:0 0 auto;color:var(--acc);margin-top:1px}
.troca{margin-top:18px;text-align:center;color:var(--dim);font-size:13.5px}
.troca a{text-decoration:none;font-weight:600}
.troca a:hover{text-decoration:underline}
.so-navegador{display:none}
html.no-app .so-navegador{display:block}

@media (max-width:920px){
  .auth{grid-template-columns:1fr}
  .marca{display:none}
  .painel{border-left:0;padding:40px 20px}
  body{overflow:auto}
}