// V1: SHELL — a literal 3D shell spiral drives the layout. // Each section is a "chamber" of the spiral; scroll pulls deeper in. const { useState, useEffect, useRef } = React; const ShellSpiral = () => { const [t, setT] = useState(0); useEffect(() => { let raf, last = performance.now(); const loop = (now) => { const mo = (+(document.body.dataset.motion ?? 80)) / 100; const dt = (now - last) / 1000; last = now; setT(v => v + dt * 0.15 * mo); raf = requestAnimationFrame(loop); }; raf = requestAnimationFrame(loop); return () => cancelAnimationFrame(raf); }, []); // Build a log spiral const pts = []; const turns = 4.2; const steps = 220; for (let i = 0; i <= steps; i++) { const p = i / steps; const angle = p * Math.PI * 2 * turns + t; const r = 6 + Math.pow(p, 1.35) * 300; const x = 400 + Math.cos(angle) * r; const y = 400 + Math.sin(angle) * r; pts.push(`${x.toFixed(2)},${y.toFixed(2)}`); } return ( {/* Chambers — concentric arcs */} {[0,1,2,3,4].map(i => { const r = 40 + i * 55; return ; })} {/* Ticks */} {Array.from({length: 36}).map((_, i) => { const a = (i / 36) * Math.PI * 2 + t * 0.5; const x1 = 400 + Math.cos(a) * 345, y1 = 400 + Math.sin(a) * 345; const x2 = 400 + Math.cos(a) * 360, y2 = 400 + Math.sin(a) * 360; return ; })} {/* Center eye */} ); }; const ChamberNav = ({ active, onGo }) => { const items = [ { id: 'hero', label: 'Entry' }, { id: 'about', label: 'About' }, { id: 'builds', label: 'Builds' }, { id: 'arcade', label: 'Arcade' }, { id: 'videos', label: 'Videos' }, { id: 'faith', label: 'Faith' }, { id: 'contact', label: 'Contact' }, ]; return ( ); }; const ShellHero = () => { return (
Shell v3 · Evangelism Mode

Build
slowly,
ship
faithfully.

Snail3D is a maker, builder, father and evangelist. 3D printing, agentic code, and work for the Lord — kept at the center of every chamber we build.

Enter the shell → Meet GITA
Scroll inward
); }; const ShellSection = ({ id, kicker, title, children }) => (
{kicker}

{title}

{children}
); const ProjectCard = ({ p }) => ( { e.currentTarget.style.borderColor = 'var(--cyan)'; e.currentTarget.style.transform = 'translateY(-2px)'; }} onMouseLeave={e => { e.currentTarget.style.borderColor = 'var(--line)'; e.currentTarget.style.transform = 'translateY(0)'; }}>

{p.name}

{p.featured && ◆ FEATURED}

{p.desc}

{p.lang} →
 ); const FaithPanel = () => { const [i, setI] = useState(0); const d = window.DEVOTIONALS[i]; return (
Daily Chamber · {new Date().toLocaleDateString('en-US', { month: 'short', day: 'numeric' })}
"{d.quote}"
— {d.verse}

{d.ref}

{window.DEVOTIONALS.map((_, j) => (
); }; const VideoStrip = () => (
{window.VIDEOS.slice(0, 6).map(v => (
{v.new &&
NEW
}
{v.title}
 ))}
); const ContactBlock = () => (

Got a build to share, a collaboration idea, or a prayer request? Come say hi in the Discord — the chamber's open.

Join the Discord → GitHub YouTube
); const btnPrimary = { display: 'inline-flex', alignItems: 'center', gap: 10, padding: '14px 22px', background: 'var(--cyan)', color: 'var(--bg)', borderRadius: 999, textDecoration: 'none', fontWeight: 600, fontSize: 14, letterSpacing: '0.02em', transition: 'transform .2s', }; const btnGhost = { display: 'inline-flex', alignItems: 'center', gap: 10, padding: '14px 22px', background: 'rgba(255,255,255,0.04)', color: 'var(--fg)', borderRadius: 999, textDecoration: 'none', fontWeight: 500, fontSize: 14, border: '1px solid var(--line)', }; const ShellRoot = () => { const [active, setActive] = useState('hero'); useEffect(() => { const onScroll = () => { const ids = ['hero','about','builds','arcade','videos','faith','contact']; let cur = 'hero'; for (const id of ids) { const el = document.getElementById(id); if (el && el.getBoundingClientRect().top < window.innerHeight * 0.45) cur = id; } setActive(cur); }; window.addEventListener('scroll', onScroll); return () => window.removeEventListener('scroll', onScroll); }, []); return ( <>
Snail3D
{[ { h: "3D Printing", p: "Practical prints, public designs, and open MakerWorld files." }, { h: "Agentic Code", p: "Local-first AI tools, voice dashboards, honest prototypes." }, { h: "Faith & Family", p: "The Lord first, family close, work for His glory." }, ].map((b, i) => (
0{i+1}

{b.h}

{b.p}

))}
{window.PROJECTS.slice(0, 9).map(p => )}

Same prompt, different coding agents. The Snail Arcade is a living scoreboard of how well AI can build something actually fun to play — updated as the frontier moves.

{window.GAMES.map(g => ( e.currentTarget.style.borderColor = 'var(--magenta)'} onMouseLeave={e => e.currentTarget.style.borderColor = 'var(--line)'}>
{g.name}
{g.desc}
{g.tag}
 ))}
© {new Date().getFullYear()} Snail3D · Soli Deo Gloria Built slowly. Shipped faithfully.
); }; window.ShellRoot = ShellRoot;