:root{--fond:#f5f5f7;--carte:#fff;--texte:#1d1d1f;--texte-2:#56565c;--trait:rgba(0,0,0,.14);--accent:#6d28d9;--erreur:#b42318;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--fond:#000;--carte:#1c1c1e;--texte:#f5f5f7;--texte-2:#aeaeb2;--trait:rgba(255,255,255,.18);--accent:#a78bfa;--erreur:#ff8a80}}
*{box-sizing:border-box}html,body{overscroll-behavior-y:none}body{margin:0;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--fond);color:var(--texte);font:17px/1.6 system-ui,-apple-system,'Segoe UI',Roboto,'Noto Sans',sans-serif;padding:24px 16px}
main{width:100%;max-width:440px;background:var(--carte);border:1px solid var(--trait);border-radius:20px;padding:28px 22px;box-shadow:0 12px 40px rgba(0,0,0,.12);text-align:center}
.cadenas{width:64px;height:64px;margin:0 auto 10px}
h1{font-size:1.5rem;margin:0 0 8px}p{margin:0 0 16px;color:var(--texte-2)}
label{display:block;text-align:start;font-weight:700;margin:0 0 6px}
input{width:100%;font:inherit;font-size:1.1rem;padding:12px 14px;border:1px solid var(--trait);border-radius:12px;background:var(--fond);color:var(--texte);margin:0 0 14px}
button{width:100%;font:inherit;font-weight:700;border:0;border-radius:999px;padding:13px 20px;min-height:50px;background:var(--accent);color:#fff;cursor:pointer}
button:disabled{opacity:.6;cursor:wait}
.err{color:var(--erreur);font-weight:600;margin:14px 0 0}
footer{margin-top:18px;font-size:.85rem;color:var(--texte-2);text-align:center;max-width:440px}