<!DOCTYPE html>
<html lang="en" class="earthen">
{{ head_html|safe }}
<body class="bg-paper-grain earthen-body antialiased min-h-screen flex flex-col" style="background-color: hsl(var(--background)); color: hsl(var(--foreground)); font-family: var(--font-body, &quot;Work Sans&quot;, ui-sans-serif, system-ui, sans-serif);">
	{{ admin_banner_html|safe }}
	<header class="w-full">{{ slots.header|safe }}</header>
	{% if slots.lede %}<section class="w-full max-w-3xl mx-auto px-4 pt-12">{{ slots.lede|safe }}</section>{% endif %}
	<div class="flex-grow w-full grid grid-cols-1 lg:grid-cols-[1fr,260px] gap-12 max-w-5xl mx-auto px-4 py-12">
		<main>{% if slots.main %}<article class="earthen-article">{{ slots.main|safe }}</article>{% else %}<p style="color: hsl(var(--muted-foreground));">No story body yet.</p>{% endif %}</main>
		{% if slots.aside %}<aside class="earthen-aside text-sm">{{ slots.aside|safe }}</aside>{% endif %}
	</div>
	<footer class="w-full mt-auto">{{ slots.footer|safe }}</footer>
	{{ body_end_html|safe }}
</body>
</html>
