/*
  Styles for the set-password page.

  In its own file, not a <style> block, so the Content Security Policy can be
  script-src 'self'; style-src 'self' with no 'unsafe-inline' anywhere. An
  inline block would have forced us to loosen the policy on a page that handles
  a live session token.
*/
:root {
  --brand:#0F766E; --brand-dark:#0B5F58; --ink:#0C1A18; --muted:#5A6B68;
  --line:#D7E3E0; --bg:#F2F7F6; --card:#FFFFFF; --danger:#B42318; --ok:#15803D;
}
* { box-sizing:border-box; }
body {
  margin:0; min-height:100vh; background:var(--bg); color:var(--ink);
  font-family:"Plus Jakarta Sans","Segoe UI",system-ui,-apple-system,sans-serif;
  display:flex; align-items:center; justify-content:center; padding:1.25rem;
  line-height:1.6;
}
.card {
  background:var(--card); width:100%; max-width:26rem; border-radius:1.25rem;
  padding:2rem 1.75rem; box-shadow:0 20px 45px -20px rgba(12,26,24,.35);
  border:1px solid var(--line);
}
.badge {
  width:3.5rem; height:3.5rem; border-radius:999px; background:#E6F4F1;
  color:var(--brand); display:grid; place-items:center; margin:0 auto 1.1rem;
  font-size:1.5rem;
}
h1 { font-size:1.35rem; margin:0 0 .35rem; text-align:center; font-weight:600; }
.sub { color:var(--muted); font-size:.9rem; text-align:center; margin:0 0 1.4rem; }
label { display:block; font-size:.8rem; font-weight:600; margin:0 0 .35rem; }
input {
  width:100%; padding:.7rem .85rem; font-size:.95rem; border-radius:.75rem;
  border:1px solid var(--line); background:#F8FAFA; color:var(--ink);
  font-family:inherit;
}
input:focus { outline:none; border-color:var(--brand); box-shadow:0 0 0 3px rgba(15,118,110,.15); }
input[aria-invalid="true"] { border-color:var(--danger); }
.field { margin-bottom:1rem; }
.err { color:var(--danger); font-size:.78rem; margin:.35rem 0 0; }
.hint { color:var(--muted); font-size:.78rem; margin:.35rem 0 0; }
button {
  width:100%; padding:.8rem; border:0; border-radius:.75rem; background:var(--brand);
  color:#fff; font-size:.95rem; font-weight:600; cursor:pointer; font-family:inherit;
}
button:hover:not(:disabled) { background:var(--brand-dark); }
button:disabled { opacity:.55; cursor:not-allowed; }
.note { margin-top:1.1rem; font-size:.78rem; color:var(--muted); text-align:center; }
.state { text-align:center; }
.state .icon { font-size:2.5rem; margin-bottom:.6rem; }
.state.ok .icon { color:var(--ok); }
.state.bad .icon { color:var(--danger); }
.hidden { display:none; }
ul { margin:.5rem 0 0; padding-left:1.1rem; color:var(--muted); font-size:.82rem; }