/* Estilo das páginas de auth (cadastro/login/recuperação) no padrão PsiLogia.
   Classes/atributos batem com assets/js/auth.js (alert show ok/err, .invalid,
   [data-password-alert].show). */
:root{
  --bg:oklch(0.984 0.007 84);--surface:oklch(0.998 0.004 84);--surface-2:oklch(0.972 0.01 80);
  --text:oklch(0.275 0.035 305);--text-2:oklch(0.49 0.028 303);--text-3:oklch(0.60 0.022 300);
  --primary:oklch(0.535 0.158 300);--primary-2:oklch(0.46 0.16 300);--primary-ink:oklch(0.99 0.006 300);
  --primary-soft-2:oklch(0.90 0.05 300);
  --border:oklch(0.915 0.012 78);--border-2:oklch(0.86 0.016 78);
  --ring:oklch(0.535 0.158 300 / 0.32);
  --shadow:0 1px 2px oklch(0.4 0.05 305 / .05), 0 18px 38px -20px oklch(0.45 0.08 305 / .26);
}
[data-theme="dark"]{
  --bg:oklch(0.185 0.024 305);--surface:oklch(0.243 0.03 305);--surface-2:oklch(0.285 0.032 305);
  --text:oklch(0.96 0.008 84);--text-2:oklch(0.78 0.02 300);--text-3:oklch(0.66 0.024 300);
  --primary:oklch(0.72 0.15 300);--primary-2:oklch(0.66 0.16 300);--primary-ink:oklch(0.16 0.03 305);
  --primary-soft:oklch(0.31 0.06 300);--primary-soft-2:oklch(0.37 0.08 300);
  --border:oklch(0.34 0.03 305);--border-2:oklch(0.41 0.035 305);
  --ring:oklch(0.72 0.15 300 / 0.4);
  --shadow:0 1px 2px oklch(0 0 0 / .25), 0 20px 40px -22px oklch(0 0 0 / .5);
}
*{box-sizing:border-box;transition:background-color .3s ease,border-color .3s ease,color .25s ease}
body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--primary);text-decoration:none}
.nav{position:sticky;top:0;z-index:10;background:color-mix(in oklch, var(--bg) 86%, transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.nav-inner{max-width:1080px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:14px clamp(18px,4vw,28px)}
.brand{display:inline-flex;align-items:center;gap:11px;color:var(--text)}
.brand-logo{width:38px;height:38px;border-radius:11px;overflow:hidden;display:inline-flex;box-shadow:0 6px 16px -8px var(--ring)}
.brand-logo .logo-img{width:100%;height:100%;object-fit:contain;display:block}
.wm{font-size:21px;letter-spacing:-.02em;line-height:1}
.wm .p{font-weight:500;color:var(--text-2)}
.wm .l{font-family:'Spectral',serif;font-style:italic;font-weight:600;color:var(--primary);letter-spacing:0;padding-right:.04em}
.nav-login{font-weight:600;color:var(--text);font-size:14.5px;padding:9px 14px;border-radius:10px}
.nav-login:hover{color:var(--primary)}
.nav-cta{display:inline-flex;align-items:center;gap:10px}
.nav-links{display:none;align-items:center;gap:26px}
.nav-links a{color:var(--text-2);font-size:15px;font-weight:500}
.nav-links a:hover{color:var(--primary)}
.icon-btn{width:40px;height:40px;flex:none;border-radius:11px;border:1px solid var(--border-2);background:var(--surface);color:var(--text-2);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.icon-btn:hover{color:var(--primary);border-color:var(--primary)}
.theme-moon{display:none}
[data-theme="dark"] .theme-moon{display:inline-flex}
[data-theme="dark"] .theme-sun{display:none}
.burger{width:40px;height:40px;flex:none;border-radius:11px;border:1px solid var(--border-2);background:var(--surface);color:var(--text);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.burger:hover{color:var(--primary);border-color:var(--primary)}
#mobile-menu{display:none;position:absolute;right:clamp(18px,4vw,28px);top:calc(100% + 8px);min-width:220px;padding:8px;border:1px solid var(--border-2);border-radius:14px;background:color-mix(in oklab, var(--surface) 97%, transparent);box-shadow:var(--shadow);z-index:80}
[data-menu="open"] #mobile-menu{display:grid;gap:2px}
#mobile-menu a,#mobile-menu button{display:block;width:100%;text-align:left;text-decoration:none;color:var(--text-2);font:inherit;font-size:15px;font-weight:600;padding:10px 12px;border-radius:9px;background:none;border:none;cursor:pointer}
#mobile-menu a:hover,#mobile-menu button:hover{color:var(--text);background:color-mix(in oklab, var(--text) 7%, transparent)}
@media(min-width:920px){
  .nav-links{display:flex}
  .burger{display:none}
  #mobile-menu{display:none !important}
}
@media(max-width:919px){
  .nav-cta .nav-login,.nav-cta .btn{display:none}
}
.auth-shell{min-height:calc(100vh - 64px);display:flex;align-items:center;justify-content:center;padding:40px clamp(18px,4vw,28px)}
.auth-card{width:100%;max-width:430px;background:var(--surface);border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow);padding:clamp(26px,4vw,38px)}
.auth-card h1{font-family:'Spectral',serif;font-weight:500;font-size:30px;letter-spacing:-.02em;margin:0 0 6px}
.auth-card>p{color:var(--text-2);margin:0 0 22px;font-size:15px;line-height:1.5}
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:15px}
.field label{font-size:13.5px;font-weight:600;color:var(--text-2)}
.field input{width:100%;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:13px 14px;font-size:15px;color:var(--text);font-family:inherit;transition:border-color .15s,box-shadow .15s}
.field input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--ring)}
.field input.invalid{border-color:oklch(0.6 0.17 25)}
.field-alert{font-size:12px;color:oklch(0.55 0.16 25);display:none}
.field-alert.show{display:block}
/* Campo de senha com botão de mostrar/ocultar (olho). */
.pw-field{position:relative}
.pw-field input{padding-right:46px}
.pw-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;color:var(--text-3);cursor:pointer;border-radius:8px}
.pw-toggle:hover{color:var(--primary);background:var(--surface-2)}
.pw-toggle .eye-off{display:none}
.pw-toggle.on .eye-on{display:none}
.pw-toggle.on .eye-off{display:block}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border:none;cursor:pointer;font-family:inherit;font-weight:600;font-size:15px;padding:14px;border-radius:12px;transition:background .15s,border-color .15s,opacity .15s}
.btn:disabled{opacity:.6;cursor:default}
.btn-emerald{background:var(--primary);color:var(--primary-ink);box-shadow:0 12px 26px -14px var(--ring)}
.btn-emerald:hover{background:var(--primary-2)}
.btn-ghost{background:var(--surface-2);color:var(--text);border:1px solid var(--border-2)}
.btn-ghost:hover{border-color:var(--primary);color:var(--primary)}
.btn-full{width:100%}
.auth-divider{display:flex;align-items:center;gap:12px;color:var(--text-3);font-size:13px;margin:18px 0}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--border)}
.auth-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px;font-size:14px;color:var(--text-2)}
.auth-row a{font-weight:600}
.alert{display:none;margin-bottom:16px;padding:11px 14px;border-radius:11px;font-size:13.5px;line-height:1.45}
.alert.show{display:block}
.alert.err{background:oklch(0.95 0.05 25);color:oklch(0.45 0.16 25);border:1px solid oklch(0.85 0.08 25)}
.alert.ok{background:var(--primary-soft-2);color:var(--primary-2)}
.usage-box{margin-top:18px;padding:14px;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;font-size:13.5px;color:var(--text-2);line-height:1.5}