/* Archive family (0.7.46). Identity block, stream-family collage inside
   archives, Browse-all directory. Tokens only; the accent comes from the
   block's --cr-archive-accent (a --cr-type-* token), so dark mode follows
   the token flips in tokens.css. Editor and front end load this sheet. */

.cr-archive-identity {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-block-end: 0.5rem;
}
.cr-archive-identity__glyph {
	flex: none;
	inline-size: 2.75rem;
	block-size: 2.75rem;
	display: inline-grid;
	place-items: center;
	border-radius: 50%;
	background: var(--cr-surface, #fbfaf5);
	color: var(--cr-ink, #241c4a);
	box-shadow: 0 0 0 2px var(--cr-ink, #241c4a), 3px 3px 0 var(--cr-archive-accent, var(--cr-cerulean));
	transform: rotate(var(--cr-rotate-1, -1.2deg));
}
.cr-archive-identity__glyph svg { inline-size: 1.5rem; block-size: 1.5rem; }
.cr-archive-identity__kicker { margin: 0; }
.cr-archive-identity--stream .cr-archive-identity__kicker { --cr-tape-bg: var(--cr-archive-accent); }
.cr-archive-identity-editor { display: block; }

/* The h1 keeps its ✺ flank; the accent tints the short marker bar below it. */
.cr-archive__header hr.is-style-cr-marker-bar-short { background-color: var(--cr-archive-accent, var(--cr-ut-orange)); }

/* Stream-family archives: the collage owns the wide column, cards keep the
   plugin's own paint (cr-post-kinds.css). */
.cr-archive--stream .cr-archive__header { max-width: 72rem; }
.cr-archive-stream__empty {
	font-family: var(--cr-font-accent, serif);
	font-size: var(--wp--preset--font-size--medium, 1.125rem);
	max-width: var(--cr-measure, 65ch);
}

/* Browse all: three term lists as pill rows. Core's Terms List markup. */
.cr-browse-all {
	margin-block-start: var(--wp--preset--spacing--x-large, 4rem);
	padding-block-start: var(--wp--preset--spacing--large, 2.5rem);
	border-block-start: 3px solid var(--cr-ink, #241c4a);
}
.cr-browse-all__title { margin-block: 0 1rem; }
.cr-browse-all__group {
	font-family: var(--cr-font-mono, monospace);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin-block: 0 0.5rem;
}
.cr-browse-all ul.cr-browse-all__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.cr-browse-all ul.cr-browse-all__list li {
	margin: 0;
	font-family: var(--cr-font-mono, monospace);
	font-size: max(0.72rem, var(--cr-text-floor, 0.7rem));
	letter-spacing: 0.06em;
	text-transform: uppercase;
	border: 1.5px solid var(--cr-ink, #241c4a);
	background: var(--cr-surface, #fbfaf5);
	color: var(--cr-ink, #241c4a);
	padding: 0.2rem 0.55rem;
	box-shadow: 2px 2px 0 var(--cr-ink, #241c4a);
}
.cr-browse-all ul.cr-browse-all__list li a { color: inherit; text-decoration: none; }
.cr-browse-all ul.cr-browse-all__list li a:hover,
.cr-browse-all ul.cr-browse-all__list li a:focus-visible { text-decoration: underline; text-decoration-thickness: 2px; }
.cr-browse-all ul.cr-browse-all__list ul.children { display: contents; }
@media (max-width: 48em) {
	.cr-browse-all__columns { flex-direction: column; gap: 1.25rem; }
}

/* Inside the collage the blog-grid separators and hover lift do not apply:
   the cards are the plugin's objects, spaced by the masonry rules. */
.cr-archive :is(.cr-archive-stream, .cr-stories) .wp-block-post:not(:last-child)::after { content: none; }
.cr-archive :is(.cr-archive-stream, .cr-stories) .wp-block-post { padding-block: 0; }
.cr-archive :is(.cr-archive-stream, .cr-stories) .wp-block-post:hover { transform: none; }

/* Stories archive: 9:16 posters as pinned prints; the plugin owns playback on
   the story URL. A story without a poster shows its title on ruled paper. */
.cr-archive--stories .cr-archive__header { max-width: 72rem; }
.cr-stories .cr-stories__list { gap: 2.25rem 1.75rem; }
.cr-stories .cr-stories__card {
	background: var(--cr-surface, #fbfaf5);
	border: 2px solid var(--cr-ink, #241c4a);
	box-shadow: var(--cr-shadow-hard, 4px 4px 0 var(--cr-ink, #241c4a));
	padding: 0.6rem 0.6rem 0.9rem;
	transform: rotate(var(--cr-rotate-1, -1.2deg));
}
.cr-stories .cr-stories__list > li:nth-child(even) .cr-stories__card { transform: rotate(var(--cr-rotate-2, 1.5deg)); }
.cr-stories .cr-stories__card:has(a:focus-visible) { outline: 3px solid var(--cr-selective-yellow, #ffb703); outline-offset: 4px; }
.cr-stories .cr-stories__poster { margin: 0; }
.cr-stories .cr-stories__poster img { display: block; inline-size: 100%; block-size: auto; object-fit: cover; }
/* no poster: keep the 9:16 slot as ruled paper so the grid stays even */
.cr-stories .cr-stories__poster:empty,
.cr-stories .cr-stories__card > .cr-stories__label:first-child::before {
	content: "";
	display: block;
	aspect-ratio: 9 / 16;
	background:
		repeating-linear-gradient(to bottom, transparent 0 1.4rem, color-mix(in srgb, var(--cr-ink, #241c4a) 18%, transparent) 1.4rem calc(1.4rem + 1px)),
		var(--cr-halftone), var(--cr-surface, #fbfaf5);
	background-size: auto, var(--cr-halftone-size), auto;
	border: 1.5px dashed var(--cr-ink, #241c4a);
	margin-block-end: 0.6rem;
}
.cr-stories .cr-stories__label { margin-block-start: 0.6rem; }
.cr-stories .cr-stories__title { margin: 0; line-height: 1.2; font-size: var(--wp--preset--font-size--medium, 1.25rem); }
.cr-stories .cr-stories__title a { color: var(--cr-ink, #241c4a); text-decoration: none; }
.cr-stories .cr-stories__title a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.cr-stories .cr-stories__date {
	margin: 0.35rem 0 0;
	font-family: var(--cr-font-mono, monospace);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cr-ink, #241c4a);
}
.cr-stories__empty { font-family: var(--cr-font-accent, serif); font-size: var(--wp--preset--font-size--medium, 1.125rem); }
@media (prefers-reduced-motion: no-preference) {
	.cr-stories .cr-stories__card { transition: transform 0.15s ease; }
	.cr-stories .cr-stories__card:hover { transform: rotate(0deg) translateY(-2px); }
}