{{template "header" .}}
<div class="form-card">
  <h1>{{if .Register}}Create account{{else}}Sign in{{end}}</h1>
  {{if .Error}}<div class="alert">{{.Error}}</div>{{end}}
  <form method="post">
    {{if .Query}}<input type="hidden" name="next" value="{{.Query}}">{{end}}
    <label>Username</label>
    <input type="text" name="username" required>
    <label>Password</label>
    <input type="password" name="password" required>
    {{if .Register}}
      <label>Display name</label>
      <input type="text" name="name">
      <div class="hp" aria-hidden="true">
        <label>Website<input type="text" name="website" tabindex="-1" autocomplete="off"></label>
      </div>
      <input type="hidden" name="started" value="{{.Started}}">
      <input type="hidden" name="qa" value="{{.QA}}">
      <input type="hidden" name="qb" value="{{.QB}}">
      <input type="hidden" name="ctok" value="{{.CTok}}">
      <label>Human check — what is {{.QA}} + {{.QB}}?
        <input type="text" name="answer" inputmode="numeric" required autocomplete="off">
      </label>
    {{end}}
    <div style="margin-top:18px">
      <button class="btn btn-green" type="submit">{{if .Register}}Register{{else}}Sign in{{end}}</button>
    </div>
  </form>
  <p class="meta" style="margin-top:16px">
    {{if .Register}}
      Already have an account? <a href="/login{{if .Query}}?next={{urlquery .Query}}{{end}}">Sign in</a>
    {{else}}
      New here? <a href="/register{{if .Query}}?next={{urlquery .Query}}{{end}}">Create an account</a>
      {{if not .Operator}} · First account on this player becomes the <b>site manager</b> (library & storage — not payments).{{end}}
    {{end}}
  </p>
</div>
{{template "footer" .}}