feat(web): couche de tokens de design centralisée (surfaces, statuts, terminal)

Introduit une couche sémantique dans style.css (@theme) : surfaces (surface-0..3), bordures, texte (fg/muted/subtle) et accent, aliasant la palette Tailwind (rendu identique, vérifié dans le CSS produit). Ajoute les métriques du chrome IDE (--ide-*) pour la refonte à venir.

Centralise deux sources uniques : lib/terminal-theme.ts (thème + police xterm) et lib/status-tokens.ts (tons de statut, dédupliqués entre BaseBadge et SessionStateBadge). Définit le thème Monaco « arboretum-dark ». Remplace les #09090b épars des composants par bg-surface-0 (ne restent que index.html et les renderers exigeant un hex concret).

packages/web/src/components/TerminalView.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="relative h-full min-h-0 bg-[#09090b]">
+  <div class="relative h-full min-h-0 bg-surface-0">
     <div ref="container" class="h-full w-full" />
     <div
       v-if="!controlling && !ended"
@@ -25,6 +25,7 @@ import { Terminal } from '@xterm/xterm';
 import { FitAddon } from '@xterm/addon-fit';
 import '@xterm/xterm/css/xterm.css';
 import { wsClient, type Attachment } from '../lib/ws-client';
+import { TERMINAL_THEME, TERMINAL_FONT_FAMILY } from '../lib/terminal-theme';
 
 const props = withDefaults(defineProps<{ sessionId: string; mode?: 'interactive' | 'observer' }>(), {
   mode: 'interactive',
@@ -48,14 +49,9 @@ onMounted(async () => {
   term = new Terminal({
     cursorBlink: true,
     fontSize: 13,
-    fontFamily: "ui-monospace, 'JetBrains Mono', 'Fira Code', Menlo, Consolas, monospace",
+    fontFamily: TERMINAL_FONT_FAMILY,
     scrollback: 20_000, // absorbe le replay élargi (REPLAY_TAIL_BYTES = 1 Mo) → on remonte plus loin
-    theme: {
-      background: '#09090b',
-      foreground: '#d4d4d8',
-      cursor: '#e4e4e7',
-      selectionBackground: '#3f3f46',
-    },
+    theme: TERMINAL_THEME,
   });
   const fit = new FitAddon();
   term.loadAddon(fit);