/* Shared shell for the creed pages: top bar and previous/next links. Colours come from each page's own variables. */
.cs,.cs-foot{max-width:1500px; margin:0 auto; padding:0 1.25rem; font-size:.95rem; line-height:1.4}
.cs{display:flex; flex-wrap:wrap; align-items:center; gap:.4rem 1.2rem; padding-top:.8rem; padding-bottom:.7rem; border-bottom:1px solid var(--rule,#ccc); color:var(--muted,#666)}
.cs a{color:inherit; text-decoration:none}
.cs a:hover,.cs a:focus-visible{color:var(--shell-accent,var(--lapis,var(--porph,var(--accent,inherit)))); text-decoration:underline; text-underline-offset:3px}
.cs .home{font-weight:700; color:var(--ink,inherit)}
.cs ol{display:flex; flex-wrap:wrap; gap:.2rem .9rem; list-style:none; margin:0; padding:0}
.cs li a[aria-current="page"]{color:var(--shell-accent,var(--lapis,var(--porph,var(--accent,inherit)))); border-bottom:2px solid currentColor; padding-bottom:1px; text-decoration:none}
.cs li small{opacity:.75; margin-left:.3rem}
.cs .pn{margin-left:auto; display:flex; gap:1rem}
.cs-foot{display:flex; justify-content:space-between; gap:1rem; padding-top:1.5rem; padding-bottom:3rem}
.cs-foot a{flex:1 1 0; max-width:26rem; display:block; padding:.8rem 1rem; border:1px solid var(--rule,#ccc); border-radius:6px; color:var(--ink,inherit); text-decoration:none}
.cs-foot a:hover,.cs-foot a:focus-visible{border-color:var(--shell-accent,var(--lapis,var(--porph,var(--accent,currentColor)))); background:var(--card,transparent)}
.cs-foot .dir{display:block; font-size:.85rem; color:var(--muted,#666)}
.cs-foot .nm{display:block; font-size:1.15rem; font-weight:700}
.cs-foot .next{text-align:right; margin-left:auto}
@media (max-width:760px){ .cs .pn{margin-left:0; width:100%} .cs-foot{flex-direction:column} .cs-foot a{max-width:none} .cs-foot .next{text-align:left} }