feat(web): UI component layer + dark-theme reskin

The TRM tokens were good but every screen hand-rolled inputs and buttons as
bare outlines on near-black panels, so fields, cards and buttons were
visually indistinguishable. Add a component layer (.input/.select/.textarea
as recessed slots, .btn family with a FILLED primary, .card scaffolding) and
adopt it across the booth/shift/login/tariff/site screens — several of which
were still light-theme inline styles dropped on a dark background.

Claude-Session: https://claude.ai/code/session_01Xcm6ikLgGoCxxHrxtjkk5V

apps/web/src/ActiveSessions.tsx

@@ -108,7 +108,7 @@ export function ActiveSessions({ onPick }: { onPick: (identity: string) => void
                     type="button"
                     disabled={reopen.isPending || !shiftReady}
                     onClick={() => handleReopen(s)}
-                    className="shrink-0 rounded-term border border-term-cyan px-2 py-0.5 text-[10px] uppercase tracking-wider text-term-cyan hover:bg-term-cyan/10 disabled:opacity-50"
+                    className="btn btn-pay btn-sm shrink-0"
                     title={shiftReady ? t("booth.openBarrierTitle") : t("shift.gateTitle")}
                   >
                     {t("booth.openBarrier")}