:root {
  color-scheme: dark;
  --bg: #0e0e0e;
  --bg-raised: #121212;
  --text: #fff;
  --text-muted: rgba(255, 255, 255, .58);
  --border: rgba(255, 255, 255, .09);
  --surface: rgba(255, 255, 255, .025);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100svh;
  color: var(--text);
  background: var(--bg);
  font-family: Sora, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}
body::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  background: radial-gradient(ellipse at 50% -12%, rgba(255,255,255,.025), transparent 56%);
}
.page { width: min(100%, 640px); margin: 0 auto; padding: 62px 28px 32px; }
.profile { display: grid; justify-items: center; text-align: center; }
.avatar { width: 92px; height: 92px; border: 1px solid var(--border); border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 6px rgba(255,255,255,.018), 0 12px 28px rgba(0,0,0,.34); }
.eyebrow { margin: 25px 0 8px; color: var(--text-muted); font-family: "JetBrains Mono", ui-monospace, monospace; font-size: .69rem; font-weight: 400; letter-spacing: .03em; }
h1 { margin: 24px 0 0; font-size: 2.1rem; font-weight: 400; letter-spacing: -.065em; line-height: .95; }
.bio { max-width: 450px; margin: 18px 0 0; color: var(--text-muted); font-size: .98rem; font-weight: 300; line-height: 1.52; }
.links { display: grid; gap: 12px; margin-top: 43px; }
.link {
  display: grid;
  grid-template-columns: 1fr 28px;
  align-items: center;
  min-height: 66px;
  padding: 10px 18px;
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--surface);
  text-decoration: none;
  font-size: 1rem;
  font-weight: 400;
  text-align: center;
  box-shadow: 0 6px 22px rgba(0,0,0,.12);
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.link:hover, .link:focus-visible { transform: translateY(-2px); border-color: rgba(255,255,255,.25); background: rgba(255,255,255,.065); box-shadow: 0 14px 28px rgba(0,0,0,.25); outline: none; }
.link:focus-visible { box-shadow: 0 0 0 3px rgba(255,255,255,.2), 0 14px 28px rgba(0,0,0,.25); }
.link--featured { color: #0e0e0e; border-color: #fff; background: #fff; font-weight: 500; }
.link--featured:hover, .link--featured:focus-visible { background: #e8e8e8; border-color: #e8e8e8; }
.icon { display: grid; place-items: center; width: 30px; height: 30px; font-size: 1.7rem; line-height: 1; }
.icon--type { font-size: 1.15rem; font-weight: 700; letter-spacing: -.08em; }
.arrow { justify-self: end; font-size: 1.25rem; font-weight: 400; opacity: .7; }
footer { margin-top: 43px; color: var(--text-muted); font-family: "JetBrains Mono", ui-monospace, monospace; font-size: .66rem; font-weight: 400; letter-spacing: .03em; text-align: center; }
.node { position: fixed; z-index: -1; width: 3px; height: 3px; border-radius: 50%; background: #fff; box-shadow: 0 0 9px 1px rgba(255,255,255,.28); opacity: .16; animation: breathe 5.5s ease-in-out infinite; }
.node--one { top: 18%; left: 11%; }
.node--two { top: 68%; right: 12%; animation-delay: -1.4s; }
.node--three { top: 84%; left: 18%; animation-delay: -2.6s; }
@keyframes breathe { 50% { opacity: .35; transform: scale(1.25); } }
@media (prefers-reduced-motion: reduce) { .node { animation: none; } .link { transition: none; } }
@media (max-width: 480px) {
  .page { padding: 42px 20px 24px; }
  .links { margin-top: 34px; gap: 12px; }
  .link { min-height: 64px; border-radius: 16px; font-size: 1rem; }
  .bio { font-size: .95rem; }
}