/* the small one-message pages: 404, /start/ */
:root{ --felt:#0D2E2A; --felt-hi:#17453D; --felt-lo:#061B19; --bone:#F0E8D7; --ember:#DE5A40; --brass:#D2A24C; }
*{ box-sizing:border-box; }
body{
  margin:0; min-height:100vh; min-height:100svh; display:grid; place-items:center; text-align:center;
  padding:2rem 16px; color:var(--bone); background:var(--felt);
  background-image:radial-gradient(85% 62% at 50% 40%, var(--felt-hi) 0%, var(--felt) 55%, var(--felt-lo) 100%);
  font-family:"Instrument Sans", system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing:antialiased;
}
.piece{ width:74px; height:74px; margin:0 auto 2rem; display:block; }
p.eyebrow{ font-size:12.5px; letter-spacing:.02em; color:var(--brass); margin:0 0 1.1rem; opacity:.85; }
h1{
  font-family:"Bricolage Grotesque", "Arial Black", sans-serif; font-weight:800;
  font-variation-settings:"wdth" 86, "opsz" 44;
  font-size:clamp(1.9rem, 5.4vw, 3.4rem); line-height:1; letter-spacing:-.022em; margin:0; text-wrap:balance;
}
h1 em{ font-style:normal; color:var(--ember); }
p.sub{ margin:1.4rem auto 2.4rem; max-width:34ch; opacity:.55; font-size:15px; line-height:1.5; }
a.back{
  display:inline-block; color:var(--bone); text-decoration:none; font-size:13.5px;
  padding:.75rem 1.4rem; border:1px solid rgba(240,232,215,.28); border-radius:100px;
  transition:border-color .2s, background .2s;
}
a.back:hover, a.back:focus-visible{ border-color:var(--bone); background:rgba(240,232,215,.06); }
a.back:focus-visible{ outline:2px solid var(--brass); outline-offset:4px; }
