@meycult/core 0.1.0 → 0.2.0

package/src/unveil/bg.ts

@@ -2,18 +2,28 @@
  * MeyCult Unveil background state. Kept set: glyphs, veil, ash, breath.
  * The six retired layers live in @meyvoid/core backgrounds for reuse.
  */
-import { createPersistStore } from '../lib/store'
+import { createPersistStore } from '@meyvoid/core'
 
-export type BgEffect = 'runes' | 'veil' | 'ash' | 'breath'
+export type BgEffect = 'wall' | 'runes' | 'veil' | 'ash' | 'breath'
 
 export const BG_EFFECTS: Array<{ id: BgEffect; label: string }> = [
+  { id: 'wall', label: 'Pyramid Wall' },
   { id: 'runes', label: 'Egyptian Glyphs' },
   { id: 'veil', label: 'Veil Fog' },
   { id: 'ash', label: 'Ash Flow-Field' },
   { id: 'breath', label: 'Breath Vignette' },
 ]
 
-export const BG_DEFAULTS: BgEffect[] = ['runes', 'veil', 'ash', 'breath']
+export const BG_DEFAULTS: BgEffect[] = ['wall', 'runes', 'veil', 'ash', 'breath']
+
+/** Fresh defaults — also used to reset stale persisted sets on version bump. */
+const BG_INITIAL = {
+  effects: BG_DEFAULTS,
+  density: 75,
+  speed: 0.6,
+  opacity: 0.8,
+  grain: true,
+} as const
 
 interface BgState {
   effects: BgEffect[]
@@ -29,13 +39,9 @@ interface BgState {
 
 export const useUnveilBg = createPersistStore<BgState>(
   'meycult-unveil-bg-v1',
-  1,
+  3,
   (set) => ({
-    effects: BG_DEFAULTS,
-    density: 50,
-    speed: 0.6,
-    opacity: 0.8,
-    grain: true,
+    ...BG_INITIAL,
     toggle: (e) =>
       set((s) => ({
         effects: s.effects.includes(e)
@@ -44,9 +50,12 @@ export const useUnveilBg = createPersistStore<BgState>(
       })),
     setMany: (effects) => set({ effects }),
     set: (p) => set(p),
-    reset: () =>
-      set({ effects: BG_DEFAULTS, density: 50, speed: 0.6, opacity: 0.8, grain: true }),
+    reset: () => set({ ...BG_INITIAL }),
   }),
+  {
+    // version bumps reset to fresh defaults (new effects ship enabled)
+    migrate: () => ({ ...BG_INITIAL }) as unknown as BgState,
+  },
 )
 
 /** Read-only ?bg=veil,runes share param (applied once on mount). */

package/src/unveil/bgStyles.ts

@@ -8,6 +8,5 @@ export const BG_STYLES = `
 @keyframes mey-veil-drift{from{transform:translateX(-8vw)}to{transform:translateX(8vw)}}
 .mey-breath{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 180px 60px rgba(0,0,0,.75);animation:mey-breath 7s ease-in-out infinite}
 @keyframes mey-breath{50%{box-shadow:inset 0 0 240px 90px rgba(0,0,0,.9)}}
-.mey-bg-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
 @media (prefers-reduced-motion:reduce){.mey-veil i:nth-child(2),.mey-breath{animation:none}}
 `

package/src/unveil/blocks.tsx

@@ -10,26 +10,56 @@ import CultEye from '../brand/CultEye'
 import { CultCountdown } from '../components/CultCountdown'
 import { UNVEIL_AT, unveilDayLabel, unveilLocalLabel } from '../unveil'
 
-export function UnveilHero() {
+export interface UnveilHeroSizes {
+  /** px overrides for live tuning — undefined keeps the class defaults */
+  mey?: number
+  unveil?: number
+  gap?: number
+}
+
+export interface UnveilHeroRoutes {
+  countdown?: string
+  crowdfunding?: string
+}
+
+export function UnveilHero({
+  sizes,
+  routes,
+}: {
+  sizes?: UnveilHeroSizes
+  /** Composition — hosts override when paths differ. Defaults are the web routes. */
+  routes?: UnveilHeroRoutes
+}) {
+  const countdownHref = routes?.countdown ?? '/unveil/countdown'
+  const crowdfundingHref = routes?.crowdfunding ?? '/#crowdfunding'
   return (
     <section className="section section--hero">
-      <a href="/unveil/countdown" aria-label="Open the full-page countdown" data-testid="unveil-sigil">
+      <a href={countdownHref} aria-label="Open the full-page countdown" data-testid="unveil-sigil">
         <div className="w-[200px] sm:w-[280px]">
           <CultEye fluid />
         </div>
       </a>
 
       <div className="mt-2 flex flex-col items-center leading-none">
-        <span className="text-6xl sm:text-7xl font-bold tracking-wider">
+        <span
+          className="text-[64px] sm:text-[96px] font-bold tracking-wider"
+          style={sizes?.mey !== undefined ? { fontSize: sizes.mey } : undefined}
+        >
           <span className="brand-mey">Mey</span>
           <span className="brand-cult">Cult</span>
         </span>
-        <span className="brand-unveil unveil-glow mt-1 text-5xl sm:text-6xl">Unveil</span>
+        <span
+          className="brand-unveil unveil-glow mt-[-12px] sm:mt-[-19px] text-[56px] sm:text-[85px]"
+          style={{
+            ...(sizes?.unveil !== undefined ? { fontSize: sizes.unveil } : undefined),
+            ...(sizes?.gap !== undefined ? { marginTop: sizes.gap } : undefined),
+          }}
+        >Unveil</span>
       </div>
       <p className="mt-3 text-sm text-text-muted tracking-wide">
         {unveilDayLabel(UNVEIL_AT)} SAST · Stellenbosch
       </p>
-      <p className="text-xs text-text-muted">{unveilLocalLabel(UNVEIL_AT)} your time</p>
+      <p className="text-xs text-text-muted" suppressHydrationWarning>{unveilLocalLabel(UNVEIL_AT)} your time</p>
 
       <div className="mt-8 w-full max-w-2xl">
         <CultCountdown />
@@ -39,13 +69,13 @@ export function UnveilHero() {
       <div className="mt-8 flex flex-wrap justify-center gap-3">
         <a
           className="px-6 py-2.5 rounded-lg bg-accent text-bg font-bold text-sm uppercase tracking-wider"
-          href="/#crowdfunding"
+          href={crowdfundingHref}
         >
           Notify me
         </a>
         <a
           className="px-6 py-2.5 rounded-lg border border-line/40 text-sm uppercase tracking-wider text-text"
-          href="/unveil/countdown"
+          href={countdownHref}
         >
           Full countdown
         </a>
@@ -78,7 +108,7 @@ export function WhereWhen({
           <a href={href} target="_blank" rel="noreferrer" className="block w-full group">
             <div
               className="w-full aspect-[2/1] overflow-hidden rounded-xl transition-transform duration-300 group-hover:scale-[1.02]"
-              style={{ border: '1px solid rgba(255,230,0,0.18)', boxShadow: '0 0 40px rgba(255,230,0,0.12)' }}
+              style={{ border: '1px solid var(--color-line)', boxShadow: '0 0 40px rgba(255,230,0,0.12)' }}
             >
               {/* eslint-disable-next-line @next/next/no-img-element */}
               <img src={map.src} alt={map.alt} className="w-full h-full object-cover" />
@@ -90,7 +120,7 @@ export function WhereWhen({
         ) : (
           <div
             className="w-full aspect-[2/1] rounded-xl flex items-center justify-center"
-            style={{ border: '1px solid rgba(255,230,0,0.18)', background: 'rgba(0,0,0,0.3)' }}
+            style={{ border: '1px solid var(--color-line)', background: 'rgba(0,0,0,0.3)' }}
           >
             <div className="w-[64px]">
               <CultEye fluid />
@@ -138,7 +168,14 @@ export function CardGrid({ cards, cols = 3 }: { cards: UnveilCard[]; cols?: 2 |
   )
 }
 
-export function HypeRow({ qrUrl }: { qrUrl: string }) {
+export interface HypeRowRoutes {
+  crowdfunding?: string
+  whitepaper?: string
+}
+
+export function HypeRow({ qrUrl, routes }: { qrUrl: string; routes?: HypeRowRoutes }) {
+  const crowdfundingHref = routes?.crowdfunding ?? '/#crowdfunding'
+  const whitepaperHref = routes?.whitepaper ?? '/whitepaper'
   return (
     <div className="grid grid-cols-1 sm:grid-cols-[2fr_1fr] gap-8 items-center max-w-3xl mx-auto">
       <div>
@@ -153,10 +190,10 @@ export function HypeRow({ qrUrl }: { qrUrl: string }) {
           Free to play. Real USDC cash-out. Sweepstakes-legal.
         </p>
         <div className="mt-4 flex flex-wrap gap-3">
-          <a className="px-6 py-2.5 rounded-lg bg-accent text-bg font-bold text-sm uppercase tracking-wider" href="/#crowdfunding">
+          <a className="px-6 py-2.5 rounded-lg bg-accent text-bg font-bold text-sm uppercase tracking-wider" href={crowdfundingHref}>
             Get notified
           </a>
-          <a className="px-6 py-2.5 rounded-lg border border-line/40 text-sm uppercase tracking-wider text-text" href="/whitepaper">
+          <a className="px-6 py-2.5 rounded-lg border border-line/40 text-sm uppercase tracking-wider text-text" href={whitepaperHref}>
             Read the whitepaper
           </a>
         </div>
@@ -181,7 +218,7 @@ export function HypeRow({ qrUrl }: { qrUrl: string }) {
   )
 }
 
-export function NotifyPanel() {
+export function NotifyPanel({ crowdfundingHref = '/#crowdfunding' }: { crowdfundingHref?: string }) {
   return (
     <div className="landing-card p-8 max-w-lg mx-auto text-center">
       <p className="text-accent font-bold text-lg mb-2">Be there at 20:00.</p>
@@ -190,7 +227,7 @@ export function NotifyPanel() {
       </p>
       <a
         className="inline-block px-6 py-2.5 rounded-lg bg-accent text-bg font-bold text-sm uppercase tracking-wider"
-        href="/#crowdfunding"
+        href={crowdfundingHref}
       >
         Join the list
       </a>

package/src/unveil/effects.tsx

@@ -2,74 +2,7 @@
 
 /** MeyCult Unveil background effects — 4 canvas + 6 CSS layers. */
 import { useEffect, useRef } from 'react'
-
-export interface FxProps {
-  density?: number // 0-100
-  speed?: number // 0-2 multiplier
-  opacity?: number // 0-1 master
-}
-
-function reducedMotion(): boolean {
-  return (
-    typeof window !== 'undefined' &&
-    window.matchMedia('(prefers-reduced-motion: reduce)').matches
-  )
-}
-
-/** Shared rAF canvas loop: DPR cap, resize, hidden-tab + offscreen pause. */
-function useCanvas(
-  ref: React.RefObject<HTMLCanvasElement | null>,
-  render: (ctx: CanvasRenderingContext2D, w: number, h: number, t: number) => void,
-  active: boolean,
-) {
-  useEffect(() => {
-    if (!active) return
-    const canvas = ref.current
-    if (!canvas || reducedMotion()) return
-    const ctx = canvas.getContext('2d')
-    if (!ctx) return
-    let raf = 0
-    let w = 0
-    let h = 0
-    const resize = () => {
-      const dpr = Math.min(window.devicePixelRatio || 1, 1.5)
-      const rect = canvas.getBoundingClientRect()
-      w = Math.max(1, Math.floor(rect.width * dpr))
-      h = Math.max(1, Math.floor(rect.height * dpr))
-      canvas.width = w
-      canvas.height = h
-    }
-    resize()
-    const ro = new ResizeObserver(resize)
-    const parent = canvas.parentElement
-    if (parent) ro.observe(parent)
-    let visible = true
-    const io = new IntersectionObserver(([e]) => {
-      visible = e.isIntersecting
-      if (visible) last = performance.now()
-    })
-    io.observe(canvas)
-    let last = performance.now()
-    const loop = (t: number) => {
-      raf = requestAnimationFrame(loop)
-      if (!visible || document.hidden) {
-        last = t
-        return
-      }
-      void last
-      last = t
-      ctx.clearRect(0, 0, w, h)
-      render(ctx, w, h, t)
-    }
-    raf = requestAnimationFrame(loop)
-    return () => {
-      cancelAnimationFrame(raf)
-      ro.disconnect()
-      io.disconnect()
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [active])
-}
+import { useCanvas, reducedMotion, type FxProps } from '@meyvoid/core/backgrounds'
 
 /**
  * Old-Egypt / illuminati glyph ascension — all cult yellow. Authentic
@@ -90,18 +23,34 @@ const GLYPHS = [
   '◉', // the eye
 ]
 
-export function RuneCanvas({ density = 50, speed = 0.6, opacity = 0.8 }: FxProps) {
+interface RunePart {
+  x: number
+  y: number
+  vy: number
+  tw: number
+  size: number
+  glyph: string
+}
+
+/** Glyph budget scales with viewport area: 150 particles at 1080p. */
+const RUNE_REF_AREA = 1920 * 1080
+const RUNE_REF_COUNT = 150
+
+function makeRuneParts(n: number): RunePart[] {
+  return Array.from({ length: n }, (_, i) => ({
+    x: Math.random(),
+    y: Math.random(),
+    vy: 0.0002 + Math.random() * 0.0006,
+    tw: Math.random() * Math.PI * 2,
+    size: 10 + Math.random() * 12,
+    glyph: GLYPHS[i % GLYPHS.length],
+  }))
+}
+
+export function RuneCanvas({ density = 50, speed = 0.6, opacity = 0.8, z = 3 }: FxProps) {
   const ref = useRef<HTMLCanvasElement>(null)
-  const parts = useRef(
-    Array.from({ length: 60 }, (_, i) => ({
-      x: Math.random(),
-      y: Math.random(),
-      vy: 0.0002 + Math.random() * 0.0006,
-      tw: Math.random() * Math.PI * 2,
-      size: 10 + Math.random() * 12,
-      glyph: GLYPHS[i % GLYPHS.length],
-    })),
-  )
+  const parts = useRef<RunePart[]>([])
+  const sized = useRef({ w: 0, h: 0 })
   useEffect(() => {
     // ensure the hieroglyph webfont is ready before first glyphs drift in
     try {
@@ -113,6 +62,20 @@ export function RuneCanvas({ density = 50, speed = 0.6, opacity = 0.8 }: FxProps
   useCanvas(
     ref,
     (ctx, w, h, t) => {
+      // rebuild the pool when the viewport bucket changes (CSS px, so DPR
+      // never inflates the count) — cheap compare, layout read only on resize
+      if (w !== sized.current.w || h !== sized.current.h) {
+        sized.current = { w, h }
+        const cw = ref.current?.clientWidth || w
+        const ch = ref.current?.clientHeight || h
+        const want = Math.max(
+          40,
+          Math.min(300, Math.round((RUNE_REF_COUNT * cw * ch) / RUNE_REF_AREA)),
+        )
+        if (Math.abs(want - parts.current.length) > 8) {
+          parts.current = makeRuneParts(want)
+        }
+      }
       const n = Math.floor((density / 100) * parts.current.length)
       for (let i = 0; i < n; i++) {
         const p = parts.current[i]
@@ -124,6 +87,22 @@ export function RuneCanvas({ density = 50, speed = 0.6, opacity = 0.8 }: FxProps
         }
         const x = (p.x + Math.sin(p.tw) * 0.008) * w
         const y = p.y * h
+        // mini stone rect: the glyph rides a tiny carved block, same
+        // treatment as the wall at glyph scale
+        const rw = p.size * 1.15
+        const rh = p.size * 1.15
+        const rx = x - rw / 2
+        const ry = y - rh / 2 - p.size * 0.08
+        ctx.globalAlpha = (0.5 + 0.5 * Math.abs(Math.sin(p.tw))) * opacity
+        ctx.fillStyle = '#141003'
+        ctx.fillRect(rx, ry, rw, rh)
+        ctx.fillStyle = 'rgba(255,230,0,0.10)'
+        ctx.fillRect(rx, ry, rw, 1)
+        ctx.fillStyle = 'rgba(0,0,0,0.6)'
+        ctx.fillRect(rx, ry + rh - 1, rw, 1)
+        ctx.strokeStyle = 'rgba(0,0,0,0.7)'
+        ctx.lineWidth = 1
+        ctx.strokeRect(rx + 0.5, ry + 0.5, rw - 1, rh - 1)
         ctx.globalAlpha = (0.15 + 0.5 * Math.abs(Math.sin(p.tw))) * opacity
         ctx.font = `${p.size}px ${GLYPH_FONT}`
         ctx.fillStyle = '#FFE600'
@@ -134,10 +113,10 @@ export function RuneCanvas({ density = 50, speed = 0.6, opacity = 0.8 }: FxProps
     },
     true,
   )
-  return <canvas ref={ref} className="mey-bg-canvas" aria-hidden="true" />
+  return <canvas ref={ref} className="mey-bg-canvas" style={{ zIndex: z }} aria-hidden="true" />
 }
 
-export function AshCanvas({ density = 50, speed = 0.5, opacity = 0.8 }: FxProps) {
+export function AshCanvas({ density = 50, speed = 0.5, opacity = 0.8, z = 2 }: FxProps) {
   const ref = useRef<HTMLCanvasElement>(null)
   const parts = useRef(
     Array.from({ length: 220 }, () => ({
@@ -182,12 +161,129 @@ export function AshCanvas({ density = 50, speed = 0.5, opacity = 0.8 }: FxProps)
     },
     true,
   )
-  return <canvas ref={ref} className="mey-bg-canvas" aria-hidden="true" />
+  return <canvas ref={ref} className="mey-bg-canvas" style={{ zIndex: z }} aria-hidden="true" />
+}
+
+/**
+ * Pyramid wall — baked dark-stone texture. Static: rendered once per resize
+ * to an offscreen canvas, then blitted. Running-bond courses, top-lit
+ * bevels, per-block tonal jitter, speckle noise, baked vignette.
+ */
+function mulberry32(seed: number): () => number {
+  let a = seed >>> 0
+  return () => {
+    a |= 0
+    a = (a + 0x6d2b79f5) | 0
+    let t = Math.imul(a ^ (a >>> 15), 1 | a)
+    t = (t + Math.imul(t ^ (t >>> 7), 61 | t)) ^ t
+    return ((t ^ (t >>> 14)) >>> 0) / 4294967296
+  }
+}
+
+export function WallCanvas({ opacity = 0.9, z = 0 }: FxProps) {
+  const ref = useRef<HTMLCanvasElement>(null)
+  useEffect(() => {
+    const canvas = ref.current
+    if (!canvas || reducedMotion()) return
+    const ctx = canvas.getContext('2d')
+    if (!ctx) return
+    const bake = () => {
+      const dpr = Math.min(window.devicePixelRatio || 1, 1.5)
+      const rect = canvas.getBoundingClientRect()
+      const w = Math.max(1, Math.floor(rect.width * dpr))
+      const h = Math.max(1, Math.floor(rect.height * dpr))
+      canvas.width = w
+      canvas.height = h
+      const off = document.createElement('canvas')
+      off.width = w
+      off.height = h
+      const c = off.getContext('2d')
+      if (!c) return
+      const rand = mulberry32((w * 73856093) ^ (h * 19349663))
+      // base: near-black warm basalt
+      c.fillStyle = '#0e0b06'
+      c.fillRect(0, 0, w, h)
+      // courses of small blocks, running bond — fixed 88 CSS px course
+      // height (not viewport- or page-derived), so bricks read the same
+      // size on every display. Block width capped at course height:
+      // more blocks on wide screens, never slabs.
+      const bh = 88 * dpr
+      const rowCount = Math.ceil(h / bh)
+      const MAX_BLOCK_RATIO = 1.0
+      for (let r = 0; r < rowCount; r++) {
+        const y = r * bh
+        const rawBlocks = 5 + ((r * 7) % 4)
+        const bw = Math.min(w / rawBlocks, bh * MAX_BLOCK_RATIO)
+        const span = bw * Math.ceil(w / bw)
+        const x0 = (w - span) / 2
+        const bond = r % 2 === 0 ? 0 : -bw / 2
+        for (let x = x0 + bond; x < w; x += bw) {
+          const tone = (rand() - 0.5) * 14
+          const base = 14 + tone
+          // block body: subtle vertical falloff, lighter crown
+          const g = c.createLinearGradient(0, y, 0, y + bh)
+          g.addColorStop(0, `rgb(${base + 9},${base + 1},${Math.max(0, base - 9)})`)
+          g.addColorStop(0.12, `rgb(${base + 4},${base - 2},${Math.max(0, base - 10)})`)
+          g.addColorStop(1, `rgb(${Math.max(0, base - 6)},${Math.max(0, base - 9)},${Math.max(0, base - 13)})`)
+          c.fillStyle = g
+          c.fillRect(x + 1.5, y + 1.5, bw - 3, bh - 3)
+          // top bevel catches the cult light
+          c.fillStyle = 'rgba(255,230,0,0.055)'
+          c.fillRect(x + 1.5, y + 1.5, bw - 3, Math.max(1, dpr))
+          c.fillStyle = 'rgba(255,255,255,0.03)'
+          c.fillRect(x + 1.5, y + 1.5 + dpr, bw - 3, Math.max(1, dpr * 0.5))
+          // foot shadow
+          c.fillStyle = 'rgba(0,0,0,0.55)'
+          c.fillRect(x + 1.5, y + bh - 1.5 - dpr * 1.5, bw - 3, dpr * 1.5)
+          // occasional stained block
+          if (rand() < 0.18) {
+            c.fillStyle = `rgba(0,0,0,${0.12 + rand() * 0.18})`
+            c.fillRect(x + 1.5, y + 1.5, bw - 3, bh - 3)
+          }
+        }
+      }
+      // mortar shadow grid
+      c.fillStyle = 'rgba(0,0,0,0.8)'
+      for (let r = 0; r <= rowCount; r++) c.fillRect(0, r * bh - 1, w, 2)
+      // speckle noise
+      const specks = Math.floor((w * h) / 900)
+      for (let i = 0; i < specks; i++) {
+        const sx = rand() * w
+        const sy = rand() * h
+        c.fillStyle = rand() < 0.12 ? 'rgba(255,230,0,0.05)' : 'rgba(0,0,0,0.35)'
+        c.fillRect(sx, sy, dpr, dpr)
+      }
+      // baked vignette
+      const v = c.createRadialGradient(
+        w / 2, h / 2, Math.min(w, h) * 0.35,
+        w / 2, h / 2, Math.max(w, h) * 0.75,
+      )
+      v.addColorStop(0, 'rgba(0,0,0,0)')
+      v.addColorStop(1, 'rgba(0,0,0,0.55)')
+      c.fillStyle = v
+      c.fillRect(0, 0, w, h)
+      ctx.clearRect(0, 0, w, h)
+      ctx.drawImage(off, 0, 0)
+    }
+    bake()
+    const ro = new ResizeObserver(bake)
+    if (canvas.parentElement) ro.observe(canvas.parentElement)
+    return () => ro.disconnect()
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [])
+  return (
+    <canvas
+      ref={ref}
+      className="mey-bg-canvas"
+      style={{ opacity, zIndex: z }}
+      aria-hidden="true"
+    />
+  )
 }
 
-export function VeilFog({ opacity = 0.7 }: FxProps) {
+export function VeilFog({ opacity = 0.7, z = 1 }: FxProps) {
   return (
-    <div className="mey-veil" style={{ opacity }} aria-hidden="true">
+    <div className="mey-veil" style={{ opacity, zIndex: z }} aria-hidden="true">
       <i />
       <i />
     </div>
@@ -195,6 +291,6 @@ export function VeilFog({ opacity = 0.7 }: FxProps) {
 }
 
 
-export function BreathVignette() {
-  return <div className="mey-breath" aria-hidden="true" />
+export function BreathVignette({ z = 4 }: FxProps) {
+  return <div className="mey-breath" style={{ zIndex: z }} aria-hidden="true" />
 }

package/src/unveil.ts

@@ -55,24 +55,5 @@ export function unveilLocalLabel(at: number = UNVEIL_AT): string {
   }).format(new Date(at))
 }
 
-export interface CountdownParts {
-  days: number
-  hours: number
-  minutes: number
-  seconds: number
-  done: boolean
-}
-
-export function diffParts(target: number, now: number = Date.now()): CountdownParts {
-  const delta = target - now
-  if (delta <= 0) return { days: 0, hours: 0, minutes: 0, seconds: 0, done: true }
-  return {
-    days: Math.floor(delta / 86_400_000),
-    hours: Math.floor(delta / 3_600_000) % 24,
-    minutes: Math.floor(delta / 60_000) % 60,
-    seconds: Math.floor(delta / 1_000) % 60,
-    done: false,
-  }
-}
-
-export const pad2 = (n: number) => String(n).padStart(2, '0')
+// Pure time math lives in @meyvoid/core — re-exported here for compat.
+export { diffParts, pad2, type CountdownParts } from '@meyvoid/core'

package/src/auth/Gate.tsx

@@ -1,14 +0,0 @@
-import type { RequireAuthProps } from './types'
-
-/** Framework-free auth gate — host passes user/loading from its own auth wiring. */
-export function RequireAuth({
-  user,
-  loading,
-  loadingFallback = null,
-  loginFallback = null,
-  children,
-}: RequireAuthProps) {
-  if (loading) return <>{loadingFallback}</>
-  if (!user) return <>{loginFallback}</>
-  return <>{children}</>
-}

package/src/auth/types.ts

@@ -1,12 +0,0 @@
-export interface SessionProfile {
-  id: string
-  email?: string | null
-}
-
-export interface RequireAuthProps {
-  user: SessionProfile | null
-  loading: boolean
-  loadingFallback?: React.ReactNode
-  loginFallback?: React.ReactNode
-  children: React.ReactNode
-}

package/src/brand/GodEmperor.tsx

@@ -1,8 +0,0 @@
-export default function GodEmperorBrand() {
-  return (
-    <span style={{ fontFamily: 'var(--font-logo)', fontWeight: 700, textTransform: 'none' }}>
-      <span style={{ color: '#ffffff' }}>God</span>
-      <span style={{ color: 'var(--color-premium-400)' }}>Emperor</span>
-    </span>
-  )
-}

package/src/cn.ts

@@ -1,6 +0,0 @@
-import { clsx, type ClassValue } from 'clsx'
-import { twMerge } from 'tailwind-merge'
-
-export function cn(...inputs: ClassValue[]): string {
-  return twMerge(clsx(...inputs))
-}

package/src/lib/images.ts

@@ -1,10 +0,0 @@
-export function isAbsoluteUrl(src: string): boolean {
-  return /^https?:\/\//.test(src) || src.startsWith('data:') || src.startsWith('blob:')
-}
-
-/** Resolve a product/asset src against an optional storage base. */
-export function resolveImage(src: string, base?: string): string {
-  if (!src) return src
-  if (isAbsoluteUrl(src) || !base) return src
-  return `${base.replace(/\/$/, '')}/${src.replace(/^\//, '')}`
-}

package/src/lib/money.ts

@@ -1,12 +0,0 @@
-const SYMBOLS: Record<string, string> = {
-  USD: '$',
-  ZAR: 'R',
-  EUR: '€',
-  GBP: '£',
-}
-
-/** Format integer minor units (cents) — e.g. formatPrice(1999) → '$19.99'. */
-export function formatPrice(cents: number, currency = 'USD'): string {
-  const symbol = SYMBOLS[currency] ?? `${currency} `
-  return `${symbol}${(cents / 100).toFixed(2)}`
-}

package/src/lib/store.ts

@@ -1,19 +0,0 @@
-import { create, type StateCreator } from 'zustand'
-import { persist, type PersistOptions } from 'zustand/middleware'
-
-/** Persisted zustand store with a stable shape — mirrors the meybuddy store pattern. */
-export function createPersistStore<T>(
-  name: string,
-  version: number,
-  initializer: StateCreator<T, [], []>,
-  options?: Partial<PersistOptions<T, T>>,
-) {
-  return create<T>()(
-    persist(initializer, {
-      name,
-      version,
-      skipHydration: true,
-      ...options,
-    }),
-  )
-}

package/src/shell/types.ts

@@ -1,13 +0,0 @@
-import type { ComponentType, AnchorHTMLAttributes } from 'react'
-
-export interface NavLink {
-  label: string
-  href: string
-  external?: boolean
-  branded?: boolean
-}
-
-/** Injectable link — host passes next/link (web) or react-router Link (app). Defaults to <a>. */
-export type LinkComponent = ComponentType<
-  AnchorHTMLAttributes<HTMLAnchorElement> & { href: string }
->