(() => {
const { SiteHeader, SiteFooter, Button } = window.JudithHorvathNonprofitDesignSystem_c97fb3;

const NAV = [
  { id: 'well', label: 'The Well' },
  { id: 'ccs', label: 'CCS 101' },
  { id: 'landowners', label: 'Landowners' },
  { id: 'stand', label: 'Position' },
  { id: 'projects', label: 'Projects' },
  { id: 'mission', label: 'Mission' },
  { id: 'media', label: 'Media' },
  { id: 'library', label: 'Library' },
  { id: 'involved', label: 'Involved' },
];

const FOOTER_COLUMNS = [
  { title: 'Understand it', links: [{ label: 'CO₂ & CCS 101', page: 'ccs' }, { label: 'The Amanda Township test well', page: 'well' }, { label: 'Where we stand', page: 'stand' }] },
  { title: 'Act on it', links: [{ label: 'For landowners', page: 'landowners' }, { label: 'Where to be heard', page: 'involved' }, { label: 'Report a tip', page: 'involved' }, { label: 'Volunteer', page: 'involved' }] },
  { title: 'The record', links: [{ label: 'Project case files', page: 'projects' }, { label: 'Document library', page: 'library' }, { label: 'Resources', page: 'library' }, { label: 'Media & podcast', page: 'media' }, { label: 'YouTube archive', href: 'https://www.youtube.com/channel/UCwT0AW5z7pEyExX1YZ9PnRw' }, { label: 'Facebook', href: 'https://www.facebook.com/share/19ePbR8EmK/' }] },
];

function Shell({ page, setPage, children }) {
  return (
    <div style={{ minHeight: '100vh', display: 'flex', flexDirection: 'column', background: 'var(--surface-page)' }}>
      <SiteHeader
        style={{ borderBottom: '2px solid var(--wheat-500)' }}
        logoSrc={LOGO}
        items={NAV} active={page} onNavigate={setPage}
        notice="HB 170 takes effect September 23, 2026 · Viking 1-S stratigraphic test being drilled now, Amanda Township"
        cta={<Button size="sm" variant="urgent" onClick={() => setPage('involved')}>Stay informed</Button>}
      />
      <main style={{ flex: 1 }}>{children}</main>
      <SiteFooter
        note="Read the documents. Talk to your neighbors. Decide for yourself."
        columns={FOOTER_COLUMNS}
        onNavigate={setPage}
        disclaimer="Nonpartisan and unaffiliated with any political party, campaign, or commercial interest. Coverage area: Amanda, Hocking, Liberty, Greenfield and Clearcreek Townships · Tarlton, Oakland, Stoutsville, Buena Vista, Lancaster, OH"
      />
    </div>
  );
}

function Band({ children, tone = 'page', tight, style }) {
  const bg = { page: 'var(--surface-page)', sunken: 'var(--surface-sunken)', dark: 'var(--surface-dark)', accent: 'var(--surface-accent)' }[tone];
  return (
    <section style={{ background: bg, padding: (tight ? 'var(--space-12)' : 'var(--section-y)') + ' 0', ...style }}>
      <div style={{ maxWidth: 'var(--container-max)', margin: '0 auto', padding: '0 var(--gutter)' }}>{children}</div>
    </section>
  );
}


const UPDATES = [
  { d: 'Sept 23, 2026', t: 'HB 170 takes effect' },
  { d: 'Now', t: 'Viking 1-S stratigraphic test being drilled, Amanda Township' },
  { d: 'Aug 28, 2026', t: 'Operating Class VI wells in Ohio: 0' },
  { d: 'Jul 28, 2026', t: 'Hocking Township trustees meeting recorded \u00b7 EX-52' },
  { d: 'Jul 13, 2026', t: 'Amanda Township trustees meeting recorded \u00b7 EX-51' },
  { d: 'Fall 2026', t: 'ODNR carbon storage rulemaking and JCARR hearing expected' },
  { d: 'Not filed', t: 'No Class VI permit application has been filed' },
];

function Ticker({ onNavigate }) {
  const run = (key) => UPDATES.map((u, i) => (
    <span key={key + i} style={{ display: 'inline-flex', alignItems: 'baseline', gap: '10px', paddingRight: 'var(--space-10)' }}>
      <span style={{ fontFamily: 'var(--font-mono)', fontSize: 'var(--text-xs)', color: 'var(--clay-600)', whiteSpace: 'nowrap' }}>{u.d}</span>
      <span style={{ fontFamily: 'var(--font-sans)', fontSize: 'var(--text-sm)', color: 'var(--text-secondary)', whiteSpace: 'nowrap' }}>{u.t}</span>
    </span>
  ));
  return (
    <div style={{ background: 'var(--cream-100)', borderBottom: '1px solid var(--border-subtle)', overflow: 'hidden', display: 'flex', alignItems: 'stretch' }}>
      <div style={{ flex: 'none', display: 'flex', alignItems: 'center', padding: '11px var(--space-5)', background: 'var(--green-900)', color: 'var(--wheat-400)', fontFamily: 'var(--font-mono)', fontSize: 'var(--text-xs)', letterSpacing: '0.14em', textTransform: 'uppercase' }}>Latest</div>
      <div className="fg-ticker-viewport" style={{ flex: 1, overflow: 'hidden', display: 'flex', alignItems: 'center' }}>
        <div className="fg-ticker-track" style={{ display: 'flex', whiteSpace: 'nowrap', paddingLeft: 'var(--space-6)' }}>
          <span style={{ display: 'inline-flex' }}>{run('a')}</span>
          <span style={{ display: 'inline-flex' }} aria-hidden="true">{run('b')}</span>
        </div>
      </div>
    </div>
  );
}

// 300px-wide derivative — the 1112px original is for print only.
const LOGO = 'assets/logo-fairfield-grounded-header.png';

const PHOTO = {
  field: 'assets/photos/viking-1s-rig-across-field.jpeg',
  night: 'assets/photos/viking-1s-derrick-night.jpeg',
  floor: 'assets/photos/viking-1s-rig-floor.png',
};

Object.assign(window, { Shell, Band, Ticker, NAV, FOOTER_COLUMNS, PHOTO, LOGO });
})();