:root { --bg: #fbfbfd; --ink: #111114; --muted: #6e6e76; --line: #e6e6ea; color-scheme: light dark; }
@media (prefers-color-scheme: dark) {
  :root { --bg: #0e0e11; --ink: #f2f2f5; --muted: #9a9aa3; --line: #26262c; }
}
* { box-sizing: border-box; margin: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  background: var(--bg); color: var(--ink);
  font: 17px/1.5 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", Roboto, sans-serif;
  overflow-x: hidden;
}
main {
  min-height: 100vh; min-height: 100svh;
  display: flex; flex-direction: column; justify-content: center;
  width: 100%; max-width: 560px; margin: 0 auto;
  padding: 48px 24px;
}
h1 { font-size: clamp(36px, 10vw, 52px); font-weight: 700; letter-spacing: -0.025em; line-height: 1.05; overflow-wrap: anywhere; }
p.role { margin-top: 12px; color: var(--ink); font-size: 20px; font-weight: 500; }
p.stack { margin-top: 8px; color: var(--muted); font-size: 16px; max-width: 30em; }
hr { border: 0; border-top: 1px solid var(--line); margin: 36px 0 20px; }
a { color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
a:hover { border-color: var(--ink); }
footer { margin-top: 48px; color: var(--muted); font-size: 13px; }