Track, celebrate, and
reward your team culture

An IIFE that wraps all localStorage access behind a clean API. Every mutation calls save(), which serialises the whole object to localStorage and fires a CustomEvent so every page re-renders reactively.

window.CH  // global singleton
CH.getPeople()       CH.addPerson(…)
CH.getEvents()       CH.addEvent(…)
CH.checkIn(…)        CH.toggleWinner(…)
CH.getLeaderboard()  CH.exportBackup()
CH.getPersonStats()  CH.importBackup()

Shared utilities loaded on every page after data.js. Provides the nav template, theme + accent system, toast notifications, modal helpers, avatar generation, date formatting, and PDF report builders.

Theme.toggle()         Accent.apply(name)
openModal(html)        toast(msg, type)
avatarEl(name, size)   confirmDialog(msg)
eventTypeBadge(type)   fmtDate(dateStr)
navHTML()              generateReport(…)

A single CSS file with a complete token-based design system. Dark, Dim, and Light themes are declared as CSS custom properties on html[data-theme], with Violet, Blue, Orange, and Red accent overrides layered on top via html[data-theme][data-accent]. Components are utility-first with semantic class names.

.card    .btn-primary  .badge-accent
.modal   .stat-card    .progress-bar
.avatar  .chip         .type-game
.grid-2  .form-control .empty-state

Every page follows the same pattern: inject nav, call render(), and subscribe to the culturehub:updated event so the page re-renders whenever data changes (even if changed in another tab on the same origin).

// Every page — verbatim pattern
document.getElementById('nav-root')
  .innerHTML = navHTML();
setActiveNav();

function render() { /* build innerHTML */ }
window.addEventListener(
  'culturehub:updated', render);
render();