heyiam 0.2.29 → 0.3.0

package/dist/render/templates/meridian/portfolio.liquid

@@ -0,0 +1,255 @@
+<div class="heyiam-portfolio meridian" data-render-version="2" data-template="meridian" data-username="{{ user.username }}">
+
+  {%- comment -%} Topographic contour background {%- endcomment -%}
+  <div class="topo-bg" aria-hidden="true">
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 900" preserveAspectRatio="xMidYMid slice">
+      <g class="topo-contours" fill="none" stroke-width="0.75">
+        <ellipse cx="350" cy="300" rx="280" ry="180" stroke="var(--mer-contour)" />
+        <ellipse cx="355" cy="305" rx="240" ry="150" stroke="var(--mer-contour)" />
+        <ellipse cx="360" cy="310" rx="200" ry="120" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="365" cy="315" rx="160" ry="90" stroke="var(--mer-contour)" />
+        <ellipse cx="370" cy="320" rx="120" ry="65" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="375" cy="325" rx="80" ry="40" stroke="var(--mer-contour)" />
+        <ellipse cx="850" cy="550" rx="300" ry="200" stroke="var(--mer-contour)" />
+        <ellipse cx="845" cy="545" rx="250" ry="165" stroke="var(--mer-contour)" />
+        <ellipse cx="840" cy="540" rx="200" ry="130" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="835" cy="535" rx="150" ry="95" stroke="var(--mer-contour)" />
+        <ellipse cx="830" cy="530" rx="100" ry="60" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="825" cy="525" rx="55" ry="30" stroke="var(--mer-contour)" />
+        <ellipse cx="950" cy="150" rx="220" ry="140" stroke="var(--mer-contour)" />
+        <ellipse cx="955" cy="155" rx="170" ry="105" stroke="var(--mer-contour)" />
+        <ellipse cx="960" cy="160" rx="120" ry="70" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="965" cy="165" rx="70" ry="38" stroke="var(--mer-contour)" />
+        <ellipse cx="150" cy="700" rx="250" ry="160" stroke="var(--mer-contour)" />
+        <ellipse cx="155" cy="695" rx="200" ry="125" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="160" cy="690" rx="150" ry="90" stroke="var(--mer-contour)" />
+        <ellipse cx="165" cy="685" rx="100" ry="55" stroke="var(--mer-contour)" />
+      </g>
+    </svg>
+  </div>
+
+  <a class="skip-link" href="#main-content">Skip to content</a>
+
+  <div class="mer-page">
+    <main id="main-content">
+
+      {%- comment -%} Hero {%- endcomment -%}
+      {% if hasProfile %}
+      <section class="hero section-reveal" aria-label="Profile">
+        <div class="section-label">
+          <span>&#167;01 &mdash; survey point</span>
+        </div>
+        <div class="hero__profile">
+          {% if user.photoUrl %}
+          <img src="{{ user.photoUrl }}" alt="{{ user.displayName }}" class="hero__photo" width="120" height="150">
+          {% endif %}
+          <div class="hero__info">
+            {% if user.displayName != blank %}
+            <h1 class="hero__name">{{ user.displayName }}</h1>
+            {% endif %}
+            <p class="hero__handle">@{{ user.username }}</p>
+            {% if user.bio != blank %}
+            <p class="hero__bio">{{ user.bio }}</p>
+            {% endif %}
+            {% if user.location != blank %}
+            <p class="hero__location">
+              <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7z" stroke-linecap="round" stroke-linejoin="round"/><circle cx="12" cy="9" r="2.5"/></svg>
+              {{ user.location }}
+            </p>
+            {% endif %}
+            {% if user.email or user.linkedinUrl or user.githubUrl or user.twitterHandle or user.websiteUrl %}
+            <ul class="hero__contact" aria-label="Contact and social links">
+              {% if user.email %}
+              <li><a href="mailto:{{ user.email }}"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="4" width="20" height="16" rx="2"/><path d="m2 4 10 8 10-8"/></svg>{{ user.email }}</a></li>
+              {% endif %}
+              {% if user.phone %}
+              <li><a href="tel:{{ user.phone }}"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z"/></svg>{{ user.phone }}</a></li>
+              {% endif %}
+              {% if user.linkedinUrl %}
+              <li><a href="{{ user.linkedinUrl }}"><svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor"><path d="M20.5 2h-17A1.5 1.5 0 002 3.5v17A1.5 1.5 0 003.5 22h17a1.5 1.5 0 001.5-1.5v-17A1.5 1.5 0 0020.5 2zM8 19H5v-9h3zM6.5 8.25A1.75 1.75 0 118.3 6.5a1.78 1.78 0 01-1.8 1.75zM19 19h-3v-4.74c0-1.42-.6-1.93-1.38-1.93A1.74 1.74 0 0013 14.19V19h-3v-9h2.9v1.3a3.11 3.11 0 012.7-1.4c1.55 0 3.36.86 3.36 3.66z"/></svg>LinkedIn</a></li>
+              {% endif %}
+              {% if user.githubUrl %}
+              <li><a href="{{ user.githubUrl }}"><svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor"><path d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"/></svg>GitHub</a></li>
+              {% endif %}
+              {% if user.twitterHandle %}
+              <li><a href="https://x.com/{{ user.twitterHandle }}"><svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>@{{ user.twitterHandle }}</a></li>
+              {% endif %}
+              {% if user.websiteUrl %}
+              <li><a href="{{ user.websiteUrl }}"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg>{{ user.websiteUrl | stripProtocol }}</a></li>
+              {% endif %}
+            </ul>
+            {% endif %}
+            {% if user.resumeUrl %}
+            <a href="{{ user.resumeUrl }}" class="hero__resume-btn"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="12" y1="18" x2="12" y2="12"/><polyline points="9 15 12 18 15 15"/></svg>Download Resume</a>
+            {% endif %}
+          </div>
+        </div>
+      </section>
+      {% endif %}
+
+      {%- comment -%} Stats {%- endcomment -%}
+      <section class="section-reveal" aria-label="Aggregate statistics">
+        <div class="section-label">
+          <span>&#167;02 &mdash; elevation data</span>
+        </div>
+        <div class="stats-grid">
+          <div class="stat-cell stat-counter" role="group" aria-label="Projects count">
+            <div class="stat-cell__coord">projects</div>
+            <div class="stat-cell__value">{{ projects.size }}</div>
+            <div class="stat-cell__label">projects</div>
+          </div>
+          <div class="stat-cell stat-counter" role="group" aria-label="Sessions count">
+            <div class="stat-cell__coord">sessions</div>
+            <div class="stat-cell__value">{{ totalSessions }}</div>
+            <div class="stat-cell__label">sessions</div>
+          </div>
+          {% if efficiencyMultiplier %}
+          <div class="stat-cell stat-cell--leverage stat-counter" role="group" aria-label="Leverage">
+            <div class="stat-cell__coord">leverage</div>
+            <div class="mer-leverage-nums">
+              <span><span class="mlev-val">{{ totalDurationMinutes | formatDuration }}</span> <span class="mlev-lbl">you</span></span>
+              <span><span class="mlev-val mlev-val--agent">{{ totalAgentDurationMinutes | formatDuration }}</span> <span class="mlev-lbl">agents</span></span>
+              <span><span class="mlev-val mlev-val--multi">{{ efficiencyMultiplier }}</span></span>
+            </div>
+            {% assign totalCombined = totalDurationMinutes | plus: totalAgentDurationMinutes %}
+            {% if totalCombined > 0 %}
+            {% assign humanPct = totalDurationMinutes | times: 100 | divided_by: totalCombined %}
+            {% assign agentPct = 100 | minus: humanPct %}
+            <div class="mer-leverage-bar">
+              <div class="mer-leverage-bar__human" style="width: {{ humanPct }}%"></div>
+              <div class="mer-leverage-bar__agent" style="width: {{ agentPct }}%"></div>
+            </div>
+            {% endif %}
+          </div>
+          {% else %}
+          <div class="stat-cell stat-counter" role="group" aria-label="Duration">
+            <div class="stat-cell__coord">time</div>
+            <div class="stat-cell__value">{{ totalDurationMinutes | formatDuration }}</div>
+            <div class="stat-cell__label">total</div>
+          </div>
+          {% endif %}
+          <div class="stat-cell stat-counter" role="group" aria-label="Lines of code">
+            <div class="stat-cell__coord">datum</div>
+            <div class="stat-cell__value">{{ totalLoc | localeNumber }}</div>
+            <div class="stat-cell__label">lines changed</div>
+          </div>
+        </div>
+      </section>
+
+      {%- comment -%} Projects {%- endcomment -%}
+      {% if projects.size > 0 %}
+      <section class="projects-section section-reveal" aria-label="Projects">
+        <div class="section-label">
+          <span>&#167;03 &mdash; terrain features</span>
+        </div>
+        <h2 class="section-heading">Projects</h2>
+
+        {% for p in projects %}
+        <article class="project-card">
+          <div class="project-card__header">
+            <h3 class="project-card__title">
+              <a href="/{{ user.username }}/{{ p.slug }}">{{ p.title }}</a>
+            </h3>
+            {% if p.publishedCount %}
+            <span class="project-card__source">{{ p.publishedCount }} session{% if p.publishedCount != 1 %}s{% endif %} published</span>
+            {% endif %}
+          </div>
+          {% if p.narrative != blank %}
+          <p class="project-card__narrative">{{ p.narrative }}</p>
+          {% endif %}
+          <div class="project-card__stats">
+            <span><strong>{{ p.totalSessions }}</strong> sessions</span>
+            <span><strong>{{ p.totalDurationMinutes | formatDuration }}</strong></span>
+            <span><strong>{{ p.totalLoc | localeNumber }}</strong> LOC</span>
+          </div>
+          {% if p.skills.size > 0 %}
+          <div class="project-card__skills">
+            {% for skill in p.skills %}
+            <span class="skill-chip">{{ skill }}</span>
+            {% endfor %}
+          </div>
+          {% endif %}
+          {% if p.sourceCounts.size > 0 %}
+          {% assign pTotalSrc = 0 %}
+          {% for src in p.sourceCounts %}{% assign pTotalSrc = pTotalSrc | plus: src.count %}{% endfor %}
+          {% if pTotalSrc > 0 %}
+          <div class="source-bar" role="img" aria-label="Source breakdown">
+            {% for src in p.sourceCounts %}
+            {% assign pSrcPct = src.count | times: 100.0 | divided_by: pTotalSrc | round %}
+            <div class="source-bar__segment source-bar__segment--{% if forloop.first %}claude{% else %}cursor{% endif %}" style="width: {{ pSrcPct }}%"></div>
+            {% endfor %}
+          </div>
+          <div class="source-bar__legend">
+            {% for src in p.sourceCounts %}
+            <span><span class="source-bar__legend-dot" style="background: {% if forloop.first %}var(--mer-accent){% else %}var(--mer-text-muted){% endif %}"></span>{{ src.tool }}</span>
+            {% endfor %}
+          </div>
+          {% endif %}
+          {% endif %}
+        </article>
+        {% endfor %}
+      </section>
+      {% endif %}
+
+      {%- comment -%} Skills Overview {%- endcomment -%}
+      {% if allSkills.size > 0 %}
+      <section class="section-reveal" aria-label="Skills overview">
+        <div class="section-label">
+          <span>&#167;04 &mdash; instrument readings</span>
+        </div>
+        <h2 class="section-heading">Skills Across Projects</h2>
+        <div style="display: flex; flex-wrap: wrap; gap: 0.5rem;">
+          {% for skill in allSkills %}
+          <span class="skill-chip">{{ skill.name }}</span>
+          {% endfor %}
+        </div>
+      </section>
+      {% endif %}
+
+      {%- comment -%} Source Overview {%- endcomment -%}
+      {% if sourceCounts.size > 0 %}
+      <section class="section-reveal" aria-label="Source overview">
+        <div class="section-label">
+          <span>&#167;05 &mdash; map legend</span>
+        </div>
+        <h2 class="section-heading">Source Overview</h2>
+        <div style="background: var(--mer-surface); border: 1px solid var(--mer-border-subtle); border-radius: var(--radius); padding: 1.5rem;">
+          <div style="display: grid; grid-template-columns: repeat({{ sourceCounts.size }}, 1fr); gap: 1.5rem;">
+            {% for src in sourceCounts %}
+            {% if totalSourceSessions > 0 %}
+            {% assign srcPct = src.count | times: 100 | divided_by: totalSourceSessions %}
+            {% else %}
+            {% assign srcPct = 0 %}
+            {% endif %}
+            <div>
+              <div style="font-family: var(--font-mono); font-size: 0.6875rem; color: var(--mer-text-muted); letter-spacing: 0.06em; text-transform: uppercase; margin-block-end: 0.375rem;">{% if forloop.first %}Primary{% else %}Secondary{% endif %} Source</div>
+              <div style="display: flex; align-items: center; gap: 0.5rem;">
+                <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: {% if forloop.first %}var(--mer-accent){% else %}var(--mer-text-muted){% endif %};"></span>
+                <span style="font-family: var(--font-mono); font-size: 0.875rem; color: var(--mer-white);">{{ src.tool }}</span>
+              </div>
+              <div style="font-family: var(--font-mono); font-size: 0.8125rem; color: var(--mer-text-muted); margin-block-start: 0.25rem;">{{ src.count }} sessions &middot; {{ srcPct }}%</div>
+            </div>
+            {% endfor %}
+          </div>
+          {% if totalSourceSessions > 0 %}
+          <div style="margin-block-start: 1.25rem;">
+            <div style="display: flex; height: 8px; border-radius: 4px; overflow: hidden;">
+              {% for src in sourceCounts %}
+              {% assign srcPct = src.count | times: 100 | divided_by: totalSourceSessions %}
+              <div style="width: {{ srcPct }}%; height: 100%; background: {% if forloop.first %}var(--mer-accent){% else %}var(--mer-text-muted){% endif %};"></div>
+              {% endfor %}
+            </div>
+          </div>
+          {% endif %}
+        </div>
+      </section>
+      {% endif %}
+    </main>
+
+    <footer class="mer-footer">
+      <p class="mer-footer__text">surveyed with heyi.am &middot; meridian template</p>
+    </footer>
+  </div>
+
+
+</div>

package/dist/render/templates/meridian/project.liquid

@@ -0,0 +1,376 @@
+<div class="heyiam-project meridian" data-render-version="2" data-template="meridian"{% if sessionBaseUrl %} data-session-base-url="{{ sessionBaseUrl }}"{% endif %} data-username="{{ user.username }}" data-project-slug="{{ project.slug }}">
+
+  {%- comment -%} Topographic contour background {%- endcomment -%}
+  <div class="topo-bg" aria-hidden="true">
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 900" preserveAspectRatio="xMidYMid slice">
+      <g class="topo-contours" fill="none" stroke-width="0.75">
+        <ellipse cx="350" cy="300" rx="280" ry="180" stroke="var(--mer-contour)" />
+        <ellipse cx="355" cy="305" rx="240" ry="150" stroke="var(--mer-contour)" />
+        <ellipse cx="360" cy="310" rx="200" ry="120" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="365" cy="315" rx="160" ry="90" stroke="var(--mer-contour)" />
+        <ellipse cx="370" cy="320" rx="120" ry="65" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="850" cy="550" rx="300" ry="200" stroke="var(--mer-contour)" />
+        <ellipse cx="845" cy="545" rx="250" ry="165" stroke="var(--mer-contour)" />
+        <ellipse cx="840" cy="540" rx="200" ry="130" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="835" cy="535" rx="150" ry="95" stroke="var(--mer-contour)" />
+        <ellipse cx="950" cy="150" rx="220" ry="140" stroke="var(--mer-contour)" />
+        <ellipse cx="955" cy="155" rx="170" ry="105" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="960" cy="160" rx="120" ry="70" stroke="var(--mer-contour)" />
+        <ellipse cx="150" cy="700" rx="250" ry="160" stroke="var(--mer-contour)" />
+        <ellipse cx="155" cy="695" rx="200" ry="125" stroke="var(--mer-contour-strong)" />
+        <ellipse cx="160" cy="690" rx="150" ry="90" stroke="var(--mer-contour)" />
+      </g>
+    </svg>
+  </div>
+
+  <a class="skip-link" href="#main-content">Skip to content</a>
+
+  <div class="mer-page">
+    <main id="main-content">
+
+      {%- comment -%} Breadcrumb {%- endcomment -%}
+      <nav class="breadcrumb" aria-label="Breadcrumb">
+        <a href="/{{ user.username }}">{{ user.username }}</a>
+        <span class="breadcrumb__sep">/</span>
+        <span aria-current="page">{{ project.slug }}</span>
+      </nav>
+
+      {%- comment -%} Hero {%- endcomment -%}
+      <section class="project-hero section-reveal" aria-label="Project overview">
+        <div class="section-label">
+          <span>&#167;01 &mdash; base camp</span>
+        </div>
+        <h1 class="project-hero__title" data-editable="title">{{ project.title }}</h1>
+        {% if project.repoUrl or project.projectUrl %}
+        <div class="project-hero__links">
+          {% if project.repoUrl %}
+          <a href="{{ project.repoUrl }}" target="_blank" rel="noopener">
+            <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22" stroke-linecap="round" stroke-linejoin="round"/></svg>
+            {{ project.repoUrl | stripProtocol }}
+          </a>
+          {% endif %}
+          {% if project.projectUrl %}
+          <a href="{{ project.projectUrl }}" target="_blank" rel="noopener">
+            <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14L21 3" stroke-linecap="round" stroke-linejoin="round"/></svg>
+            {{ project.projectUrl | stripProtocol }}
+          </a>
+          {% endif %}
+        </div>
+        {% endif %}
+      </section>
+
+      {%- comment -%} Screenshot {%- endcomment -%}
+      {% if project.screenshotUrl %}
+      <div class="screenshot section-reveal" role="img" aria-label="{{ project.title }} screenshot">
+        <div class="screenshot__chrome">
+          <span class="screenshot__dot"></span>
+          <span class="screenshot__dot"></span>
+          <span class="screenshot__dot"></span>
+          {% if project.projectUrl %}
+          <span class="screenshot__url">{{ project.projectUrl | stripProtocol }}</span>
+          {% endif %}
+        </div>
+        <div class="screenshot__body">
+          <img src="{{ project.screenshotUrl }}" alt="{{ project.title }} screenshot" style="width: 100%; height: 100%; object-fit: cover;">
+        </div>
+      </div>
+      {% endif %}
+
+      {%- comment -%} Stats {%- endcomment -%}
+      <section class="section-reveal" aria-label="Project statistics">
+        <div class="section-label">
+          <span>&#167;02 &mdash; survey data</span>
+        </div>
+        <div class="stats-row">
+          <div class="stat-cell" role="group" aria-label="Sessions">
+            <div class="stat-cell__coord">waypts</div>
+            <div class="stat-cell__value">{{ project.totalSessions }}</div>
+            <div class="stat-cell__label">sessions</div>
+          </div>
+          {% if efficiencyMultiplier %}
+          <div class="stat-cell stat-cell--leverage" role="group" aria-label="Leverage">
+            <div class="stat-cell__coord">leverage</div>
+            <div class="mer-leverage-nums">
+              <span><span class="mlev-val">{{ project.totalDurationMinutes | formatDuration }}</span> <span class="mlev-lbl">you</span></span>
+              <span><span class="mlev-val mlev-val--agent">{{ project.totalAgentDurationMinutes | formatDuration }}</span> <span class="mlev-lbl">agents</span></span>
+              <span><span class="mlev-val mlev-val--multi">{{ efficiencyMultiplier }}</span></span>
+            </div>
+            {% assign totalCombined = project.totalDurationMinutes | plus: project.totalAgentDurationMinutes %}
+            {% if totalCombined > 0 %}
+            {% assign humanPct = project.totalDurationMinutes | times: 100.0 | divided_by: totalCombined | round %}
+            {% assign agentPct = 100 | minus: humanPct %}
+            <div class="mer-leverage-bar">
+              <div class="mer-leverage-bar__human" style="width: {{ humanPct }}%"></div>
+              <div class="mer-leverage-bar__agent" style="width: {{ agentPct }}%"></div>
+            </div>
+            {% endif %}
+          </div>
+          {% else %}
+          <div class="stat-cell" role="group" aria-label="Duration">
+            <div class="stat-cell__coord">time</div>
+            <div class="stat-cell__value">{{ project.totalDurationMinutes | formatDuration }}</div>
+            <div class="stat-cell__label">total</div>
+          </div>
+          {% endif %}
+          <div class="stat-cell" role="group" aria-label="Lines of code">
+            <div class="stat-cell__coord">datum</div>
+            <div class="stat-cell__value">{{ project.totalLoc | localeNumber }}</div>
+            <div class="stat-cell__label">LOC</div>
+          </div>
+          <div class="stat-cell" role="group" aria-label="Files changed">
+            <div class="stat-cell__coord">feat</div>
+            <div class="stat-cell__value">{{ project.totalFilesChanged }}</div>
+            <div class="stat-cell__label">files</div>
+          </div>
+          {% if project.totalTokens %}
+          <div class="stat-cell" role="group" aria-label="Tokens used">
+            <div class="stat-cell__coord">flux</div>
+            <div class="stat-cell__value">{{ project.totalTokens | formatTokens }}</div>
+            <div class="stat-cell__label">tokens</div>
+          </div>
+          {% endif %}
+        </div>
+      </section>
+
+      {%- comment -%} Narrative {%- endcomment -%}
+      {% if project.narrative != blank %}
+      <section class="narrative section-reveal" aria-label="Project narrative">
+        <div class="section-label">
+          <span>&#167;03 &mdash; field notes</span>
+        </div>
+        <h2 class="section-heading">Narrative</h2>
+        <p>{{ project.narrative }}</p>
+      </section>
+      {% endif %}
+
+      {%- comment -%} Phases / Route {%- endcomment -%}
+      {% if arc.size > 0 %}
+      <section class="route-section section-reveal" aria-label="Project phases">
+        <div class="section-label">
+          <span>&#167;04 &mdash; route map</span>
+        </div>
+        <h2 class="section-heading">Phases</h2>
+        <div class="route" role="list">
+          {% for item in arc %}
+          <div class="route-waypoint" role="listitem">
+            <div class="route-waypoint__marker"><div class="route-waypoint__marker-dot"></div></div>
+            <div class="route-waypoint__phase">Phase {{ item.phase }} &mdash; {{ item.title }}</div>
+            <div class="route-waypoint__desc">{{ item.description }}</div>
+          </div>
+          {% endfor %}
+        </div>
+      </section>
+      {% endif %}
+
+      {%- comment -%} Elevation Profile (Work Timeline as CSS-only SVG) {%- endcomment -%}
+      {% if featuredSessions.size > 0 %}
+      <section class="elevation-section section-reveal" aria-label="Work timeline chart">
+        <div class="section-label">
+          <span>&#167;05 &mdash; elevation profile</span>
+        </div>
+        <h2 class="section-heading">Work Timeline</h2>
+        <div class="elevation-chart">
+          {% assign maxLoc = 0 %}
+          {% for s in featuredSessions %}
+            {% if s.locChanged > maxLoc %}{% assign maxLoc = s.locChanged %}{% endif %}
+          {% endfor %}
+          {% if maxLoc == 0 %}{% assign maxLoc = 1 %}{% endif %}
+          <svg viewBox="0 0 800 200" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Elevation-style chart showing lines of code per session">
+            <!-- Grid lines -->
+            <line x1="60" y1="20" x2="60" y2="170" stroke="var(--mer-border-subtle)" stroke-width="0.5"/>
+            <line x1="60" y1="170" x2="760" y2="170" stroke="var(--mer-border-subtle)" stroke-width="0.5"/>
+            <line x1="60" y1="120" x2="760" y2="120" stroke="var(--mer-border-subtle)" stroke-width="0.5" stroke-dasharray="4,4"/>
+            <line x1="60" y1="70" x2="760" y2="70" stroke="var(--mer-border-subtle)" stroke-width="0.5" stroke-dasharray="4,4"/>
+            <line x1="60" y1="20" x2="760" y2="20" stroke="var(--mer-border-subtle)" stroke-width="0.5" stroke-dasharray="4,4"/>
+
+            <!-- Y-axis labels -->
+            <text x="50" y="174" text-anchor="end" fill="var(--mer-text-muted)" font-family="IBM Plex Mono" font-size="9">0</text>
+            {% assign yMid = maxLoc | divided_by: 2 | round %}
+            <text x="50" y="124" text-anchor="end" fill="var(--mer-text-muted)" font-family="IBM Plex Mono" font-size="9">{{ yMid }}</text>
+            <text x="50" y="74" text-anchor="end" fill="var(--mer-text-muted)" font-family="IBM Plex Mono" font-size="9">{{ maxLoc }}</text>
+
+            <!-- Data points + line -->
+            {% assign chartW = 700 %}
+            {% assign chartH = 150 %}
+            {% assign sessCount = featuredSessions.size %}
+            {% assign points = "" %}
+            {% assign areaPath = "" %}
+            {% for s in featuredSessions %}
+              {% assign idx = forloop.index0 %}
+              {% if sessCount > 1 %}
+                {% assign xPos = idx | times: chartW | divided_by: sessCount | minus: 1 | plus: 87 %}
+              {% else %}
+                {% assign xPos = 410 %}
+              {% endif %}
+              {% assign locPct = s.locChanged | times: chartH | divided_by: maxLoc %}
+              {% assign yPos = 170 | minus: locPct %}
+              {% if forloop.first %}
+                {% assign points = points | append: xPos | append: "," | append: yPos %}
+                {% assign areaPath = "M " | append: xPos | append: " " | append: yPos %}
+              {% else %}
+                {% assign points = points | append: " " | append: xPos | append: "," | append: yPos %}
+                {% assign areaPath = areaPath | append: " L " | append: xPos | append: " " | append: yPos %}
+              {% endif %}
+              {% if forloop.last %}
+                {% assign areaPath = areaPath | append: " L " | append: xPos | append: " 170 L 87 170 Z" %}
+              {% endif %}
+            {% endfor %}
+
+            <path d="{{ areaPath }}" fill="url(#elevGradient)" opacity="0.3"/>
+            <polyline points="{{ points }}" fill="none" stroke="var(--mer-accent)" stroke-width="2.5" stroke-linejoin="round" stroke-linecap="round"/>
+
+            {% for s in featuredSessions %}
+              {% assign idx = forloop.index0 %}
+              {% if sessCount > 1 %}
+                {% assign xPos = idx | times: chartW | divided_by: sessCount | minus: 1 | plus: 87 %}
+              {% else %}
+                {% assign xPos = 410 %}
+              {% endif %}
+              {% assign locPct = s.locChanged | times: chartH | divided_by: maxLoc %}
+              {% assign yPos = 170 | minus: locPct %}
+              <circle cx="{{ xPos }}" cy="{{ yPos }}" r="4" fill="var(--mer-accent)"/>
+            {% endfor %}
+
+            <defs>
+              <linearGradient id="elevGradient" x1="0" y1="0" x2="0" y2="1">
+                <stop offset="0%" stop-color="var(--mer-accent)" stop-opacity="0.4"/>
+                <stop offset="100%" stop-color="var(--mer-accent)" stop-opacity="0"/>
+              </linearGradient>
+            </defs>
+          </svg>
+          <div class="elevation-chart__x-labels">
+            {% for s in featuredSessions %}
+            <span>S{{ forloop.index }} {{ s.recordedAt | formatDateShort }}</span>
+            {% endfor %}
+          </div>
+        </div>
+      </section>
+      {% endif %}
+
+      {%- comment -%} Sessions Table {%- endcomment -%}
+      {% if featuredSessions.size > 0 %}
+      <section class="sessions-section section-reveal" aria-label="All sessions">
+        <div class="section-label">
+          <span>&#167;06 &mdash; waypoint log</span>
+        </div>
+        <h2 class="section-heading">Sessions</h2>
+        <div class="session-table-wrap">
+          <table class="session-table">
+            <thead>
+              <tr>
+                <th scope="col">#</th>
+                <th scope="col">Title</th>
+                <th scope="col">Date</th>
+                <th scope="col">Duration</th>
+                <th scope="col">LOC</th>
+                <th scope="col">Source</th>
+              </tr>
+            </thead>
+            <tbody>
+              {% for s in featuredSessions %}
+              <tr>
+                <td>{{ forloop.index | prepend: '0' | slice: -2, 2 }}</td>
+                <td class="session-table__title-cell"><a href="{{ sessionBaseUrl }}/{{ s.slug }}{{ sessionSuffix }}">{{ s.title }}</a></td>
+                <td>{{ s.recordedAt | formatDateShort }}</td>
+                <td class="mono-val">{{ s.durationMinutes | formatDuration }}</td>
+                <td class="mono-val">{{ s.locChanged | localeNumber }}</td>
+                <td>{{ s.sourceTool }}</td>
+              </tr>
+              {% endfor %}
+            </tbody>
+          </table>
+        </div>
+      </section>
+      {% endif %}
+
+      {%- comment -%} Key Decisions {%- endcomment -%}
+      {% if arc.size > 0 %}
+      <section class="decisions-section section-reveal" aria-label="Key decisions">
+        <div class="section-label">
+          <span>&#167;07 &mdash; bearing marks</span>
+        </div>
+        <h2 class="section-heading">Key Decisions</h2>
+        <ol class="decision-list">
+          {% for item in arc %}
+          <li class="decision-item">{{ item.description }}</li>
+          {% endfor %}
+        </ol>
+      </section>
+      {% endif %}
+
+      {%- comment -%} Skills {%- endcomment -%}
+      {% if project.skills.size > 0 %}
+      <section class="skills-section section-reveal" aria-label="Skills used">
+        <div class="section-label">
+          <span>&#167;08 &mdash; instrument readings</span>
+        </div>
+        <h2 class="section-heading">Skills</h2>
+        <div class="skills-grid">
+          {% for skill in project.skills %}
+          <span class="skill-chip">{{ skill }}</span>
+          {% endfor %}
+        </div>
+      </section>
+      {% endif %}
+
+      {%- comment -%} Source Breakdown {%- endcomment -%}
+      {% if sourceCounts.size > 0 %}
+      <section class="source-section section-reveal" aria-label="Source breakdown">
+        <div class="section-label">
+          <span>&#167;09 &mdash; signal source</span>
+        </div>
+        <h2 class="section-heading">Source Breakdown</h2>
+        {% assign totalSourceSessions = 0 %}
+        {% for src in sourceCounts %}
+          {% assign totalSourceSessions = totalSourceSessions | plus: src.count %}
+        {% endfor %}
+        {% if totalSourceSessions > 0 %}
+        <div class="source-bar-large" role="img" aria-label="Source breakdown">
+          {% for src in sourceCounts %}
+          {% assign srcPct = src.count | times: 100.0 | divided_by: totalSourceSessions | round %}
+          <div class="source-bar-large__segment{% if forloop.first %} source-bar-large__segment--claude{% else %} source-bar-large__segment--cursor{% endif %}" style="width: {{ srcPct }}%"></div>
+          {% endfor %}
+        </div>
+        <div class="source-legend">
+          {% for src in sourceCounts %}
+          {% assign legendPct = src.count | times: 100.0 | divided_by: totalSourceSessions | round %}
+          <span><span class="source-legend__dot" style="background: {% if forloop.first %}var(--mer-accent){% else %}var(--mer-text-muted){% endif %}"></span>{{ src.tool }} &mdash; {{ legendPct }}% ({{ src.count }} session{% if src.count != 1 %}s{% endif %})</span>
+          {% endfor %}
+        </div>
+        {% endif %}
+      </section>
+      {% endif %}
+
+      {%- comment -%} Featured Sessions Cards {%- endcomment -%}
+      {% if featuredSessions.size > 0 %}
+      <section class="featured-section section-reveal" aria-label="Featured sessions">
+        <div class="section-label">
+          <span>&#167;10 &mdash; peak waypoints</span>
+        </div>
+        <h2 class="section-heading">Featured Sessions</h2>
+        <div class="featured-grid">
+          {% for s in featuredSessions %}
+          <article class="featured-card">
+            {% if s.skills.size > 0 %}
+            <div class="featured-card__tag">{{ s.skills | first }}</div>
+            {% endif %}
+            <h3 class="featured-card__title"><a href="{{ sessionBaseUrl }}/{{ s.slug }}{{ sessionSuffix }}">{{ s.title }}</a></h3>
+            <div class="featured-card__meta">
+              <span><strong>{{ s.durationMinutes | formatDuration }}</strong></span>
+              <span><strong>{{ s.locChanged | localeNumber }}</strong> LOC</span>
+              <span><strong>{{ s.filesChanged }}</strong> files</span>
+            </div>
+          </article>
+          {% endfor %}
+        </div>
+      </section>
+      {% endif %}
+    </main>
+
+    <footer class="mer-footer">
+      <p class="mer-footer__text">surveyed with heyi.am &middot; meridian template</p>
+    </footer>
+  </div>
+
+
+</div>