feat(web): refonte visuelle « Emerald » (thème clair/sombre, polices, tokens)

Adopte le langage visuel du design system Emerald dans l'IDE web :
neutres zinc + accent emerald, polices auto-hébergées Inter + JetBrains
Mono, radii/pills mono, points de statut, motif terminal, halo/grain.
Refonte purement visuelle et additive (layout, routing, stores, protocole
inchangés).

- style.css : défauts sombres dans @theme + override clair sous
  html[data-theme=light] ; accent scindé (bright #34d399 / solid #059669 /
  hover) ; tokens border-soft/info/warn/danger/coffee ; idiomes globaux
  (focus/selection accent, scrollbars fines, jl-pulse/jl-blink, classes
  .chip/.status/.eyebrow/.label-mono/.caret/.halo/.grain, .btn*/.badge pill).
- lib/theme.ts : singleton themeMode/resolvedTheme (dark/light/system,
  persistedRef arb.theme) + application dataset.theme/metas ; script
  anti-FOUC inline dans index.html ; toggle ActivityBar + Réglages.
- Thèmes Monaco + xterm dark/light réactifs (palette ANSI + coloration
  syntaxique) ; fonts.ready + remeasureFonts pour l'alignement des glyphes.
- status-tokens : tons sémantiques tokenisés ; balayage des ~340 couleurs
  Tailwind brutes vers les tokens sur tout components/* et views/*
  (exceptions assumées commentées).
- GroupSummary.color exploité : icône de groupe teintée + ColorSwatchPicker
  (lib/group-colors.ts) dans les modals de groupe.
- Polices via @fontsource-variable/{inter,jetbrains-mono} (offline).

packages/web/src/components/settings/GitConnectionsSection.vue

@@ -1,18 +1,18 @@
 <template>
   <section class="card flex flex-col gap-3">
-    <h2 class="flex items-center gap-2 text-sm font-semibold text-zinc-100">
+    <h2 class="flex items-center gap-2 text-sm font-semibold text-fg">
       <Plug :size="16" /> {{ t('gitconn.title') }}
     </h2>
-    <p class="text-xs text-zinc-500">{{ t('gitconn.hint') }}</p>
+    <p class="text-xs text-fg-subtle">{{ t('gitconn.hint') }}</p>
 
     <!-- liste des connexions -->
     <ul v-if="store.connections.length" class="flex flex-col gap-1">
       <li v-for="c in store.connections" :key="c.id" class="card-inset flex flex-wrap items-center gap-2">
-        <BaseBadge tone="sky">{{ c.service }}</BaseBadge>
-        <span class="font-medium text-zinc-200">{{ c.label }}</span>
-        <span class="text-xs text-zinc-500">{{ c.authType }}<template v-if="c.username"> · {{ c.username }}</template></span>
-        <span v-if="c.hasSecret" class="font-mono text-xs text-zinc-600">••••{{ c.secretLast4 }}</span>
-        <BaseBadge v-if="c.testResult" :tone="c.testResult === 'ok' ? 'emerald' : 'red'">{{ c.testResult }}</BaseBadge>
+        <BaseBadge tone="info">{{ c.service }}</BaseBadge>
+        <span class="font-medium text-fg">{{ c.label }}</span>
+        <span class="text-xs text-fg-subtle">{{ c.authType }}<template v-if="c.username"> · {{ c.username }}</template></span>
+        <span v-if="c.hasSecret" class="font-mono text-xs text-fg-subtle">••••{{ c.secretLast4 }}</span>
+        <BaseBadge v-if="c.testResult" :tone="c.testResult === 'ok' ? 'accent' : 'danger'">{{ c.testResult }}</BaseBadge>
         <span class="ml-auto flex items-center gap-1">
           <BaseButton size="sm" variant="ghost" :loading="testingId === c.id" @click="onTest(c.id)">{{ t('gitconn.test') }}</BaseButton>
           <BaseButton v-if="confirmId === c.id" size="sm" variant="danger" @click="onDelete(c.id)">{{ t('common.confirm') }}</BaseButton>
@@ -20,12 +20,12 @@
         </span>
       </li>
     </ul>
-    <p v-else class="text-xs text-zinc-600">{{ t('gitconn.empty') }}</p>
+    <p v-else class="text-xs text-fg-subtle">{{ t('gitconn.empty') }}</p>
 
     <!-- formulaire d'ajout -->
     <form v-if="adding" class="card-inset flex flex-col gap-2" @submit.prevent="onCreate">
       <div class="flex flex-wrap gap-2">
-        <label class="flex flex-col gap-1 text-xs text-zinc-400">
+        <label class="flex flex-col gap-1 text-xs text-fg-muted">
           {{ t('gitconn.service') }}
           <select v-model="form.service" class="input">
             <option value="gitea">Gitea</option>
@@ -33,33 +33,33 @@
             <option value="github">GitHub</option>
           </select>
         </label>
-        <label class="flex flex-col gap-1 text-xs text-zinc-400">
+        <label class="flex flex-col gap-1 text-xs text-fg-muted">
           {{ t('gitconn.authType') }}
           <select v-model="form.authType" class="input">
             <option value="pat">{{ t('gitconn.pat') }}</option>
             <option value="app_password">{{ t('gitconn.appPassword') }}</option>
           </select>
         </label>
-        <label class="flex flex-1 flex-col gap-1 text-xs text-zinc-400">
+        <label class="flex flex-1 flex-col gap-1 text-xs text-fg-muted">
           {{ t('gitconn.label') }}
           <input v-model.trim="form.label" class="input" :placeholder="t('gitconn.labelPlaceholder')" required />
         </label>
       </div>
-      <label v-if="form.service === 'gitea' || form.service === 'gitlab'" class="flex flex-col gap-1 text-xs text-zinc-400">
+      <label v-if="form.service === 'gitea' || form.service === 'gitlab'" class="flex flex-col gap-1 text-xs text-fg-muted">
         {{ t('gitconn.baseUrl') }}<template v-if="form.service === 'gitea'"> *</template>
         <input v-model.trim="form.baseUrl" class="input font-mono" placeholder="https://git.example.com" :required="form.service === 'gitea'" />
       </label>
       <div class="flex flex-wrap gap-2">
-        <label class="flex flex-col gap-1 text-xs text-zinc-400">
+        <label class="flex flex-col gap-1 text-xs text-fg-muted">
           {{ t('gitconn.username') }}
           <input v-model.trim="form.username" class="input" :placeholder="t('gitconn.usernamePlaceholder')" />
         </label>
-        <label class="flex flex-1 flex-col gap-1 text-xs text-zinc-400">
+        <label class="flex flex-1 flex-col gap-1 text-xs text-fg-muted">
           {{ form.authType === 'pat' ? t('gitconn.token') : t('gitconn.password') }}
           <input v-model="form.secret" type="password" class="input font-mono" autocomplete="off" required />
         </label>
       </div>
-      <p v-if="error" class="text-xs text-amber-400">{{ error }}</p>
+      <p v-if="error" class="text-xs text-warn">{{ error }}</p>
       <div class="flex items-center gap-2">
         <BaseButton type="submit" variant="primary" size="sm" :loading="creating" :disabled="!canCreate">{{ t('gitconn.add') }}</BaseButton>
         <BaseButton type="button" size="sm" variant="ghost" @click="adding = false">{{ t('common.cancel') }}</BaseButton>