html, body{ overflow-x:hidden; }

:root{
  --paper:#EDEAE0; --paper-raised:#F5F3EA; --ink:#26271F; --ink-soft:#6E695D;
  --violet:#8E72A8; --violet-deep:#6A4E82; --mauve:#C99BB5; --line:#D8D2C0;
  --violet-tint:#F2EAF4; --error:#9C4A3B; --radius:2px;
}
*{ box-sizing:border-box; }
body{
  margin:0; min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:var(--paper); color:var(--ink); font-family:'Inter', sans-serif; -webkit-font-smoothing:antialiased;
  padding:24px;
}
h1,h2{ font-family:'Fraunces', serif; font-weight:500; margin:0; }
p{ margin:0; }
a{ color:inherit; }

.auth-card{
  width:100%; max-width:400px; background:var(--paper-raised); border:1px solid var(--line);
  border-radius:var(--radius); padding:40px 32px; box-shadow:0 12px 32px rgba(38,39,31,.08);
  position:relative;
}
.auth-back{
  position:absolute; top:20px; left:20px; width:32px; height:32px; border-radius:50%;
  background:var(--paper); border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  color:var(--ink-soft); text-decoration:none; font-size:16px;
}
.auth-brand{ text-align:center; margin-bottom:24px; }
.auth-brand img{ height:64px; width:auto; }

h2.auth-title{ font-size:20px; text-align:center; margin-bottom:6px; }
p.auth-subtitle{ text-align:center; font-size:13.5px; color:var(--ink-soft); margin-bottom:26px; line-height:1.5; }

.field{ margin-bottom:16px; }
label{ display:block; font-size:13px; color:var(--ink-soft); margin-bottom:6px; font-weight:500; }
input[type=email], input[type=password], input[type=text]{
  width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:var(--radius);
  background:var(--paper); color:var(--ink); font-family:'Inter'; font-size:14.5px;
}
input:focus{ outline:none; border-color:var(--violet); }
input[readonly]{ opacity:.7; }

.password-container{ position:relative; margin-bottom:16px; }
.password-container input{ padding-right:42px; }
.password-container .toggle-password{
  position:absolute; right:12px; top:50%; transform:translateY(-50%); cursor:pointer;
  color:var(--ink-soft); font-size:19px; user-select:none;
}

.btn-primary{
  width:100%; padding:13px; border:none; border-radius:999px; background:var(--violet); color:var(--paper);
  font-family:'Inter'; font-size:14.5px; font-weight:600; cursor:pointer; text-align:center; text-decoration:none; display:block;
}
.btn-primary:hover{ background:var(--violet-deep); }

.btn-google{
  width:100%; padding:12px; border:1px solid var(--line); border-radius:999px; background:var(--paper);
  color:var(--ink); font-family:'Inter'; font-size:14px; font-weight:600; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:10px; text-decoration:none; margin-bottom:14px;
}
.btn-google:hover{ border-color:var(--violet); }
.btn-google img{ height:18px; }

.btn-mail{
  width:100%; padding:12px; border:1px solid var(--line); border-radius:999px; background:var(--paper-raised);
  color:var(--ink); font-family:'Inter'; font-size:14px; font-weight:600; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:10px; text-decoration:none; margin-bottom:14px;
}
.btn-mail:hover{ border-color:var(--violet); }

.separator{ text-align:center; font-size:12px; color:var(--ink-soft); margin:18px 0; position:relative; }
.separator::before, .separator::after{ content:""; position:absolute; top:50%; width:40%; height:1px; background:var(--line); }
.separator::before{ left:0; }
.separator::after{ right:0; }

.auth-links{ text-align:center; margin-top:20px; font-size:13.5px; color:var(--ink-soft); }
.auth-links a{ color:var(--violet-deep); font-weight:600; text-decoration:none; }
.auth-links a:hover{ text-decoration:underline; }

.auth-terms{ text-align:center; font-size:11.5px; color:var(--ink-soft); margin-top:20px; line-height:1.5; }
.auth-terms a{ color:var(--violet-deep); text-decoration:none; }

.alert-error, .alert-success{
  border-radius:var(--radius); padding:11px 14px; font-size:13.5px; margin-bottom:18px; border:1px solid var(--line);
}
.alert-error{ background:#F6E9E6; color:var(--error); }
.alert-success{ background:var(--violet-tint); color:var(--violet-deep); }

/* Étapes (inscription par mail) */
.progress-container{ height:3px; background:var(--line); border-radius:2px; margin-bottom:28px; overflow:hidden; }
.progress-bar{ height:100%; width:33%; background:var(--violet); transition:width .3s ease; }
.step{ display:none; }
.step.active{ display:block; }
.buttons{ display:flex; gap:12px; margin-top:20px; }
.buttons button{
  flex:1; padding:12px; border-radius:999px; font-family:'Inter'; font-size:13.5px; font-weight:600; cursor:pointer; border:none;
}
.prev-btn{ background:var(--paper); border:1px solid var(--line) !important; color:var(--ink); }
.next-btn, .finish-btn{ background:var(--violet); color:var(--paper); }
.next-btn:hover, .finish-btn:hover{ background:var(--violet-deep); }

/* Choix simple à deux options (accueil) */
.choice-buttons{ display:flex; flex-direction:column; gap:12px; }

.flags-row{ display:none; } /* les drapeaux hors-sujet de l'ancienne version ne sont pas repris */