.afa-cover {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 5 / 3;
	overflow: hidden;
	border-radius: 14px;
	background: var(--afa-color-soft, #edf2ef);
}
.afa-cover > .afa-cover__image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	object-fit: cover;
	object-position: 50% 50%;
}
.afa-cover .afa-cover__placeholder {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	font-size: clamp(2rem, 7vw, 5rem);
	color: var(--afa-color-primary, #2e5d5c);
	background: linear-gradient(135deg, var(--afa-color-soft, #edf2ef), var(--afa-color-surface, #fff));
}
.afa-cover-editor {
	min-width: 0;
	margin: 0;
	padding: 18px;
	border: 1px solid var(--afa-color-border, #dce3df);
	border-radius: 14px;
	color: var(--afa-color-text, #222);
	background: var(--afa-color-surface, #fff);
}
.afa-cover-editor legend { font-weight: 700; padding-inline: 6px; }
.afa-cover-editor > p { font-size: .88rem; }
.afa-cover-editor .afa-cover-editor__preview { margin-block: 12px; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.afa-cover-editor .afa-cover-editor__preview:active { cursor: grabbing; }
.afa-cover-editor .afa-cover-editor__preview img { pointer-events: none; -webkit-user-drag: none; }
.afa-cover-editor .afa-cover-editor__preview:focus-visible { outline: 3px solid var(--afa-color-accent, #3fc2c4); outline-offset: 3px; }
.afa-cover-editor .afa-cover-editor__positions { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.afa-cover-editor .afa-cover-editor__positions label { display: grid; gap: 8px; }
.afa-cover-editor .afa-cover-editor__positions input { width: 100%; min-height: 32px; accent-color: var(--afa-color-primary, #2e5d5c); }
.afa-cover-editor .afa-cover-editor__actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-top: 12px; }
.afa-cover-editor button { min-height: 44px; }
.afa-cover-editor button:disabled { opacity: .55; cursor: default; }
.afa-home .afa-home__activity-cover { width: 76px; flex-shrink: 0; }
@media (max-width: 620px) {
	.afa-cover-editor { padding: 12px; }
	.afa-cover-editor .afa-cover-editor__positions { grid-template-columns: 1fr; }
	.afa-home .afa-home__activity-cover { width: 54px; }
}
@media (prefers-color-scheme: dark) {
	.afa-cover { background: var(--afa-color-soft, #1f2925); }
	.afa-cover .afa-cover__placeholder { background: linear-gradient(135deg, var(--afa-color-soft, #1f2925), var(--afa-color-surface, #18211d)); }
}
.afa-cover-management { margin-block: 1rem; }
.afa-cover-editor__positions > label:last-child { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.afa-cover-editor__positions [data-cover-zoom] { grid-column: 1 / -1; grid-row: 2; }
.afa-cover-editor__positions [data-cover-zoom-value] { grid-column: 2; grid-row: 1; font-variant-numeric: tabular-nums; }
.afa-cover-management > summary { cursor: pointer; }
.afa-cover-editor__library { border: 1px solid currentColor; border-radius: .6rem; padding: .75rem; }
.afa-cover-editor__library[hidden] { display: none; }
.afa-cover-editor__images { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: .5rem; margin-block: .75rem; }
.afa-cover-editor__images button { padding: 0; cursor: pointer; border: 2px solid transparent; background: transparent; border-radius: .3rem; overflow: hidden; }
.afa-cover-editor__images button:focus-visible { outline: 2px solid currentColor; }
.afa-cover-editor__images img { width: 100%; aspect-ratio: 5 / 3; object-fit: cover; display: block; }
