:root {
  color: #1c1915;
  background: #efeae0;
  font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  line-height: 1.45;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
}

main {
  max-width: 40rem;
  margin: 0 auto;
  padding: 1.25rem 1.1rem 3rem;
}

h1,
h2 {
  font-family: ui-sans-serif, system-ui, sans-serif;
  line-height: 1.2;
}

h1 {
  margin: 0 0 0.45rem;
  font-size: 2.1rem;
}

h2 {
  margin: 0 0 0.45rem;
  font-size: 1.2rem;
}

.mark {
  margin: 0;
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.mark a {
  color: inherit;
  text-decoration: none;
}

.lede {
  margin-top: 0;
}

.page-head,
.panel {
  margin: 0 0 1rem;
}

.panel {
  border: 1px solid #1c1915;
  background: #fffdf8;
  padding: 1rem 1.05rem 1.15rem;
}

.panel-result {
  background: #14120b;
  color: #fffdf8;
}

.fine,
.status,
#session,
#progress,
button,
label {
  font-family: ui-sans-serif, system-ui, sans-serif;
}

.fine,
.status {
  font-size: 0.88rem;
}

.hash,
pre,
code,
textarea,
input {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.hash,
pre {
  word-break: break-all;
  white-space: pre-wrap;
}

.hash {
  margin: 0.75rem 0 0.2rem;
  font-size: 0.82rem;
}

#header-height {
  margin-top: 0;
  font-family: ui-sans-serif, system-ui, sans-serif;
}

#qr {
  margin-top: 0.8rem;
  background: #fff;
  display: inline-block;
  line-height: 0;
}

#qr svg {
  width: min(100%, 20rem);
  height: auto;
  display: block;
}

#progress {
  margin: 0.2rem 0 0;
  padding-left: 1.2rem;
}

#progress li {
  margin: 0.25rem 0;
}

label {
  display: block;
  margin-top: 0.8rem;
  font-size: 0.88rem;
  font-weight: 700;
}

textarea,
input[type="text"],
input:not([type]),
input[type="file"] {
  width: 100%;
  margin-top: 0.3rem;
}

textarea,
input:not([type="file"]) {
  padding: 0.55rem 0.6rem;
  border: 1px solid #1c1915;
  background: #fff;
  color: #1c1915;
  font-size: 1rem;
}

button {
  font-size: 1rem;
  background: #1c1915;
  color: #fffdf8;
  border: 0;
  min-height: 2.75rem;
  padding: 0.55rem 1rem;
  margin-top: 0.9rem;
  cursor: pointer;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 3px solid #ffbf3c;
  outline-offset: 2px;
}

#session {
  margin-bottom: 0.3rem;
}

#decision {
  margin: 0.2rem 0 0.6rem;
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-size: 1.45rem;
  font-weight: 800;
}

#decision[data-kind="accept"] {
  color: #b7e3c4;
}

#decision[data-kind="deny"] {
  color: #ffbf3c;
}

#result {
  margin: 0;
  min-height: 2.5rem;
  font-size: 0.82rem;
}

.noscript {
  max-width: 40rem;
  margin: 0 auto 2rem;
  padding: 0 1.1rem;
}

a {
  color: inherit;
}
