/* /linktree: the link-in-bio page for the socials. A single column on the site's
   palette (appearance.js applies the visitor's light or dark choice) in the
   default Literary type, without the site chrome or GSAP. Rows arrive like the
   floating nav: a 14px rise on its curve, 45ms apart. */
:root{--font-display:'Newsreader',serif;--font-body:'Space Grotesk',sans-serif;--font-mono:'IBM Plex Mono',monospace;--ease-out:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}
html{background:var(--pink);color:var(--wine)}
body{margin:0;min-height:100svh;font:400 16px/1.55 var(--font-body);-webkit-font-smoothing:antialiased}
.linktree{width:min(100% - 32px,460px);min-height:100svh;margin:0 auto;padding:56px 0 40px;display:flex;flex-direction:column;justify-content:center;gap:36px}
.linktree-kicker,.linktree-foot,.linktree-link small{font:500 11px/1.4 var(--font-mono);letter-spacing:.06em;text-transform:uppercase}
.linktree-kicker{margin:0 0 14px;color:var(--violet)}
.linktree-head h1{margin:0;font:500 clamp(52px,15vw,76px)/.92 var(--font-display);font-optical-sizing:auto;letter-spacing:-.045em}
.linktree-head h1 em{display:block;text-align:right;font-style:italic}
.linktree-role{max-width:30ch;margin:20px 0 0;font-size:15px;opacity:.85}
.linktree-links{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.linktree-link{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:14px;min-height:60px;padding:12px 20px 12px 24px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--wine);text-decoration:none;transition:background-color .2s ease,border-color .2s ease,color .2s ease,scale .16s ease}
.linktree-link span{font:600 16px/1.2 var(--font-body)}
.linktree-link small{text-transform:none;letter-spacing:.02em;opacity:.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.linktree-link b{display:inline-block;font-weight:500;transition:translate 320ms cubic-bezier(.2,.8,.2,1)}
.linktree-link:hover,.linktree-link:focus-visible{border-color:var(--wine)}
.linktree-link:hover b,.linktree-link:focus-visible b{translate:3px -3px}
.linktree-link:active{scale:.98}
.linktree-link:focus-visible{outline:2px solid var(--violet);outline-offset:3px}
.linktree-link.is-primary{background:var(--violet);border-color:var(--violet);color:var(--on-accent)}
.linktree-link.is-primary:hover,.linktree-link.is-primary:focus-visible{background:var(--wine);border-color:var(--wine);color:var(--paper)}
.linktree-foot{margin:0;text-align:center;opacity:.6}
@media(max-width:340px){.linktree-link small{display:none}}
@media(prefers-reduced-motion:no-preference){
  .linktree-head,.linktree-links li,.linktree-foot{animation:linktree-rise .48s var(--ease-out) both}
  .linktree-links li:nth-child(1){animation-delay:.09s}
  .linktree-links li:nth-child(2){animation-delay:.135s}
  .linktree-links li:nth-child(3){animation-delay:.18s}
  .linktree-links li:nth-child(4){animation-delay:.225s}
  .linktree-links li:nth-child(5){animation-delay:.27s}
  .linktree-foot{animation-delay:.36s}
}
@keyframes linktree-rise{from{opacity:0;translate:0 14px}}