:root {
  --bg: #0b0b0a;
  --fg: #ece6da;      /* warm off-white, like pale sand */
  --dim: #8a8478;
  --sand: #c9b48f;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body {
  background: var(--bg);
  color: var(--fg);
  display: grid;
  grid-template-rows: 1fr auto;
  font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  -webkit-font-smoothing: antialiased;
}
main {
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 1.1rem;
  padding: 2rem;
  text-align: center;
  max-width: 100vw;
}
.pulse { width: min(240px, 60vw); height: auto; }
.pulse polyline {
  fill: none;
  stroke: var(--sand);
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.pulse .base { opacity: 0.35; }
.pulse .beat {
  stroke-width: 1.6;
  stroke-dasharray: 46 400;
  stroke-dashoffset: 46;
  animation: beat 2.8s linear infinite;
}
@keyframes beat {
  from { stroke-dashoffset: 46; }
  to   { stroke-dashoffset: -400; }
}
@media (prefers-reduced-motion: reduce) {
  .pulse .beat { animation: none; stroke-dasharray: none; opacity: 0.9; }
}
h1 {
  font-weight: 400;
  font-size: clamp(2rem, 6vw, 3.4rem);
  letter-spacing: 0.02em;
}
.line {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 0.85rem;
  letter-spacing: 0.04em;
  color: var(--dim);
  max-width: 42ch;
  overflow-wrap: anywhere;
}
footer {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 0.7rem;
  color: var(--dim);
  text-align: center;
  padding: 1.5rem;
  letter-spacing: 0.06em;
}
footer p + p { margin-top: 0.5rem; opacity: 0.7; }
footer .echo { font-style: italic; letter-spacing: 0.03em; }
footer a {
  color: var(--sand);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s ease;
}
footer a:hover, footer a:focus-visible { border-bottom-color: var(--sand); outline: none; }
