:root{
	--void:#07060f;
	--nebula:#161235;
	--gold:#ffd98a;
	--ember:#F0C060;
	--parchment:#f5ead3;
	--mist:#D2CCD8;
	--dim:#90949C;
	--maxw:680px;
	--display:'Space Grotesk', 'Segoe UI', Arial, sans-serif;
	--body:'Segoe UI', Arial, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }

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

body {
	margin:0;
	min-height:100vh;
	background: #000000;
	background:
		radial-gradient(120% 80% at 50% -10%, var(--nebula) 0%, var(--void) 55%) fixed,
		var(--void);
	color:var(--mist);
	font-family:var(--body);
	font-size: clamp(0.8rem, 0.73rem + 0.36vw, 1rem);
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
	padding:clamp(0px, 2vw, 20px) 20px 60px;
	user-select:none;
}

a { all: unset }

table { border-collapse: collapse; }

.nowrap { white-space:nowrap }
.full-width { width:100% }

.wrap {
	max-width:var(--maxw);
	margin:0 auto;
}

.logo {
	display:block;
	width:100%;
	height:auto;
	margin:0 auto;
	filter:drop-shadow(0 18px 50px rgba(0,0,0,.55)); }

.subtitle {
	text-align: center;
	font-family:var(--display);
	text-transform:uppercase;
	font-size: clamp(0.7rem, 0.6rem + 0.8vw, 1.4rem);
	letter-spacing:clamp(.05rem, .1vw, .1rem);
	line-height: 1.5;
	color:var(--ember);
	margin:0 10% 0 0;
	/* the topic list can wrap on small screens */
	padding:0 .26em 0 0; }

.page-break {
	height:1px;
	background:linear-gradient(90deg, color-mix(in srgb, var(--gold) 45%, transparent), transparent);
	margin: 2em 0;
}

.chapter { cursor:pointer }

.chapters td {
	font-size:.93em;
	vertical-align: middle;
	padding: 0 0.3em 1.2em 0 }

.chapters .star {
	color:var(--gold);
	font-size:.7em;
	padding: 0 .5em;
}

.chapter:hover {
	color:var(--gold);
}

.chapter td:first-child{
	text-align: right; }

.chapter td:last-child{
	color:var(--dim); }

.intro {
	line-height:1.5;
	font-size:1em; }

.intro .nexus {
	color:var(--ember);
	text-transform:uppercase; }

.section-label {
	display:flex;
	align-items:center;
	gap:14px;
	margin:clamp(30px, 6vw, 48px) 0 20px;
	font-family:var(--display);
	text-transform:uppercase;
	letter-spacing:.24em;
	font-size:.66em;
	font-weight:500;
	color:var(--gold);
}

.section-label::after {
	content:"";
	flex:1;
	height:1px;
	background:linear-gradient(90deg, color-mix(in srgb, var(--gold) 45%, transparent), transparent);
}

/* ---------- footer ---------- */
.site-footer{
	width:90%;
	text-align:center;
}
.footer-star{
	display:block;
	width:46px;
	height:46px;
	margin:0 auto 18px;
}
.footer-note{
	font-family:var(--body);
	font-style:italic;
	color:var(--mist);
	margin:0 0 16px;
	font-size:1em;
}
.footer-meta{
	font-family:var(--display);
	font-size:.72em;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--dim);
	margin:0;
}
.footer-meta a{
	color:var(--mist);
	text-decoration:none;
	transition:color .2s ease;
}
.footer-meta a:hover,
.footer-meta a:focus-visible{ color:var(--gold); outline:none; }
.footer-meta .sep{ color:var(--dim); margin:0 .55em; }
.footer-license{
	font-family:var(--display);
	font-size:.66em;
	letter-spacing:.1em;
	color:var(--dim);
	margin:14px 0 0;
}

@keyframes twinkle{
	0%,100%{ opacity:.85; }
	50%{ opacity:1; filter:drop-shadow(0 0 6px var(--gold)); }
}
.footer-star{ animation:twinkle 4.5s ease-in-out infinite; }

@media (prefers-reduced-motion:reduce){
	.reveal,.footer-star{ animation:none; }
	*{ transition:none !important; }
}