/* Card bodies rendered by leeSay(). Page layout lives in about.html. */

/* Email card */

.fakemail {
	max-width: 480px;
	font-family: -apple-system, "Segoe UI", sans-serif;
	border: 1px solid #eadfb0;
	border-radius: 12px;
	overflow: hidden;
	background: #fffef7;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.fakemail-header {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	border-bottom: 1px solid #f0e9c8;
}

.fakemail-avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
	object-position: top;
	background: var(--bg-secondary);
	flex-shrink: 0;
}

.fakemail-meta {
	flex: 1;
	line-height: 1.4;
}

.fakemail-from {
	font-weight: 600;
	font-size: 14px;
	color: #4a4a3a;
}

.fakemail-addr {
	font-weight: 400;
	color: #a09a7a;
}

.fakemail-to {
	font-size: 12px;
	color: #a09a7a;
}

.fakemail-date {
	font-size: 12px;
	color: #a09a7a;
}

.fakemail-subject {
	padding: 12px 16px 4px;
	font-weight: 600;
	font-size: 16px;
	color: #4a4a3a;
}

.fakemail-body {
	padding: 4px 16px 18px;
	font-size: 14px;
	line-height: 1.6;
	color: #5a5a4a;
}

.fakemail-body p {
	margin: 0 0 10px;
}

.fakemail-attach {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	padding: 8px 14px;
	border: 1px solid #eadfb0;
	border-radius: 8px;
	background: #fdfbef;
	font-size: 13px;
	color: #5a5a4a;
	text-decoration: none;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.fakemail-attach:hover {
	background: #f7f2dd;
	border-color: #d8c98a;
}

.fakemail-file {
	font-weight: 600;
}

/* GoobLab card */

.gooblab-embed {
	margin: 0.9rem 0;
	transition: opacity 0.2s ease;
}

.gooblab-embed[data-loading] {
	opacity: 0;
}

.gooblab-head {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-bottom: 0.7rem;
	padding: 0.4rem 0.6rem;
	border-radius: 8px;
	color: inherit;
	text-decoration: none;
	transition: background 0.15s ease;
}

.gooblab-head:hover,
.gooblab-head:focus-visible {
	background: #22262e;
	transform: none;
	box-shadow: none;
	text-decoration: none;
}

.gooblab-avatar {
	width: 42px;
	height: 42px;
	border-radius: 50%;
}

.gooblab-name {
	display: block;
	font-weight: 600;
	font-size: 20px;
}

.gooblab-handle {
	display: block;
	font-size: 13px;
	color: #75c485;
}

.gooblab-calendar {
	--cell: 13px;
	display: grid;
	grid-auto-flow: column;
	grid-template-rows: repeat(7, var(--cell));
	gap: 3px;
	justify-content: start;
	padding: 12px;
	border-radius: 10px;
	background: #1b1e24;
	border: 1px solid #2b2f38;
	overflow: hidden;
}

.gooblab-calendar i {
	width: var(--cell);
	height: var(--cell);
	border-radius: 3px;
	background: #262b34;
}

.gooblab-calendar i[data-level="1"] { background: #3b4a6b; }
.gooblab-calendar i[data-level="2"] { background: #4a5f96; }
.gooblab-calendar i[data-level="3"] { background: #5b78c4; }
.gooblab-calendar i[data-level="4"] { background: #7592e8; }

.gooblab-projects {
	list-style: none;
	margin: 0.8rem 0 0;
	padding: 12px;
	border-radius: 10px;
	background: #1b1e24;
	border: 1px solid #2b2f38;
	font-size: 15px;
}

.gooblab-projects:empty {
	display: none;
}

.gooblab-projects li {
	margin-bottom: 0.35rem;
}

.gooblab-projects li:last-child {
	margin-bottom: 0;
}

.gooblab-projects span {
	margin-left: 0.4rem;
	color: #8b93a1;
}

/* Shared */

.lee-copy {
	cursor: pointer;
	font-weight: 600;
	color: #5865f2;
}

.lee-copy:hover {
	text-decoration: underline;
}

@media (width < 768px) {
	.fakemail { max-width: 100%; }

	.gooblab-calendar { --cell: 10px; }
}