<% function sentChip(s){ return s==='positive'?'<span class="chip pos">Positive</span>':(s==='negative'?'<span class="chip neg">Negative</span>':'<span class="chip flat">Neutral</span>'); }

   function srcPath(c){
     var u = h.safeUrl(c.url);
     if (!u) return '';
     var p = '';
     try { var o = new URL(u); [...o.searchParams.keys()].filter(function (k) { return /^utm_/i.test(k); }).forEach(function (k) { o.searchParams.delete(k); }); p = (o.pathname || '') + (o.search || ''); } catch (e) { return ''; }
     if (!p || p === '/') return '';
     try { p = decodeURI(p); } catch (e) {  }

     var MAX = 30;
     if (p.length > MAX) {
       var seg = p.split('/').filter(Boolean).pop() || '';
       p = '…/' + seg;
       if (p.length > MAX) p = p.slice(0, MAX - 1) + '…';
     }
     return p;
   }
   function srcCell(c){
     var name = h.esc(c.source || '—');
     var url = h.safeUrl(c.url);
     var cell = url ? '<a href="' + url + '" target="_blank" rel="noopener noreferrer nofollow">' + name + '</a>' : name;
     var path = srcPath(c);
     if (path) cell += '<span class="pdf-only"> ' + h.esc(path) + '</span>';
     if (c.rival) {
       cell += ' <span class="chip warn" style="margin-left:6px" title="'
         + h.esc(c.rival) + ' is a competitor you track. The engine cited their site for this question.">Competitor</span>';
     }
     return cell;
   }
   var canManage = locals.showStaff;
   var lastCheck = (all || []).map(function(c){ return c.checkedAt; }).filter(Boolean).sort().pop();

   var eng = function(c){ return String(c.engine || '').trim(); };
   var ekey = function(c){ return eng(c).toLowerCase() || 'unknown'; };

   var _ec = locals.engineCounts || {};
   var _tabKeys = ['all', 'new', 'lost', 'broken', 'rivals', 'others'];

   var _engTotal = _ec.page || {};
   var engList = Object.keys(_engTotal).map(function (k) { return { k: k, label: _engTotal[k].label, n: _engTotal[k].n }; })
     .sort(function (a, b) { return b.n - a.n; });

   var engCount = Object.keys(_ec.all || {}).length;

   var _pg = locals.pg || { per: 2000, tab: 'all', page: 1, pages: { all: 1, others: 1 } };
   var _open = _pg.tab === 'others' && counts.others ? 'others' : 'all';
   var _engOf = function (tab, k) { return ((_ec[tab] || {})[k] || {}).n || 0; };
   var _tabTotal = { all: counts.total, new: counts.new, lost: counts.lost,
                     broken: counts.broken, rivals: counts.rivals, others: counts.others,

                     page: counts.total + counts.others };

   var hasCites = (all || []).length > 0;
%>
<div class="pg-head" style="margin-bottom:0">
  <div>
    <div class="eyebrow">AI Search / Citation Center</div>
  </div>
  <div class="ph-right"><%- include('../partials/range-picker') %></div>
</div>

<h1 class="claim"><%= title %></h1>
<% if (hasCites) { %>
  <p class="claim-lede">AI answers about you cite <em><%= h.int(counts.total) %></em> source<%= counts.total === 1 ? '' : 's' %>.</p>
<% } else if ((others || []).length) { %>
  <p class="claim-lede">The engines cited sources for your questions, and named you in none of them.</p>
<% } else { %>
  <p class="claim-lede">No AI answer has cited a source about you yet.</p>
<% } %>
<p class="claim-sub"><%
  if (hasCites) { %>Across <%= engCount %> engine<%= engCount === 1 ? '' : 's' %><%= counts.others ? ', plus ' + counts.others + ' in answers that named others' : '' %>.<%
  } else { %>The pages AI engines link to when they answer questions about you. The list fills in from the AI Visibility runs.<%
  } %> <%- h.ihelp('Why this matters',
      'Citations are the pages an AI engine links to when it answers a question about you. '
      + '<b>Lost</b> means a source was missing from the last two runs.') %></p>

<%

  var _byEng = {};
  Object.keys(_ec.all || {}).forEach(function (k) { _byEng[_ec.all[k].label || 'Unknown'] = _ec.all[k].n; });
  var _shelf = [], _off = [];
  function _cell(l, val) { _shelf.push({ l: l, v: val }); }
  function _blank(n, cta, href) { _off.push({ n: n, cta: cta, href: href || '' }); }

  Object.keys(_byEng).sort(function (a, b) { return _byEng[b] - _byEng[a]; })
    .forEach(function (nm) { _cell('Cited by ' + nm, _byEng[nm]); });

  if ((others || []).length) _cell("Cited, you weren't named", counts.others);

  if (!lastCheck) _blank('Broken cited pages', 'No cited page has been fetched and checked yet');
%>

<div class="bento" style="margin-top:22px">

  <div class="vdark vd-cut b12">
    <span class="vn-fillet"></span>

    <a class="vn-cut" href="/prompt-explorer">See the prompts
      <svg viewBox="0 0 12 12" fill="none" width="13" height="13" aria-hidden="true"><path d="M3 9L9 3M9 3H4.2M9 3v4.8" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"/></svg>
    </a>

    <div class="ov-strip ov-2">
    <div class="ov">
      <div class="ovl">Sources cited</div>
      <div class="ovv tnum" data-kpi="all"><%= h.int(counts.total) %></div>
      <div class="rr-meta" style="margin-top:5px" data-kpi-foot>across <%= engCount %> engine<%= engCount===1?'':'s' %><%= counts.others ? ' · +' + counts.others + ' where you weren\'t named' : '' %></div>
    </div>
    <div class="ov">
      <div class="ovl">New</div>
      <div class="ovv tnum" data-kpi="new" data-kpi-sign="+">+<%= counts.new %></div>
      <div class="rr-meta" style="margin-top:5px">first seen in the latest run</div>
    </div>
    <div class="ov">
      <div class="ovl">Lost</div>
      <div class="ovv tnum" data-kpi="lost" data-kpi-sign="−">−<%= counts.lost %></div>
      <div class="rr-meta" style="margin-top:5px">absent from 2 runs we re-asked</div>
    </div>
    <div class="ov">
      <div class="ovl">Broken</div>

      <div class="ovv tnum" data-kpi="broken"><% if(lastCheck){ %><%= counts.broken %><% } else { %><span class="noval">—</span><% } %></div>
      <div class="rr-meta" style="margin-top:5px"><%= lastCheck ? 'cited page no longer loads' : 'not checked yet' %></div>
    </div>
    </div>

  </div>

  <% if (_shelf.length) { %>
  <%

    var _tints = ['sc-violet', 'sc-lime', 'sc-navy', 'sc-sky', 'sc-sand', 'sc-rose'];
  %>
  <div class="shelf-row b12" style="--shelf-n:<%= _shelf.length %>">
  <% _shelf.forEach(function (s, i) { %>
    <div class="card shelf-c <%= _tints[i % _tints.length] %>">
      <div class="cl"><%= s.l %></div>
      <div class="cv tnum"><%= s.v %></div>
    </div>
  <% }) %>
  </div>
  <% } %>

  <% if (_off.length) { %>

  <div class="voff b12">
    <div class="voff-h"><b>Not connected yet</b></div>
    <% _off.forEach(function (o) { %>
      <div class="voff-i">
        <span class="n"><%= o.n %></span>
        <% if (o.href) { %><a href="<%= o.href %>"><%= o.cta %></a><% } else { %><span class="n"><%= o.cta %></span><% } %>
      </div>
    <% }) %>
  </div>
  <% } %>

  <% if (hasCites || counts.others) { %>

  <div class="filterbar b12" data-engine-filter
       data-engine-counts="<%= JSON.stringify(_ec) %>"
       data-tab-totals="<%= JSON.stringify(_tabTotal) %>">
    <% if (engList.length > 1) { %>
    <span class="fb-lbl">Engine</span>

    <button class="efilt on" data-engine="" type="button">All engines <span class="pilln"><%= _tabTotal.page || 0 %></span></button>
    <% engList.forEach(function(e){ %>
      <button class="efilt" data-engine="<%= e.k %>" type="button"><%- include('../partials/engine-mark', { engine: e.label, size: 'sm', bare: true }) %><%= e.label %> <span class="pilln"><%= e.n %></span></button>
    <% }) %>
    <% } %>

    <button class="grp-toggle on" data-group-toggle type="button" aria-pressed="true">
      <span class="gt-on">Grouped by domain</span><span class="gt-off">Every citation</span>
    </button>
  </div>
  <% } %>

  <%

    function pgLink(tab, p) {
      var q = Object.assign({}, locals.query || {});
      delete q.tab; delete q.p;
      var parts = Object.keys(q).filter(function (k) { return q[k] !== undefined && q[k] !== ''; })
        .map(function (k) { return encodeURIComponent(k) + '=' + encodeURIComponent(q[k]); });
      parts.push('tab=' + tab);
      if (p > 1) parts.push('p=' + p);
      return '/citation-center?' + parts.join('&');
    }

    function pager(tab, shown, total) {
      if (total <= _pg.per) return '';
      var active = _pg.tab === tab, page = active ? _pg.page : 1, last = _pg.pages[tab] || 1;
      var from = (page - 1) * _pg.per + 1, to = from + shown - 1;
      var out = '<div class="pgr"><span class="pgr-n">Showing <b>' + from + '–' + to + '</b> of ' + h.int(total) + '</span><span class="pgr-b">';
      out += page > 1
        ? '<a class="btn btn-sm" href="' + pgLink(tab, page - 1) + '">← Newer</a>'
        : '<span class="btn btn-sm is-off" aria-disabled="true">← Newer</span>';
      out += '<span class="pgr-p">Page ' + page + ' of ' + last + '</span>';
      out += page < last
        ? '<a class="btn btn-sm" href="' + pgLink(tab, page + 1) + '">Older →</a>'
        : '<span class="btn btn-sm is-off" aria-disabled="true">Older →</span>';
      return out + '</span></div>';
    }

    var _panel = function (k) { return k === _open ? '' : 'display:none; '; };
  %>
  <div class="card b12">
    <div style="padding:4px 16px 0">
      <div class="tabs">
        <div class="tab<%= _open === 'all' ? ' on' : '' %>" data-tab="all">All <span class="pilln"><%= counts.total %></span></div>
        <div class="tab" data-tab="new">New <span class="pilln"><%= counts.new %></span></div>
        <div class="tab" data-tab="lost">Lost <span class="pilln"><%= counts.lost %></span></div>
        <div class="tab" data-tab="broken">Broken <span class="pilln"><%= counts.broken %></span></div>

        <% if (locals.rivalsLinked) { %>
        <div class="tab" data-tab="rivals">Competitor sites <span class="pilln"><%= counts.rivals %></span></div>
        <% } %>

        <div class="tab<%= _open === 'others' ? ' on' : '' %>" data-tab="others">You weren't named <span class="pilln"><%= counts.others %></span></div>
      </div>
    </div>

    <div class="tabpanel" data-panel="all" style="<%= _panel('all') %>overflow-x:auto">
      <% if(!all.length){ %>
        <div class="card-p rr-meta" style="text-align:center; padding:34px">
          No citations yet. They appear when an AI answer that mentions you also links to a source<%= canManage ? '. Run AI Visibility to check.' : '. Your VOCTOS team checks the engines every week.' %>
          <% if(canManage){ %><br><span style="opacity:.8">Perplexity returns the most citations; ChatGPT and Gemini return fewer.</span><% } %>
        </div>
      <% } else { %>

      <div class="tbl-frozen">
        <table class="tbl"><thead><tr><th>Source</th><th>Question asked</th><th>Engine</th><th>Tone</th><th>State</th><th>Last seen</th></tr></thead><tbody>
          <% all.forEach(function(c){ %>
            <tr class="cit-row" data-engine="<%= ekey(c) %>" data-domain="<%= (c.source || '').trim() %>" data-at="<%= c.date ? new Date(c.date).getTime() : 0 %>" data-at-label="<%= h.date(c.date) %>">
              <td class="strong"><%- srcCell(c) %></td>
              <td class="muted"><%= c.prompt %></td>
              <td><span style="display:inline-flex;align-items:center;gap:7px"><%- include('../partials/engine-mark', { engine: c.engine, size: 'sm' }) %><%= c.engine %></span></td>
              <td><%- sentChip(c.sentiment) %></td>
              <td>
                <% if(c.status==='broken'){ %><span class="chip neg" title="Returned HTTP <%= c.httpStatus || '?' %>">Broken</span>
                <% } else if(c.status==='lost'){ %><span class="chip warn">Lost</span>
                <% } else if(c.status==='new'){ %><span class="chip pos">New</span>
                <% } else { %><span class="chip flat">Active</span><% } %>
              </td>
              <td class="muted"><%= h.date(c.date) %></td>
            </tr>
          <% }) %>
        </tbody></table>
      </div>
      <%- pager('all', all.length, counts.total) %>
      <div class="rr-meta grp-note" data-grp-note style="padding:10px 16px 2px"></div><div class="rr-meta filt-empty" style="display:none; text-align:center; padding:30px">No citations from this engine in this list.</div><% } %>
    </div>

    <div class="tabpanel" data-panel="new" style="display:none; overflow-x:auto">
      <% if(!cnew.length){ %><div class="card-p rr-meta" style="text-align:center; padding:30px">Nothing new in the latest run.</div><% } else { %>

      <div class="tbl-frozen">
        <table class="tbl"><thead><tr><th>New source</th><th>Question asked</th><th>Engine</th><th>Tone</th><th>First seen</th></tr></thead><tbody>
          <% cnew.forEach(function(c){ %><tr class="cit-row" data-engine="<%= ekey(c) %>" data-domain="<%= (c.source || '').trim() %>" data-at="<%= c.date ? new Date(c.date).getTime() : 0 %>" data-at-label="<%= h.date(c.date) %>"><td class="strong"><%- srcCell(c) %></td><td class="muted"><%= c.prompt %></td><td><span style="display:inline-flex;align-items:center;gap:7px"><%- include('../partials/engine-mark', { engine: c.engine, size: 'sm' }) %><%= c.engine %></span></td><td><%- sentChip(c.sentiment) %></td><td class="muted"><%= h.date(c.date) %></td></tr><% }) %>
        </tbody></table>
      </div>
      <div class="rr-meta grp-note" data-grp-note style="padding:10px 16px 2px"></div><div class="rr-meta filt-empty" style="display:none; text-align:center; padding:30px">No citations from this engine in this list.</div><% } %>
    </div>

    <div class="tabpanel" data-panel="lost" style="display:none; overflow-x:auto">
      <% if(!lost.length){ %><div class="card-p rr-meta" style="text-align:center; padding:30px">No sources lost.</div><% } else { %>
      <div class="card-p rr-meta" style="padding-bottom:4px"><span class="ihelp-w" tabindex="0" role="button" aria-label="What lost means"><svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><circle cx="8" cy="8" r="6.4" stroke="currentColor" stroke-width="1.4"/><path d="M8 7.1v4M8 4.9v.1" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg> What lost means<span class="ihelp-pop" role="tooltip"><b>What lost means</b>Cited before, and missing from the last <b>two runs in a row</b> on the same question and engine<% if (locals.showStaff) { %>, and an engine that failed or was out of quota never marks anything lost<% } %>.</span></span></div>

      <div class="tbl-frozen">
        <table class="tbl"><thead><tr><th>Lost source</th><th>Question asked</th><th>Engine</th><th>Last seen</th><% if(canManage){ %><th></th><% } %></tr></thead><tbody>
          <% lost.forEach(function(c){ %>
            <tr class="cit-row" data-engine="<%= ekey(c) %>" data-domain="<%= (c.source || '').trim() %>" data-at="<%= c.date ? new Date(c.date).getTime() : 0 %>" data-at-label="<%= h.date(c.date) %>">
              <td class="strong"><%- srcCell(c) %></td>
              <td class="muted"><%= c.prompt %></td>
              <td><span style="display:inline-flex;align-items:center;gap:7px"><%- include('../partials/engine-mark', { engine: c.engine, size: 'sm' }) %><%= c.engine %></span></td>
              <td class="muted"><%= h.date(c.date) %></td>
              <% if(canManage){ %>
              <td>
                <form method="POST" action="/api/tasks" class="inline-form js-ajax-form" data-success-text="Task created ✓">
                  <input type="hidden" name="title" value="Win back the citation on <%= c.source %>">
                  <input type="hidden" name="description" value="<%= c.engine %> stopped citing <%= c.source %> for “<%= c.prompt %>”.">
                  <input type="hidden" name="category" value="GEO">
                  <input type="hidden" name="priority" value="med">
                  <button class="act" style="background:none;border:0;cursor:pointer;color:var(--teal-600)">Create task</button>
                </form>
              </td>
              <% } %>
            </tr>
          <% }) %>
        </tbody></table>
      </div>
      <div class="rr-meta grp-note" data-grp-note style="padding:10px 16px 2px"></div><div class="rr-meta filt-empty" style="display:none; text-align:center; padding:30px">No citations from this engine in this list.</div><% } %>
    </div>

    <div class="tabpanel" data-panel="broken" style="display:none; overflow-x:auto">
      <% if(!broken.length){ %>
        <div class="card-p rr-meta" style="text-align:center; padding:30px">
          <% if(lastCheck){ %>Every cited page still loads. Last checked <%= h.timeAgo(lastCheck) %>.
          <% } else { %>Cited pages haven't been checked yet. This fills in after the next sync.<% } %>
        </div>
      <% } else { %>
      <div class="card-p rr-meta" style="padding-bottom:4px"><span class="ihelp-w" tabindex="0" role="button" aria-label="What broken means"><svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><circle cx="8" cy="8" r="6.4" stroke="currentColor" stroke-width="1.4"/><path d="M8 7.1v4M8 4.9v.1" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg> What broken means<span class="ihelp-pop" role="tooltip"><b>What broken means</b>An AI engine is citing a page that no longer loads. If it's your page, redirect it; if it's someone else's, the citation will fade on its own.</span></span></div>

      <div class="tbl-frozen">
        <table class="tbl"><thead><tr><th>Cited page</th><th>Status</th><th>Cited by</th><th>Question asked</th><th>Checked</th></tr></thead><tbody>
          <% broken.forEach(function(c){ %>
            <tr class="cit-row" data-engine="<%= ekey(c) %>" data-domain="<%= (c.source || '').trim() %>" data-at="<%= c.date ? new Date(c.date).getTime() : 0 %>" data-at-label="<%= h.date(c.date) %>">
              <td class="strong"><%- srcCell(c) %></td>
              <td><span class="chip neg"><%= c.httpStatus || 'error' %></span></td>
              <td><span style="display:inline-flex;align-items:center;gap:7px"><%- include('../partials/engine-mark', { engine: c.engine, size: 'sm' }) %><%= c.engine %></span></td>
              <td class="muted"><%= c.prompt %></td>
              <td class="muted"><%= c.checkedAt ? h.timeAgo(c.checkedAt) : '—' %></td>
            </tr>
          <% }) %>
        </tbody></table>
      </div>
      <div class="rr-meta grp-note" data-grp-note style="padding:10px 16px 2px"></div><div class="rr-meta filt-empty" style="display:none; text-align:center; padding:30px">No citations from this engine in this list.</div><% } %>
    </div>

    <% if (locals.rivalsLinked) { %>
    <div class="tabpanel" data-panel="rivals" style="display:none; overflow-x:auto">
      <% if(!(locals.rivals || []).length){ %>
        <div class="card-p rr-meta" style="text-align:center; padding:30px">
          No competitor's own site was cited in the answers we checked. Review sites and directories still are, under <b>All</b>.
        </div>
      <% } else { %>
      <div class="card-p rr-meta" style="padding-bottom:4px">
        <b><%= h.int(counts.rivals) %></b> citation<%= counts.rivals === 1 ? '' : 's' %> of
        <b><%= h.int(counts.rivalBrands) %></b> competitor<%= counts.rivalBrands === 1 ? '' : 's' %>'
        own site<%= counts.rivalBrands === 1 ? '' : 's' %>. Matched on the domains recorded against each
        competitor<%= canManage ? '. Set or correct those on Competitors.' : '.' %>
      </div>
      <div class="tbl-frozen">
        <table class="tbl"><thead><tr><th>Source</th><th>Competitor</th><th>Question asked</th><th>Engine</th><th>Named you</th><th>Last seen</th></tr></thead><tbody>
          <% locals.rivals.forEach(function(c){ %>
            <tr class="cit-row" data-engine="<%= ekey(c) %>" data-domain="<%= (c.source || '').trim() %>" data-at="<%= c.date ? new Date(c.date).getTime() : 0 %>" data-at-label="<%= h.date(c.date) %>">
              <td class="strong"><%- srcCell(c) %></td>
              <td><%= c.rival %></td>
              <td class="muted"><%= c.prompt %></td>
              <td><span style="display:inline-flex;align-items:center;gap:7px"><%- include('../partials/engine-mark', { engine: c.engine, size: 'sm' }) %><%= c.engine %></span></td>

              <td><% if(c.mentioned === false){ %><span class="chip warn">No</span><% } else { %><span class="chip flat">Yes</span><% } %></td>
              <td class="muted"><%= h.date(c.date) %></td>
            </tr>
          <% }) %>
        </tbody></table>
      </div>
      <div class="rr-meta grp-note" data-grp-note style="padding:10px 16px 2px"></div><div class="rr-meta filt-empty" style="display:none; text-align:center; padding:30px">No citations from this engine in this list.</div><% } %>
    </div>
    <% } %>

    <div class="tabpanel" data-panel="others" style="<%= _panel('others') %>overflow-x:auto">
      <% if(!others.length){ %>
        <div class="card-p rr-meta" style="text-align:center; padding:30px">Every answer we checked named you.</div>
      <% } else { %>

      <div class="card-p rr-meta" style="padding-bottom:4px">
        <span class="ihelp-w" tabindex="0" role="button" aria-label="What this list is">
          <svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><circle cx="8" cy="8" r="6.4" stroke="currentColor" stroke-width="1.4"/><path d="M8 7.1v4M8 4.9v.1" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg> What this list is
          <span class="ihelp-pop" role="tooltip"><b>What this list is</b>Sources the engines cited in answers that named other brands. Getting a presence on these pages is the most direct way into those answers.</span>
        </span>
      </div>

      <div class="tbl-frozen">
        <table class="tbl"><thead><tr><th>Source</th><th>Question asked</th><th>Engine</th><th>Seen</th><% if(canManage){ %><th></th><% } %></tr></thead><tbody>
          <% others.forEach(function(c){ %>
            <tr class="cit-row" data-engine="<%= ekey(c) %>" data-domain="<%= (c.source || '').trim() %>" data-at="<%= c.date ? new Date(c.date).getTime() : 0 %>" data-at-label="<%= h.date(c.date) %>">
              <td class="strong"><%- srcCell(c) %></td>
              <td class="muted"><%= c.prompt %></td>
              <td><span style="display:inline-flex;align-items:center;gap:7px"><%- include('../partials/engine-mark', { engine: c.engine, size: 'sm' }) %><%= c.engine %></span></td>
              <td class="muted"><%= h.date(c.date) %></td>
              <% if(canManage){ %>
              <td>
                <form method="POST" action="/api/tasks" class="inline-form js-ajax-form" data-success-text="Task created ✓">
                  <input type="hidden" name="title" value="Get listed on <%= c.source %>">

                  <input type="hidden" name="description" value="<%= c.engine %> cited <%= c.source %> for “<%= c.prompt %>” in an answer that did not name us. Check whether the page lists us, and what it would take to be part of that answer.">
                  <input type="hidden" name="category" value="GEO">
                  <input type="hidden" name="priority" value="med">
                  <button class="act" style="background:none;border:0;cursor:pointer;color:var(--teal-600)">Create task</button>
                </form>
              </td>
              <% } %>
            </tr>
          <% }) %>
        </tbody></table>
      </div>
      <%- pager('others', others.length, counts.others) %>
      <div class="rr-meta grp-note" data-grp-note style="padding:10px 16px 2px"></div><div class="rr-meta filt-empty" style="display:none; text-align:center; padding:30px">No citations from this engine in this list.</div><% } %>
    </div>
  </div>
</div>

<div class="dompop" data-domain-pop hidden>
  <div class="dompop-back" data-domain-close></div>
  <div class="dompop-card" role="dialog" aria-modal="true" aria-labelledby="dompop-title">
    <div class="dompop-h">
      <div class="dompop-ht">
        <div class="dompop-title" id="dompop-title"></div>
        <div class="dompop-sub rr-meta"></div>
      </div>
      <button class="dompop-x" data-domain-close type="button" aria-label="Close">
        <svg viewBox="0 0 16 16" fill="none" aria-hidden="true" width="15" height="15"><path d="M4 4l8 8M12 4l-8 8" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/></svg>
      </button>
    </div>
    <div class="dompop-b"></div>
  </div>
</div>
