/* Ambient scripture background — the whole Gospel of John drifting slowly up the screen behind the page: the KJV, then the Greek, one copy of each. At the last page the layer fades out, returns to the top, and begins again. scripture-bg.js builds the layer and drives the drift; this file is shared by all the pages. The layer sits at z-index:-1, which is only visible because each page keeps its background on and leaves transparent — a negative-z layer paints above the canvas but below body content. */ .scripture-bg{ position:fixed;inset:0;z-index:-1; overflow:hidden; pointer-events:none; user-select:none;-webkit-user-select:none; opacity:0;transition:opacity 2.5s ease; } .scripture-bg.on{opacity:1} .scripture-bg .drift{ will-change:transform; } .scripture-bg .passage{ font-family:var(--serif); font-size:15px; line-height:1.95; text-align:justify; hyphens:auto;-webkit-hyphens:auto; padding:0 14px; /* two blank lines between passages — and, identically, across the loop seam */ margin:0 0 3.9em; /* readable-but-recessed accent ink; the rgba is a fallback for browsers without color-mix. Dark takes a touch more: gold-on-dark reads weaker than brown-on-paper. */ color:rgba(120,84,52,.14); color:color-mix(in srgb,var(--accent) 14%,transparent); } @media (prefers-color-scheme:dark){ .scripture-bg .passage{ color:rgba(198,161,112,.16); color:color-mix(in srgb,var(--accent) 16%,transparent); } }