@font-face{font-family:"Plex Mono";font-weight:400;font-display:swap;src:url(/fonts/mono-400.woff2) format("woff2")}
@font-face{font-family:"Plex Mono";font-weight:500;font-display:swap;src:url(/fonts/mono-500.woff2) format("woff2")}
:root{--bg:#0f1311;--card:#151a17;--ink:#e7f4ed;--ink-2:#a9b8af;--leaf:#5da87a;--line:rgba(231,244,237,.15);--neg:#f2a093;color-scheme:dark}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--ink);font:16px/1.5 "Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;display:grid;place-items:center;-webkit-font-smoothing:antialiased;
  padding:env(safe-area-inset-top) max(20px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(20px,env(safe-area-inset-left))}
form{width:100%;max-width:320px;display:flex;flex-direction:column;gap:12px}
img{width:72px;height:72px;border-radius:16px;align-self:center;margin-bottom:8px}
h1{margin:0;text-align:center;font-size:24px;font-weight:500}
.prompt{color:var(--leaf);margin-right:8px}
.sub{margin:0 0 16px;text-align:center;font-size:13px;color:var(--ink-2)}
input{height:48px;padding:0 14px;font:inherit;font-size:16px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:10px}
input::placeholder{color:var(--ink-2)}
input:focus{border-color:var(--leaf);outline:none}
button{height:48px;font:inherit;font-weight:500;background:var(--leaf);color:#0b1f13;border:0;border-radius:10px;cursor:pointer;transition:transform .12s cubic-bezier(.22,1,.36,1)}
button:active{transform:scale(.97)}
button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.aviso{min-height:24px;margin:4px 0 0;text-align:center;font-size:13px;color:var(--neg)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
