:root{--bg:#f4efe6;--card:#fffdf9;--text:#1f2420;--muted:#6b6f68;--line:#ddd6c9;--accent:#2f5d50;--accent-text:#f4efe6;--error:#a23b2a;--error-bg:#f7e4df}
@media (prefers-color-scheme:dark){:root{--bg:#161a18;--card:#1f2421;--text:#e8e6e1;--muted:#9a9d97;--line:#343a36;--accent:#5f9c89;--accent-text:#101412;--error:#f0a090;--error-bg:#3a2420}}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--text);font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:24px 16px}
.card{width:100%;max-width:360px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:32px 28px}
.mark{display:block;margin-bottom:16px}
h1{font-size:22px;font-weight:600;margin:0;letter-spacing:-.01em}
.sub{color:var(--muted);margin:4px 0 24px;font-size:14px}
.sub a{color:var(--accent)}
.code{font:600 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);margin:0 0 12px}
label{display:block;font-size:13px;font-weight:500;margin:0 0 6px}
input{width:100%;font:inherit;color:var(--text);background:transparent;border:1px solid var(--line);border-radius:8px;padding:9px 11px;margin-bottom:16px}
input:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:transparent}
button{width:100%;font:inherit;font-weight:600;color:var(--accent-text);background:var(--accent);border:0;border-radius:8px;padding:10px;margin-top:4px;cursor:pointer}
button:hover{filter:brightness(1.08)}
.error{color:var(--error);background:var(--error-bg);border-radius:8px;padding:9px 11px;margin:0 0 16px;font-size:14px}
footer{color:var(--muted);font-size:12px;margin-top:20px}