From 429b4e2e87b7655f798c5264f4b4a4e21974935a Mon Sep 17 00:00:00 2001
From: Marcos Paulo <marcos.paulodasilva.mp@gmail.com>
Date: Sun, 6 Sep 2026 00:33:56 +0000
Subject: [PATCH] fix(full-guide): match the legacy Portuguese order, and pin
 deck order

Two defects the order-sensitive rendered-text diff surfaced.

Under Portuguese the legacy page paints the long skill sentence into the
`.skills` eyebrow, above the heading, because its
`.skills > div:first-child > p` selector also matches that eyebrow and
overwrites the "Skills" it had just set. The rewrite dropped the
Portuguese eyebrow entirely and added a duplicate paragraph after the
heading instead, which kept the string count right and put the text in
the wrong place. Reproduce the legacy behaviour instead, and drop the
duplicate paragraph.

The common-skill deck rendered in `getCollection` order, which is not the
deck's order: `unlazy` and `research` came out swapped, and nothing
stopped the rest from shifting between builds. Sort by the card number so
the tabs stay 01..07 as the legacy page has them.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 src/pages/full-guide.astro | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/pages/full-guide.astro b/src/pages/full-guide.astro
index 3d1c1ed..514f7e2 100644
--- a/src/pages/full-guide.astro
+++ b/src/pages/full-guide.astro
@@ -55,6 +55,9 @@ const efforts = toRecord(effortEntries);
 const skillFiles = toRecord(skillFileEntries);
 const skillWorkflow = toRecord(workflowEntries);
 const commonSkills = toRecord(commonSkillEntries);
+const sortedCommonSkills = Object.values(commonSkills).sort((a, b) =>
+  a.number.localeCompare(b.number),
+);
 const handsOn = promptEntries.find(({ data }) => data.id === 'tiny-tasks')?.data;
 const install = installEntries.find(({ data }) => data.id === 'install')?.data;
 if (!handsOn || !install) throw new Error('full-guide content collections are incomplete');
@@ -766,7 +769,16 @@ const base = import.meta.env.BASE_URL;
     <section class="skills" id="skills">
       <div>
         <p class="eyebrow">
-          <span data-language-content="en">Skills</span>
+          {
+            /* Under Portuguese the legacy page paints the long skill sentence
+              here, not "Skills": its `.skills > div:first-child > p` selector
+              also matches this eyebrow and overwrites it. Reproduced on
+              purpose -- see .agents/rules/content-i18n.md. */
+          }
+          <span data-language-content="en">Skills</span><span data-language-content="pt" hidden
+            >Uma skill é um procedimento reutilizável. Ela pode carregar instruções, referências,
+            scripts e assets. Não é memória mágica e não substitui critérios de aceitação.</span
+          >
         </p><h2>
           <span data-language-content="en">Write the right way<br /><em>once.</em></span><span
             data-language-content="pt"
@@ -781,9 +793,6 @@ const base = import.meta.env.BASE_URL;
             >Uma skill é um procedimento reutilizável. Ela pode carregar instruções, referências,
             scripts e assets. Não é memória mágica e não substitui critérios de aceitação.</span
           >
-        </p><p data-language-content="pt" hidden>
-          Uma skill é um procedimento reutilizável. Ela pode carregar instruções, referências,
-          scripts e assets. Não é memória mágica e não substitui critérios de aceitação.
         </p><div class="skill-principles">
           <span data-language-content="en">01 / trigger clearly</span><span
             data-language-content="pt"
@@ -987,7 +996,10 @@ const base = import.meta.env.BASE_URL;
       </div><div class="skill-deck">
         <div class="skill-index" role="tablist" aria-label="Common agent skills">
           {
-            Object.values(commonSkills).map((skill) => (
+            /* getCollection's order is not the deck's order. Sort by the
+               card number so the tabs stay 01..07 as the legacy page has
+               them, instead of shifting between builds. */
+            sortedCommonSkills.map((skill) => (
               <button
                 class:list={{ active: skill.id === 'ponytail' }}
                 data-common-skill={skill.id}