:root {
  color-scheme: light;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #492f23;
  background: #faf7ef;
  line-height: 1.6;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: 32px 16px;
  background-image: repeating-linear-gradient(0deg, transparent 0 31px, #526f5712 31px 32px);
}
main {
  position: relative;
  width: 100%;
  max-width: 520px;
  padding: 40px clamp(24px, 7vw, 48px);
  border: 1px solid #d5cebd;
  border-radius: 8px 22px 22px 8px;
  background: #fffdf7;
  box-shadow: 4px 5px 0 #e5dece, 0 16px 40px #243b3512;
  overflow-wrap: anywhere;
}
main::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 12px;
  width: 1px;
  background: #bc73584d;
}
.logo {
  display: block;
  width: 112px;
  height: 112px;
  margin: 0 0 16px;
  border-radius: 24px;
}
.brand {
  margin: 0;
  color: #356e2a;
  font: italic 700 2rem/1.3 Georgia, serif;
  letter-spacing: -0.04em;
}
.divider {
  display: block;
  width: 44px;
  height: 3px;
  margin: 24px 0;
  border-radius: 50%;
  background: #ee5523;
  transform: rotate(-3deg);
}
h1 {
  margin: 0 0 16px;
  font-size: clamp(1.6rem, 6vw, 2rem);
  line-height: 1.25;
  letter-spacing: -0.025em;
}
#message { margin: 0; font-size: 1rem; }
.note {
  margin: 32px 0 0;
  padding-top: 20px;
  border-top: 1px dashed #d5cebd;
  color: #596457;
  font-size: 1rem;
}