/* ===================================================== Caribbean Startups — Universal static-page shell Shared by /pages/*.html and /resources/*.html Matches the React SPA nav, footer and Three.js scene ===================================================== */ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;900&display=swap'); /* ── Theme tokens ─────────────────────────────────── */ :root { --ns-bg: #f4f7fc; --ns-bg2: #e8effa; --ns-panel: rgba(255,255,255,0.88); --ns-line: rgba(37,99,235,0.18); --ns-text: #0f172a; --ns-muted: #475569; --ns-nav-bg: rgba(255,255,255,0.86); --ns-tile-bg: rgba(248,252,255,0.94); --ns-link: #1d4ed8; } [data-theme='dark'] { --ns-bg: #060b16; --ns-bg2: #0f1d35; --ns-panel: rgba(12,22,44,0.85); --ns-line: rgba(122,175,246,0.22); --ns-text: #ecf3ff; --ns-muted: #94a3b8; --ns-nav-bg: rgba(5,10,20,0.84); --ns-tile-bg: rgba(8,16,30,0.85); --ns-link: #7ab0ff; } /* ── Body theming for shell pages ─────────────────── */ /* Background lives on so the fixed #ns-shell-canvas at z-index:-1 is visible through the transparent . Per CSS painting order, z-index:-1 positioned elements paint AFTER the html background but BEFORE body content, making the Three.js scene visible through sections that lack their own bg. */ html:has(body.ns-shell-body) { background: var(--ns-bg); transition: background 0.25s ease; } /* .ns-shell-body is added by ns-shell.js in boot(). Class + element selector (0,1,1) beats resource-styles.css body selector (0,0,1) even though ns-shell.css loads first. */ body.ns-shell-body { background: transparent !important; color: var(--ns-text); transition: color 0.25s ease; } /* ── Hide legacy shell elements ───────────────────── */ /* These exist in pages/*.html and are replaced by ns-shell.js. Scoped to body > * to avoid hiding content-level elements inside

(e.g.