@import url('/f/polices.css');
:root{
  color-scheme:light;
  --ground:#f6f4ef; --surface:#fffefb; --surface-2:#f1ede4; --line:#e2dccf;
  --ink:#1e2833; --ink-2:#5c6875; --ink-3:#8e9aa6; --gold:#a9762f; --bad:#c0392b;
  --shadow:0 1px 2px rgba(30,40,51,.05), 0 8px 24px -16px rgba(30,40,51,.18);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --ground:#12161b; --surface:#191f26; --surface-2:#212932; --line:#2e3841;
    --ink:#f2f0ea; --ink-2:#a9b4bf; --ink-3:#76828e; --gold:#ddb875; --bad:#e26d5f;
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 8px 24px -16px rgba(0,0,0,.6);
  }
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0; background:var(--ground); color:var(--ink);
  font:14px/1.5 'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  display:flex; align-items:center; justify-content:center; padding:20px;
  -webkit-font-smoothing:antialiased}
.boite{background:var(--surface); width:100%; max-width:372px; padding:30px 28px 20px;
  border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); text-align:center}
.logo{width:68px; height:68px; border-radius:50%; background:#fff; padding:2px;
  border:1px solid var(--line); object-fit:cover}
h1{font-size:19px; margin:13px 0 2px; font-weight:600; letter-spacing:-.2px}
.st{margin:0 0 22px; color:var(--ink-3); font-size:11.5px; letter-spacing:.08em;
  text-transform:uppercase; font-weight:500}
form{text-align:left}
label{display:block; font-size:10.5px; text-transform:uppercase; letter-spacing:.09em;
  font-weight:600; margin:13px 0 5px; color:var(--ink-3)}
input{width:100%; padding:10px 12px; font:inherit; font-size:15px; color:var(--ink);
  border:1px solid var(--line); border-radius:8px; background:var(--surface-2)}
input:focus{outline:2px solid var(--gold); outline-offset:1px; border-color:var(--gold)}
button{width:100%; margin-top:20px; padding:11px; font:inherit; font-size:14px; font-weight:600;
  color:var(--surface); background:var(--ink); border:0; border-radius:8px; cursor:pointer}
button:hover:not(:disabled){opacity:.88}
button:disabled{opacity:.6; cursor:progress}
.err{margin:13px 0 0; padding:9px 12px; font-size:12.5px; color:var(--bad);
  background:color-mix(in srgb, var(--bad) 8%, var(--surface));
  border:1px solid color-mix(in srgb, var(--bad) 30%, transparent); border-radius:8px}
.pied{margin-top:22px; padding-top:15px; border-top:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; gap:9px;
  font-size:11px; color:var(--ink-3)}
.pied img{width:22px; height:auto; opacity:.8}
@media (max-width:380px){ .boite{padding:24px 18px 16px} }