/*
 * Author page (author.php): a white tablet at the top with the
 * author's photo, name and "About you", then their posts in the
 * usual feed. Loads only on author pages.
 */

/* The "About you" font, the same files Shots use (cached already if
   the reader has seen a Shot). */
@font-face {
	font-family: "Libre Baskerville";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/libre-baskerville-latin-400-italic.woff2") format("woff2");
}

.author-head {
	box-sizing: border-box;
	width: calc(100% - 2 * var(--frame));
	max-width: 36rem;
	margin: 0 auto var(--post-space);
	padding: 2rem 1.75rem 1.75rem;
	background: var(--tablet);
	border-radius: var(--radius);
	color: var(--ink);
	text-align: center;
}

/* The same round photo as on the blog cards, bigger. */
.author-photo {
	display: block;
	width: 96px;
	height: 96px;
	margin: 0 auto 1rem;
	border-radius: 50%;
	object-fit: cover;
}

.author-name {
	margin: 0;
	font-family: var(--title-font);
	font-weight: var(--title-weight);
	font-size: var(--title-size);
	line-height: 1.2;
	color: var(--title-color);
	overflow-wrap: break-word;
}

.author-about {
	margin-top: 1.125rem;
	font-family: "Libre Baskerville", georgia, serif;
	font-style: italic;
	font-size: 0.96875rem;
	line-height: 1.75;
	text-align: left;
	overflow-wrap: break-word;
}

.author-about p + p { margin-top: 0.9em; }

.author-none {
	margin: 0 auto;
	text-align: center;
	color: #aaa;
}