:root {
  color-scheme: dark;
  --bg: #0d0d0d;
  --surface: #171719;
  --text: #f5f5f5;
  font-family: "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
}
body {
  min-height: 100svh;
  margin: 0;
  display: grid;
  place-items: center;
  background: radial-gradient(ellipse 65% 55% at 50% 45%, var(--surface), var(--bg) 75%);
}
.mark {
  margin: 0;
  color: var(--text);
  font: 200 .7rem/1 "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: .3rem;
  opacity: 0;
  transform: translateY(20px);
  animation: arrive 2s ease-in-out forwards;
}
@keyframes arrive { to { opacity: .6; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .mark { opacity: .6; transform: none; animation: none; }
}