feat(freelancer-directory): full-text search, OCA/projects/language filters, standardised languages

- Search box: substring, case- and accent-insensitive, over Name, description,
  Focus, specialities and language names; combines with every filter (AND).
- Filters: OCA membership (any / member / not a member), Language (canonical
  names only), plus Country/Speciality; a project MINIMUM ('N+ projects'),
  rendered only when a threshold can narrow the list.
- Languages standardised: a closed ISO 639-1 checklist on both forms, with the
  proficiency as a SEPARATE axis (language_levels, 'Spanish:beginner'). A stored
  'Spanish - beginners' now maps to the language 'Spanish' and never becomes a
  filter option.
- Fix: .dev-card/.dir-filters set display, which beat the UA [hidden] rule, so
  filtered-out cards and the JS-off filter bar stayed visible.
- Deterministic order by Name (the endpoint's order alternates between reads).
- Card states plainly that a photo shows only when it is a link (the stored
  value is base64 and is not rendered); admin Image field says the same.
- specialities stays free text.

odoo-community-developers/admin/index.html

@@ -115,6 +115,50 @@
         color: var(--ink);
         width: 100%;
       }
+      /* The standardised language multi-select: a closed, scrollable checklist. The
+         level <select> appears beside a language only once it is checked — pure CSS. */
+      .lang-field {
+        min-width: 0;
+        border: 1px solid var(--line);
+        border-radius: var(--radius);
+        padding: 0.85rem 0.9rem 0.6rem;
+      }
+      .lang-field legend {
+        font-size: 0.8rem;
+        font-weight: 600;
+        color: var(--midnight);
+        padding: 0 0.35rem;
+      }
+      .lang-list {
+        display: flex;
+        flex-direction: column;
+        gap: 0.25rem;
+        max-height: 220px;
+        overflow: auto;
+        padding-right: 0.35rem;
+      }
+      .lang-pick {
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+        font-size: 0.88rem;
+        color: var(--ink);
+      }
+      .lang-pick input {
+        width: auto;
+        margin: 0;
+        flex-shrink: 0;
+      }
+      .lang-pick .lang-level {
+        display: none;
+        width: auto;
+        max-width: 9rem;
+        padding: 0.25rem 0.4rem;
+        font-size: 0.8rem;
+      }
+      .lang-pick input:checked ~ .lang-level {
+        display: inline-block;
+      }
       .form-check {
         grid-column: 1 / -1;
         display: flex;
@@ -506,11 +550,128 @@
               <input id="adVersions" name="odoo_versions" type="text" />
               <span class="hint">Separate with commas.</span>
             </div>
-            <div class="form-field">
+            <fieldset class="form-field full lang-field">
-              <label for="adLanguages">Languages</label>
+              <legend>Languages</legend>
-              <input id="adLanguages" name="languages" type="text" />
+              <div class="lang-list" id="adLanguages">
-              <span class="hint">Separate with commas.</span>
+                <!-- LANGUAGE-OPTIONS-START -->
-            </div>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-afrikaans" name="languages" value="Afrikaans" /><label for="ad-lang-afrikaans">Afrikaans</label><select class="lang-level" name="language_level" data-language="Afrikaans" aria-label="Level in Afrikaans"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-amharic" name="languages" value="Amharic" /><label for="ad-lang-amharic">Amharic</label><select class="lang-level" name="language_level" data-language="Amharic" aria-label="Level in Amharic"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-arabic" name="languages" value="Arabic" /><label for="ad-lang-arabic">Arabic</label><select class="lang-level" name="language_level" data-language="Arabic" aria-label="Level in Arabic"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-aymara" name="languages" value="Aymara" /><label for="ad-lang-aymara">Aymara</label><select class="lang-level" name="language_level" data-language="Aymara" aria-label="Level in Aymara"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-azerbaijani" name="languages" value="Azerbaijani" /><label for="ad-lang-azerbaijani">Azerbaijani</label><select class="lang-level" name="language_level" data-language="Azerbaijani" aria-label="Level in Azerbaijani"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-belarusian" name="languages" value="Belarusian" /><label for="ad-lang-belarusian">Belarusian</label><select class="lang-level" name="language_level" data-language="Belarusian" aria-label="Level in Belarusian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-bulgarian" name="languages" value="Bulgarian" /><label for="ad-lang-bulgarian">Bulgarian</label><select class="lang-level" name="language_level" data-language="Bulgarian" aria-label="Level in Bulgarian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-bislama" name="languages" value="Bislama" /><label for="ad-lang-bislama">Bislama</label><select class="lang-level" name="language_level" data-language="Bislama" aria-label="Level in Bislama"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-bengali" name="languages" value="Bengali" /><label for="ad-lang-bengali">Bengali</label><select class="lang-level" name="language_level" data-language="Bengali" aria-label="Level in Bengali"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-bosnian" name="languages" value="Bosnian" /><label for="ad-lang-bosnian">Bosnian</label><select class="lang-level" name="language_level" data-language="Bosnian" aria-label="Level in Bosnian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-catalan" name="languages" value="Catalan" /><label for="ad-lang-catalan">Catalan</label><select class="lang-level" name="language_level" data-language="Catalan" aria-label="Level in Catalan"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-chamorro" name="languages" value="Chamorro" /><label for="ad-lang-chamorro">Chamorro</label><select class="lang-level" name="language_level" data-language="Chamorro" aria-label="Level in Chamorro"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-czech" name="languages" value="Czech" /><label for="ad-lang-czech">Czech</label><select class="lang-level" name="language_level" data-language="Czech" aria-label="Level in Czech"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-danish" name="languages" value="Danish" /><label for="ad-lang-danish">Danish</label><select class="lang-level" name="language_level" data-language="Danish" aria-label="Level in Danish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-german" name="languages" value="German" /><label for="ad-lang-german">German</label><select class="lang-level" name="language_level" data-language="German" aria-label="Level in German"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-divehi" name="languages" value="Divehi" /><label for="ad-lang-divehi">Divehi</label><select class="lang-level" name="language_level" data-language="Divehi" aria-label="Level in Divehi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-dzongkha" name="languages" value="Dzongkha" /><label for="ad-lang-dzongkha">Dzongkha</label><select class="lang-level" name="language_level" data-language="Dzongkha" aria-label="Level in Dzongkha"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-greek" name="languages" value="Greek" /><label for="ad-lang-greek">Greek</label><select class="lang-level" name="language_level" data-language="Greek" aria-label="Level in Greek"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-english" name="languages" value="English" /><label for="ad-lang-english">English</label><select class="lang-level" name="language_level" data-language="English" aria-label="Level in English"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-spanish" name="languages" value="Spanish" /><label for="ad-lang-spanish">Spanish</label><select class="lang-level" name="language_level" data-language="Spanish" aria-label="Level in Spanish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-estonian" name="languages" value="Estonian" /><label for="ad-lang-estonian">Estonian</label><select class="lang-level" name="language_level" data-language="Estonian" aria-label="Level in Estonian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-basque" name="languages" value="Basque" /><label for="ad-lang-basque">Basque</label><select class="lang-level" name="language_level" data-language="Basque" aria-label="Level in Basque"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-persian" name="languages" value="Persian" /><label for="ad-lang-persian">Persian</label><select class="lang-level" name="language_level" data-language="Persian" aria-label="Level in Persian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-peul" name="languages" value="Peul" /><label for="ad-lang-peul">Peul</label><select class="lang-level" name="language_level" data-language="Peul" aria-label="Level in Peul"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-finnish" name="languages" value="Finnish" /><label for="ad-lang-finnish">Finnish</label><select class="lang-level" name="language_level" data-language="Finnish" aria-label="Level in Finnish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-fijian" name="languages" value="Fijian" /><label for="ad-lang-fijian">Fijian</label><select class="lang-level" name="language_level" data-language="Fijian" aria-label="Level in Fijian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-faroese" name="languages" value="Faroese" /><label for="ad-lang-faroese">Faroese</label><select class="lang-level" name="language_level" data-language="Faroese" aria-label="Level in Faroese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-french" name="languages" value="French" /><label for="ad-lang-french">French</label><select class="lang-level" name="language_level" data-language="French" aria-label="Level in French"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-irish" name="languages" value="Irish" /><label for="ad-lang-irish">Irish</label><select class="lang-level" name="language_level" data-language="Irish" aria-label="Level in Irish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-galician" name="languages" value="Galician" /><label for="ad-lang-galician">Galician</label><select class="lang-level" name="language_level" data-language="Galician" aria-label="Level in Galician"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-guarani" name="languages" value="Guarani" /><label for="ad-lang-guarani">Guarani</label><select class="lang-level" name="language_level" data-language="Guarani" aria-label="Level in Guarani"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-manx" name="languages" value="Manx" /><label for="ad-lang-manx">Manx</label><select class="lang-level" name="language_level" data-language="Manx" aria-label="Level in Manx"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-hebrew" name="languages" value="Hebrew" /><label for="ad-lang-hebrew">Hebrew</label><select class="lang-level" name="language_level" data-language="Hebrew" aria-label="Level in Hebrew"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-hindi" name="languages" value="Hindi" /><label for="ad-lang-hindi">Hindi</label><select class="lang-level" name="language_level" data-language="Hindi" aria-label="Level in Hindi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-croatian" name="languages" value="Croatian" /><label for="ad-lang-croatian">Croatian</label><select class="lang-level" name="language_level" data-language="Croatian" aria-label="Level in Croatian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-haitian" name="languages" value="Haitian" /><label for="ad-lang-haitian">Haitian</label><select class="lang-level" name="language_level" data-language="Haitian" aria-label="Level in Haitian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-hungarian" name="languages" value="Hungarian" /><label for="ad-lang-hungarian">Hungarian</label><select class="lang-level" name="language_level" data-language="Hungarian" aria-label="Level in Hungarian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-armenian" name="languages" value="Armenian" /><label for="ad-lang-armenian">Armenian</label><select class="lang-level" name="language_level" data-language="Armenian" aria-label="Level in Armenian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-indonesian" name="languages" value="Indonesian" /><label for="ad-lang-indonesian">Indonesian</label><select class="lang-level" name="language_level" data-language="Indonesian" aria-label="Level in Indonesian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-icelandic" name="languages" value="Icelandic" /><label for="ad-lang-icelandic">Icelandic</label><select class="lang-level" name="language_level" data-language="Icelandic" aria-label="Level in Icelandic"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-italian" name="languages" value="Italian" /><label for="ad-lang-italian">Italian</label><select class="lang-level" name="language_level" data-language="Italian" aria-label="Level in Italian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-japanese" name="languages" value="Japanese" /><label for="ad-lang-japanese">Japanese</label><select class="lang-level" name="language_level" data-language="Japanese" aria-label="Level in Japanese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-georgian" name="languages" value="Georgian" /><label for="ad-lang-georgian">Georgian</label><select class="lang-level" name="language_level" data-language="Georgian" aria-label="Level in Georgian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-kongo" name="languages" value="Kongo" /><label for="ad-lang-kongo">Kongo</label><select class="lang-level" name="language_level" data-language="Kongo" aria-label="Level in Kongo"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-kazakh" name="languages" value="Kazakh" /><label for="ad-lang-kazakh">Kazakh</label><select class="lang-level" name="language_level" data-language="Kazakh" aria-label="Level in Kazakh"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-greenlandic" name="languages" value="Greenlandic" /><label for="ad-lang-greenlandic">Greenlandic</label><select class="lang-level" name="language_level" data-language="Greenlandic" aria-label="Level in Greenlandic"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-cambodian" name="languages" value="Cambodian" /><label for="ad-lang-cambodian">Cambodian</label><select class="lang-level" name="language_level" data-language="Cambodian" aria-label="Level in Cambodian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-korean" name="languages" value="Korean" /><label for="ad-lang-korean">Korean</label><select class="lang-level" name="language_level" data-language="Korean" aria-label="Level in Korean"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-kurdish" name="languages" value="Kurdish" /><label for="ad-lang-kurdish">Kurdish</label><select class="lang-level" name="language_level" data-language="Kurdish" aria-label="Level in Kurdish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-kyrgyz" name="languages" value="Kyrgyz" /><label for="ad-lang-kyrgyz">Kyrgyz</label><select class="lang-level" name="language_level" data-language="Kyrgyz" aria-label="Level in Kyrgyz"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-latin" name="languages" value="Latin" /><label for="ad-lang-latin">Latin</label><select class="lang-level" name="language_level" data-language="Latin" aria-label="Level in Latin"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-luxembourgish" name="languages" value="Luxembourgish" /><label for="ad-lang-luxembourgish">Luxembourgish</label><select class="lang-level" name="language_level" data-language="Luxembourgish" aria-label="Level in Luxembourgish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-lingala" name="languages" value="Lingala" /><label for="ad-lang-lingala">Lingala</label><select class="lang-level" name="language_level" data-language="Lingala" aria-label="Level in Lingala"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-laotian" name="languages" value="Laotian" /><label for="ad-lang-laotian">Laotian</label><select class="lang-level" name="language_level" data-language="Laotian" aria-label="Level in Laotian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-lithuanian" name="languages" value="Lithuanian" /><label for="ad-lang-lithuanian">Lithuanian</label><select class="lang-level" name="language_level" data-language="Lithuanian" aria-label="Level in Lithuanian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-luba-katanga" name="languages" value="Luba-Katanga" /><label for="ad-lang-luba-katanga">Luba-Katanga</label><select class="lang-level" name="language_level" data-language="Luba-Katanga" aria-label="Level in Luba-Katanga"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-latvian" name="languages" value="Latvian" /><label for="ad-lang-latvian">Latvian</label><select class="lang-level" name="language_level" data-language="Latvian" aria-label="Level in Latvian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-malagasy" name="languages" value="Malagasy" /><label for="ad-lang-malagasy">Malagasy</label><select class="lang-level" name="language_level" data-language="Malagasy" aria-label="Level in Malagasy"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-marshallese" name="languages" value="Marshallese" /><label for="ad-lang-marshallese">Marshallese</label><select class="lang-level" name="language_level" data-language="Marshallese" aria-label="Level in Marshallese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-maori" name="languages" value="Maori" /><label for="ad-lang-maori">Maori</label><select class="lang-level" name="language_level" data-language="Maori" aria-label="Level in Maori"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-macedonian" name="languages" value="Macedonian" /><label for="ad-lang-macedonian">Macedonian</label><select class="lang-level" name="language_level" data-language="Macedonian" aria-label="Level in Macedonian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-mongolian" name="languages" value="Mongolian" /><label for="ad-lang-mongolian">Mongolian</label><select class="lang-level" name="language_level" data-language="Mongolian" aria-label="Level in Mongolian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-malay" name="languages" value="Malay" /><label for="ad-lang-malay">Malay</label><select class="lang-level" name="language_level" data-language="Malay" aria-label="Level in Malay"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-maltese" name="languages" value="Maltese" /><label for="ad-lang-maltese">Maltese</label><select class="lang-level" name="language_level" data-language="Maltese" aria-label="Level in Maltese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-burmese" name="languages" value="Burmese" /><label for="ad-lang-burmese">Burmese</label><select class="lang-level" name="language_level" data-language="Burmese" aria-label="Level in Burmese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-nauruan" name="languages" value="Nauruan" /><label for="ad-lang-nauruan">Nauruan</label><select class="lang-level" name="language_level" data-language="Nauruan" aria-label="Level in Nauruan"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-norwegian-bokmål" name="languages" value="Norwegian Bokmål" /><label for="ad-lang-norwegian-bokmål">Norwegian Bokmål</label><select class="lang-level" name="language_level" data-language="Norwegian Bokmål" aria-label="Level in Norwegian Bokmål"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-north-ndebele" name="languages" value="North Ndebele" /><label for="ad-lang-north-ndebele">North Ndebele</label><select class="lang-level" name="language_level" data-language="North Ndebele" aria-label="Level in North Ndebele"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-nepali" name="languages" value="Nepali" /><label for="ad-lang-nepali">Nepali</label><select class="lang-level" name="language_level" data-language="Nepali" aria-label="Level in Nepali"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-dutch" name="languages" value="Dutch" /><label for="ad-lang-dutch">Dutch</label><select class="lang-level" name="language_level" data-language="Dutch" aria-label="Level in Dutch"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-norwegian-nynorsk" name="languages" value="Norwegian Nynorsk" /><label for="ad-lang-norwegian-nynorsk">Norwegian Nynorsk</label><select class="lang-level" name="language_level" data-language="Norwegian Nynorsk" aria-label="Level in Norwegian Nynorsk"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-norwegian" name="languages" value="Norwegian" /><label for="ad-lang-norwegian">Norwegian</label><select class="lang-level" name="language_level" data-language="Norwegian" aria-label="Level in Norwegian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-south-ndebele" name="languages" value="South Ndebele" /><label for="ad-lang-south-ndebele">South Ndebele</label><select class="lang-level" name="language_level" data-language="South Ndebele" aria-label="Level in South Ndebele"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-chichewa" name="languages" value="Chichewa" /><label for="ad-lang-chichewa">Chichewa</label><select class="lang-level" name="language_level" data-language="Chichewa" aria-label="Level in Chichewa"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-occitan" name="languages" value="Occitan" /><label for="ad-lang-occitan">Occitan</label><select class="lang-level" name="language_level" data-language="Occitan" aria-label="Level in Occitan"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-panjabi-/-punjabi" name="languages" value="Panjabi / Punjabi" /><label for="ad-lang-panjabi-/-punjabi">Panjabi / Punjabi</label><select class="lang-level" name="language_level" data-language="Panjabi / Punjabi" aria-label="Level in Panjabi / Punjabi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-polish" name="languages" value="Polish" /><label for="ad-lang-polish">Polish</label><select class="lang-level" name="language_level" data-language="Polish" aria-label="Level in Polish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-pashto" name="languages" value="Pashto" /><label for="ad-lang-pashto">Pashto</label><select class="lang-level" name="language_level" data-language="Pashto" aria-label="Level in Pashto"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-portuguese" name="languages" value="Portuguese" /><label for="ad-lang-portuguese">Portuguese</label><select class="lang-level" name="language_level" data-language="Portuguese" aria-label="Level in Portuguese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-quechua" name="languages" value="Quechua" /><label for="ad-lang-quechua">Quechua</label><select class="lang-level" name="language_level" data-language="Quechua" aria-label="Level in Quechua"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-kirundi" name="languages" value="Kirundi" /><label for="ad-lang-kirundi">Kirundi</label><select class="lang-level" name="language_level" data-language="Kirundi" aria-label="Level in Kirundi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-romanian" name="languages" value="Romanian" /><label for="ad-lang-romanian">Romanian</label><select class="lang-level" name="language_level" data-language="Romanian" aria-label="Level in Romanian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-russian" name="languages" value="Russian" /><label for="ad-lang-russian">Russian</label><select class="lang-level" name="language_level" data-language="Russian" aria-label="Level in Russian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-rwandi" name="languages" value="Rwandi" /><label for="ad-lang-rwandi">Rwandi</label><select class="lang-level" name="language_level" data-language="Rwandi" aria-label="Level in Rwandi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-sango" name="languages" value="Sango" /><label for="ad-lang-sango">Sango</label><select class="lang-level" name="language_level" data-language="Sango" aria-label="Level in Sango"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-sinhalese" name="languages" value="Sinhalese" /><label for="ad-lang-sinhalese">Sinhalese</label><select class="lang-level" name="language_level" data-language="Sinhalese" aria-label="Level in Sinhalese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-slovak" name="languages" value="Slovak" /><label for="ad-lang-slovak">Slovak</label><select class="lang-level" name="language_level" data-language="Slovak" aria-label="Level in Slovak"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-slovenian" name="languages" value="Slovenian" /><label for="ad-lang-slovenian">Slovenian</label><select class="lang-level" name="language_level" data-language="Slovenian" aria-label="Level in Slovenian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-samoan" name="languages" value="Samoan" /><label for="ad-lang-samoan">Samoan</label><select class="lang-level" name="language_level" data-language="Samoan" aria-label="Level in Samoan"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-shona" name="languages" value="Shona" /><label for="ad-lang-shona">Shona</label><select class="lang-level" name="language_level" data-language="Shona" aria-label="Level in Shona"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-somalia" name="languages" value="Somalia" /><label for="ad-lang-somalia">Somalia</label><select class="lang-level" name="language_level" data-language="Somalia" aria-label="Level in Somalia"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-albanian" name="languages" value="Albanian" /><label for="ad-lang-albanian">Albanian</label><select class="lang-level" name="language_level" data-language="Albanian" aria-label="Level in Albanian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-serbian" name="languages" value="Serbian" /><label for="ad-lang-serbian">Serbian</label><select class="lang-level" name="language_level" data-language="Serbian" aria-label="Level in Serbian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-swati" name="languages" value="Swati" /><label for="ad-lang-swati">Swati</label><select class="lang-level" name="language_level" data-language="Swati" aria-label="Level in Swati"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-southern-sotho" name="languages" value="Southern Sotho" /><label for="ad-lang-southern-sotho">Southern Sotho</label><select class="lang-level" name="language_level" data-language="Southern Sotho" aria-label="Level in Southern Sotho"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-swedish" name="languages" value="Swedish" /><label for="ad-lang-swedish">Swedish</label><select class="lang-level" name="language_level" data-language="Swedish" aria-label="Level in Swedish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-swahili" name="languages" value="Swahili" /><label for="ad-lang-swahili">Swahili</label><select class="lang-level" name="language_level" data-language="Swahili" aria-label="Level in Swahili"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-tamil" name="languages" value="Tamil" /><label for="ad-lang-tamil">Tamil</label><select class="lang-level" name="language_level" data-language="Tamil" aria-label="Level in Tamil"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-tajik" name="languages" value="Tajik" /><label for="ad-lang-tajik">Tajik</label><select class="lang-level" name="language_level" data-language="Tajik" aria-label="Level in Tajik"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-thai" name="languages" value="Thai" /><label for="ad-lang-thai">Thai</label><select class="lang-level" name="language_level" data-language="Thai" aria-label="Level in Thai"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-tigrinya" name="languages" value="Tigrinya" /><label for="ad-lang-tigrinya">Tigrinya</label><select class="lang-level" name="language_level" data-language="Tigrinya" aria-label="Level in Tigrinya"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-turkmen" name="languages" value="Turkmen" /><label for="ad-lang-turkmen">Turkmen</label><select class="lang-level" name="language_level" data-language="Turkmen" aria-label="Level in Turkmen"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-tswana" name="languages" value="Tswana" /><label for="ad-lang-tswana">Tswana</label><select class="lang-level" name="language_level" data-language="Tswana" aria-label="Level in Tswana"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-tonga" name="languages" value="Tonga" /><label for="ad-lang-tonga">Tonga</label><select class="lang-level" name="language_level" data-language="Tonga" aria-label="Level in Tonga"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-turkish" name="languages" value="Turkish" /><label for="ad-lang-turkish">Turkish</label><select class="lang-level" name="language_level" data-language="Turkish" aria-label="Level in Turkish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-tsonga" name="languages" value="Tsonga" /><label for="ad-lang-tsonga">Tsonga</label><select class="lang-level" name="language_level" data-language="Tsonga" aria-label="Level in Tsonga"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-ukrainian" name="languages" value="Ukrainian" /><label for="ad-lang-ukrainian">Ukrainian</label><select class="lang-level" name="language_level" data-language="Ukrainian" aria-label="Level in Ukrainian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-urdu" name="languages" value="Urdu" /><label for="ad-lang-urdu">Urdu</label><select class="lang-level" name="language_level" data-language="Urdu" aria-label="Level in Urdu"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-uzbek" name="languages" value="Uzbek" /><label for="ad-lang-uzbek">Uzbek</label><select class="lang-level" name="language_level" data-language="Uzbek" aria-label="Level in Uzbek"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-venda" name="languages" value="Venda" /><label for="ad-lang-venda">Venda</label><select class="lang-level" name="language_level" data-language="Venda" aria-label="Level in Venda"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-vietnamese" name="languages" value="Vietnamese" /><label for="ad-lang-vietnamese">Vietnamese</label><select class="lang-level" name="language_level" data-language="Vietnamese" aria-label="Level in Vietnamese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-xhosa" name="languages" value="Xhosa" /><label for="ad-lang-xhosa">Xhosa</label><select class="lang-level" name="language_level" data-language="Xhosa" aria-label="Level in Xhosa"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-chinese" name="languages" value="Chinese" /><label for="ad-lang-chinese">Chinese</label><select class="lang-level" name="language_level" data-language="Chinese" aria-label="Level in Chinese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <span class="lang-pick"><input type="checkbox" id="ad-lang-zulu" name="languages" value="Zulu" /><label for="ad-lang-zulu">Zulu</label><select class="lang-level" name="language_level" data-language="Zulu" aria-label="Level in Zulu"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                <!-- LANGUAGE-OPTIONS-END -->
+              </div>
+              <span class="hint">Each language is stored by its standard name, so the directory filter never gets a name like “Spanish - beginners”. A level is optional.</span>
+            </fieldset>
             <div class="form-field">
               <label for="adSpecialities">Specialities</label>
               <input id="adSpecialities" name="specialities" type="text" />
@@ -539,6 +700,7 @@
             <div class="form-field">
               <label for="adImage">Image URL</label>
               <input id="adImage" name="Image" type="text" inputmode="url" />
+              <span class="hint">A link (https://…). A photo shows on the card only when this is a link — an inline/base64 image is not displayed.</span>
             </div>
             <label class="form-check">
               <input type="checkbox" name="OCA_member" value="1" />
@@ -603,6 +765,28 @@
         );
       }
 
+      /* Lower-case and strip accents ("Zürich" -> "zurich"). */
+      function fold(text) {
+        return String(text == null ? "" : text)
+          .normalize("NFD")
+          .replace(/[\u0300-\u036f]/g, "")
+          .toLowerCase();
+      }
+
+      /* Comma-separated tokens from any shape of field: a text box split on commas, or the
+         `languages` checklist read as its checked values. One wire shape either way. */
+      function collectCsvTokens(els) {
+        var out = [];
+        els.forEach(function (el) {
+          if (el.type === "checkbox" || el.type === "radio") {
+            if (el.checked && el.value) out.push(el.value.trim());
+          } else {
+            (el.value || "").split(",").forEach(function (part) { out.push(part.trim()); });
+          }
+        });
+        return out.filter(Boolean);
+      }
+
       /* The Country value to submit: the ISO code by default, the English name when
          COUNTRY_VALUE_FORMAT is "name". Empty until the owner picks a country. */
       function countryValue(form) {
@@ -661,6 +845,27 @@
           box.checked = val;
           box.dataset.loaded = val ? "true" : "false";
         });
+        // Languages: the standardised checklist. A stored token ticks a box when it IS a
+        // standard name or begins with one ("Spanish - beginners" -> Spanish); its level,
+        // where `language_levels` records one, goes in the level select beside it.
+        var langs = String(recordField(rec, "languages") || "").split(",")
+          .map(function (s) { return s.trim(); }).filter(Boolean);
+        var levels = {};
+        String(recordField(rec, "language_levels") || "").split(",").forEach(function (pair) {
+          var bits = pair.split(":");
+          if (bits.length === 2) levels[fold(bits[0])] = bits[1].trim();
+        });
+        Array.prototype.forEach.call(form.querySelectorAll('input[name="languages"]'), function (box) {
+          var fb = fold(box.value);
+          var on = langs.some(function (t) {
+            var ft = fold(t);
+            return ft === fb || ft.indexOf(fb + " ") === 0 || ft.indexOf(fb + "-") === 0 || ft.indexOf(fb + "(") === 0;
+          });
+          box.checked = on;
+          var row = box.closest(".lang-pick");
+          var sel = row ? row.querySelector("select") : null;
+          if (sel) sel.value = on && levels[fb] ? levels[fb] : "";
+        });
       }
 
       function loadRecord() {
@@ -737,16 +942,28 @@
             return;
           }
 
+          if (name === "language_level") {
+            // Proficiency is a SEPARATE AXIS: a level rides in `language_levels`
+            // ("Spanish:beginner"), never inside a language name.
+            var pairs = [];
+            Array.prototype.forEach.call(
+              form.querySelectorAll('input[name="languages"]:checked'),
+              function (box) {
+                var row = box.closest(".lang-pick");
+                var sel = row ? row.querySelector("select") : null;
+                if (sel && sel.value) pairs.push(box.value + ":" + sel.value);
+              }
+            );
+            if (pairs.length) payload.language_levels = pairs.join(",");
+            return;
+          }
+
           if (CSV_STRING_FIELDS.indexOf(name) !== -1) {
-            // Normalise to the wire shape: trim each entry, drop blanks, re-join.
+            // Normalise to the wire shape: trim each entry, drop blanks, re-join. A text
-            var norm = (els[0].value || "")
+            // box is split on commas; the `languages` checklist is read as its checked
-              .split(",")
+            // values. Nothing selected → the field is omitted, so a save cannot wipe it.
-              .map(function (s) {
+            var norm = collectCsvTokens(els).join(",");
-                return s.trim();
+            if (norm) payload[name] = norm;
-              })
-              .filter(Boolean)
-              .join(",");
-            if (norm) payload[name] = norm; // an empty box must not wipe the field
             return;
           }
 

odoo-community-developers/index.html

@@ -215,6 +215,97 @@
         background: var(--midnight);
         color: #fff;
       }
+      .dir-search {
+        min-width: 240px;
+      }
+      /* `hidden` must really hide. The filter bar and each card set `display` in their own
+         class rules, and a class rule beats the UA's [hidden] rule — so without this a
+         filtered-out card (and a dead bar with JavaScript off) would stay on screen. */
+      .dir-filters[hidden],
+      .dev-card[hidden] {
+        display: none;
+      }
+      .dir-filter input[type="search"] {
+        font-family: Inter, sans-serif;
+        font-size: 0.9rem;
+        padding: 0.5rem 0.7rem;
+        border-radius: var(--radius);
+        border: 1px solid var(--line-brass);
+        background: var(--midnight);
+        color: #fff;
+      }
+      .dir-clear {
+        font-family: Inter, sans-serif;
+        font-size: 0.85rem;
+        cursor: pointer;
+        padding: 0.5rem 0.9rem;
+        border-radius: var(--radius);
+        border: 1px solid var(--line-brass);
+        background: transparent;
+        color: #fff;
+      }
+      .dir-clear:hover {
+        background: rgba(201, 162, 39, 0.14);
+      }
+      .dir-clear:focus-visible {
+        outline: 3px solid var(--brass-bright);
+        outline-offset: 2px;
+      }
+
+      /* The standardised language multi-select: a closed checklist, scrollable so the
+         form stays short. The level <select> is folded in beside a language only once
+         it is checked — pure CSS, so it needs no script. */
+      .lang-field {
+        min-width: 0;
+        border: 1px solid var(--line);
+        border-radius: var(--radius);
+        padding: 0.85rem 0.9rem 0.6rem;
+      }
+      .lang-field legend {
+        font-size: 0.8rem;
+        font-weight: 600;
+        color: var(--midnight);
+        padding: 0 0.35rem;
+      }
+      .section-dark .lang-field {
+        border-color: var(--line-brass);
+      }
+      .section-dark .lang-field legend {
+        color: rgba(255, 255, 255, 0.85);
+      }
+      .lang-list {
+        display: flex;
+        flex-direction: column;
+        gap: 0.25rem;
+        max-height: 220px;
+        overflow: auto;
+        padding-right: 0.35rem;
+      }
+      .lang-pick {
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+        font-size: 0.88rem;
+        color: var(--ink);
+      }
+      .section-dark .lang-pick {
+        color: rgba(255, 255, 255, 0.85);
+      }
+      .lang-pick input {
+        width: auto;
+        margin: 0;
+        flex-shrink: 0;
+      }
+      .lang-pick .lang-level {
+        display: none;
+        width: auto;
+        max-width: 9rem;
+        padding: 0.25rem 0.4rem;
+        font-size: 0.8rem;
+      }
+      .lang-pick input:checked ~ .lang-level {
+        display: inline-block;
+      }
       .dir-count {
         text-align: center;
         font-size: 0.82rem;
@@ -691,7 +782,7 @@
     <section class="section-dark" id="directory">
       <div class="container">
         <h2 class="section-title">Freelancers available</h2>
-        <p class="dir-lede">Listings are for freelancers who work on their own — that is the declaration we ask each of them for, and we do not verify it. Where a card shows a number of projects, that is a number we recorded — not a rating, a score or an endorsement. We make no claim about a freelancer beyond what they wrote and what we can count ourselves.</p>
+        <p class="dir-lede">Listings are for freelancers who work on their own — that is the declaration we ask each of them for, and we do not verify it. Where a card shows a number of projects, that is a number we recorded — not a rating, a score or an endorsement. A card shows a photo only where the freelancer gave us a link to one; otherwise it shows their initials. We make no claim about a freelancer beyond what they wrote and what we can count ourselves.</p>
 
         <!-- Rendered at build time from our freelancer webhook (one call, no CRM),
              so the list works with JavaScript disabled. The filter controls below are
@@ -699,16 +790,24 @@
              itself as the fields land. Rebuild the list with:
                  python3 /root/workspace/webmaster/work/build-directory.py -->
         <div class="dir-filters" id="dirFilters" hidden>
+          <div class="dir-filter dir-search">
+            <label for="dirSearch">Search</label>
+            <input type="search" id="dirSearch" data-search-box="1" placeholder="Name, focus, skills…" autocomplete="off" />
+          </div>
           <!-- FILTERS-START -->
 <div class="dir-filter"><label for="f-country">Country</label><select id="f-country" data-field="country"><option value="">All</option><option value="py">Paraguay</option></select></div>
-<div class="dir-filter"><label for="f-languages">Language</label><select id="f-languages" data-field="languages"><option value="">All</option><option value="english">English</option><option value="german">German</option><option value="spanish - beginners">Spanish - beginners</option></select></div>
+<div class="dir-filter"><label for="f-languages">Language</label><select id="f-languages" data-field="languages"><option value="">All</option><option value="english">English</option><option value="german">German</option><option value="spanish">Spanish</option></select></div>
 <div class="dir-filter"><label for="f-specialities">Speciality</label><select id="f-specialities" data-field="specialities"><option value="">All</option><option value="functional consulting">Functional Consulting</option></select></div>
+<div class="dir-filter"><label for="f-oca">OCA membership</label><select id="f-oca" data-field="oca"><option value="">All</option><option value="1">OCA member</option><option value="0">Not an OCA member</option></select></div>
       <!-- FILTERS-END -->
+          <div class="dir-filter dir-clear-wrap">
+            <button type="button" id="dirClear" class="dir-clear" hidden>Clear</button>
+          </div>
         </div>
         <p class="dir-count" id="dirCount" hidden></p>
         <div class="dir-grid" id="dirGrid">
           <!-- DIRECTORY-LIST-START -->
-<article class="dev-card" data-name="oliver" data-country="" data-languages="" data-specialities="">
+<article class="dev-card" data-name="oliver" data-search="oliver ginwwgnri vieoem  " data-country="" data-languages="" data-specialities="" data-oca="1">
 <header class="dev-head">
 <span class="dev-avatar" aria-hidden="true">OL</span>
 <div class="dev-id">
@@ -722,7 +821,7 @@
 <dl class="dev-facts"><div><dt>Projects on ODOO4projects</dt><dd>4 projects — a number we recorded</dd></div></dl>
 <p class="dev-contact-none">No contact details published for this freelancer.</p>
 </article>
-<article class="dev-card" data-name="oliver - the oc guy" data-country="py" data-languages="german|english|spanish - beginners" data-specialities="functional consulting">
+<article class="dev-card" data-name="oliver - the oc guy" data-search="oliver - the oc guy i love to see how far i can push the odoo community version for my clients. besides the module implementation i am quite happy with adding to odoo using hermes agent, n8n and progressive web apps agent automation, manufacturing, e-commerce functional consulting german english spanish - beginners" data-country="py" data-languages="german|english|spanish" data-specialities="functional consulting" data-oca="0">
 <header class="dev-head">
 <span class="dev-avatar" aria-hidden="true">OG</span>
 <div class="dev-id">
@@ -742,7 +841,7 @@
 </article>
       <!-- DIRECTORY-LIST-END -->
         </div>
-        <p class="dir-empty" id="dirEmpty" hidden>No freelancer matches those filters. Clear them to see everyone.</p>
+        <p class="dir-empty" id="dirEmpty" hidden>No freelancer matches that search and those filters. Use Clear to see everyone.</p>
 
         <div class="dir-note" id="listing-note">
           <p>You deal with the freelancer directly. The contract for the work is between you and them, and the terms, the price and the delivery are yours to agree. We are not a party to it — we publish the listings and, if you ask, pass your message along.</p>
@@ -1089,11 +1188,128 @@
                 <input id="apVersions" name="odoo_versions" type="text" placeholder="16, 17, 18" />
                 <span class="hint">Separate with commas. The versions you actually work in.</span>
               </div>
-              <div class="form-field">
+              <fieldset class="form-field full lang-field">
-                <label for="apLanguages">Languages</label>
+                <legend>Languages</legend>
-                <input id="apLanguages" name="languages" type="text" placeholder="English, German" />
+                <div class="lang-list" id="apLanguages">
-                <span class="hint">Separate with commas.</span>
+                  <!-- LANGUAGE-OPTIONS-START -->
-              </div>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-afrikaans" name="languages" value="Afrikaans" /><label for="ap-lang-afrikaans">Afrikaans</label><select class="lang-level" name="language_level" data-language="Afrikaans" aria-label="Level in Afrikaans"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-amharic" name="languages" value="Amharic" /><label for="ap-lang-amharic">Amharic</label><select class="lang-level" name="language_level" data-language="Amharic" aria-label="Level in Amharic"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-arabic" name="languages" value="Arabic" /><label for="ap-lang-arabic">Arabic</label><select class="lang-level" name="language_level" data-language="Arabic" aria-label="Level in Arabic"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-aymara" name="languages" value="Aymara" /><label for="ap-lang-aymara">Aymara</label><select class="lang-level" name="language_level" data-language="Aymara" aria-label="Level in Aymara"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-azerbaijani" name="languages" value="Azerbaijani" /><label for="ap-lang-azerbaijani">Azerbaijani</label><select class="lang-level" name="language_level" data-language="Azerbaijani" aria-label="Level in Azerbaijani"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-belarusian" name="languages" value="Belarusian" /><label for="ap-lang-belarusian">Belarusian</label><select class="lang-level" name="language_level" data-language="Belarusian" aria-label="Level in Belarusian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-bulgarian" name="languages" value="Bulgarian" /><label for="ap-lang-bulgarian">Bulgarian</label><select class="lang-level" name="language_level" data-language="Bulgarian" aria-label="Level in Bulgarian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-bislama" name="languages" value="Bislama" /><label for="ap-lang-bislama">Bislama</label><select class="lang-level" name="language_level" data-language="Bislama" aria-label="Level in Bislama"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-bengali" name="languages" value="Bengali" /><label for="ap-lang-bengali">Bengali</label><select class="lang-level" name="language_level" data-language="Bengali" aria-label="Level in Bengali"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-bosnian" name="languages" value="Bosnian" /><label for="ap-lang-bosnian">Bosnian</label><select class="lang-level" name="language_level" data-language="Bosnian" aria-label="Level in Bosnian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-catalan" name="languages" value="Catalan" /><label for="ap-lang-catalan">Catalan</label><select class="lang-level" name="language_level" data-language="Catalan" aria-label="Level in Catalan"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-chamorro" name="languages" value="Chamorro" /><label for="ap-lang-chamorro">Chamorro</label><select class="lang-level" name="language_level" data-language="Chamorro" aria-label="Level in Chamorro"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-czech" name="languages" value="Czech" /><label for="ap-lang-czech">Czech</label><select class="lang-level" name="language_level" data-language="Czech" aria-label="Level in Czech"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-danish" name="languages" value="Danish" /><label for="ap-lang-danish">Danish</label><select class="lang-level" name="language_level" data-language="Danish" aria-label="Level in Danish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-german" name="languages" value="German" /><label for="ap-lang-german">German</label><select class="lang-level" name="language_level" data-language="German" aria-label="Level in German"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-divehi" name="languages" value="Divehi" /><label for="ap-lang-divehi">Divehi</label><select class="lang-level" name="language_level" data-language="Divehi" aria-label="Level in Divehi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-dzongkha" name="languages" value="Dzongkha" /><label for="ap-lang-dzongkha">Dzongkha</label><select class="lang-level" name="language_level" data-language="Dzongkha" aria-label="Level in Dzongkha"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-greek" name="languages" value="Greek" /><label for="ap-lang-greek">Greek</label><select class="lang-level" name="language_level" data-language="Greek" aria-label="Level in Greek"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-english" name="languages" value="English" /><label for="ap-lang-english">English</label><select class="lang-level" name="language_level" data-language="English" aria-label="Level in English"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-spanish" name="languages" value="Spanish" /><label for="ap-lang-spanish">Spanish</label><select class="lang-level" name="language_level" data-language="Spanish" aria-label="Level in Spanish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-estonian" name="languages" value="Estonian" /><label for="ap-lang-estonian">Estonian</label><select class="lang-level" name="language_level" data-language="Estonian" aria-label="Level in Estonian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-basque" name="languages" value="Basque" /><label for="ap-lang-basque">Basque</label><select class="lang-level" name="language_level" data-language="Basque" aria-label="Level in Basque"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-persian" name="languages" value="Persian" /><label for="ap-lang-persian">Persian</label><select class="lang-level" name="language_level" data-language="Persian" aria-label="Level in Persian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-peul" name="languages" value="Peul" /><label for="ap-lang-peul">Peul</label><select class="lang-level" name="language_level" data-language="Peul" aria-label="Level in Peul"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-finnish" name="languages" value="Finnish" /><label for="ap-lang-finnish">Finnish</label><select class="lang-level" name="language_level" data-language="Finnish" aria-label="Level in Finnish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-fijian" name="languages" value="Fijian" /><label for="ap-lang-fijian">Fijian</label><select class="lang-level" name="language_level" data-language="Fijian" aria-label="Level in Fijian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-faroese" name="languages" value="Faroese" /><label for="ap-lang-faroese">Faroese</label><select class="lang-level" name="language_level" data-language="Faroese" aria-label="Level in Faroese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-french" name="languages" value="French" /><label for="ap-lang-french">French</label><select class="lang-level" name="language_level" data-language="French" aria-label="Level in French"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-irish" name="languages" value="Irish" /><label for="ap-lang-irish">Irish</label><select class="lang-level" name="language_level" data-language="Irish" aria-label="Level in Irish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-galician" name="languages" value="Galician" /><label for="ap-lang-galician">Galician</label><select class="lang-level" name="language_level" data-language="Galician" aria-label="Level in Galician"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-guarani" name="languages" value="Guarani" /><label for="ap-lang-guarani">Guarani</label><select class="lang-level" name="language_level" data-language="Guarani" aria-label="Level in Guarani"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-manx" name="languages" value="Manx" /><label for="ap-lang-manx">Manx</label><select class="lang-level" name="language_level" data-language="Manx" aria-label="Level in Manx"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-hebrew" name="languages" value="Hebrew" /><label for="ap-lang-hebrew">Hebrew</label><select class="lang-level" name="language_level" data-language="Hebrew" aria-label="Level in Hebrew"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-hindi" name="languages" value="Hindi" /><label for="ap-lang-hindi">Hindi</label><select class="lang-level" name="language_level" data-language="Hindi" aria-label="Level in Hindi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-croatian" name="languages" value="Croatian" /><label for="ap-lang-croatian">Croatian</label><select class="lang-level" name="language_level" data-language="Croatian" aria-label="Level in Croatian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-haitian" name="languages" value="Haitian" /><label for="ap-lang-haitian">Haitian</label><select class="lang-level" name="language_level" data-language="Haitian" aria-label="Level in Haitian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-hungarian" name="languages" value="Hungarian" /><label for="ap-lang-hungarian">Hungarian</label><select class="lang-level" name="language_level" data-language="Hungarian" aria-label="Level in Hungarian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-armenian" name="languages" value="Armenian" /><label for="ap-lang-armenian">Armenian</label><select class="lang-level" name="language_level" data-language="Armenian" aria-label="Level in Armenian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-indonesian" name="languages" value="Indonesian" /><label for="ap-lang-indonesian">Indonesian</label><select class="lang-level" name="language_level" data-language="Indonesian" aria-label="Level in Indonesian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-icelandic" name="languages" value="Icelandic" /><label for="ap-lang-icelandic">Icelandic</label><select class="lang-level" name="language_level" data-language="Icelandic" aria-label="Level in Icelandic"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-italian" name="languages" value="Italian" /><label for="ap-lang-italian">Italian</label><select class="lang-level" name="language_level" data-language="Italian" aria-label="Level in Italian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-japanese" name="languages" value="Japanese" /><label for="ap-lang-japanese">Japanese</label><select class="lang-level" name="language_level" data-language="Japanese" aria-label="Level in Japanese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-georgian" name="languages" value="Georgian" /><label for="ap-lang-georgian">Georgian</label><select class="lang-level" name="language_level" data-language="Georgian" aria-label="Level in Georgian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-kongo" name="languages" value="Kongo" /><label for="ap-lang-kongo">Kongo</label><select class="lang-level" name="language_level" data-language="Kongo" aria-label="Level in Kongo"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-kazakh" name="languages" value="Kazakh" /><label for="ap-lang-kazakh">Kazakh</label><select class="lang-level" name="language_level" data-language="Kazakh" aria-label="Level in Kazakh"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-greenlandic" name="languages" value="Greenlandic" /><label for="ap-lang-greenlandic">Greenlandic</label><select class="lang-level" name="language_level" data-language="Greenlandic" aria-label="Level in Greenlandic"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-cambodian" name="languages" value="Cambodian" /><label for="ap-lang-cambodian">Cambodian</label><select class="lang-level" name="language_level" data-language="Cambodian" aria-label="Level in Cambodian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-korean" name="languages" value="Korean" /><label for="ap-lang-korean">Korean</label><select class="lang-level" name="language_level" data-language="Korean" aria-label="Level in Korean"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-kurdish" name="languages" value="Kurdish" /><label for="ap-lang-kurdish">Kurdish</label><select class="lang-level" name="language_level" data-language="Kurdish" aria-label="Level in Kurdish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-kyrgyz" name="languages" value="Kyrgyz" /><label for="ap-lang-kyrgyz">Kyrgyz</label><select class="lang-level" name="language_level" data-language="Kyrgyz" aria-label="Level in Kyrgyz"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-latin" name="languages" value="Latin" /><label for="ap-lang-latin">Latin</label><select class="lang-level" name="language_level" data-language="Latin" aria-label="Level in Latin"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-luxembourgish" name="languages" value="Luxembourgish" /><label for="ap-lang-luxembourgish">Luxembourgish</label><select class="lang-level" name="language_level" data-language="Luxembourgish" aria-label="Level in Luxembourgish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-lingala" name="languages" value="Lingala" /><label for="ap-lang-lingala">Lingala</label><select class="lang-level" name="language_level" data-language="Lingala" aria-label="Level in Lingala"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-laotian" name="languages" value="Laotian" /><label for="ap-lang-laotian">Laotian</label><select class="lang-level" name="language_level" data-language="Laotian" aria-label="Level in Laotian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-lithuanian" name="languages" value="Lithuanian" /><label for="ap-lang-lithuanian">Lithuanian</label><select class="lang-level" name="language_level" data-language="Lithuanian" aria-label="Level in Lithuanian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-luba-katanga" name="languages" value="Luba-Katanga" /><label for="ap-lang-luba-katanga">Luba-Katanga</label><select class="lang-level" name="language_level" data-language="Luba-Katanga" aria-label="Level in Luba-Katanga"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-latvian" name="languages" value="Latvian" /><label for="ap-lang-latvian">Latvian</label><select class="lang-level" name="language_level" data-language="Latvian" aria-label="Level in Latvian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-malagasy" name="languages" value="Malagasy" /><label for="ap-lang-malagasy">Malagasy</label><select class="lang-level" name="language_level" data-language="Malagasy" aria-label="Level in Malagasy"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-marshallese" name="languages" value="Marshallese" /><label for="ap-lang-marshallese">Marshallese</label><select class="lang-level" name="language_level" data-language="Marshallese" aria-label="Level in Marshallese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-maori" name="languages" value="Maori" /><label for="ap-lang-maori">Maori</label><select class="lang-level" name="language_level" data-language="Maori" aria-label="Level in Maori"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-macedonian" name="languages" value="Macedonian" /><label for="ap-lang-macedonian">Macedonian</label><select class="lang-level" name="language_level" data-language="Macedonian" aria-label="Level in Macedonian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-mongolian" name="languages" value="Mongolian" /><label for="ap-lang-mongolian">Mongolian</label><select class="lang-level" name="language_level" data-language="Mongolian" aria-label="Level in Mongolian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-malay" name="languages" value="Malay" /><label for="ap-lang-malay">Malay</label><select class="lang-level" name="language_level" data-language="Malay" aria-label="Level in Malay"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-maltese" name="languages" value="Maltese" /><label for="ap-lang-maltese">Maltese</label><select class="lang-level" name="language_level" data-language="Maltese" aria-label="Level in Maltese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-burmese" name="languages" value="Burmese" /><label for="ap-lang-burmese">Burmese</label><select class="lang-level" name="language_level" data-language="Burmese" aria-label="Level in Burmese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-nauruan" name="languages" value="Nauruan" /><label for="ap-lang-nauruan">Nauruan</label><select class="lang-level" name="language_level" data-language="Nauruan" aria-label="Level in Nauruan"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-norwegian-bokmål" name="languages" value="Norwegian Bokmål" /><label for="ap-lang-norwegian-bokmål">Norwegian Bokmål</label><select class="lang-level" name="language_level" data-language="Norwegian Bokmål" aria-label="Level in Norwegian Bokmål"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-north-ndebele" name="languages" value="North Ndebele" /><label for="ap-lang-north-ndebele">North Ndebele</label><select class="lang-level" name="language_level" data-language="North Ndebele" aria-label="Level in North Ndebele"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-nepali" name="languages" value="Nepali" /><label for="ap-lang-nepali">Nepali</label><select class="lang-level" name="language_level" data-language="Nepali" aria-label="Level in Nepali"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-dutch" name="languages" value="Dutch" /><label for="ap-lang-dutch">Dutch</label><select class="lang-level" name="language_level" data-language="Dutch" aria-label="Level in Dutch"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-norwegian-nynorsk" name="languages" value="Norwegian Nynorsk" /><label for="ap-lang-norwegian-nynorsk">Norwegian Nynorsk</label><select class="lang-level" name="language_level" data-language="Norwegian Nynorsk" aria-label="Level in Norwegian Nynorsk"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-norwegian" name="languages" value="Norwegian" /><label for="ap-lang-norwegian">Norwegian</label><select class="lang-level" name="language_level" data-language="Norwegian" aria-label="Level in Norwegian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-south-ndebele" name="languages" value="South Ndebele" /><label for="ap-lang-south-ndebele">South Ndebele</label><select class="lang-level" name="language_level" data-language="South Ndebele" aria-label="Level in South Ndebele"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-chichewa" name="languages" value="Chichewa" /><label for="ap-lang-chichewa">Chichewa</label><select class="lang-level" name="language_level" data-language="Chichewa" aria-label="Level in Chichewa"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-occitan" name="languages" value="Occitan" /><label for="ap-lang-occitan">Occitan</label><select class="lang-level" name="language_level" data-language="Occitan" aria-label="Level in Occitan"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-panjabi-/-punjabi" name="languages" value="Panjabi / Punjabi" /><label for="ap-lang-panjabi-/-punjabi">Panjabi / Punjabi</label><select class="lang-level" name="language_level" data-language="Panjabi / Punjabi" aria-label="Level in Panjabi / Punjabi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-polish" name="languages" value="Polish" /><label for="ap-lang-polish">Polish</label><select class="lang-level" name="language_level" data-language="Polish" aria-label="Level in Polish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-pashto" name="languages" value="Pashto" /><label for="ap-lang-pashto">Pashto</label><select class="lang-level" name="language_level" data-language="Pashto" aria-label="Level in Pashto"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-portuguese" name="languages" value="Portuguese" /><label for="ap-lang-portuguese">Portuguese</label><select class="lang-level" name="language_level" data-language="Portuguese" aria-label="Level in Portuguese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-quechua" name="languages" value="Quechua" /><label for="ap-lang-quechua">Quechua</label><select class="lang-level" name="language_level" data-language="Quechua" aria-label="Level in Quechua"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-kirundi" name="languages" value="Kirundi" /><label for="ap-lang-kirundi">Kirundi</label><select class="lang-level" name="language_level" data-language="Kirundi" aria-label="Level in Kirundi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-romanian" name="languages" value="Romanian" /><label for="ap-lang-romanian">Romanian</label><select class="lang-level" name="language_level" data-language="Romanian" aria-label="Level in Romanian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-russian" name="languages" value="Russian" /><label for="ap-lang-russian">Russian</label><select class="lang-level" name="language_level" data-language="Russian" aria-label="Level in Russian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-rwandi" name="languages" value="Rwandi" /><label for="ap-lang-rwandi">Rwandi</label><select class="lang-level" name="language_level" data-language="Rwandi" aria-label="Level in Rwandi"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-sango" name="languages" value="Sango" /><label for="ap-lang-sango">Sango</label><select class="lang-level" name="language_level" data-language="Sango" aria-label="Level in Sango"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-sinhalese" name="languages" value="Sinhalese" /><label for="ap-lang-sinhalese">Sinhalese</label><select class="lang-level" name="language_level" data-language="Sinhalese" aria-label="Level in Sinhalese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-slovak" name="languages" value="Slovak" /><label for="ap-lang-slovak">Slovak</label><select class="lang-level" name="language_level" data-language="Slovak" aria-label="Level in Slovak"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-slovenian" name="languages" value="Slovenian" /><label for="ap-lang-slovenian">Slovenian</label><select class="lang-level" name="language_level" data-language="Slovenian" aria-label="Level in Slovenian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-samoan" name="languages" value="Samoan" /><label for="ap-lang-samoan">Samoan</label><select class="lang-level" name="language_level" data-language="Samoan" aria-label="Level in Samoan"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-shona" name="languages" value="Shona" /><label for="ap-lang-shona">Shona</label><select class="lang-level" name="language_level" data-language="Shona" aria-label="Level in Shona"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-somalia" name="languages" value="Somalia" /><label for="ap-lang-somalia">Somalia</label><select class="lang-level" name="language_level" data-language="Somalia" aria-label="Level in Somalia"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-albanian" name="languages" value="Albanian" /><label for="ap-lang-albanian">Albanian</label><select class="lang-level" name="language_level" data-language="Albanian" aria-label="Level in Albanian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-serbian" name="languages" value="Serbian" /><label for="ap-lang-serbian">Serbian</label><select class="lang-level" name="language_level" data-language="Serbian" aria-label="Level in Serbian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-swati" name="languages" value="Swati" /><label for="ap-lang-swati">Swati</label><select class="lang-level" name="language_level" data-language="Swati" aria-label="Level in Swati"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-southern-sotho" name="languages" value="Southern Sotho" /><label for="ap-lang-southern-sotho">Southern Sotho</label><select class="lang-level" name="language_level" data-language="Southern Sotho" aria-label="Level in Southern Sotho"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-swedish" name="languages" value="Swedish" /><label for="ap-lang-swedish">Swedish</label><select class="lang-level" name="language_level" data-language="Swedish" aria-label="Level in Swedish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-swahili" name="languages" value="Swahili" /><label for="ap-lang-swahili">Swahili</label><select class="lang-level" name="language_level" data-language="Swahili" aria-label="Level in Swahili"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-tamil" name="languages" value="Tamil" /><label for="ap-lang-tamil">Tamil</label><select class="lang-level" name="language_level" data-language="Tamil" aria-label="Level in Tamil"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-tajik" name="languages" value="Tajik" /><label for="ap-lang-tajik">Tajik</label><select class="lang-level" name="language_level" data-language="Tajik" aria-label="Level in Tajik"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-thai" name="languages" value="Thai" /><label for="ap-lang-thai">Thai</label><select class="lang-level" name="language_level" data-language="Thai" aria-label="Level in Thai"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-tigrinya" name="languages" value="Tigrinya" /><label for="ap-lang-tigrinya">Tigrinya</label><select class="lang-level" name="language_level" data-language="Tigrinya" aria-label="Level in Tigrinya"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-turkmen" name="languages" value="Turkmen" /><label for="ap-lang-turkmen">Turkmen</label><select class="lang-level" name="language_level" data-language="Turkmen" aria-label="Level in Turkmen"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-tswana" name="languages" value="Tswana" /><label for="ap-lang-tswana">Tswana</label><select class="lang-level" name="language_level" data-language="Tswana" aria-label="Level in Tswana"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-tonga" name="languages" value="Tonga" /><label for="ap-lang-tonga">Tonga</label><select class="lang-level" name="language_level" data-language="Tonga" aria-label="Level in Tonga"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-turkish" name="languages" value="Turkish" /><label for="ap-lang-turkish">Turkish</label><select class="lang-level" name="language_level" data-language="Turkish" aria-label="Level in Turkish"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-tsonga" name="languages" value="Tsonga" /><label for="ap-lang-tsonga">Tsonga</label><select class="lang-level" name="language_level" data-language="Tsonga" aria-label="Level in Tsonga"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-ukrainian" name="languages" value="Ukrainian" /><label for="ap-lang-ukrainian">Ukrainian</label><select class="lang-level" name="language_level" data-language="Ukrainian" aria-label="Level in Ukrainian"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-urdu" name="languages" value="Urdu" /><label for="ap-lang-urdu">Urdu</label><select class="lang-level" name="language_level" data-language="Urdu" aria-label="Level in Urdu"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-uzbek" name="languages" value="Uzbek" /><label for="ap-lang-uzbek">Uzbek</label><select class="lang-level" name="language_level" data-language="Uzbek" aria-label="Level in Uzbek"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-venda" name="languages" value="Venda" /><label for="ap-lang-venda">Venda</label><select class="lang-level" name="language_level" data-language="Venda" aria-label="Level in Venda"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-vietnamese" name="languages" value="Vietnamese" /><label for="ap-lang-vietnamese">Vietnamese</label><select class="lang-level" name="language_level" data-language="Vietnamese" aria-label="Level in Vietnamese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-xhosa" name="languages" value="Xhosa" /><label for="ap-lang-xhosa">Xhosa</label><select class="lang-level" name="language_level" data-language="Xhosa" aria-label="Level in Xhosa"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-chinese" name="languages" value="Chinese" /><label for="ap-lang-chinese">Chinese</label><select class="lang-level" name="language_level" data-language="Chinese" aria-label="Level in Chinese"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <span class="lang-pick"><input type="checkbox" id="ap-lang-zulu" name="languages" value="Zulu" /><label for="ap-lang-zulu">Zulu</label><select class="lang-level" name="language_level" data-language="Zulu" aria-label="Level in Zulu"><option value="">—</option><option value="native">native</option><option value="fluent">fluent</option><option value="advanced">advanced</option><option value="intermediate">intermediate</option><option value="beginner">beginner</option></select></span>
+                  <!-- LANGUAGE-OPTIONS-END -->
+                </div>
+                <span class="hint">Pick the languages you work in. Each is stored by its standard name, so the filter never gets a name like “Spanish - beginners”. A level is optional and kept apart from the name.</span>
+              </fieldset>
               <div class="form-field">
                 <label for="apSpecialities">Specialities</label>
                 <input id="apSpecialities" name="specialities" type="text" placeholder="accounting, stock, migration" />
@@ -1299,6 +1515,58 @@
         );
       }
 
+      /* Lower-case and strip accents, so "Zürich" matches "zurich" (search + dedupe). */
+      function fold(text) {
+        return String(text == null ? "" : text)
+          .normalize("NFD")
+          .replace(/[\u0300-\u036f]/g, "")
+          .toLowerCase();
+      }
+
+      /* Comma-separated tokens from any shape of field: a text box split on commas, or a
+         group of checkboxes (the standardised `languages` field) read as the checked
+         values. Trims and drops blanks — one wire shape either way. */
+      function collectCsvTokens(els) {
+        var out = [];
+        els.forEach(function (el) {
+          if (el.type === "checkbox" || el.type === "radio") {
+            if (el.checked && el.value) out.push(el.value.trim());
+          } else {
+            (el.value || "").split(",").forEach(function (part) { out.push(part.trim()); });
+          }
+        });
+        return out.filter(Boolean);
+      }
+
+      /* The standard language names, read off this page's own language checklist — the
+         list is already in the form, so no second copy is shipped. */
+      function canonicalLanguages() {
+        var names = [];
+        Array.prototype.forEach.call(
+          document.querySelectorAll('input[name="languages"]'),
+          function (box) { if (box.value) names.push(box.value); }
+        );
+        return names;
+      }
+
+      /* Map stored language tokens to standard names: "Spanish - beginners" -> "Spanish".
+         A token matching no standard name yields nothing (it still shows as a tag). */
+      function canonicalFor(tokens) {
+        var names = canonicalLanguages();
+        var out = [];
+        tokens.forEach(function (token) {
+          var ft = fold(token), best = null;
+          names.forEach(function (n) {
+            var fn = fold(n);
+            if (ft === fn || ft.indexOf(fn + " ") === 0 || ft.indexOf(fn + "-") === 0 || ft.indexOf(fn + "(") === 0) {
+              if (best === null || n.length > best.length) best = n;
+            }
+          });
+          if (best && out.map(fold).indexOf(fold(best)) === -1) out.push(best);
+        });
+        return out;
+      }
+
       /* The Country value to submit: the ISO code by default, the English name when
          COUNTRY_VALUE_FORMAT is "name". Empty until the visitor picks a country. */
       function countryValue(form) {
@@ -1347,17 +1615,30 @@
             return;
           }
 
+          if (name === "language_level") {
+            // Proficiency is a SEPARATE AXIS: a level rides in `language_levels`
+            // ("Spanish:beginner"), never inside a language name. The language NAME in
+            // `languages` is always a standard one, so the filter can never see a
+            // free-text "Spanish - beginners".
+            var pairs = [];
+            Array.prototype.forEach.call(
+              form.querySelectorAll('input[name="languages"]:checked'),
+              function (box) {
+                var row = box.closest(".lang-pick");
+                var sel = row ? row.querySelector("select") : null;
+                if (sel && sel.value) pairs.push(box.value + ":" + sel.value);
+              }
+            );
+            if (pairs.length) payload.language_levels = pairs.join(",");
+            return;
+          }
+
           if (CSV_STRING_FIELDS.indexOf(name) !== -1) {
-            // Normalise to the wire shape: trim each entry, drop blanks, re-join.
+            // Normalise to the wire shape: trim each entry, drop blanks, re-join. A text
-            // "English, German" and "a, b, ,c" → "English,German" and "a,b,c".
+            // box is split on commas; the `languages` checklist is read as its checked
-            var norm = (els[0].value || "")
+            // values. "English, German" → "English,German"; nothing checked → omitted.
-              .split(",")
+            var norm = collectCsvTokens(els).join(",");
-              .map(function (s) {
+            if (norm) payload[name] = norm; // an empty selection must not wipe the field
-                return s.trim();
-              })
-              .filter(Boolean)
-              .join(",");
-            if (norm) payload[name] = norm; // an empty box must not wipe the field
             return;
           }
 
@@ -1433,10 +1714,12 @@
          the endpoint returns with a `Name` is rendered, exactly as build-directory.py
          does it. The workflow has to expose a marker before this can gate on one. */
       var LIVE_FILTERS = [
-        ["Country", "Country", "country"],
+        ["Country", "Country", "country", "value"],
-        ["odoo_versions", "Odoo version", "odoo-versions"],
+        ["odoo_versions", "Odoo version", "odoo-versions", "value"],
-        ["languages", "Language", "languages"],
+        ["languages", "Language", "languages", "language"],
-        ["specialities", "Speciality", "specialities"]
+        ["specialities", "Speciality", "specialities", "value"],
+        ["OCA_member", "OCA membership", "oca", "bool"],
+        ["odoo4projects_clients", "Projects on ODOO4projects", "projects", "min"]
       ];
       // The webhook's casing has drifted once already. Accept the known aliases too —
       // the same list as FIELD_ALIASES in build-directory.py, so both renderers agree.
@@ -1465,16 +1748,40 @@
         return node;
       }
 
+      /* Everything the freelancer wrote about themselves, folded, for the search box:
+         Name, description, Focus, specialities and the language names. */
+      function liveSearchText(rec) {
+        return fold([
+          String(rec.Name || ""),
+          String(rec.description || ""),
+          String(rec.Focus || ""),
+          liveValues(rec, "specialities").join(" "),
+          liveValues(rec, "languages").join(" ")
+        ].join(" "));
+      }
+
+      /* The card's data-<attr> value for one active filter — mirrors attr_value() in
+         build-directory.py, field for field. */
+      function liveAttrValue(rec, pair) {
+        var field = pair[0], kind = pair[3];
+        if (kind === "bool") return rec[field] === true ? "1" : "0";
+        if (kind === "min") {
+          var n = parseInt(rec[field], 10);
+          return isNaN(n) ? "" : String(n);
+        }
+        if (kind === "language") return canonicalFor(liveValues(rec, field)).map(fold).join("|");
+        return liveValues(rec, field).map(fold).join("|");
+      }
+
       /* One card, field for field the same as render_card() in build-directory.py.
          Everything a freelancer wrote goes in as textContent, never as HTML. */
       function liveCard(rec, active) {
         var name = String(rec.Name || "").trim();
         var card = liveEl("article", "dev-card");
         card.setAttribute("data-name", name.toLowerCase());
+        card.setAttribute("data-search", liveSearchText(rec));
         active.forEach(function (pair) {
-          card.setAttribute("data-" + pair[2], liveValues(rec, pair[0]).map(function (v) {
+          card.setAttribute("data-" + pair[2], liveAttrValue(rec, pair));
-            return v.toLowerCase();
-          }).join("|"));
         });
 
         var photo = String(rec.Image || "").trim();
@@ -1578,41 +1885,73 @@
         return map;
       }
 
-      /* The filter bar, rebuilt from the records just fetched. Same rule as the build:
+      /* The filter bar, rebuilt from the records just fetched. Same rule as the build: a
-         a filter appears only when at least one record carries a value for it. */
+         filter appears only when the data supports it. A project minimum is additionally
+         printed only when a threshold can narrow the list (two distinct counts); with one
+         count it would return everyone, so it is not shipped. */
       function liveFilters(records) {
         var bar = document.getElementById("dirFilters");
         var countries = countryNames();
-        while (bar.firstChild) bar.removeChild(bar.firstChild);
+        var clearWrap = bar.querySelector(".dir-clear-wrap");
+        Array.prototype.slice.call(bar.querySelectorAll(".dir-filter")).forEach(function (node) {
+          if (!node.classList.contains("dir-search") && !node.classList.contains("dir-clear-wrap")) {
+            bar.removeChild(node);
+          }
+        });
         var active = [];
         LIVE_FILTERS.forEach(function (pair) {
-          var seen = [];
+          var field = pair[0], label = pair[1], attr = pair[2], kind = pair[3];
-          records.forEach(function (rec) {
+          var options = null;
-            liveValues(rec, pair[0]).forEach(function (v) {
+
-              var dup = seen.some(function (s) { return s.toLowerCase() === v.toLowerCase(); });
+          if (kind === "bool") {
-              if (!dup) seen.push(v);
+            var anyBool = records.some(function (r) {
+              return r[field] !== null && r[field] !== undefined && r[field] !== "";
             });
-          });
+            if (anyBool) options = [["1", "OCA member"], ["0", "Not an OCA member"]];
-          if (!seen.length) return; // no data → no filter
+          } else if (kind === "min") {
+            var counts = [];
+            records.forEach(function (r) {
+              var n = parseInt(r[field], 10);
+              if (!isNaN(n) && counts.indexOf(n) === -1) counts.push(n);
+            });
+            counts.sort(function (a, b) { return a - b; });
+            if (counts.length >= 2) {
+              options = counts.slice(1).map(function (c) { return [String(c), c + "+ projects"]; });
+            }
+          } else {
+            var seen = [];
+            records.forEach(function (rec) {
+              var vals = kind === "language" ? canonicalFor(liveValues(rec, field)) : liveValues(rec, field);
+              vals.forEach(function (v) {
+                if (!seen.some(function (s) { return fold(s) === fold(v); })) seen.push(v);
+              });
+            });
+            if (seen.length) {
+              seen.sort(function (a, b) { return fold(a) < fold(b) ? -1 : 1; });
+              options = seen.map(function (v) {
+                var shown = field === "Country" ? (countries[v.trim().toUpperCase()] || v) : v;
+                return [fold(v), shown];
+              });
+            }
+          }
+          if (!options) return; // no data → no filter
+
           active.push(pair);
           var wrap = liveEl("div", "dir-filter");
-          var id = "f-" + pair[2];
+          var id = "f-" + attr;
-          var label = liveEl("label", null, pair[1]);
+          var lbl = liveEl("label", null, label);
-          label.setAttribute("for", id);
+          lbl.setAttribute("for", id);
           var sel = document.createElement("select");
           sel.id = id;
-          sel.setAttribute("data-field", pair[2]);
+          sel.setAttribute("data-field", attr);
+          if (kind === "min") sel.setAttribute("data-match", "min");
           sel.appendChild(new Option("All", ""));
-          seen.sort(function (a, b) {
+          options.forEach(function (o) { sel.appendChild(new Option(o[1], o[0])); });
-            return a.toLowerCase() < b.toLowerCase() ? -1 : 1;
+          wrap.appendChild(lbl);
-          }).forEach(function (v) {
-            sel.appendChild(new Option(
-              pair[0] === "Country" ? (countries[v.trim().toUpperCase()] || v) : v,
-              v.toLowerCase()));
-          });
-          wrap.appendChild(label);
           wrap.appendChild(sel);
-          bar.appendChild(wrap);
+          // Keep the selects between the static Search box and the static Clear button.
+          if (clearWrap) bar.insertBefore(wrap, clearWrap);
+          else bar.appendChild(wrap);
         });
         return active;
       }
@@ -1630,6 +1969,12 @@
             // A record with no Name is not a freelancer (build-directory.py skips it too).
             var records = all.filter(function (r) { return r && String(r.Name || "").trim(); });
             if (!records.length) return; // never trade a stale list for an empty one
+            // Deterministic, NEUTRAL order by Name — never by project count (no ranking),
+            // and never the endpoint's own order, which alternates between reads.
+            records.sort(function (a, b) {
+              var fa = fold(a.Name), fb = fold(b.Name);
+              return fa < fb ? -1 : (fa > fb ? 1 : 0);
+            });
             var active = liveFilters(records);
             while (grid.firstChild) grid.removeChild(grid.firstChild);
             records.forEach(function (rec) { grid.appendChild(liveCard(rec, active)); });
@@ -1642,39 +1987,74 @@
       function initFilters() {
         var bar = document.getElementById("dirFilters");
         if (!bar) return;
-        // One listener for the life of the page. It re-reads the selects on every change,
+        // One delegated listener for the life of the page: it re-reads the controls on
-        // so the same code filters the build-time list and a runtime-rendered one.
+        // every change, so the same code filters the build-time list and a runtime one.
         bar.addEventListener("change", function (event) {
           if (event.target && event.target.tagName === "SELECT") applyFilters();
         });
+        bar.addEventListener("input", function (event) {
+          if (event.target && event.target.hasAttribute("data-search-box")) applyFilters();
+        });
+        var clear = document.getElementById("dirClear");
+        if (clear) {
+          clear.addEventListener("click", function () {
+            var box = bar.querySelector("[data-search-box]");
+            if (box) box.value = "";
+            Array.prototype.forEach.call(bar.querySelectorAll("select"), function (s) { s.value = ""; });
+            applyFilters();
+          });
+        }
         applyFilters();
       }
 
+      /* Search AND filters combine: a card shows only when it matches every control —
+         a folded substring for the search box, equality for a value filter, a minimum
+         for the project count. The same logic covers the build-time list and a runtime
+         one. A filter that matches nobody shows the explained empty state, never a blank
+         page. */
       function applyFilters() {
         var bar = document.getElementById("dirFilters");
         var grid = document.getElementById("dirGrid");
         var count = document.getElementById("dirCount");
         var empty = document.getElementById("dirEmpty");
+        var clear = document.getElementById("dirClear");
         if (!bar || !grid) return;
 
+        var search = bar.querySelector("[data-search-box]");
+        var query = search ? fold(search.value.trim()) : "";
         var selects = Array.prototype.slice.call(bar.querySelectorAll("select"));
-        bar.hidden = !selects.length; // no data supports any filter → no filter bar
-        if (count) count.hidden = !selects.length;
         var cards = Array.prototype.slice.call(grid.querySelectorAll(".dev-card"));
+        var nothing = cards.length === 0;
+
+        bar.hidden = nothing;
+        if (count) count.hidden = nothing;
+        if (clear) {
+          clear.hidden = nothing || (!query && !selects.some(function (s) { return s.value; }));
+        }
 
         var shown = 0;
         cards.forEach(function (card) {
-          var ok = selects.every(function (sel) {
+          var ok = true;
-            var want = sel.value;
+          if (query) ok = (card.getAttribute("data-search") || "").indexOf(query) !== -1;
-            if (!want) return true;
+          if (ok) {
-            var have = (card.getAttribute("data-" + sel.getAttribute("data-field")) || "").split("|");
+            selects.forEach(function (sel) {
-            return have.indexOf(want) !== -1;
+              if (!ok) return;
-          });
+              var want = sel.value;
+              if (!want) return;
+              var have = card.getAttribute("data-" + sel.getAttribute("data-field")) || "";
+              if (sel.getAttribute("data-match") === "min") {
+                var n = parseInt(have, 10);
+                if (isNaN(n) || n < parseInt(want, 10)) ok = false;
+              } else if (have.split("|").indexOf(want) === -1) {
+                ok = false;
+              }
+            });
+          }
           card.hidden = !ok;
           if (ok) shown++;
         });
-        if (count && selects.length) count.textContent = "Showing " + shown + " of " + cards.length;
+        if (count && !count.hidden) count.textContent = "Showing " + shown + " of " + cards.length;
-        if (empty) empty.hidden = selects.length ? shown !== 0 : true;
+        if (empty) empty.hidden = nothing ? true : shown !== 0;
       }
 
       /* ---- Form 1: freelancer application (create — no id) ---- */