/* Tela de entrar (projeto "ClipClass Login" do Claude Design): cartão de vidro sobre o fundo de
   luz do estúdio. As cores passam pelos tokens do style.css, então o tema escuro vem junto. */
.loginbody{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:24px 16px 40px;box-sizing:border-box}
.lg-top{align-self:stretch;max-width:1200px;width:100%;margin:0 auto;display:flex}
.lg-back{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--ink2);padding:9px 12px;border-radius:11px;transition:background .2s,color .2s}
.lg-back:hover{background:var(--glass-strong);color:var(--ink)}
.lg{flex:1;width:100%;max-width:380px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;padding:40px 0}
.lg-brand{display:flex;align-items:center;gap:10px;color:var(--ink)}
.lg-brand:hover{color:var(--ink)}
.lg-brand img{width:30px;height:30px;transition:transform .5s cubic-bezier(.3,1.6,.5,1)}
.lg-brand:hover img{transform:rotate(-12deg) scale(1.12)}
.lg-brand span{font-size:21px;font-weight:800;letter-spacing:-.03em}
.lg-card{width:100%;box-sizing:border-box;background:var(--glass);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border-radius:22px;padding:32px 29px 36px;box-shadow:0 0 0 1px var(--glass-line),0 30px 70px rgba(40,30,90,.10)}
.lg-step{display:flex;flex-direction:column;gap:22px}
.lg-step.tight{gap:18px}
.lg-head{display:flex;flex-direction:column;gap:12px}
.lg-card h1{margin:0;font-size:28px;line-height:1.1;font-weight:800;letter-spacing:-.035em}
.lg-card h1 em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
.lg-lead{margin:0;font-size:14px;line-height:1.5;color:var(--muted);text-wrap:pretty}
.lg-lead b{font-weight:800;color:var(--ink)}
.lg-google{display:flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;padding:13px;font-size:15px;font-weight:700;background:var(--glass-strong);box-shadow:0 0 0 1px var(--line-strong);transition:transform .2s,box-shadow .2s}
.lg-google:hover{transform:translateY(-1px);box-shadow:0 0 0 1px var(--line-strong),0 10px 22px rgba(28,28,60,.08)}
.lg-google:active{transform:scale(.98)}
.lg-google svg{width:18px;height:18px}
.lg-or{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--faint)}
.lg-or::before,.lg-or::after{content:"";flex:1;height:1px;background:var(--line)}
.lg-fields{display:flex;flex-direction:column;gap:12px}
.lg-field{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;font-size:12px;font-weight:800;letter-spacing:0;text-transform:none;color:var(--ink2)}
.lg-field input{width:100%;box-sizing:border-box;margin:0;font:inherit;font-size:14px;font-weight:500;padding:13px;border-radius:11px;border:0;outline:none;background:var(--field);color:var(--ink);box-shadow:0 0 0 1px var(--line);transition:box-shadow .2s}
.lg-field input:focus,.lg-field input:focus-visible{outline:none;box-shadow:0 0 0 2px var(--blue)}
.lg-field input.bad{box-shadow:0 0 0 1px var(--red)}
.lg-field input.code{font-family:var(--mono);font-size:28px;font-weight:600;letter-spacing:.35em;text-align:center}
.aluno .lg-field input:focus{box-shadow:0 0 0 2px #ff5a6e}
.lg-erro{margin:0;font-size:13px;font-weight:700;color:var(--red-ink)}
.lg-erro:empty{display:none}
.lg-btn{border-radius:11px;padding:13px;font-size:14px;font-weight:800;text-align:center;background:var(--fill);color:var(--ink);transition:background .25s,color .25s,transform .2s,box-shadow .25s}
.lg-btn:hover{transform:translateY(-1px)}
.lg-btn:active{transform:scale(.98)}
.lg-btn.on{background:var(--blue);color:#fff;box-shadow:0 10px 22px var(--blue-soft)}
.lg-btn.hot{background:linear-gradient(150deg,#ff9f6b,#ff5a6e);color:#1c1c1e}
.lg-btn:disabled{opacity:1;cursor:progress;transform:none}
.lg-badge{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;color:#fff}
.lg-badge .ic{width:26px;height:26px}
.lg-badge.mail{background:linear-gradient(150deg,#ff9f6b,#ff5a6e);box-shadow:0 12px 26px rgba(255,90,110,.3)}
.lg-badge.ok{border-radius:50%;background:#1fa661;box-shadow:0 12px 26px rgba(31,166,97,.3)}
.lg-links{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px}
.lg-links button{font-weight:700;color:var(--blue);padding:0}
.lg-links button:disabled{color:var(--faint);opacity:1;cursor:default}
.lg-links i{color:var(--faint);font-style:normal}
.lg-bar{height:6px;border-radius:6px;background:var(--fill-soft);overflow:hidden}
.lg-bar span{display:block;height:100%;border-radius:6px;background:var(--blue);transform-origin:left center}
.lg-foot{margin:0;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:13px;text-align:center;color:var(--muted)}
.lg-foot button{display:flex;gap:4px;color:var(--blue);padding:0;transition:gap .2s}
.lg-foot button:hover{gap:8px}
@media (max-width:420px){.lg-card{padding:26px 20px 28px}}
/* Termos, privacidade e reembolso, ao pé do login e da conta */
.legal-links{margin:18px 0 0;font-size:12px;text-align:center;color:var(--faint)}
.legal-links a{color:var(--ink2)}