nav{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:100;display:flex;gap:4px;align-items:center;padding:6px 8px 6px 20px;border-radius:999px;
  background:rgba(255,255,255,.55);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);box-shadow:0 8px 30px rgba(80,70,140,.15),inset 0 0 0 1px rgba(255,255,255,.7);
  animation:navin 1.2s 2.2s both cubic-bezier(.2,.9,.3,1)}
@keyframes navin{from{opacity:0;transform:translate(-50%,-30px)}}
nav b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:19px;margin-right:12px}
nav a{text-decoration:none;font-size:14px;padding:8px 14px;border-radius:999px;color:var(--mute);transition:.3s}
nav a:hover{background:#fff;color:var(--ink);box-shadow:0 0 18px rgba(255,95,168,.45)}
nav.night{background:rgba(20,18,40,.55);box-shadow:0 8px 30px rgba(0,0,0,.4),inset 0 0 0 1px rgba(255,255,255,.12)}
nav.night b,nav.night a:hover{color:#fff}
nav.night a{color:#a8a9c8}
nav.night a:hover{background:rgba(255,255,255,.12)}