nav a {
  cursor: pointer;
}

#pagenav ul {
  display: flex;
  justify-content: space-between;
}

#pagenav li {
  flex: 1;
  text-align: center;
}

#pagenav li:last-child { text-align: right; }
#pagenav li:first-child { text-align: left; }

#pagenav li:last-child a:after { content: ' →'; }
#pagenav li:first-child a:before { content: '← '; }

hgroup {
  text-align: center;
}
hgroup > *:first-child {
  margin-bottom: 0;
}
hgroup > *:last-child {
  margin-top: 0.25em;
}


#primary {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

#secondary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 1rem;
}
#secondary li {
  display: flex;
  flex-direction: column;
}

.album .cover {
  float: left;
  width: 100%;
  margin-right: 1rem;
  margin-bottom: 1rem;
  max-width: 400px;
}

@media(min-width: 600px) {
  #primary .album .cover {
    width: 50%;
    max-width: 400px;
  }
}

.album .cover { grid-area: cover; }
.album .card { grid-area: card; }
.album .comment { grid-area: comment; }


.title, .artist { margin: 0.25rem 0; }