:root{
  --paper:#f2efe8;
  --panel:#f9f7f1;
  --ink:#191713;
  --hubs:#3f1d5c;
  --line:#6c6558;
}
*{ box-sizing:border-box; }
html{ font-size:20px; }
body{
  margin:0 auto; max-width:36rem; padding:1.5rem 1rem 4rem;
  background:var(--paper); color:var(--ink);
  font:1rem/1.55 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
header{ text-align:center; color:var(--hubs); }
header img{ display:block; margin:0 auto .5rem; }
h1{ font-size:2.2rem; line-height:1.15; margin:0; }
.where{ font-size:1.1rem; margin:.25rem 0 0; }
.big{ font-size:1.6rem; font-weight:700; color:var(--hubs); margin:2rem 0 .5rem; }
form{ margin-top:2rem; }
label, legend{ display:block; font-weight:700; margin:1.25rem 0 .35rem; }
fieldset{ border:0; padding:0; margin:0; }
input:not([type]), input[type=text]{
  width:100%; font:inherit; padding:.6rem .75rem;
  border:2px solid var(--line); border-radius:6px; background:var(--panel); color:var(--ink);
}
input:focus, button:focus, a:focus{ outline:3px solid var(--hubs); outline-offset:2px; }
label.tick{ font-weight:400; margin:.5rem 0; display:flex; gap:.6rem; align-items:center; }
label.tick input{ width:1.4rem; height:1.4rem; accent-color:var(--hubs); flex:none; }
button, .button{
  display:inline-block; margin-top:2rem; padding:.8rem 1.6rem;
  font:inherit; font-size:1.2rem; font-weight:700; text-decoration:none;
  background:var(--hubs); color:#fff; border:0; border-radius:8px; cursor:pointer;
}
.trap{ position:absolute; left:-9999px; }
