heyiam 0.2.28 → 0.3.0

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

@@ -0,0 +1,217 @@
+<div class="heyiam-portfolio daylight" data-render-version="2" data-template="daylight" data-username="{{ user.username }}">
+
+  {%- comment -%} Hero {%- endcomment -%}
+  {% if hasProfile %}
+  <section class="dl-hero dl-container dl-bounce" aria-label="Profile">
+    {% if user.photoUrl %}
+    <img src="{{ user.photoUrl }}" alt="{{ user.displayName }}" class="dl-hero-photo">
+    {% endif %}
+    {% if user.displayName != blank %}
+    <h1 class="dl-hero-name">{{ user.displayName }}</h1>
+    {% endif %}
+    {% if user.bio %}
+    <p class="dl-hero-bio">{{ user.bio }}</p>
+    {% endif %}
+    {% if user.location %}
+    <p class="dl-hero-location">{{ user.location }}</p>
+    {% endif %}
+    {% if user.email or user.linkedinUrl or user.githubUrl or user.twitterHandle or user.websiteUrl or user.resumeUrl %}
+    <ul class="dl-hero-links" 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" aria-hidden="true"><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.linkedinUrl %}
+      <li><a href="{{ user.linkedinUrl }}" target="_blank" rel="noopener"><svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><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 }}" target="_blank" rel="noopener"><svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><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 }}" target="_blank" rel="noopener"><svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><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 }}" target="_blank" rel="noopener"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><circle cx="12" cy="12" r="10"/><path d="M2 12h20M12 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 %}
+      {% if user.resumeUrl %}
+      <li><a href="{{ user.resumeUrl }}"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><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>Resume (PDF)</a></li>
+      {% endif %}
+    </ul>
+    {% endif %}
+  </section>
+  {% endif %}
+
+  <div class="dl-container">
+
+    {%- comment -%} Stats {%- endcomment -%}
+    <section class="dl-stats dl-bounce dl-delay-1" aria-label="Portfolio statistics">
+      <div class="dl-stat-card">
+        <span class="dl-stat-number" data-target="{{ projects.size }}">0</span>
+        <span class="dl-stat-label">Projects</span>
+      </div>
+      <div class="dl-stat-card">
+        <span class="dl-stat-number" data-target="{{ totalSessions }}">0</span>
+        <span class="dl-stat-label">Sessions</span>
+      </div>
+      <div class="dl-stat-card">
+        <span class="dl-stat-number" data-target="{{ totalLoc }}" data-format="comma">0</span>
+        <span class="dl-stat-label">Lines Changed</span>
+      </div>
+      {% if efficiencyMultiplier %}
+      <div class="dl-stat-card">
+        <span class="dl-stat-number">{{ efficiencyMultiplier }}</span>
+        <span class="dl-stat-label">Leverage</span>
+      </div>
+      {% else %}
+      <div class="dl-stat-card">
+        <span class="dl-stat-number">{{ totalDurationMinutes | formatDuration }}</span>
+        <span class="dl-stat-label">Total Time</span>
+      </div>
+      {% endif %}
+    </section>
+
+    {%- comment -%} Leverage Card {%- endcomment -%}
+    {% if efficiencyMultiplier %}
+    <div class="dl-leverage-card dl-bounce dl-delay-1" role="figure" aria-label="Time breakdown">
+      <div class="dl-leverage-card__title">Time Breakdown</div>
+      <svg width="96" height="96" viewBox="0 0 96 96">
+        <circle cx="48" cy="48" r="40" fill="none" stroke="rgba(14,165,233,0.12)" stroke-width="7"/>
+        {% assign totalCombined = totalDurationMinutes | plus: totalAgentDurationMinutes %}
+        {% if totalCombined > 0 %}
+        {% assign humanPct = totalDurationMinutes | times: 251 | divided_by: totalCombined %}
+        {% else %}
+        {% assign humanPct = 125 %}
+        {% endif %}
+        <circle cx="48" cy="48" r="40" fill="none" stroke="var(--dl-accent)" stroke-width="7" stroke-dasharray="{{ humanPct }} 251" stroke-dashoffset="-50" stroke-linecap="round"/>
+        <text x="48" y="44" text-anchor="middle" font-family="var(--dl-font-display)" font-size="18" font-weight="700" fill="var(--dl-accent)">{{ efficiencyMultiplier }}</text>
+        <text x="48" y="58" text-anchor="middle" font-family="var(--dl-font-mono)" font-size="8" fill="var(--dl-text-tertiary)">LEVERAGE</text>
+      </svg>
+      <div class="dl-leverage-card__values">
+        <div><span class="dl-leverage-card__num">{{ totalDurationMinutes | formatDuration }}</span><span class="dl-leverage-card__lbl">you</span></div>
+        <div><span class="dl-leverage-card__num" style="color:var(--dl-accent)">{{ totalAgentDurationMinutes | formatDuration }}</span><span class="dl-leverage-card__lbl">agents</span></div>
+      </div>
+    </div>
+    {% endif %}
+
+    {%- comment -%} Projects {%- endcomment -%}
+    {% if projects.size > 0 %}
+    <section aria-label="Projects" class="dl-bounce dl-delay-2">
+      <h2 class="dl-section-heading">Projects</h2>
+      <div class="dl-projects">
+        {% for p in projects %}
+        <article class="dl-project-card dl-bounce dl-delay-2">
+          <h3 class="dl-project-title">
+            <a href="/{{ user.username }}/{{ p.slug }}">{{ p.title }}</a>
+          </h3>
+          {% if p.narrative %}
+          <p class="dl-project-narrative">{{ p.narrative }}</p>
+          {% endif %}
+          <p class="dl-project-meta">
+            {{ p.totalSessions }} session{% if p.totalSessions != 1 %}s{% endif %} &middot; {{ p.totalDurationMinutes | formatDuration }} &middot; {{ p.totalLoc | localeNumber }} LOC
+          </p>
+          {% if p.skills.size > 0 %}
+          <div class="dl-project-skills">
+            {% for skill in p.skills %}
+            <span class="dl-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="dl-project-source">
+            {% assign pFirstPct = p.sourceCounts[0].count | times: 100.0 | divided_by: pTotalSrc | round %}
+            <span>{{ p.sourceCounts[0].tool }} {{ pFirstPct }}%</span>
+            <div class="dl-source-bar" role="img" aria-label="Source tool distribution">
+              <div class="dl-source-fill" style="width: {{ pFirstPct }}%"></div>
+            </div>
+            {% if p.sourceCounts.size > 1 %}
+            {% assign pSecondPct = p.sourceCounts[1].count | times: 100.0 | divided_by: pTotalSrc | round %}
+            <span>{{ p.sourceCounts[1].tool }} {{ pSecondPct }}%</span>
+            {% endif %}
+          </div>
+          {% endif %}
+          {% endif %}
+        </article>
+        {% endfor %}
+      </div>
+    </section>
+    {% endif %}
+
+    {%- comment -%} Activity Heatmap {%- endcomment -%}
+    {% if activityByDay.size > 0 %}
+    <section class="dl-activity-section dl-bounce dl-delay-3" aria-label="Activity overview">
+      <h2 class="dl-section-heading">Activity</h2>
+      <div class="dl-activity-chart">
+        <div class="dl-activity-title">Coding sessions over time</div>
+        <div class="dl-activity-grid" role="img" aria-label="Activity heatmap showing coding sessions over time">
+          {% for day in activityByDay %}
+          {% if day.count >= 4 %}{% assign level = 4 %}
+          {% elsif day.count >= 3 %}{% assign level = 3 %}
+          {% elsif day.count >= 2 %}{% assign level = 2 %}
+          {% elsif day.count >= 1 %}{% assign level = 1 %}
+          {% else %}{% assign level = 0 %}{% endif %}
+          <div class="dl-activity-cell" data-level="{{ level }}" title="{{ day.date }}: {{ day.count }} sessions"></div>
+          {% endfor %}
+        </div>
+        <div class="dl-activity-legend">
+          <span>Less</span>
+          <div class="dl-activity-legend-cell" data-level="0"></div>
+          <div class="dl-activity-legend-cell" data-level="1"></div>
+          <div class="dl-activity-legend-cell" data-level="2"></div>
+          <div class="dl-activity-legend-cell" data-level="3"></div>
+          <div class="dl-activity-legend-cell" data-level="4"></div>
+          <span>More</span>
+        </div>
+      </div>
+    </section>
+    {% endif %}
+
+    {%- comment -%} All Skills {%- endcomment -%}
+    {% if allSkills.size > 0 %}
+    <section class="dl-all-skills-section dl-bounce dl-delay-3" aria-label="All skills across projects">
+      <h2 class="dl-section-heading">Skills</h2>
+      <div class="dl-all-skills">
+        {% for skill in allSkills %}
+        <span class="dl-skill-chip-lg">{{ skill.name }} <span class="dl-skill-count">{{ skill.count }} project{% if skill.count != 1 %}s{% endif %}</span></span>
+        {% endfor %}
+      </div>
+    </section>
+    {% endif %}
+
+    {%- comment -%} Source Overview {%- endcomment -%}
+    {% if sourceCounts.size > 0 %}
+    <section class="dl-source-overview dl-bounce dl-delay-4" aria-label="Source tool breakdown">
+      <h2 class="dl-section-heading">Source Breakdown</h2>
+      {% assign totalSourceSessions = 0 %}
+      {% for src in sourceCounts %}{% assign totalSourceSessions = totalSourceSessions | plus: src.count %}{% endfor %}
+      <div class="dl-source-cards">
+        {% for src in sourceCounts %}
+        <div class="dl-source-card">
+          <div class="dl-source-card-name">{{ src.tool }}</div>
+          {% if totalSourceSessions > 0 %}
+          {% assign srcPct = src.count | times: 100.0 | divided_by: totalSourceSessions | round %}
+          <div class="dl-source-card-pct">{{ srcPct }}%</div>
+          {% endif %}
+          <div class="dl-source-card-sessions">{{ src.count }} session{% if src.count != 1 %}s{% endif %}</div>
+        </div>
+        {% endfor %}
+      </div>
+      {% if totalSourceSessions > 0 %}
+      {% assign firstSrcPct = sourceCounts[0].count | times: 100.0 | divided_by: totalSourceSessions | round %}
+      <div class="dl-source-bar-overview" role="img" aria-label="Source tool distribution">
+        <div class="dl-source-fill-overview" style="width: {{ firstSrcPct }}%"></div>
+      </div>
+      {% endif %}
+    </section>
+    {% endif %}
+
+    <footer class="dl-footer" role="contentinfo">
+      <p>Built with <a href="https://heyi.am">heyi.am</a> &middot; Daylight theme</p>
+    </footer>
+
+  </div>
+
+  {%- comment -%} Animations {%- endcomment -%}
+
+</div>

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

@@ -0,0 +1,229 @@
+<div class="heyiam-project daylight" data-render-version="2" data-template="daylight"{% if sessionBaseUrl %} data-session-base-url="{{ sessionBaseUrl }}"{% endif %} data-username="{{ user.username }}" data-project-slug="{{ project.slug }}">
+
+  <div class="dl-container">
+
+    {%- comment -%} Project Header {%- endcomment -%}
+    <header class="dl-project-header dl-bounce">
+      <h1 data-editable="title">{{ project.title }}</h1>
+      {% if project.repoUrl or project.projectUrl %}
+      <div class="dl-project-links">
+        {% if project.repoUrl %}
+        <a href="{{ project.repoUrl }}" target="_blank" rel="noopener">{{ project.repoUrl | stripProtocol }}</a>
+        {% endif %}
+        {% if project.projectUrl %}
+        <a href="{{ project.projectUrl }}" target="_blank" rel="noopener">{{ project.projectUrl | stripProtocol }}</a>
+        {% endif %}
+      </div>
+      {% endif %}
+    </header>
+
+    {%- comment -%} Screenshot {%- endcomment -%}
+    {% if project.screenshotUrl %}
+    <div class="dl-screenshot dl-bounce dl-delay-1" data-editable="screenshot">
+      <div class="dl-screenshot-bar">
+        <span class="dl-screenshot-dot"></span>
+        <span class="dl-screenshot-dot"></span>
+        <span class="dl-screenshot-dot"></span>
+      </div>
+      <div class="dl-screenshot-body">
+        <img src="{{ project.screenshotUrl }}" alt="{{ project.title }} screenshot">
+      </div>
+    </div>
+    {% endif %}
+
+    {%- comment -%} Narrative {%- endcomment -%}
+    {% if project.narrative %}
+    <section class="dl-narrative dl-bounce dl-delay-2" aria-label="Project narrative">
+      <h2 class="dl-section-heading">The Story</h2>
+      <p>{{ project.narrative }}</p>
+    </section>
+    {% endif %}
+
+    {%- comment -%} Stats {%- endcomment -%}
+    <section class="dl-stats-row dl-bounce dl-delay-1" aria-label="Project statistics">
+      <div class="dl-stat-card">
+        <span class="dl-stat-number" data-target="{{ project.totalSessions }}">0</span>
+        <span class="dl-stat-label">Sessions</span>
+      </div>
+      <div class="dl-stat-card">
+        <span class="dl-stat-number" data-target="{{ project.totalLoc }}" data-format="comma">0</span>
+        <span class="dl-stat-label">Lines Changed</span>
+      </div>
+      <div class="dl-stat-card">
+        <span class="dl-stat-number" data-target="{{ project.totalFilesChanged }}">0</span>
+        <span class="dl-stat-label">Files</span>
+      </div>
+      {% if project.totalTokens %}
+      <div class="dl-stat-card">
+        <span class="dl-stat-number">{{ project.totalTokens | formatTokens }}</span>
+        <span class="dl-stat-label">Tokens</span>
+      </div>
+      {% endif %}
+      {% if efficiencyMultiplier %}
+      <div class="dl-stat-card">
+        <span class="dl-stat-number">{{ efficiencyMultiplier }}</span>
+        <span class="dl-stat-label">Leverage</span>
+      </div>
+      {% endif %}
+    </section>
+
+    {%- comment -%} Leverage Card {%- endcomment -%}
+    {% if efficiencyMultiplier %}
+    <div class="dl-leverage-card dl-bounce dl-delay-1" role="figure" aria-label="Time breakdown">
+      <div class="dl-leverage-card__title">Time Breakdown</div>
+      <svg width="96" height="96" viewBox="0 0 96 96">
+        <circle cx="48" cy="48" r="40" fill="none" stroke="rgba(14,165,233,0.12)" stroke-width="7"/>
+        {% assign totalCombined = project.totalDurationMinutes | plus: project.totalAgentDurationMinutes %}
+        {% if totalCombined > 0 %}
+        {% assign humanPct = project.totalDurationMinutes | times: 251 | divided_by: totalCombined %}
+        {% else %}
+        {% assign humanPct = 125 %}
+        {% endif %}
+        <circle cx="48" cy="48" r="40" fill="none" stroke="var(--dl-accent)" stroke-width="7" stroke-dasharray="{{ humanPct }} 251" stroke-dashoffset="-50" stroke-linecap="round"/>
+        <text x="48" y="44" text-anchor="middle" font-family="var(--dl-font-display)" font-size="18" font-weight="700" fill="var(--dl-accent)">{{ efficiencyMultiplier }}</text>
+        <text x="48" y="58" text-anchor="middle" font-family="var(--dl-font-mono)" font-size="8" fill="var(--dl-text-tertiary)">LEVERAGE</text>
+      </svg>
+      <div class="dl-leverage-card__values">
+        <div><span class="dl-leverage-card__num">{{ project.totalDurationMinutes | formatDuration }}</span><span class="dl-leverage-card__lbl">you</span></div>
+        <div><span class="dl-leverage-card__num" style="color:var(--dl-accent)">{{ project.totalAgentDurationMinutes | formatDuration }}</span><span class="dl-leverage-card__lbl">agents</span></div>
+      </div>
+    </div>
+    {% endif %}
+
+    {%- comment -%} Work Timeline Chart (CSS-only bars matching mockup) {%- endcomment -%}
+    {% if featuredSessions.size > 0 %}
+    <section class="dl-chart-container dl-bounce dl-delay-2" aria-label="Work timeline">
+      <h2 class="dl-chart-title">Work Timeline</h2>
+      {% assign maxLoc = 1 %}
+      {% for s in featuredSessions %}
+        {% if s.locChanged > maxLoc %}{% assign maxLoc = s.locChanged %}{% endif %}
+      {% endfor %}
+      {% assign maxDur = 1 %}
+      {% for s in featuredSessions %}
+        {% if s.durationMinutes > maxDur %}{% assign maxDur = s.durationMinutes %}{% endif %}
+      {% endfor %}
+      <div class="dl-chart" role="img" aria-label="Bar chart showing lines of code and duration across {{ featuredSessions.size }} sessions">
+        {% for s in featuredSessions %}
+        <div class="dl-chart-bar-group">
+          {% assign locHeight = s.locChanged | times: 100 | divided_by: maxLoc %}
+          {% assign durHeight = s.durationMinutes | times: 100 | divided_by: maxDur %}
+          <div class="dl-chart-bar dl-chart-bar-loc" style="height: {{ locHeight }}%" title="{{ s.locChanged }} LOC"></div>
+          <div class="dl-chart-bar dl-chart-bar-duration" style="height: {{ durHeight }}%" title="{{ s.durationMinutes }}m"></div>
+          <span class="dl-chart-label">S{{ forloop.index }}</span>
+        </div>
+        {% endfor %}
+      </div>
+      <div class="dl-chart-legend">
+        <span><span class="dl-chart-legend-dot" style="background: var(--dl-accent)"></span>Lines of Code</span>
+        <span><span class="dl-chart-legend-dot" style="background: var(--dl-accent-green)"></span>Duration</span>
+      </div>
+    </section>
+    {% endif %}
+
+    {%- comment -%} Phases {%- endcomment -%}
+    {% if arc.size > 0 %}
+    <section class="dl-phases dl-bounce dl-delay-2" aria-label="Project phases">
+      <h2 class="dl-section-heading">Phases</h2>
+      <ol class="dl-phase-list" role="list">
+        {% for item in arc %}
+        <li class="dl-phase-item">
+          <span class="dl-phase-name">{{ item.title }}</span>
+          {% if item.dates %}
+          <span class="dl-phase-dates">{{ item.dates }}</span>
+          {% endif %}
+          <p class="dl-phase-desc">{{ item.description }}</p>
+        </li>
+        {% endfor %}
+      </ol>
+    </section>
+    {% endif %}
+
+    {%- comment -%} Skills {%- endcomment -%}
+    {% if project.skills.size > 0 %}
+    <section class="dl-skills-section dl-bounce dl-delay-3" aria-label="Skills used">
+      <h2 class="dl-section-heading">Skills</h2>
+      <div class="dl-skill-chips">
+        {% for skill in project.skills %}
+        <span class="dl-skill-chip">{{ skill }}</span>
+        {% endfor %}
+      </div>
+    </section>
+    {% endif %}
+
+    {%- comment -%} Key Decisions {%- endcomment -%}
+    {% if arc.size > 0 %}
+    <section class="dl-decisions dl-bounce dl-delay-3" aria-label="Key decisions">
+      <h2 class="dl-section-heading">Key Decisions</h2>
+      <ol class="dl-decision-list">
+        {% for item in arc %}
+        <li class="dl-decision-item">{{ item.description }}</li>
+        {% endfor %}
+      </ol>
+    </section>
+    {% endif %}
+
+    {%- comment -%} Source Breakdown {%- endcomment -%}
+    {% if sourceCounts.size > 0 %}
+    <section class="dl-source-section dl-bounce dl-delay-3" aria-label="Source breakdown">
+      <h2 class="dl-section-heading">Source Breakdown</h2>
+      {% assign totalSourceSessions = 0 %}
+      {% for src in sourceCounts %}
+        {% assign totalSourceSessions = totalSourceSessions | plus: src.count %}
+      {% endfor %}
+      <div class="dl-source-breakdown">
+        {% if totalSourceSessions > 0 %}
+        {% assign firstPct = sourceCounts[0].count | times: 100.0 | divided_by: totalSourceSessions | round %}
+        <div class="dl-source-bar-large" role="img" aria-label="Source tool distribution">
+          <div class="dl-source-fill-large" style="width: {{ firstPct }}%"></div>
+        </div>
+        {% endif %}
+        <div class="dl-source-labels">
+          {% for src in sourceCounts %}
+          {% if totalSourceSessions > 0 %}
+          {% assign srcPct = src.count | times: 100.0 | divided_by: totalSourceSessions | round %}
+          <span>{{ src.tool }} {{ srcPct }}% ({{ src.count }} session{% if src.count != 1 %}s{% endif %})</span>
+          {% else %}
+          <span>{{ src.tool }} ({{ src.count }} session{% if src.count != 1 %}s{% endif %})</span>
+          {% endif %}
+          {% endfor %}
+        </div>
+      </div>
+    </section>
+    {% endif %}
+
+    {%- comment -%} Featured Sessions {%- endcomment -%}
+    {% if featuredSessions.size > 0 %}
+    <section class="dl-sessions-section dl-bounce dl-delay-4" aria-label="Featured sessions">
+      <h2 class="dl-section-heading">Sessions</h2>
+      <div class="dl-session-grid">
+        {% assign agent_colors = '#0891b2,#059669,#7c3aed,#475569,#e11d48,#d97706' | split: ',' %}
+        {% for s in featuredSessions %}
+        <article class="dl-session-card">
+          {% if s.skills.size > 0 %}
+          <span class="dl-session-card-tag">{{ s.skills | first }}</span>
+          {% endif %}
+          <h3 class="dl-session-card-title"><a href="{{ sessionBaseUrl }}/{{ s.slug }}{{ sessionSuffix }}">{{ s.title }}</a></h3>
+          <p class="dl-session-card-meta">{{ s.durationMinutes | formatDuration }} &middot; {{ s.locChanged | localeNumber }} LOC{% if s.agentSummary %} &middot; {{ s.agentSummary.agents.size }} agents{% endif %}</p>
+          {% if s.agentSummary %}
+          <div class="dl-session-card-agents" aria-label="{{ s.agentSummary.agents.size }} agents used">
+            {% for agent in s.agentSummary.agents %}
+            {% assign colorIdx = forloop.index0 | modulo: 6 %}
+            <span class="dl-agent-dot" style="background: {{ agent_colors[colorIdx] }}" title="{{ agent.role }}"></span>
+            {% endfor %}
+          </div>
+          {% endif %}
+        </article>
+        {% endfor %}
+      </div>
+    </section>
+    {% endif %}
+
+    <footer class="dl-footer" role="contentinfo">
+      <p>Built with <a href="https://heyi.am">heyi.am</a> &middot; Daylight theme</p>
+    </footer>
+
+  </div>
+
+  {%- comment -%} Animations {%- endcomment -%}
+
+</div>