/* =============================================================================
   Angry Airship — ink on paper.

   theme.json owns the tokens (palette, type scale, spacing, layout). This file
   owns the craft: the paper itself, the brush marks, the seal, and the handful
   of components blocks cannot express on their own.

   Contents
     1.  Tokens and marks
     2.  Paper
     3.  Typography
     4.  Links, buttons, forms
     5.  Header
     6.  Footer
     7.  Block styles
     8.  Page heads
     9.  Devlog index — cards, grid, pagination
     10. Single post — byline, prose, patch notes, post navigation
     11. Comments
     12. Media and galleries
     13. Resilience, accessibility, print
============================================================================= */

/* -----------------------------------------------------------------------------
   1. Tokens and marks
----------------------------------------------------------------------------- */

:root {
	--aa-paper:        var(--wp--preset--color--paper, #F2EDE3);
	--aa-paper-sunk:   var(--wp--preset--color--paper-sunk, #E8E0D0);
	--aa-paper-edge:   var(--wp--preset--color--paper-edge, #D8CDB7);
	--aa-ink:          var(--wp--preset--color--ink, #1B1A18);
	--aa-ink-soft:     var(--wp--preset--color--ink-soft, #2E2B26);
	--aa-ink-muted:    var(--wp--preset--color--ink-muted, #6B6357);
	--aa-cinnabar:     var(--wp--preset--color--cinnabar, #B33A2B);
	--aa-cinnabar-deep:var(--wp--preset--color--cinnabar-deep, #8A2A1D);

	--aa-hairline:     color-mix(in srgb, var(--aa-ink) 12%, transparent);
	--aa-hairline-firm:color-mix(in srgb, var(--aa-ink) 20%, transparent);

	--aa-mono:    var(--wp--preset--font-family--mono);
	--aa-display: var(--wp--preset--font-family--display);
	--aa-body:    var(--wp--preset--font-family--body);

	/* Fine paper grain. Fractal noise, desaturated, laid over the page at a few
	   percent so the background never reads as flat screen-white. */
	--aa-grain: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23g)'/%3E%3C/svg%3E");

	/* A single dry brush stroke — thicker where the brush lands on the left,
	   lifting away to the right. Used as a mask so it inherits its colour. */
	--aa-brush: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 18' preserveAspectRatio='none'%3E%3Cpath d='M1,7.4C88,4.1 168,7.2 249,5.6C340,3.8 431,9.4 521,7.3C611,5.2 700,11.2 790,8.9C879,6.6 959,10.8 1039,8.5C1109,6.5 1160,9.4 1198,8.1L1198,10.1C1160,11.6 1109,9 1039,11.1C959,13.5 879,9.6 790,11.9C700,14.2 611,8.6 521,10.6C431,12.6 340,7.3 249,9.2C168,10.9 88,8.4 1,12.6Z'/%3E%3Cpath d='M1150,13.4C1162,13.1 1170,13.6 1178,13.2L1178,14.4C1170,14.9 1162,14.4 1150,14.7Z'/%3E%3C/svg%3E");

	/* Deckled paper edge — solid above, torn below. */
	--aa-deckle: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 24' preserveAspectRatio='none'%3E%3Cpath d='M0,0L1200,0L1200,11C1120,19 1050,7 970,14C880,22 800,8 720,15C640,22 560,6 470,13C390,19 310,7 230,14C160,20 80,9 0,16Z'/%3E%3C/svg%3E");
}

/* -----------------------------------------------------------------------------
   2. Paper
----------------------------------------------------------------------------- */

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	background-color: var(--aa-paper);
	background-image:
		radial-gradient(58rem 40rem at 10% -8%, color-mix(in srgb, var(--aa-paper-edge) 48%, transparent), transparent 62%),
		radial-gradient(48rem 34rem at 94% 16%, color-mix(in srgb, var(--aa-paper-edge) 36%, transparent), transparent 64%),
		radial-gradient(70rem 48rem at 46% 104%, color-mix(in srgb, var(--aa-paper-edge) 34%, transparent), transparent 60%);
	background-attachment: fixed;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* The grain sits above the paper wash and below every piece of content. */
body::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background-image: var(--aa-grain);
	background-size: 220px 220px;
	opacity: .05;
	mix-blend-mode: multiply;
}

.wp-site-blocks {
	position: relative;
	z-index: 1;
	overflow-x: clip;
}

/* -----------------------------------------------------------------------------
   3. Typography
----------------------------------------------------------------------------- */

body {
	font-variant-numeric: oldstyle-num proportional-nums;
	font-feature-settings: "kern" 1, "liga" 1;
}

/* Headings, meta and anything mechanical want lining figures instead. */
h1, h2, h3, h4, h5, h6,
.aa-eyebrow, .aa-byline, .aa-card__meta,
.wp-block-post-date, .wp-block-post-terms,
.aa-pagination, code, pre, kbd, samp {
	font-variant-numeric: lining-nums tabular-nums;
}

h1, h2, h3, h4 {
	text-wrap: balance;
	overflow-wrap: break-word;
	hyphens: none;
}

p, li, dd, figcaption {
	text-wrap: pretty;
}

strong, b { font-weight: 600; }

em, i { font-style: italic; }

::selection {
	background: color-mix(in srgb, var(--aa-cinnabar) 22%, transparent);
	color: var(--aa-ink);
}

/* Eyebrow: the machine voice, used for labels and metadata. */
.aa-eyebrow {
	display: flex;
	align-items: center;
	gap: .6em;
	margin: 0;
	font-family: var(--aa-mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: .14em;
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--aa-ink-muted);
}

.aa-eyebrow::before {
	content: "";
	flex: none;
	width: 7px;
	height: 7px;
	background: var(--aa-cinnabar);
}

.is-style-eyebrow {
	font-family: var(--aa-mono) !important;
	font-size: var(--wp--preset--font-size--x-small) !important;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--aa-ink-muted);
}

/* Lead paragraph — one clear step above body, well below the heading. */
.is-style-lead,
.aa-entry-content > div:first-child {
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.58;
	color: var(--aa-ink);
}

.is-style-note {
	font-size: var(--wp--preset--font-size--small);
	font-style: italic;
	color: var(--aa-ink-muted);
	border-left: 2px solid var(--aa-paper-edge);
	padding-left: 1rem;
}

/* -----------------------------------------------------------------------------
   4. Links, buttons, forms
----------------------------------------------------------------------------- */

a {
	text-underline-offset: .18em;
	text-decoration-thickness: from-font;
	transition: color .18s ease;
}

/* Prose links carry an underline; navigation and card links do not. */
.aa-entry-content a:where(:not(.wp-element-button):not(.wp-block-button__link)) {
	text-decoration: underline;
	text-decoration-color: color-mix(in srgb, var(--aa-cinnabar) 42%, transparent);
}

.aa-entry-content a:where(:not(.wp-element-button):not(.wp-block-button__link)):hover {
	text-decoration-color: currentColor;
}

.wp-element-button,
.wp-block-button__link {
	transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--aa-ink);
	border: 1px solid var(--aa-hairline-firm);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-button.is-style-outline > .wp-block-button__link:focus {
	background: var(--aa-ink);
	border-color: var(--aa-ink);
	color: var(--aa-paper);
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="password"],
textarea,
select {
	width: 100%;
	padding: .8rem 1rem;
	background: color-mix(in srgb, var(--aa-paper) 60%, #fff);
	border: 1px solid var(--aa-hairline-firm);
	border-radius: 2px;
	font-family: var(--aa-body);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--aa-ink);
	transition: border-color .18s ease, box-shadow .18s ease;
}

input:focus,
textarea:focus,
select:focus {
	outline: none;
	border-color: var(--aa-cinnabar);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--aa-cinnabar) 16%, transparent);
}

label {
	display: block;
	margin-bottom: .4rem;
	font-family: var(--aa-mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--aa-ink-muted);
}

.required { color: var(--aa-cinnabar); }

.aa-search .wp-block-search__inside-wrapper {
	border: 0;
	gap: .6rem;
}

.aa-search .wp-block-search__button {
	margin: 0;
	border: 0;
	border-radius: 2px;
	padding: .8rem 1.5rem;
	background: var(--aa-ink);
	color: var(--aa-paper);
	font-family: var(--aa-body);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	cursor: pointer;
}

.aa-search .wp-block-search__button:hover { background: var(--aa-cinnabar); }

/* -----------------------------------------------------------------------------
   5. Header
----------------------------------------------------------------------------- */

.aa-header {
	position: sticky;
	top: 0;
	z-index: 100;
	padding-block: .9rem;
	border-bottom: 1px solid var(--aa-hairline);
}

/* The frosted panel lives on a pseudo-element, not on .aa-header itself.
   backdrop-filter makes an element the containing block for its
   position: fixed descendants (same as transform or filter). Core's mobile
   menu is position: fixed; inset: 0, so with the filter on the header the
   overlay resolved against the header box and opened *inside* the 70px
   strip instead of covering the viewport. Moving it down one level keeps
   the frosted look and lets the overlay escape to the viewport. */
.aa-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: color-mix(in srgb, var(--aa-paper) 88%, transparent);
	backdrop-filter: blur(12px) saturate(1.15);
	-webkit-backdrop-filter: blur(12px) saturate(1.15);
	pointer-events: none;
}

.aa-header__inner { width: 100%; }

/* The seal that stands in for the studio mark in the header. */
.aa-brand::before {
	content: "";
	flex: none;
	width: 11px;
	height: 11px;
	background: var(--aa-cinnabar);
	transform: translateY(-1px);
}

.aa-brand .wp-block-site-title a { text-decoration: none; }

.aa-nav .wp-block-navigation-item__content {
	position: relative;
	padding-block: .3rem;
	color: var(--aa-ink-soft);
	text-decoration: none;
}

.aa-nav .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background: var(--aa-cinnabar);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .22s ease;
}

.aa-nav .wp-block-navigation-item__content:hover { color: var(--aa-ink); }
.aa-nav .wp-block-navigation-item__content:hover::after { transform: scaleX(1); }

.aa-nav .current-menu-item > .wp-block-navigation-item__content,
.aa-nav .current_page_item > .wp-block-navigation-item__content {
	color: var(--aa-ink);
}

.aa-nav .current-menu-item > .wp-block-navigation-item__content::after,
.aa-nav .current_page_item > .wp-block-navigation-item__content::after {
	transform: scaleX(1);
}

/* Mobile overlay.
   Core hardcodes background-color:#fff and color:#000 on the open overlay, so
   the paper and ink have to be forced rather than merely out-specified.

   Core sizes the overlay as `position: fixed; inset: 0`, which only reaches the
   viewport while *every* ancestor stays out of the way. Any ancestor that gains
   a transform, filter, backdrop-filter, perspective, contain or will-change —
   from this theme, from a plugin, or from a cache/optimiser rewriting the CSS —
   becomes the containing block instead, and `inset: 0` then resolves against the
   ~58px header strip: the menu opens inside the header and scrolls in place.

   Sizing the overlay in viewport units removes the dependency. The header is
   sticky at top:0 and full-bleed, so its padding-box origin coincides with the
   viewport origin; whichever box ends up being the containing block, the overlay
   covers the screen. left/top are pinned and right/bottom released so the box is
   never over-constrained. */
.aa-nav .wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--aa-paper) !important;
	color: var(--aa-ink) !important;
	padding: clamp(1.5rem, 6vw, 3rem);
	position: fixed;
	top: 0;
	left: 0;
	right: auto;
	bottom: auto;
	/* Core sets border-box on the overlay's children but not on the overlay
	   itself, so an explicit width would otherwise gain the padding on top. */
	box-sizing: border-box;
	width: 100vw;
	/* dvh so mobile browser chrome retracting does not leave a dead strip. */
	height: 100dvh;
	max-height: 100dvh;
	overflow-y: auto;
	overscroll-behavior: contain;
}

/* Fallback for engines without dvh (Safari < 15.4, older Chromium). */
@supports not (height: 100dvh) {
	.aa-nav .wp-block-navigation__responsive-container.is-menu-open {
		height: 100vh;
		max-height: 100vh;
	}
}

/* Belt and braces: drop the header's own backdrop-filter while the menu is
   open. It is invisible behind a full-screen opaque overlay, and Safari has
   long-standing repaint bugs around fixed content layered over a live blur. */
.aa-header:has(.wp-block-navigation__responsive-container.is-menu-open)::before {
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

/* The desktop nav is justified right. The overlay is a column flex box, so the
   horizontal placement of each level is set by its parent's align-items — the
   whole chain has to be reset or long labels ("Shogun Exodus") run off-screen. */
.aa-nav .wp-block-navigation__responsive-container.is-menu-open,
.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-start;
	justify-content: flex-start;
	text-align: left;
}

/* ...-container-content is WordPress 6.8's extra wrapper; the older markup has
   no such element, so naming both keeps the chain unbroken either way. */
.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	width: 100%;
}

.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: .35em;
}

.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-family: var(--aa-display);
	/* Not the xxx-large preset: at ~54px "Shogun Exodus" overflows a 390px screen. */
	font-size: clamp(1.75rem, 7vw, 2.75rem);
	font-weight: 700;
	line-height: 1.15;
	color: var(--aa-ink);
}

/* Close control: give it an explicit ink colour and a 44px tap target rather
   than relying on the 24px core icon alone. */
.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: -10px -10px 0 0;
	color: var(--aa-ink);
	opacity: 1;
	visibility: visible;
}

.aa-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
	width: 26px;
	height: 26px;
	fill: currentColor;
}

.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	color: var(--aa-ink);
}

/* -----------------------------------------------------------------------------
   6. Footer
----------------------------------------------------------------------------- */

.aa-footer {
	position: relative;
	isolation: isolate;
}

/* Torn paper edge, so the page does not simply stop against a black band. */
.aa-footer::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -1px;
	height: 24px;
	background: var(--aa-paper);
	-webkit-mask-image: var(--aa-deckle);
	mask-image: var(--aa-deckle);
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	pointer-events: none;
}

.aa-footer__label {
	color: color-mix(in srgb, var(--aa-paper) 62%, transparent) !important;
	margin: 0;
}

.aa-footer__studio {
	font-family: var(--aa-display);
	font-weight: 700;
	letter-spacing: .04em;
}

.aa-footer__meta {
	color: color-mix(in srgb, var(--aa-paper) 62%, transparent);
	max-width: 34ch;
}

.aa-footer__links {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
}

.aa-footer__links li + li { margin-top: .55rem; }

.aa-footer a {
	color: color-mix(in srgb, var(--aa-paper) 82%, transparent);
	text-decoration: none;
}

.aa-footer a:hover {
	color: var(--aa-paper);
	text-decoration: underline;
	text-decoration-color: var(--aa-cinnabar);
	text-decoration-thickness: 2px;
}

.aa-footer__logo img {
	filter: saturate(.25) brightness(1.1);
	opacity: .85;
	transition: filter .3s ease, opacity .3s ease;
}

.aa-footer__logo:hover img {
	filter: none;
	opacity: 1;
}

.aa-footer__base {
	border-top: 1px solid color-mix(in srgb, var(--aa-paper) 16%, transparent);
	color: color-mix(in srgb, var(--aa-paper) 55%, transparent);
}

.aa-footer__base p { margin: 0; }

/* -----------------------------------------------------------------------------
   7. Block styles
----------------------------------------------------------------------------- */

/* Brush stroke separator */
.wp-block-separator.is-style-brush {
	border: 0;
	height: 16px;
	width: 100%;
	max-width: none;
	opacity: 1;
	background-color: color-mix(in srgb, var(--aa-ink) 46%, transparent);
	-webkit-mask-image: var(--aa-brush);
	mask-image: var(--aa-brush);
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

/* Seal separator — a hairline broken by a cinnabar stamp */
.wp-block-separator.is-style-seal {
	border: 0;
	height: 9px;
	width: 100%;
	max-width: none;
	opacity: 1;
	background:
		linear-gradient(var(--aa-paper-edge), var(--aa-paper-edge)) left center / calc(50% - 1.4rem) 1px no-repeat,
		linear-gradient(var(--aa-paper-edge), var(--aa-paper-edge)) right center / calc(50% - 1.4rem) 1px no-repeat,
		linear-gradient(var(--aa-cinnabar), var(--aa-cinnabar)) center center / 9px 9px no-repeat;
}

/* Plain separators stay quiet hairlines rather than heavy rules. */
.wp-block-separator:not(.is-style-brush):not(.is-style-seal) {
	border: 0;
	height: 1px;
	background: var(--aa-paper-edge);
	opacity: 1;
	max-width: none;
	width: 100%;
}

/* Heading with a cinnabar rule above it */
.wp-block-heading.is-style-rule-above::before {
	content: "";
	display: block;
	width: 44px;
	height: 3px;
	margin-bottom: .85rem;
	background: var(--aa-cinnabar);
}

/* Artwork that dissolves into the paper instead of ending in a hard rectangle */
.wp-block-image.is-style-bleed img,
.wp-block-cover.is-style-bleed .wp-block-cover__image-background {
	-webkit-mask-image: radial-gradient(118% 108% at 50% 46%, #000 50%, transparent 86%);
	mask-image: radial-gradient(118% 108% at 50% 46%, #000 50%, transparent 86%);
}

/* Artwork mounted on a paper plate */
.wp-block-image.is-style-plate img {
	background: color-mix(in srgb, var(--aa-paper) 55%, #fff);
	box-shadow: 0 0 0 1px var(--aa-hairline), 0 12px 28px -20px rgba(27, 26, 24, .55);
	border-radius: 2px;
}

/* Sunken panel */
.wp-block-group.is-style-panel {
	background: color-mix(in srgb, var(--aa-paper-sunk) 70%, transparent);
	border: 1px solid var(--aa-hairline);
	border-radius: 2px;
	padding: clamp(1.5rem, 3.5vw, 2.75rem);
}

/* Ink panel */
.wp-block-group.is-style-ink {
	background: var(--aa-ink);
	color: var(--aa-paper);
	border-radius: 2px;
	padding: clamp(1.75rem, 4vw, 3.25rem);
}

.wp-block-group.is-style-ink :where(h1, h2, h3, h4, h5) { color: var(--aa-paper); }
.wp-block-group.is-style-ink a { color: color-mix(in srgb, var(--aa-cinnabar) 55%, var(--aa-paper)); }

/* Seal markers on lists */
ul.is-style-seal-markers {
	list-style: none;
	padding-left: 0;
}

ul.is-style-seal-markers > li {
	position: relative;
	padding-left: 1.7rem;
}

ul.is-style-seal-markers > li + li { margin-top: .85rem; }

ul.is-style-seal-markers > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .62em;
	width: 7px;
	height: 7px;
	background: var(--aa-cinnabar);
}

/* Columns divided by hairlines */
.wp-block-columns.is-style-rules > .wp-block-column + .wp-block-column {
	border-left: 1px solid var(--aa-hairline);
	padding-left: clamp(1.5rem, 3vw, 2.75rem);
}

/* -----------------------------------------------------------------------------
   8. Page heads
----------------------------------------------------------------------------- */

.aa-main { padding-bottom: var(--wp--preset--spacing--60); }

.aa-page-head > * { margin-block: 0; }

.aa-page-head .wp-block-post-title,
.aa-page-head h1 {
	margin-block: .3rem 0;
}

.aa-page-head__lede {
	max-width: 46ch;
	margin-top: var(--wp--preset--spacing--20);
	color: var(--aa-ink-muted);
}

/* -----------------------------------------------------------------------------
   9. Devlog index — cards, grid, pagination
----------------------------------------------------------------------------- */

.aa-post-grid {
	--aa-card-gap: var(--wp--preset--spacing--50);
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--aa-card-gap);
}

.aa-post-grid > li { margin: 0; }

/* The most recent entry runs the full width and reads as the lead item. */
.aa-post-grid > li:first-child {
	grid-column: 1 / -1;
	padding-bottom: var(--aa-card-gap);
	border-bottom: 1px solid var(--aa-hairline);
}

.aa-post-grid > li:first-child > .aa-card {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: clamp(1.75rem, 3.5vw, 3.25rem);
	align-items: center;
}

.aa-post-grid > li:first-child .aa-card__title {
	font-size: var(--wp--preset--font-size--display);
}

.aa-post-grid > li:first-child .aa-card__excerpt {
	font-size: var(--wp--preset--font-size--large);
}

.aa-card { position: relative; }

.aa-card__media {
	margin: 0 0 var(--wp--preset--spacing--30);
	overflow: hidden;
	border-radius: 2px;
	background: var(--aa-paper-sunk);
	box-shadow: 0 0 0 1px var(--aa-hairline);
}

.aa-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s cubic-bezier(.2, .8, .3, 1), filter .4s ease;
}

.aa-card:hover .aa-card__media img {
	transform: scale(1.025);
	filter: contrast(1.04);
}

/* Posts with no featured image keep the grid honest with an empty plate. */
.aa-plate-empty {
	position: relative;
	margin: 0 0 var(--wp--preset--spacing--30);
	aspect-ratio: 16 / 9;
	border-radius: 2px;
	background: var(--aa-paper-sunk);
	box-shadow: 0 0 0 1px var(--aa-hairline);
}

.aa-plate-empty a {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
}

.aa-plate-empty .aa-seal {
	width: 16px;
	height: 16px;
	background: color-mix(in srgb, var(--aa-cinnabar) 42%, transparent);
}

.aa-card__meta {
	align-items: baseline;
	color: var(--aa-ink-muted);
}

.aa-card__meta .wp-block-post-date,
.aa-card__meta .wp-block-post-terms {
	margin: 0;
}

.aa-card__meta .wp-block-post-terms a {
	color: var(--aa-cinnabar);
	text-decoration: none;
	font-weight: 700;
}

.aa-card__meta .wp-block-post-terms a:hover { text-decoration: underline; }

.aa-card__title {
	margin: 0;
	line-height: 1.14;
}

.aa-card__title a {
	color: var(--aa-ink);
	text-decoration: none;
	background-image: linear-gradient(var(--aa-cinnabar), var(--aa-cinnabar));
	background-size: 0 2px;
	background-position: 0 100%;
	background-repeat: no-repeat;
	transition: background-size .3s cubic-bezier(.2, .8, .3, 1), color .2s ease;
}

.aa-card:hover .aa-card__title a,
.aa-card__title a:focus-visible {
	background-size: 100% 2px;
}

.aa-card__excerpt {
	margin: 0;
	color: var(--aa-ink-soft);
}

.aa-card__excerpt p { margin: 0; }

.wp-block-post-excerpt__more-link {
	display: inline-block;
	margin-top: .9rem;
	font-family: var(--aa-mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--aa-cinnabar);
	text-decoration: none;
}

.wp-block-post-excerpt__more-link::after {
	content: " →";
	transition: padding-left .2s ease;
}

.aa-card:hover .wp-block-post-excerpt__more-link::after { padding-left: .25em; }

/* Pagination */
.aa-pagination {
	padding-top: var(--wp--preset--spacing--40);
	border-top: 1px solid var(--aa-hairline);
	font-family: var(--aa-mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.aa-pagination a,
.aa-pagination .page-numbers {
	color: var(--aa-ink-muted);
	text-decoration: none;
}

.aa-pagination a:hover { color: var(--aa-cinnabar); }

.aa-pagination .wp-block-query-pagination-numbers {
	display: flex;
	gap: .85rem;
}

.aa-pagination .page-numbers.current {
	color: var(--aa-ink);
	font-weight: 700;
	border-bottom: 2px solid var(--aa-cinnabar);
}

/* -----------------------------------------------------------------------------
   10. Single post
----------------------------------------------------------------------------- */

.aa-post-head .wp-block-post-terms {
	display: flex;
	align-items: center;
	gap: .6em;
	font-family: var(--aa-mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.aa-post-head .wp-block-post-terms::before {
	content: "";
	flex: none;
	width: 7px;
	height: 7px;
	background: var(--aa-cinnabar);
}

.aa-post-head .wp-block-post-terms a {
	color: var(--aa-cinnabar);
	text-decoration: none;
}

.aa-byline {
	align-items: baseline;
	color: var(--aa-ink-muted);
	font-family: var(--aa-mono);
	letter-spacing: .06em;
}

.aa-byline > * { margin: 0; }
.aa-byline__sep { opacity: .5; }

.aa-single__media img {
	width: 100%;
	border-radius: 2px;
	box-shadow: 0 0 0 1px var(--aa-hairline);
}

/* --- Prose ---------------------------------------------------------------- */

.aa-entry-content { line-height: 1.72; }

.aa-single .aa-entry-content > h2,
.aa-single .aa-entry-content > h3 {
	margin-top: var(--wp--preset--spacing--60);
	margin-bottom: var(--wp--preset--spacing--20);
}

.aa-single .aa-entry-content > h2::before,
.aa-single .aa-entry-content > h3::before {
	content: "";
	display: block;
	width: 44px;
	height: 3px;
	margin-bottom: .85rem;
	background: var(--aa-cinnabar);
}

/* UpdateBot writes the summary as a bare <div>; treat it as the lead. */
.aa-entry-content > div:first-child {
	margin-bottom: var(--wp--preset--spacing--40);
}

.aa-entry-content > hr,
.aa-entry-content > .wp-block-separator {
	margin-block: var(--wp--preset--spacing--50);
	border: 0;
	height: 16px;
	width: 100%;
	max-width: none;
	opacity: 1;
	background-color: color-mix(in srgb, var(--aa-ink) 40%, transparent);
	-webkit-mask-image: var(--aa-brush);
	mask-image: var(--aa-brush);
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

.aa-entry-content :where(ul, ol) { padding-left: 1.4rem; }
.aa-entry-content li + li { margin-top: .4rem; }
.aa-entry-content li::marker { color: var(--aa-cinnabar); }

.aa-entry-content blockquote {
	margin-inline: 0;
	padding-left: clamp(1.25rem, 3vw, 2rem);
	border-left: 3px solid var(--aa-cinnabar);
	font-style: italic;
	color: var(--aa-ink);
}

.aa-entry-content :not(pre) > code {
	padding: .12em .38em;
	background: var(--aa-paper-sunk);
	border: 1px solid var(--aa-hairline);
	border-radius: 2px;
	font-family: var(--aa-mono);
	font-size: .86em;
}

/* --- Patch notes: the machine voice ---------------------------------------- */

.aa-entry-content pre,
.aa-patchnotes__pre {
	margin: 0;
	padding: clamp(1.25rem, 3vw, 1.9rem);
	background: var(--aa-ink);
	color: #DED7C8;
	border-radius: 0 0 2px 2px;
	font-family: var(--aa-mono);
	font-size: .8125rem;
	line-height: 1.72;
	white-space: pre-wrap;
	overflow-wrap: break-word;
	tab-size: 2;
	overflow-x: auto;
}

.aa-patchnotes {
	margin: var(--wp--preset--spacing--30) 0 var(--wp--preset--spacing--40);
	border-radius: 2px;
	box-shadow: 0 0 0 1px var(--aa-hairline), 0 18px 40px -30px rgba(27, 26, 24, .8);
	overflow: hidden;
	position: relative;
}

.aa-patchnotes__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .7rem 1rem .7rem 1.15rem;
	background: #14130F;
	border-bottom: 1px solid rgba(242, 237, 227, .12);
	font-family: var(--aa-mono);
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: rgba(242, 237, 227, .55);
}

.aa-patchnotes__label {
	display: flex;
	align-items: center;
	gap: .7em;
}

.aa-patchnotes__label::before {
	content: "";
	width: 7px;
	height: 7px;
	background: var(--aa-cinnabar);
}

.aa-patchnotes__copy {
	appearance: none;
	border: 1px solid rgba(242, 237, 227, .2);
	background: transparent;
	border-radius: 2px;
	padding: .3rem .7rem;
	font: inherit;
	color: rgba(242, 237, 227, .7);
	cursor: pointer;
	transition: border-color .2s ease, color .2s ease, background-color .2s ease;
}

.aa-patchnotes__copy:hover {
	border-color: var(--aa-cinnabar);
	background: var(--aa-cinnabar);
	color: var(--aa-paper);
}

.aa-patchnotes.is-collapsed .aa-patchnotes__pre {
	max-height: 34rem;
	overflow: hidden;
}

.aa-patchnotes.is-collapsed::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 3.4rem;
	height: 8rem;
	background: linear-gradient(180deg, rgba(27, 26, 24, 0), var(--aa-ink) 88%);
	pointer-events: none;
}

.aa-patchnotes__toggle {
	display: block;
	width: 100%;
	appearance: none;
	border: 0;
	border-top: 1px solid rgba(242, 237, 227, .12);
	background: #14130F;
	padding: 1rem;
	font-family: var(--aa-mono);
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: rgba(242, 237, 227, .65);
	cursor: pointer;
	transition: color .2s ease, background-color .2s ease;
}

.aa-patchnotes__toggle:hover {
	color: var(--aa-paper);
	background: #1F1D19;
}

/* The automated-post disclaimer. Small, but not unreadably small. */
.aa-entry-content p[style*="small"],
.aa-entry-content > p.has-small-font-size:last-child {
	font-size: var(--wp--preset--font-size--small) !important;
	line-height: 1.6;
	color: var(--aa-ink-muted);
	border-left: 2px solid var(--aa-paper-edge);
	padding-left: 1rem;
	margin-top: var(--wp--preset--spacing--40);
}

/* --- Post navigation ------------------------------------------------------- */

.aa-postnav {
	gap: var(--wp--preset--spacing--40);
	padding-top: var(--wp--preset--spacing--40);
	border-top: 1px solid var(--aa-hairline);
}

.aa-postnav__item--next { text-align: right; }

.aa-postnav__item--next .aa-eyebrow { justify-content: flex-end; }
.aa-postnav__item--next .aa-eyebrow::before { order: 2; }

/* Hide the label when there is no adjacent post to point at. */
.aa-postnav__item:not(:has(.wp-block-post-navigation-link)) { visibility: hidden; }

.aa-postnav .wp-block-post-navigation-link a {
	font-family: var(--aa-display);
	font-weight: 700;
	color: var(--aa-ink);
	text-decoration: none;
	line-height: 1.25;
}

.aa-postnav .wp-block-post-navigation-link a:hover { color: var(--aa-cinnabar); }

/* -----------------------------------------------------------------------------
   11. Comments
----------------------------------------------------------------------------- */

.aa-comments {
	padding-top: var(--wp--preset--spacing--50);
	border-top: 1px solid var(--aa-hairline);
}

.wp-block-comments-title { margin-bottom: var(--wp--preset--spacing--40); }

.aa-comment {
	padding-bottom: var(--wp--preset--spacing--30);
	margin-bottom: var(--wp--preset--spacing--30);
	border-bottom: 1px solid var(--aa-hairline);
}

.aa-comment__head { align-items: center; }

.wp-block-comment-author-name a {
	color: var(--aa-ink);
	font-weight: 600;
	text-decoration: none;
}

.wp-block-comment-date {
	font-family: var(--aa-mono);
	color: var(--aa-ink-muted);
}

.wp-block-comment-reply-link a {
	font-family: var(--aa-mono);
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--aa-cinnabar);
	text-decoration: none;
}

.aa-comment-form {
	background: color-mix(in srgb, var(--aa-paper-sunk) 62%, transparent);
	border: 1px solid var(--aa-hairline);
	border-radius: 2px;
	padding: clamp(1.5rem, 3.5vw, 2.5rem);
}

.aa-comment-form .comment-reply-title {
	font-family: var(--aa-display);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 700;
	margin-top: 0;
	margin-bottom: var(--wp--preset--spacing--30);
	writing-mode: horizontal-tb;
}

/* Name / email / website share one row and one width. */
.aa-comment-form .comment-form-author,
.aa-comment-form .comment-form-email,
.aa-comment-form .comment-form-url {
	float: none;
	width: 100%;
	margin: 0;
}

.aa-comment-form form {
	display: grid;
	gap: var(--wp--preset--spacing--20);
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.aa-comment-form form > * { grid-column: 1 / -1; }

.aa-comment-form .comment-form-author { grid-column: span 1; }
.aa-comment-form .comment-form-email  { grid-column: span 1; }
.aa-comment-form .comment-form-url    { grid-column: span 1; }

.aa-comment-form .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: .6rem;
}

.aa-comment-form .comment-form-cookies-consent label {
	margin: 0;
	font-family: var(--aa-body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--aa-ink-muted);
}

.aa-comment-form .comment-form-cookies-consent input { width: auto; }

.aa-comment-form .form-submit { margin: 0; }

.aa-comment-form .submit {
	appearance: none;
	border: 0;
	border-radius: 2px;
	padding: 1.05em 1.9em;
	background: var(--aa-cinnabar);
	color: var(--aa-paper);
	font-family: var(--aa-body);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	cursor: pointer;
	transition: background-color .18s ease;
}

.aa-comment-form .submit:hover { background: var(--aa-cinnabar-deep); }

.comment-notes,
.logged-in-as {
	font-size: var(--wp--preset--font-size--small);
	color: var(--aa-ink-muted);
}

/* -----------------------------------------------------------------------------
   12. Media and galleries
----------------------------------------------------------------------------- */

figure { margin: 0; }

.wp-block-image img { border-radius: 2px; }

.wp-block-image figcaption,
.wp-block-embed figcaption {
	margin-top: .75rem;
	text-align: left;
}

/* Even plates: one aspect ratio for the whole gallery, no ragged bands. */
.wp-block-gallery.is-style-plates {
	display: grid;
	grid-template-columns: repeat(var(--aa-gallery-columns, 3), minmax(0, 1fr));
	gap: clamp(.75rem, 1.6vw, 1.25rem);
}

.wp-block-gallery.is-style-plates .wp-block-image {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	flex-basis: auto !important;
}

.wp-block-gallery.is-style-plates .wp-block-image img {
	width: 100%;
	height: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 2px;
	box-shadow: 0 0 0 1px var(--aa-hairline);
	transition: transform .5s cubic-bezier(.2, .8, .3, 1);
}

.wp-block-gallery.is-style-plates .wp-block-image:hover img { transform: scale(1.02); }

.wp-block-embed iframe { border-radius: 2px; }

/* -----------------------------------------------------------------------------
   13. Resilience, accessibility, print
----------------------------------------------------------------------------- */

/* Leftovers from the previous page builder: empty columns and groups that used
   to open holes several hundred pixels tall. */
.wp-block-column:empty,
.wp-block-group:empty,
.wp-block-columns:not(:has(> .wp-block-column:not(:empty))) {
	display: none;
}

.aa-entry-content > p:empty { display: none; }

:focus-visible {
	outline: 2px solid var(--aa-cinnabar);
	outline-offset: 3px;
	border-radius: 1px;
}

.skip-link:focus {
	background: var(--aa-ink);
	color: var(--aa-paper);
	padding: 1rem 1.5rem;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }

	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* --- Responsive ------------------------------------------------------------ */

@media (max-width: 900px) {
	.aa-post-grid { grid-template-columns: 1fr; }

	.aa-post-grid > li:first-child > .aa-card {
		grid-template-columns: 1fr;
		gap: var(--wp--preset--spacing--30);
	}

	.aa-post-grid > li:first-child .aa-card__title {
		font-size: var(--wp--preset--font-size--xxx-large);
	}

	.wp-block-gallery.is-style-plates { --aa-gallery-columns: 2; }

	.aa-comment-form form { grid-template-columns: 1fr; }

	.aa-comment-form .comment-form-author,
	.aa-comment-form .comment-form-email,
	.aa-comment-form .comment-form-url { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
	.aa-postnav { grid-template-columns: 1fr !important; }
	.aa-postnav__item--next { text-align: left; }
	.aa-postnav__item--next .aa-eyebrow { justify-content: flex-start; }
	.aa-postnav__item--next .aa-eyebrow::before { order: 0; }
	.aa-postnav__item:not(:has(.wp-block-post-navigation-link)) { display: none; }

	.wp-block-gallery.is-style-plates { --aa-gallery-columns: 1; }
}

@media print {
	.aa-header, .aa-footer, .aa-comments, .aa-postnav { display: none; }
	body::before { display: none; }
	.aa-entry-content pre { background: none; color: #000; border: 1px solid #999; }
}

/* -----------------------------------------------------------------------------
   14. Page sections
   Used by the Home, Shogun Exodus, About and Links layouts.
----------------------------------------------------------------------------- */

.aa-hero { overflow: hidden; }

.aa-hero__title { text-wrap: balance; }

/* Artwork pushes past its column so the hero does not read as two tidy boxes. */
.aa-hero__art { margin-block: clamp(-1rem, -2vw, -2.5rem); }

.aa-hero__art img {
	width: 110%;
	max-width: none;
	border-radius: 0;
}

.aa-hero__tagline {
	position: relative;
	margin: 0;
	padding-left: 1.1rem;
	color: var(--aa-ink-muted);
	line-height: 1.4;
}

.aa-hero__tagline::before {
	content: "";
	position: absolute;
	left: 0;
	top: .18em;
	bottom: .18em;
	width: 3px;
	background: var(--aa-cinnabar);
}

.aa-hero--page .aa-hero__tagline { max-width: 40ch; }

.aa-hero--page .is-style-bleed img { border-radius: 0; }

/* Section head: heading on the left, the way out on the right. */
.aa-section__head {
	align-items: flex-end;
	gap: var(--wp--preset--spacing--20);
	width: 100%;
}

.aa-section__head > .wp-block-heading { margin: 0; }

.aa-section__more {
	margin: 0;
	font-family: var(--aa-mono);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.aa-section__more a { text-decoration: none; }
.aa-section__more a:hover { text-decoration: underline; }

.aa-section__lede {
	max-width: 62ch;
	color: var(--aa-ink-muted);
}

/* Flat three-up feed on the front page — no lead item, no spanning row. */
.aa-post-grid--flat > li:first-child {
	grid-column: auto;
	padding-bottom: 0;
	border-bottom: 0;
}

.aa-post-grid--flat > li:first-child > .aa-card { display: block; }

.aa-post-grid--flat > li:first-child .aa-card__title,
.aa-post-grid--flat .aa-card__title {
	font-size: var(--wp--preset--font-size--xx-large);
}

/* Follow tiles */
.aa-follow p { margin: 0; }

.aa-follow a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem 1.25rem;
	background: color-mix(in srgb, var(--aa-paper-sunk) 55%, transparent);
	border: 1px solid var(--aa-hairline);
	border-radius: 2px;
	color: var(--aa-ink);
	text-decoration: none;
	font-size: var(--wp--preset--font-size--medium);
	transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.aa-follow a::after {
	content: "→";
	color: var(--aa-cinnabar);
	transition: transform .2s ease;
}

.aa-follow a:hover {
	border-color: var(--aa-cinnabar);
	background: color-mix(in srgb, var(--aa-cinnabar) 7%, transparent);
	color: var(--aa-ink);
}

.aa-follow a:hover::after { transform: translateX(3px); }

/* Update list — title and date on one line, filed like a ledger. */
.aa-updates__list {
	list-style: none;
	padding: 0;
	margin: 0;
	border-top: 1px solid var(--aa-hairline);
}

.aa-updates__list > li { margin: 0; }

.aa-update {
	align-items: baseline;
	gap: var(--wp--preset--spacing--20);
	padding-block: 1rem;
	border-bottom: 1px solid var(--aa-hairline);
	transition: background-color .2s ease;
}

.aa-update__title { margin: 0; }

.aa-update__title a {
	color: var(--aa-ink);
	text-decoration: none;
	font-weight: 700;
}

.aa-update:hover .aa-update__title a { color: var(--aa-cinnabar); }

.aa-update__date {
	margin: 0;
	color: var(--aa-ink-muted);
	white-space: nowrap;
}

/* Call to action */
.aa-cta {
	text-align: left;
	position: relative;
}

.aa-cta > * { max-width: 54ch; }

/* Studio logo, portrait, signature */
.aa-studio-logo img { max-width: 260px; }

.aa-portrait img {
	width: 100%;
	max-height: 480px;
	object-fit: cover;
	object-position: 50% 22%;
}

.aa-signature {
	align-items: center;
	gap: var(--wp--preset--spacing--30);
}

.aa-signature__logo { margin: 0; }
.aa-signature p { margin: 0; max-width: 44ch; }

.aa-comingsoon {
	padding-block: var(--wp--preset--spacing--60);
}

.aa-comingsoon > * { margin: 0; }
.aa-comingsoon .wp-block-heading { margin-top: .6rem; }

@media (max-width: 900px) {
	.aa-hero__art img { width: 100%; }
	.aa-hero__title { max-width: none; }
	.aa-post-grid--flat { grid-template-columns: 1fr !important; }
	.aa-follow { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	.aa-hero__art img { width: 100%; }
	.aa-portrait img { max-height: 380px; }
}

@media (max-width: 600px) {
	.aa-follow { grid-template-columns: 1fr !important; }
	.aa-update { flex-direction: column; align-items: flex-start; gap: .35rem; }
}

/* -----------------------------------------------------------------------------
   15. The shared grid
   Every section sits on one left edge; prose gets a readable measure without
   being re-centred into its own narrow column. This is the fix for the old
   layout, where the page title sat flush left and the body sat 30% inboard.
----------------------------------------------------------------------------- */

/* A constrained container with an explicit contentSize makes WordPress emit
   `margin-left/right: auto !important` for every child, so opting a block out
   of the centring needs !important too. This is what keeps prose on the same
   left edge as the heading above it instead of floating into its own column. */
.aa-measure.aa-measure {
	max-width: 68ch;
	margin-inline: 0 !important;
}

.aa-section__lede.aa-section__lede,
.aa-cta > * {
	margin-inline: 0 !important;
}

/* Three-up feed really is three-up. */
.aa-post-grid--flat {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* One aspect ratio for every card, whatever shape the source art is. */
.aa-card__media img {
	aspect-ratio: 16 / 9;
}

/* A missing adjacent post leaves an empty block, not an empty wrapper. */
.aa-postnav__item:not(:has(.wp-block-post-navigation-link a)) { visibility: hidden; }

/* The Shogun Exodus logotype is white artwork on transparency, drawn to sit on
   a dark plate. On paper it has to be flipped back to ink. */
.wp-block-image.is-style-invert img {
	filter: invert(1);
}

/* Hero: type on clean paper, artwork bleeding in beside it. Overlaying the two
   was tempting but the brushwork is too busy to guarantee the headline reads. */
.aa-hero {
	padding-block: clamp(2rem, 4vw, 3.5rem) clamp(2.5rem, 5vw, 4rem);
}

.aa-hero__panel > * { margin-inline: 0 !important; }

.aa-hero__title {
	text-wrap: balance;
	max-width: 12ch;
}

/* The art runs past its column so the hero does not read as two tidy boxes. */
.aa-hero__media { overflow: visible; }

.aa-hero__art { margin: 0; }

.aa-hero__art img {
	width: 116%;
	max-width: none;
	border-radius: 0;
}

/* The eyebrow above each post-navigation item already says Previous / Next, so
   core's own inline label would only repeat it. */
.aa-postnav .post-navigation-link__label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.aa-postnav .wp-block-post-navigation-link {
	display: flex;
	align-items: baseline;
	gap: .55rem;
}

.aa-postnav__item--next .wp-block-post-navigation-link { justify-content: flex-end; }

.aa-postnav .wp-block-post-navigation-link__arrow-previous,
.aa-postnav .wp-block-post-navigation-link__arrow-next {
	color: var(--aa-cinnabar);
	font-family: var(--aa-body);
}

/* Featured image shares the text column's exact left edge. */
.aa-single__media img { display: block; }
