// Shared data + small atoms for the Broadsheet report
window.BS_DATA = {
  countries: [
    ['FR', 'France',         'Western',  187],
    ['IT', 'Italy',          'Southern', 126],
    ['DE', 'Germany',        'Western',  125],
    ['UK', 'United Kingdom', 'Western',  115],
    ['ES', 'Spain',          'Southern', 113],
    ['SE', 'Sweden',         'Northern',  54],
    ['PL', 'Poland',         'Eastern',   52],
    ['HU', 'Hungary',        'Eastern',   45],
    ['NO', 'Norway',         'Northern',  29],
    ['RO', 'Romania',        'Eastern',   13],
  ],
  publishers: [
    ['Le Figaro',           'France',  102, 'Account-required'],
    ['El País',             'Spain',    69, 'Account-required'],
    ['Les Échos',           'France',   59, 'Account-required'],
    ['Financial Times',     'UK',       55, 'Account-required'],
    ['Der Spiegel',         'Germany',  53, 'Account-required'],
    ['La Repubblica',       'Italy',    48, 'Account-required'],
    ['The Guardian',        'UK',       48, 'Account-required'],
    ['Corriere della Sera', 'Italy',    47, 'Account-required'],
    ['Gazeta Wyborcza',     'Poland',   42, 'Account-required'],
    ['Die Zeit',            'Germany',  40, 'Account-required'],
  ],
  thesis: [
    ['01', 'Direct distribution',       'Email lands in a known address, at a chosen time, with no ranking algorithm in between. Publishers control what goes out, when, and to whom.'],
    ['02', 'Pay-prone audiences',        'Our audience surveys across 10 EU markets show newsletter consumption and willingness to pay for online content correlate tightly.'],
    ['03', 'Cheap to ship',              'If a newsroom can publish articles, it can package editorial expertise into a recurring email product. No studio, no complicated production.'],
    ['04', 'Habit surface',              'Professional readers treat email as a workflow surface, not a messaging tool. Newsletters meet them inside an existing routine.'],
    ['05', 'Cross-platform by default',  'Newsletters work across devices, OSes, and reading environments without being rebuilt for each platform.'],
    ['06', 'Easier than the paywall',    'Paid newsletters are easier to gate than most website paywalls, useful for testing exclusive content and supporter demand.'],
  ],
  placement: [
    ['Inside hamburger menu',     'Behind navigation drawer',      78, false],
    ['Hidden in footer only',     'Bottom-of-page placement',      53, false],
    ['Dedicated landing page',    'Reachable but not promoted',    47, false],
    ['Inline article promo',      'Contextual placement',          31, false],
    ['Above-the-fold homepage',   'Visible without scrolling',     16, true],
  ],
  signup: [
    ['Account required',            'Full registration before signup',          64, false],
    ['Double opt-in confirmation',  'Email verification step',                  76, false],
    ['No content sample shown',     'Reader signs up unseen',                   49, true],
    ['Delivery day undisclosed',    'Cadence promised, day not specified',      42, false],
    ['Email-only signup',           'Just an address — no account',             18, false],
  ],
  // Cadence bars — counts and % of total newsletters (n=859). Source: NL 2026 UPDATED.
  cadence: [
    ['Daily',    8.5,  73],
    ['5×/wk',    7.7,  66],
    ['2×/wk',    2.4,  21],
    ['Weekly',  56.5, 485],
    ['Bi-wkly',  4.8,  41],
    ['Monthly',  3.7,  32],
    ['Other',   16.4, 141],
  ],
  // Heatmap: rows = cadences, cols = days Mon..Sun. Numbers = count of NL sending that day.
  // Source: NL 2026 UPDATED — "Five times a week" is now a distinct category (was previously
  // collapsed into Daily/Weekly), and Sunday counts were rebalanced.
  heatmap: {
    days: ['Mon','Tue','Wed','Thu','Fri','Sat','Sun'],
    rows: [
      ['Daily',     [69, 69, 69, 69, 69, 69, 69]],
      ['5×/week',   [61, 62, 62, 64, 62,  1,  2]],
      ['Weekly',    [44, 40, 49, 56, 94, 49, 38]],
      ['Bi-weekly', [ 5,  2, 10,  4,  1,  0,  2]],
      ['Monthly',   [ 1,  1,  0,  1,  1,  0,  1]],
    ],
  },
  topics: [
    ['Politics & Geopolitics',    142, 16.5, true],
    ['Business & Finance',        128, 14.9, true],
    ['General News',               98, 11.4, false],
    ['Culture & Arts',             82,  9.5, false],
    ['Tech & Science',             74,  8.6, false],
    ['Sports',                     68,  7.9, false],
    ['Lifestyle & Leisure',        56,  6.5, false],
    ['Local & Regional',           48,  5.6, false],
    ['Health & Wellness',          42,  4.9, false],
    ['Travel & Food',              38,  4.4, false],
    ['Society & Social Issues',    32,  3.7, false],
    ['Environment & Climate',      28,  3.3, false],
    ['Education & Careers',        14,  1.6, false],
    ['Entertainment',               9,  1.1, false],
  ],
  newsletters: [
    ['Morning Briefing',     'The Guardian',         'UK',      'General News',       'Daily',   'Free',    'Account'],
    ['Politics Weekly',      'The Guardian',         'UK',      'Politics',           'Weekly',  'Free',    'Account'],
    ['First Edition',        'The Guardian',         'UK',      'General News',       'Daily',   'Free',    'Account'],
    ['L\'essentiel',         'Le Monde',             'France',  'General News',       'Daily',   'Paid',    'Account'],
    ['La Lettre Politique',  'Le Monde',             'France',  'Politics',           'Weekly',  'Paid',    'Account'],
    ['Süddeutsche am Morgen','Süddeutsche Zeitung',  'Germany', 'General News',       'Daily',   'Free',    'Account'],
    ['Geld & Geist',         'Süddeutsche Zeitung',  'Germany', 'Business',           'Weekly',  'Paid',    'Account'],
    ['Il Mattino',           'Corriere della Sera',  'Italy',   'General News',       'Daily',   'Free',    'Account'],
    ['Politica & Potere',    'Corriere della Sera',  'Italy',   'Politics',           'Weekly',  'Paid',    'Account'],
    ['El País a primera hora','El País',             'Spain',   'General News',       'Daily',   'Free',    'Account'],
    ['Ideas',                'El País',              'Spain',   'Culture',            'Weekly',  'Free',    'Account'],
    ['Morgen',               'Aftenposten',          'Norway',  'General News',       'Daily',   'Free',    'Email'],
    ['Helg',                 'Aftenposten',          'Norway',  'Lifestyle',          'Weekly',  'Free',    'Email'],
    ['DN i dag',             'Dagens Nyheter',       'Sweden',  'General News',       'Daily',   'Free',    'Account'],
    ['Wyborcza Codziennie',  'Gazeta Wyborcza',      'Poland',  'General News',       'Daily',   'Paid',    'Account'],
    ['Reggeli',              '24.hu',                'Hungary', 'General News',       'Daily',   'Free',    'Account'],
    ['Hét Vége',             '444.hu',               'Hungary', 'Politics',           'Weekly',  'Free',    'Account'],
    ['G4 Media Buletin',     'G4 Media',             'Romania', 'Politics',           'Weekly',  'Free',    'Email'],
  ],
};

// SectionHead atom
function SectionHead({ tag, num, title, lede, note }) {
  return (
    <div className="section-head">
      <div className="section-tag"><em>{num}</em>{tag}</div>
      <div>
        <h2>{title}</h2>
        {lede && <p className="lede">{lede}</p>}
        {note && <p className="section-note"><span>Method</span>{note}</p>}
      </div>
    </div>
  );
}

// Donut SVG — segments array: [{label, value, color, sub}]
function Donut({ segments, centerValue, centerLabel, size = 180 }) {
  const total = segments.reduce((s, x) => s + x.value, 0);
  const r = 80, cx = size / 2, cy = size / 2;
  let acc = 0;
  return (
    <div className="donut" style={{ width: size, height: size }}>
      <svg viewBox={`0 0 ${size} ${size}`} style={{ position: 'absolute', inset: 0 }}>
        {segments.map((s, i) => {
          const start = (acc / total) * Math.PI * 2 - Math.PI / 2;
          acc += s.value;
          const end = (acc / total) * Math.PI * 2 - Math.PI / 2;
          const large = end - start > Math.PI ? 1 : 0;
          const x1 = cx + r * Math.cos(start), y1 = cy + r * Math.sin(start);
          const x2 = cx + r * Math.cos(end),   y2 = cy + r * Math.sin(end);
          return (
            <path key={i}
              d={`M ${cx} ${cy} L ${x1} ${y1} A ${r} ${r} 0 ${large} 1 ${x2} ${y2} Z`}
              fill={s.color} />
          );
        })}
      </svg>
      <div className="donut-center">
        <b>{centerValue}</b>
        <small>{centerLabel}</small>
      </div>
    </div>
  );
}

window.SectionHead = SectionHead;
window.Donut = Donut;
