@import "tailwindcss";

@theme {
	--color-brand: #f59e0b;       /* amber-400 */
	--color-brand-dim: #d97706;   /* amber-600 */
	--color-surface: #18181b;     /* zinc-900 */
	--color-surface-2: #27272a;   /* zinc-800 */
	--color-surface-3: #3f3f46;   /* zinc-700 */
	--color-muted: #a1a1aa;       /* zinc-400 */
	--color-text: #f4f4f5;        /* zinc-100 */
}

html {
	background-color: var(--color-surface);
	color: var(--color-text);
}

/* ── Chapter prose ─────────────────────────────────────────────────── */
.prose-chapter {
	max-width: 72ch;
	line-height: 1.85;
	font-size: 1.05rem;
	color: #d4d4d8; /* zinc-300 */
}

.prose-chapter h1,
.prose-chapter h2,
.prose-chapter h3 {
	color: #f4f4f5;
	font-weight: 700;
	margin-top: 1.5em;
	margin-bottom: 0.5em;
}

.prose-chapter h1 { font-size: 1.4rem; }
.prose-chapter h2 { font-size: 1.2rem; }
.prose-chapter h3 { font-size: 1.05rem; }

.prose-chapter p {
	margin-bottom: 1.2em;
}

.prose-chapter em {
	color: #a1a1aa;
}

.prose-chapter strong {
	color: #f4f4f5;
}

.prose-chapter hr {
	border-color: #3f3f46;
	margin: 2em 0;
}

/* ── Navigation progress bar ───────────────────────────────────────── */
@keyframes progress-bar {
	0%   { width: 0%; opacity: 1; }
	80%  { width: 90%; opacity: 1; }
	100% { width: 100%; opacity: 0; }
}
.animate-progress-bar {
	animation: progress-bar 8s cubic-bezier(0.1, 0.05, 0.1, 1) forwards;
}