));
}
// ─────────────────────────────────────────────────────────────
// SeasonalAmbience — subtle, season-wide atmosphere
// ─────────────────────────────────────────────────────────────
// Distinct from FeastOverlay (which fires on a single liturgical day):
// this one runs throughout the season, but turned WAY down so it reads as
// atmosphere rather than celebration. A 6-flake snow drift in Advent
// instead of the 30-flake Christmas-morning blizzard. Three butterflies
// in Eastertide instead of eight at Easter Sunday. The season's color is
// already shifting via theme.accent (when useSeasonAccent is on); these
// particles add the gentle visual companion.
//
// "ordinary" intentionally returns null — Ordinary Time should look
// quiet. The forest-green accent does enough work on its own.
// Per-season SVG ornaments. All sized to a 100x100 viewBox and rendered as
// gold-line drawings ("illumination") rather than literal symbols. They sit
// in the bottom-right of the viewport like a wax-seal stamp on the margin
// of a manuscript page. Static — opacity breathes very slowly (8s) so they
// register as living without becoming distracting.
const SEASON_ORNAMENTS = {
// Advent — viewed from the side: a horizontal evergreen wreath at the
// bottom with four candles standing vertically out of it. Three violet
// candles for Advent 1, 2, and 4 plus one rose candle for Gaudete
// Sunday (Advent 3). All four flames lit, as the wreath is shown in its
// completed Advent-4 state.
advent: ({ ink, accent, gold }) => (
{/* Evergreen wreath base — flattened ellipse seen at a slight angle */}
{/* Greenery sprigs along the front edge */}
{[12, 22, 32, 42, 52, 62, 72, 82].map((x, i) => (
))}
{/* Holly berries scattered on the wreath */}
{/* Four candles standing vertically. Order left → right:
violet, violet, rose (Gaudete, Advent 3), violet. */}
{[
{ x: 18, color: accent },
{ x: 38, color: accent },
{ x: 58, color: '#d97aa3' },
{ x: 78, color: accent },
].map((c, i) => (
{/* candle body */}
{/* tiny wick */}
{/* flame */}
))}
),
// Christmastide — Star of Bethlehem with rays (illuminated)
christmas: ({ ink, gold }) => (
{Array.from({ length: 16 }).map((_, i) => {
const a = (i * 22.5 - 90) * Math.PI / 180;
const r1 = 14, r2 = 42;
return ;
})}
),
// Epiphany — gold-leaf 8-pointed star (the magi's sign)
epiphany: ({ ink, gold, accent }) => (
{/* outer ring of dots */}
{[0, 90, 180, 270].map((deg, i) => {
const r = 40, rad = (deg - 45) * Math.PI / 180;
return ;
})}
),
// Lent — Latin cross marked with ash, plain and grave
lent: ({ ink, accent }) => (
{/* ash dust around the cross */}
),
// Eastertide — risen cross with rays of light
easter: ({ ink, gold, accent }) => (
{Array.from({ length: 12 }).map((_, i) => {
const a = (i * 30 - 90) * Math.PI / 180;
return ;
})}
),
// Pentecost — single illuminated tongue of fire over a dove silhouette
pentecost: ({ ink, gold, accent }) => (
{/* dove suggestion (very abstract, descending) */}
{/* central tongue of fire */}
),
};
// Map season key → ornament function. Ordinary returns no ornament — the
// quiet green accent does its own work.
function getSeasonOrnament(theme) {
const s = theme.season;
if (!s) return null;
if (s.color === 'green') return null;
if (s.color === 'purple') return SEASON_ORNAMENTS.advent;
if (s.color === 'blue') return SEASON_ORNAMENTS.epiphany;
if (s.color === 'violet') return SEASON_ORNAMENTS.lent;
if (s.color === 'red') return SEASON_ORNAMENTS.pentecost;
if (s.color === 'gold' && s.label === 'Christmastide') return SEASON_ORNAMENTS.christmas;
if (s.color === 'gold' && s.label === 'Eastertide') return SEASON_ORNAMENTS.easter;
return null;
}
function SeasonalAmbience({ theme, mode = 'auto', enabled = true }) {
if (!enabled || mode === 'off') return null;
// Honor the user's reduce-motion accessibility preference. If they've
// asked for no animation, the ornament still appears but with a fixed
// opacity (no breathing).
const reduceMotion = typeof document !== 'undefined' &&
document.body && document.body.classList.contains('reduce-motion');
const Ornament = getSeasonOrnament(theme);
if (!Ornament) return null;
// The colors used by every ornament. Most are `theme.ink` / `theme.gold`
// so they harmonize with the parchment shell automatically; a few use
// `theme.accent` (which itself shifts per season).
const colors = { ink: theme.ink, gold: theme.gold, accent: theme.accent };
// Lent and Pentecost get a faint additional treatment in the page edge.
// Lent: a vignette darkening the corners (mortification).
// Pentecost: a slow warm-glow band along the very top edge (the Spirit
// descending). Both are CSS gradients, no DOM animation cost.
const isLent = theme.season.color === 'violet';
const isPentecost = theme.season.color === 'red';
return (
{isPentecost && (
)}
{isLent && (
)}
{/* Corner watermark — illuminated ornament in the bottom-right of
every page, sized like a wax seal in a marginal note. Sits above
any safe-area inset on iPhone notch/home-bar devices. */}